templates/frontend/templates/media_management/media_upload_popup.html.twig line 1

Open in your IDE?
  1. {% block media_upload_popup %}
  2.     <div class="mediaManagement mediaUploadPopup z-index-31" hidden>
  3.         <div class="background">
  4.             <div class="container">
  5.                 <div class="row">
  6.                     <div class="col-md-6">
  7.                         <p class="popupHeading">Neues Bild hochladen</p>
  8.                     </div>
  9.                     <div class="col-md-6">
  10.                         <button type="button" class="close" aria-hidden="true" type="button">×</button>
  11.                     </div>
  12.                 </div>
  13.                 <div class="row">
  14.                      <div class="col-md-12">
  15.                          <div id="error-name" class="alert alert-danger" style="display: none;">
  16.                              Bitte geben Sie einen Namen für das Bild ein
  17.                          </div>
  18.                      </div>
  19.                 </div>
  20.                 <div class="row marginBottom20">
  21.                     <div class="col-md-12">
  22.                         <label>Name *</label>
  23.                         <input id="imageToCropName" class="form-control" type="text">
  24.                     </div>
  25.                 </div>
  26.                 <div class="row">
  27.                     <div class="col-md-9">
  28.                         <p class="popupHeading2">Bild zuschneiden:</p>
  29.                         <div class="cropContainer marginBottom10" style="height: 600px;">
  30.                             <img id="imageToCrop" src="{{ asset('bundles/frontend/images/item-default.jpg') }}" style="width: 100%; height: auto;">
  31.                             <div class="zoomButtons">
  32.                                 <button id="zoomInButton" type="button" class="btn btn-primary">
  33.                                     <span>
  34.                                         <i class="fa fa-search-plus"></i>
  35.                                     </span>
  36.                                 </button>
  37.                                 <button id="zoomOutButton" type="button" class="btn btn-primary">
  38.                                     <span>
  39.                                         <i class="fa fa-search-minus"></i>
  40.                                     </span>
  41.                                 </button>
  42.                             </div>
  44.                         </div>
  45.                     </div>
  46.                     <div class="col-md-3">
  47.                         <p class="popupHeading2">Ergebnis:</p>
  48.                         <div class="cropOutputContainer marginBottom10" style="height: 600px;">
  49.                             <div id="defaultCropResult" style="padding: 0px;">
  50.                                 <p>Schneiden Sie Ihr Bild wie gewünscht zu.</p>
  51.                             </div>
  52.                             <img id="cropOutput" src="" style="max-height: 100%;">
  53.                             <div class="refreshButtons">
  54.                                 <button id="refreshButton" type="button" class="btn btn-primary">
  55.                                     <span>
  56.                                         <i class="fa fa-refresh"></i>
  57.                                     </span>
  58.                                 </button>
  59.                             </div>
  61.                         </div>
  62.                     </div>
  63.                 </div>
  64.                 <div class="row">
  65.                     <div class="col-md-12">
  66.                         <button id="saveCroppedImageButton" class="btn btn-default pull-right" type="button">Speichern</button>
  67.                     </div>
  68.                 </div>
  69.             </div>
  70.             <div class="row">
  71.             </div>
  72.         </div>
  74.     </div>
  75. {% endblock media_upload_popup %}
  77. {% block specific_js %}
  79.     <script>
  80.         // these lines must be in the html file so that we can access the twig functions
  81.         {% if type == "bopartner" %}
  82.             var saveMediaURL = "{{ path('bopartner_save_media')|escape('js') }}";
  83.         {% elseif type == "company" %}
  84.             var saveMediaURL = "{{ path('company_save_media')|escape('js') }}";
  85.         {% elseif type == "school" %}
  86.             var saveMediaURL = "{{ path('school_save_media')|escape('js') }}";
  87.         {% endif %}
  89.     </script>
  91.     <script src="{{ asset('/yarn/cropperjs/dist/cropper.js') }}" type="text/javascript"></script>
  92.     <script src="{{ versionedAsset('/bundles/frontend/js/templates/media_management/media_upload_popup.js') }}" type="text/javascript"></script>
  93. {% endblock %}
  95. {% block specific_css %}
  96.     <link href="/yarn/cropperjs/dist/cropper.css" type="text/css" rel="stylesheet" />
  97. {% endblock %}