templates/back/slider/edit.html.twig line 1

Open in your IDE?
  1. {% extends 'base_back.html.twig' %}
  2. {% block title %}Edition {% endblock %}
  3. {% block body %}
  4.     <div class="content-header">
  5.         <div class="container-fluid">
  6.             <div class="row mb-2">
  7.                 <div class="col-sm-6">
  8.                     <h1 class="m-0">Slider</h1>
  9.                 </div><!-- /.col -->
  10.             </div><!-- /.row -->
  11.         </div><!-- /.container-fluid -->
  12.     </div>
  13.     <section class="content">
  14.         <div class="container-fluid">
  15.             <!-- Small boxes (Stat box) -->
  16.             <div class="row">
  17.                 <div class="col-12">
  18.                     <div class="card">
  19.                         <div class="card-header">
  20.                             <h3 class="card-title">Edition du slider {{ slider.page }}</h3>
  21.                         </div>
  22.                         <!-- /.card-header -->
  23.                         <div class="card-body">
  24.                             {{ include('back/slider/_form.html.twig') }}
  25.                         </div>
  26.                     </div>
  27.                 </div>
  28.             </div>
  29.         </div>
  30.     </section>
  31. {% endblock %}
  32. {% block javascript %}
  33. {{ parent() }}
  34. <script nonce="{{ csp_nonce('script') }}">
  35.     document.getElementById(`slider_image1`).onchange = function () {
  36.         const reader = new FileReader();
  37.         reader.onload = function (e) {
  38.             document.getElementById(`previewPhoto1`).style.background = `url(${e.target.result})`;
  39.             document.getElementById(`previewPhoto1`).style.backgroundSize = `cover`;
  40.         };
  41.         reader.readAsDataURL(this.files[0]);
  42.     };
  43.     document.getElementById(`slider_image2`).onchange = function () {
  44.         const reader = new FileReader();
  45.         reader.onload = function (e) {
  46.             document.getElementById(`previewPhoto2`).style.background = `url(${e.target.result})`;
  47.             document.getElementById(`previewPhoto2`).style.backgroundSize = `cover`;
  48.         };
  49.         reader.readAsDataURL(this.files[0]);
  50.     };
  51.     document.getElementById(`slider_image3`).onchange = function () {
  52.         const reader = new FileReader();
  53.         reader.onload = function (e) {
  54.             document.getElementById(`previewPhoto3`).style.background = `url(${e.target.result})`;
  55.             document.getElementById(`previewPhoto3`).style.backgroundSize = `cover`;
  56.         };
  57.         reader.readAsDataURL(this.files[0]);
  58.     };
  59.     document.getElementById(`slider_image4`).onchange = function () {
  60.         const reader = new FileReader();
  61.         reader.onload = function (e) {
  62.             document.getElementById(`previewPhoto4`).style.background = `url(${e.target.result})`;
  63.             document.getElementById(`previewPhoto4`).style.backgroundSize = `cover`;
  64.         };
  65.         reader.readAsDataURL(this.files[0]);
  66.     };
  67. </script>
  68. {% endblock %}