vendor/frosh/platform-thumbnail-processor/src/Resources/views/storefront/utilities/thumbnail.html.twig line 1

Open in your IDE?
  1. {% block thumbnail_utility %}{% apply spaceless %}
  2.     {% if attributes is not defined %}
  3.         {% set attributes = {} %}
  4.     {% endif %}
  6.     {% if attributes.class %}
  7.         {% set attributes = attributes|merge({'class': 'frosh-proc lazyload ' ~ attributes.class}) %}
  8.     {% else %}
  9.         {% set attributes = attributes|merge({'class': 'frosh-proc lazyload'}) %}
  10.     {% endif %}
  12.     {% if attributes.alt is not defined and media.translated.alt is defined %}
  13.         {% set attributes = attributes|merge({'alt': media.translated.alt}) %}
  14.     {% endif %}
  16.     {% if attributes.title is not defined and media.translated.title is defined %}
  17.         {% set attributes = attributes|merge({'title': media.translated.title}) %}
  18.     {% endif %}
  20.     {% set metaProportion = media.metaData %}
  21.     {% if media.thumbnails|length > 0 %}
  22.         {% set thumbnails = media.thumbnails|filter((v) => v.width <= metaProportion.width)|sort((a, b) => a.width <=> b.width)|reverse %}
  24.         {% if thumbnails %}
  25.             {# generate srcset with all available thumbnails #}
  26.             {% set srcsetValue %}{% apply spaceless %}
  27.                 {{ media.url|frosh_encode_url }} {{ thumbnails|first.width + 1 }}w, {% for thumbnail in thumbnails %}{{ thumbnail.url|frosh_encode_url }} {{ thumbnail.width }}w{% if not loop.last %}, {% endif %}{% endfor %}
  28.             {% endapply %}{% endset %}
  29.         {% endif %}
  30.     {% endif %}
  32.     {% set ratio = metaProportion.width ~ '/' ~ metaProportion.height %}
  34.     {% set inlineStyle = "aspect-ratio:" ~ ratio ~ ";" %}
  35.     {% if attributes.style %}
  36.         {% set attributes = attributes|merge({'style': inlineStyle ~ attributes.style}) %}
  37.     {% else %}
  38.         {% set attributes = attributes|merge({'style': inlineStyle}) %}
  39.     {% endif %}
  41.     {% block thumbnail_utility_img %}
  42.         {% if src is not defined %}
  43.             {% set src = 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' %}
  44.         {% endif %}
  46.         <img src="{{ src }}"
  47.             data-src="{{ media.url|frosh_encode_url }}"
  48.             {% if srcsetValue %}
  49.                 data-srcset="{{ srcsetValue }}"
  50.                 data-sizes="auto"
  51.                 data-aspectratio="{{ ratio }}"
  52.                 data-parent-fit="contain"
  53.             {% endif %}
  54.             {% for key, value in attributes %}
  55.                 {{ key }}="{{ value }}"
  56.                 {% if key == 'itemprop' %}
  57.                     content="{{ media.url|frosh_encode_url }}"
  58.                 {% endif %}
  59.             {% endfor %}
  60.         />
  62.     {% endblock %}
  63. {% endapply %}{% endblock %}