custom/plugins/TcinnThemeWareClean/src/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. {# TODO: prüfen... #}
  3. {# ---------------- START: SET TEMPLATE VARS ---------------- #}
  4. {# ThemeWare: Set theme variables #}
  5. {% set twtProductBoxImageHoverType = theme_config('twt-product-box-image-hover-type') %}
  6. {% set twtProductBoxManufacturerShow = theme_config('twt-product-box-manufacturer-show') %}
  7. {% set twtProductBoxOrdernumberShow = theme_config('twt-product-box-ordernumber-show') %}
  8. {% set twtProductBoxProductReviewRatingShow = theme_config('twt-product-box-product-review-rating-show') %}
  9. {% set twtProductBoxShortDescriptionShow = theme_config('twt-product-box-short-description-show') %}
  10. {# ---------------- END: SET TEMPLATE VARS ---------------- #}
  11. {# ThemeWare: Adjustments on the product box #}
  12. {% block component_product_box_content %}
  13.     {# Default block #}
  14.     {{ parent() }}
  15. {% endblock %}
  16. {# ThemeWare: Adjustments on the product box name #}
  17. {% block component_product_box_name %}
  18.     {# Default block #}
  19.     {{ parent() }}
  20.     {# ThemeWare: Hersteller ergänzen. #}
  21.     {# TODO... see below #}
  22. {% endblock %}
  23. {# ThemeWare: Adjustments on the product-rating #}
  24. {# HC-Architecture @Doku #}
  25. {% block component_product_box_rating %}
  26.     {% if twtProductBoxProductReviewRatingShow == 2 %}
  27.         {# Default block #}
  28.         {{ parent() }}
  29.     {% elseif twtProductBoxProductReviewRatingShow == 3 %}
  30.         {# ThemeWare: Rating immer anzeigen falls konfiguriert. #}
  31.         {% if config('core.listing.showReview') %}
  32.             <div class="product-rating">
  33.                 {#% if product.ratingAverage %#}
  34.                     {% sw_include '@Storefront/storefront/component/review/rating.html.twig' with {
  35.                         points: product.ratingAverage,
  36.                         style: 'text-primary'
  37.                     } %}
  38.                 {#% endif %#}
  39.                 {# TODO: "Dieses Produkt wurde noch nicht bewertet" #}
  40.             </div>
  41.         {% endif %}
  42.     {% endif %}
  43. {% endblock %}
  44. {# ThemeWare: Adjustments on the product box description #}
  45. {% block component_product_box_description %}
  46.     {# ThemeWare: Zusatzfeld "Kurzbeschreibung" #}
  47.     {% if twtProductBoxShortDescriptionShow == 2 and product.translated.customFields.twt_clean_pro_custom_field__product__short_description is not empty %}
  48.         <div class="product-description">
  49.             {{ product.translated.customFields.twt_clean_pro_custom_field__product__short_description|raw }}
  50.         </div>
  51.     {% else %}
  52.         {# Default block #}
  53.         {{ parent() }}
  54.     {% endif %}
  55.     {# ThemeWare: Produktnummer ergänzen. #}
  56.     {% if product.productNumber and twtProductBoxOrdernumberShow == 2 %}
  57.         {% block twt_product_box_ordernumber %}
  58.             <div class="product-ordernumber twt-product-ordernumber">
  59.                 <span class="product-ordernumber-label">
  60.                     {{ "twt.listing.ordernumberLabel"|trans|sw_sanitize }}
  61.                 </span>
  62.                 <span class="product-ordernumber">
  63.                     {{ product.productNumber }}
  64.                 </span>
  65.             </div>
  66.         {% endblock %}
  67.     {% endif %}
  68.     {# ThemeWare: Hersteller ergänzen. #}
  69.     {% if product.manufacturer and twtProductBoxManufacturerShow == 2 %}
  70.         {% block twt_product_box_manufacturer %}
  71.             <div class="product-manufacturer twt-product-manufacturer">
  72.                 <span class="product-manufacturer-label">
  73.                     {{ "twt.listing.manufacturerLabel"|trans|sw_sanitize }}
  74.                 </span>
  75.                 <span class="product-manufacturer">
  76.                     {{ product.manufacturer.translated.name }}
  77.                 </span>
  78.             </div>
  79.         {% endblock %}
  80.     {% endif %}
  81. {% endblock %}
  82. {# TODO: HC-Architecture... #}
  83. {# ThemeWare: Adjustments on the product image #}
  84. {% block component_product_box_image %}
  85.     {# ThemeWare: Add hover image for crossfading the cover image #}
  86.     {# Check if cross-fade hover-type is configured + custom field is available + mediaCollection is set - otherwise use default block #}
  87.     {% if twtProductBoxImageHoverType == 10 and product.translated.customFields.twt_clean_pro_custom_field__product__hover_image is not empty and mediaCollection is not empty %}
  88.         {# ThemeWare: Get hoverMedia via hoverMediaId for crossfading the cover image >>> #}
  89.         {# Simplify ID access #}
  90.         {% set hoverMediaId = product.translated.customFields.twt_clean_pro_custom_field__product__hover_image %}
  91.         {# Get access to media of product #}
  92.         {% set hoverMedia = mediaCollection.get(hoverMediaId) %}
  93.         {# <<< Get hoverMedia via hoverMediaId for crossfading the cover image #}
  94.         <div class="product-image-wrapper twt-is-crossfade"> {# <<< ThemeWare: Add css class #}
  95.             {# fallback if display mode is not set #}
  96.             {% set displayMode = displayMode ?: 'standard' %}
  97.             {# set display mode 'cover' for box-image with standard display mode #}
  98.             {% if layout == 'image' and displayMode == 'standard' %}
  99.                 {% set displayMode = 'cover' %}
  100.             {% endif %}
  101.             <a href="{{ seoUrl('frontend.detail.page', {'productId': id}) }}"
  102.                title="{{ name }}"
  103.                class="product-image-link is-{{ displayMode }}">
  104.                 {% if cover.url %}
  105.                     {% set attributes = {
  106.                         'class': 'product-image is-'~displayMode,
  107.                         'alt': (cover.translated.alt ?: name),
  108.                         'title': (cover.translated.title ?: name)
  109.                     } %}
  110.                     {% if displayMode == 'cover' or displayMode == 'contain' %}
  111.                         {% set attributes = attributes|merge({ 'data-object-fit': displayMode }) %}
  112.                     {% endif %}
  113.                     {# ThemeWare: Add hoverMedia for crossfading the cover image >>> #}
  114.                     {% sw_thumbnails 'product-image-thumbnails' with {
  115.                         media: hoverMedia,
  116.                         sizes: sizes,
  117.                         attributes: {
  118.                             'class': 'product-image is-standard twt-crossfade-image'
  119.                         }
  120.                     } %}
  121.                     {# <<< Add hoverMedia for crossfading the cover image #}
  122.                     {% sw_thumbnails 'product-image-thumbnails' with {
  123.                         media: cover,
  124.                         sizes: sizes
  125.                     } %}
  126.                 {% else %}
  127.                     <div class="product-image-placeholder">
  128.                         {% sw_icon 'placeholder' style {
  129.                             'size': 'fluid'
  130.                         } %}
  131.                     </div>
  132.                 {% endif %}
  133.             </a>
  134.             {% if config('core.cart.wishlistEnabled') %}
  135.                 {% block component_product_box_wishlist_action %}
  136.                     {% sw_include '@Storefront/storefront/component/product/card/wishlist.html.twig' with {
  137.                         appearance: 'circle',
  138.                         productId: id
  139.                     } %}
  140.                 {% endblock %}
  141.             {% endif %}
  142.         </div>
  143.     {% else %}
  144.         {# Default block #}
  145.         {{ parent() }}
  146.     {% endif %}
  147. {% endblock %}