bundles/Alea/AreabricksBundle/Resources/views/areas/cards-catalogue/view.html.twig line 1

Open in your IDE?
  1. <div class="row catalogues">
  2.     <script>
  3.         function bytesToMB (bytes,decimals) { const megabytes = bytes / 1048576; return Math. round (megabytes * Math. pow (10, decimals)) / Math. pow (10, decimals); }
  4.         const getSize = async (id,link) => {
  6.             const client=new XMLHttpRequest();
  7.             client.open("HEAD",link,true);
  8.             client.send();
  9.             client.onreadystatechange = () => {
  10.                 if (client.readyState === client.HEADERS_RECEIVED) {
  11.                     const contentLength = client.getResponseHeader('Content-Length');
  12.                     const contentLengthMb=bytesToMB(contentLength, 1);
  13.                     document.getElementById(`_download_size_${id}`).innerHTML = contentLengthMb;
  14.                 }
  15.             };
  16.         }
  17.     </script>
  19.     {% set blockCount = pimcore_block('myBlock').count %}
  20.     {% for i in pimcore_block('myBlock').iterator %}
  21.         {% if blockCount > 0 %}
  22.             {% set colClass = 'col-lg-' ~ (12 / blockCount) %}
  23.         {% else %}
  24.             {% set colClass = 'col-lg-6' %}
  25.         {% endif %}
  27.         {% if editmode %}
  28.             {{ pimcore_input('link_text') }}
  29.         {% endif %}
  30.         {%  set link = pimcore_input('link_text') %}
  31.         <a href="{{ link ?: '#' }}" target="_blank" class="col-6 {{ colClass }} col-xl text-center d-flex flex-column align-items-center mb-40 catalogue">
  32.             {% if editmode %}
  33.                 <div class="w-75">
  34.                     {{ pimcore_image("image") }}
  35.                 </div>
  36.             {% else %}
  37.                 {#<img src="{{ pimcore_image("image").getSrc() }}" alt="{{ pimcore_image("image").getAlt() }}" class="w-75"/>#}
  38.                 {{ pimcore_image("image").thumbnail('catalogues_thumbs').html({
  39.                     'pictureAttributes': {
  40.                         'class': ''
  41.                     },
  42.                     'imgAttributes': {
  43.                         'class': 'w-75 h-auto'
  44.                     }
  45.                 }) | raw  }}
  46.             {% endif %}
  48.             <span class="fs-20 fw-bold mb-10">
  49.                 {{ pimcore_input("title",{
  50.                     "width": '100%',
  51.                     "placeholder": "Titolo"
  52.                 }) }}
  53.             </span>
  54.             <span class="fs-16"><i class="fa fa-download me-10"></i>
  55.                 Download (<span id="_download_size_{{ i }}"></span>&nbsp;Mb)
  56.             </span>
  57.         </a>
  59.         <script>
  60.             getSize('{{ i }}','{{ link }}');
  61.         </script>
  63.     {% endfor %}
  64. </div>