custom/apps/AtlKatanaTheme/Resources/views/storefront/component/product/card/box-standard.html.twig line 1

Open in your IDE?
  1. {% sw_extends "@Storefront/storefront/component/product/card/box-standard.html.twig" %}
  2. {% block component_product_box_content %}
  3.     {% set previewVariants = product.extensions.atlVariantPreview.variants %}
  4.     {% set hoverMediaId = product.translated.customFields.atl_katana_theme_product_hover_media %}
  5.     {% if previewVariants is not empty %}
  6.         {% set previewVariantsOptions = {
  7.             productId: product.id,
  8.             allowBuyInListing: config('core.listing.allowBuyInListing')
  9.         } %}
  10.         <div data-atl-katana-variant-preview="true" data-atl-katana-variant-preview-options="{{ previewVariantsOptions|json_encode }}">
  11.             {{ parent() }}
  12.         </div>
  13.     {% else %}
  14.         {{ parent() }}
  15.     {% endif %}
  16. {% endblock %}
  17. {% block component_product_box_image %}
  18.     {% set coverMedia = [cover] %}
  19.     {% set coverMediaIds = [cover.id] %}
  20.     {# Allow either preview variants or hover media #}
  21.     {% if previewVariants is not empty %}
  22.         {% for variant in previewVariants %}
  23.             {% if variant.cover.media.id not in coverMediaIds %}
  24.                 {% set coverMediaIds = coverMediaIds|merge([variant.cover.media.id]) %}
  25.                 {% set coverMedia = coverMedia|merge([variant.cover.media]) %}
  26.             {% endif %}
  27.         {% endfor %}
  28.     {% elseif hoverMediaId %}
  29.         {% set hoverMedia = searchMedia([hoverMediaId], context.context) %}
  30.         {% set hoverMediaEntity = hoverMedia.get(hoverMediaId) %}
  31.         {% set coverMedia = coverMedia|merge([hoverMediaEntity]) %}
  32.     {% endif %}
  33.     {# fallback if display mode is not set #}
  34.     {% set displayMode = displayMode ?: 'contain' %}
  35.     {# set display mode 'cover' for box-image with standard display mode #}
  36.     {% if layout == 'image' and displayMode == 'standard' %}
  37.         {% set displayMode = 'cover' %}
  38.     {% endif %}
  39.     <div class="product-image-wrapper is-{{ displayMode }}">
  40.         <a href="{{ seoUrl('frontend.detail.page', {'productId': id}) }}"
  41.            title="{{ name }}"
  42.            class="product-image-link is-{{ displayMode }}"{% if hoverMediaEntity %} data-atl-katana-hover-media="true"{% endif %}>
  43.             {% if cover.url %}
  44.                 {% for media in coverMedia %}
  45.                     {% set attributes = {
  46.                         'class': 'product-image is-'~displayMode~ (product.cover.media.id != media.id ?  ' is-inactive' : ''),
  47.                         'alt': (media.translated.alt ?: name),
  48.                         'title': (media.translated.title ?: name),
  49.                         'data-media-id': media.id
  50.                     } %}
  51.                     {% if displayMode == 'cover' or displayMode == 'contain' %}
  52.                         {% set attributes = attributes|merge({ 'data-object-fit': displayMode }) %}
  53.                     {% endif %}
  54.                     {% sw_thumbnails 'product-image-thumbnails' with {
  55.                         media: media,
  56.                         sizes: sizes,
  57.                         load: product.cover.media.id == media.id
  58.                     } %}
  59.                 {% endfor %}
  60.             {% else %}
  61.                 <div class="product-image-placeholder">
  62.                     {% sw_icon 'placeholder' style {
  63.                         'size': 'fluid'
  64.                     } %}
  65.                 </div>
  66.             {% endif %}
  67.         </a>
  68.         {% block component_product_box_image_action %}
  69.             {% if theme_config('atl-cms-product-box-action') == 'hover' %}
  70.                 {% sw_include '@Storefront/storefront/component/product/card/action.html.twig' %}
  71.             {% endif %}
  72.         {% endblock %}
  73.     </div>
  74. {% endblock %}
  75. {% block component_product_box_info %}
  76.     <div class="product-info">
  77.         {% if config('core.cart.wishlistEnabled') %}
  78.             {% block component_product_box_wishlist_action %}
  79.                 {{ parent() }}
  80.             {% endblock %}
  81.         {% endif %}
  82.         {% block component_product_box_name %}
  83.             {{ parent() }}
  84.             {% block component_product_box_product_number %}
  85.                 {% set showProductNumber = product.productNumber is not empty %}
  86.                 {% if theme_config('atl-cms-product-box-use-placeholders') == 'true' %}
  87.                     {% set showProductNumber = true %}
  88.                 {% endif %}
  89.                 {% if theme_config('atl-cms-product-box-product-number') == 'below-title' and showProductNumber %}
  90.                     <div class="product-number">
  91.                         {% if product.productNumber is not empty %}
  92.                              <span class="product-ordernumber-label">
  93.                                 {{ "detail.productNumberLabel"|trans|sw_sanitize }}
  94.                              </span>
  95.                             <span class="product-ordernumber">
  96.                                 {{ product.productNumber }}
  97.                             </span>
  98.                         {% endif %}
  99.                     </div>
  100.                 {% endif %}
  101.             {% endblock %}
  102.             {% block component_product_box_delivery_information %}
  103.                 {% set showDeliveryInformation = product.deliveryTime is not empty %}
  104.                 {% if theme_config('atl-cms-product-box-use-placeholders') == 'true' %}
  105.                     {% set showDeliveryInformation = true %}
  106.                 {% endif %}
  107.                 {% if theme_config('atl-cms-product-box-delivery-information') == 'below-title' and showDeliveryInformation %}
  108.                     <div class="product-delivery-information">
  109.                         {% sw_include '@Storefront/storefront/component/wishlist/delivery-information.html.twig' %}
  110.                     </div>
  111.                 {% endif %}
  112.             {% endblock %}
  113.         {% endblock %}
  114.         {% block component_product_box_rating %}
  115.             {% set showRatings = product.ratingAverage is not empty %}
  116.             {% if theme_config('atl-cms-product-box-use-placeholders') == 'true' %}
  117.                 {% set showRatings = true %}
  118.             {% endif %}
  119.             {% if theme_config('atl-cms-product-box-ratings') == 'default' and showRatings %}
  120.                 {{ parent() }}
  121.             {% endif %}
  122.         {% endblock %}
  123.         {% block component_product_box_variant_characteristics %}
  124.             {% set showVariantCharacteristics = product.variation is not empty %}
  125.             {% if theme_config('atl-cms-product-box-use-placeholders') == 'true' %}
  126.                 {% set showVariantCharacteristics = true %}
  127.             {% endif %}
  128.             {% if theme_config('atl-cms-product-box-characteristics') == 'default' and showVariantCharacteristics %}
  129.                 {{ parent() }}
  130.             {% endif %}
  131.         {% endblock %}
  132.         {% block component_product_box_description %}
  133.             {% set showDescription = product.translated.description is not empty %}
  134.             {% if theme_config('atl-cms-product-box-use-placeholders') == 'true' %}
  135.                 {% set showDescription = true %}
  136.             {% endif %}
  137.             {% if theme_config('atl-cms-product-box-description') == 'default' and showDescription %}
  138.                 {{ parent() }}
  139.             {% endif %}
  140.         {% endblock %}
  141.         {% block component_product_box_price %}
  142.             {{ parent() }}
  143.         {% endblock %}
  144.         {% block component_product_box_variant_preview %}
  145.             {% if previewVariants is not empty %}
  146.                 {% sw_include '@Storefront/storefront/skin/global/component/product/card/variant-preview.html.twig' %}
  147.             {% endif %}
  148.         {% endblock %}
  149.         {% block component_product_box_action %}
  150.             {% if theme_config('atl-cms-product-box-action') == 'default' %}
  151.                 {{ parent() }}
  152.             {% endif %}
  153.         {% endblock %}
  154.     </div>
  155. {% endblock %}