custom/static-plugins/LDSCustom/src/Resources/views/storefront/element/cms-element-image-gallery.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/element/cms-element-image-gallery.html.twig' %}
  3. {% block element_image_gallery_alignment %}
  4.     {{ parent() }}
  6.     {% set price = page.product.calculatedPrice %}
  8.     {% if page.product.calculatedPrices|length == 1 %}
  9.         {% set price = page.product.calculatedPrices.first %}
  10.     {% endif %}
  12.     {% set listPrice = price.listPrice %}
  13.     {% set isListPrice = listPrice.percentage >= 10 %}
  15.     {% if isListPrice %}
  16.         {% sw_include '@Storefront/storefront/themeware/includes/twt-badge-discount-include.html.twig' ignore missing with {
  17.                 product: page.product,
  18.                 type: 'listing'
  19.             } %}
  20.     {% endif %}
  21. {% endblock %}
  23. {% block element_image_gallery_inner_item %}
  24.     <div class="gallery-slider-item-container">
  25.         <div class="gallery-slider-item is-{{ displayMode }} js-magnifier-container" {% if minHeight and (displayMode == "cover" or displayMode == "contain" ) %} style="min-height: {{ minHeight }}" {% endif %}>
  26.             {% set image_name = page.product.translated.name %}
  27.             {% if page.product.parentId and page.configuratorSettings|length > 0 %}
  28.                 {% for group in page.configuratorSettings %}
  29.                     {% for option in group.options %}
  30.                         {% if option.id in page.product.optionIds %}
  31.                             {% set image_name = image_name ~ " " ~ option.translated.name %}
  32.                         {% endif %}
  33.                     {% endfor %}
  34.                 {% endfor %}
  35.             {% endif %}
  37.             {% set image_name = image_name ~ " " ~ loop.index %}
  38.             {% set attributes = {
  39.                 'class': 'img-fluid gallery-slider-image magnifier-image js-magnifier-image',
  40.                 'alt': image_name,
  41.                 'title': image_name,
  42.                 'data-full-image': image.url
  43.             } %}
  45.             {% if displayMode == 'cover' or displayMode == 'contain' %}
  46.                 {% set attributes = attributes|merge({ 'data-object-fit': displayMode }) %}
  47.             {% endif %}
  49.             {% if isProduct %}
  50.                 {% set attributes = attributes|merge({ 'itemprop': 'image' }) %}
  51.             {% endif %}
  53.             {% sw_thumbnails 'gallery-slider-image-thumbnails' with {
  54.                 media: image,
  55.                 sizes: {
  56.                     "xs" : "532px",
  57.                     "sm" : "724px",
  58.                     "md" : "948px",
  59.                     "lg" : "657px",
  60.                     "xl" : "809px",
  61.                 },
  62.                 attributes: attributes
  63.             } %}
  64.         </div>
  65.     </div>
  66. {% endblock %}
  68. {% block element_image_gallery_inner_single %}
  69.     <div class="gallery-slider-single-image is-{{ displayMode }}{% if imageCount <= 0 %} is-placeholder{% endif %} js-magnifier-container" {% if minHeight %} style="min-height: {{ imageCount > 0 ? minHeight : '430px' }}" {% endif %}>
  70.         {% if theme_config('zen-product-gallery-fallback-image-title') is not same as ('default') %}
  71.             {% set fallbackImageTitle = mediaItems|first.fileName %}
  72.         {% endif %}
  74.         {% if imageCount > 0 %}
  75.             {% set image_name = page.product.translated.name %}
  76.             {% if page.product.parentId and page.configuratorSettings|length > 0 %}
  77.                 {% for group in page.configuratorSettings %}
  78.                     {% for option in group.options %}
  79.                         {% if option.id in page.product.optionIds %}
  80.                             {% set image_name = image_name ~ " " ~ option.translated.name %}
  81.                         {% endif %}
  82.                     {% endfor %}
  83.                 {% endfor %}
  84.             {% endif %}
  86.             {% set image_name = image_name ~ " 1" %}
  88.             {% set attributes = {
  89.                 'class': 'img-fluid gallery-slider-image magnifier-image js-magnifier-image',
  90.                 'alt': image_name,
  91.                 'title': image_name,
  92.                 'data-full-image': mediaItems|first.url
  93.             } %}
  95.             {% if displayMode == 'cover' or displayMode == 'contain' %}
  96.                 {% set attributes = attributes|merge({ 'data-object-fit': displayMode }) %}
  97.             {% endif %}
  99.             {% if isProduct %}
  100.                 {% set attributes = attributes|merge({ 'itemprop': 'image' }) %}
  101.             {% endif %}
  103.             {# ... enables lazy loading for images #}
  104.             {% if config('zenitPlatformStratus.config.lazyloading') %}
  105.                 {% set attributes = attributes|merge({ 'loading': 'lazy' }) %}
  106.             {% endif %}
  108.             {% sw_thumbnails 'gallery-slider-image-thumbnails' with {
  109.                 media: mediaItems|first,
  110.                 sizes: {
  111.                     "xs" : "532px",
  112.                     "sm" : "724px",
  113.                     "md" : "948px",
  114.                     "lg" : "657px",
  115.                     "xl" : "809px",
  116.                 },
  117.                 attributes: attributes
  119.             } %}
  120.         {% else %}
  121.             {% sw_icon 'placeholder' style {
  122.                 'size': 'fluid'
  123.             } %}
  124.         {% endif %}
  125.     </div>
  126. {% endblock %}
  128. {% block element_image_gallery_inner_thumbnails_item_inner %}
  129.     <div class="gallery-slider-thumbnails-item-inner">
  130.         {% set image_name = "Vorschau: " ~ page.product.translated.name %}
  131.         {% if page.product.parentId and page.configuratorSettings|length > 0 %}
  132.             {% for group in page.configuratorSettings %}
  133.                 {% for option in group.options %}
  134.                     {% if option.id in page.product.optionIds %}
  135.                         {% set image_name = image_name ~ " " ~ option.translated.name %}
  136.                     {% endif %}
  137.                 {% endfor %}
  138.             {% endfor %}
  139.         {% endif %}
  140.         {% set attributes = {
  141.             'class': 'gallery-slider-thumbnails-image',
  142.             'alt': image_name,
  143.             'title': image_name
  144.         } %}
  146.         {% if isProduct %}
  147.             {% set attributes = attributes|merge({ 'itemprop': 'image' }) %}
  148.         {% endif %}
  150.         {% sw_thumbnails 'gallery-slider-thumbnails-image-thumbnails' with {
  151.             media: image,
  152.             sizes: {
  153.                 'default': '200px'
  154.             },
  155.             attributes: attributes
  156.         } %}
  157.     </div>
  158. {% endblock %}