{% trans_default_domain 'webshop' %}{% if config is defined %} {% set allow_cart = config.allow_cart ?? false %} {% set show_image = config.show_image ?? false %} {% set allow_list = config.allow_list ?? false %} {% set show_price = config.show_price ?? false %}{% else %} {% set allow_cart = true %} {% set show_image = true %} {% set allow_list = true %} {% set show_price = true %}{% endif %}{% if WebshopSettings is defined %} {% if WebshopSettings.getB2b and WebshopSettings.hidePricesGuest %} {% set show_price = false %} {% endif %}{% endif %}{% if OriginalProduct is not defined %} {% set OriginalProduct = Product %}{% endif %}{# {% if (OriginalProduct.type != 1 and OriginalProduct.type != 2) or OriginalProduct.linkedProducts.count > 0 %} #}{% if Settings.overridekey is defined and Settings.overridekey is not empty %} {% set overridekey = Settings.overridekey %}{% endif %}{% if overridekey is defined and overridekey is not empty and file_exists('../templates/override/' ~ overridekey ~ '/webshop/productCard.html.twig') %} {% include 'override/' ~ overridekey ~ '/webshop/productCard.html.twig' %}{% elseif file_exists('../templates/override/webshop/productCard.html.twig') %} {% include 'override/webshop/productCard.html.twig' %}{% else %} {% if catFix is defined and catFix %} {% set Category = OriginalProduct.category.first %} {% endif %} {% if WebshopSettings.uriType == 1 %} {% set productUrl = '' %} {% set productUrl = productUrl ~ (WebshopSettings is defined and WebshopSettings.uri ? path('homepage') ~ WebshopSettings.uri : path('homepage')) %} {% set productUrl = productUrl ~ ('Product' | trans({}) | lower | raw) %} {% set productUrl = productUrl ~ '/' ~ Product.number %} {% set productUrl = productUrl ~ '/' ~ Product.slug %} {% else %} {% if Settings.baseuri is empty %} {% set site_baseuri = '' %} {% else %} {% set site_baseuri = Settings.baseuri | replace({'/': ''}) ~ '/' %} {% endif %} {% set productUrl = (WebshopSettings is defined and WebshopSettings.uri ? path('homepage') ~ WebshopSettings.uri : path('homepage') ~ site_baseuri ) ~ (Category.category is defined ? Category.category.uri : Category.uri) ~ '/' ~ (OriginalProduct is defined ? OriginalProduct.slug : Product.slug) %} {% endif %}{% set childProductSale = false %}{% if OriginalProduct.linkedProducts.count > 0 %} {% for CP in OriginalProduct.linkedProducts %} {% if CP.hasPromotion or (CP.priceSale is not empty and CP.priceSale > 0) %} {% set childProductSale = true %} {% endif %} {% endfor %}{% endif %} <div class="card"> {% if list is defined %} <a href="{{path(app.request.attributes.get('_route'))}}?l={{list.id}}&d={{OriginalProduct.id}}" class="remove-from-list" title="{{'Verwijderen van lijst'|trans}}" data-id="{{OriginalProduct.id}}"> <i class="fa fa-times"></i> </a> {% endif %} <a href="{{productUrl}}"> {% if show_image %} <span class="badge-wrapper"> {% if OriginalProduct.hasPromotion or (OriginalProduct.priceSale is not empty and OriginalProduct.priceSale > 0) or childProductSale %} <span class="sale-badge">{{'Sale'|trans}}</span> {% endif %} {% if OriginalProduct.exclusive is defined and OriginalProduct.exclusive %} <span class="exclusive-badge">{{'Exclusief'|trans({}, 'webshop', app.request.locale)}}</span> {% endif %} {% if OriginalProduct.hasCombi() %} <span class="combi-badge">{{'Combideal!'|trans({}, 'webshop', app.request.locale)}}</span> {% endif %} {% if OriginalProduct.new and OriginalProduct.newFrom <= date() and (OriginalProduct.newTill >= date() or OriginalProduct.newTill is empty) %} <span class="new-badge">{{'Nieuw'|trans}}</span> {% endif %} </span> <div class="card-image {{ OriginalProduct.media.count > 1 and WebshopSettings.imageSwap ? 'multi-image' : '' }}"> <div class="img-first"> <div class="lcp"> {% set media = OriginalProduct.media.first %} {% if media %} {% if media.hasBlurred %} <picture> {% if media.hasWebp() %} <source srcset="/{{media.getBlurredWebpPath('small')}}" type="image/webp"> {% endif %} <source srcset="/{{media.getBlurredWebPath('small')}}" type="{{media.mime}}"> <img class="lq" id="lq" alt="{{media.description_alt}}" src="/{{media.getBlurredWebPath('small')}}" type="{{media.mime}}" loading="lazy" height="{{media.height}}" style="opacity: 1;"> </picture> {% endif %} <picture> {% if media.hasWebp() %} <source srcset="/{{media.getWebpPath('medium')}}" type="image/webp"> {% endif %} <source srcset="/{{media.getWebPath('medium')}}" type="{{media.mime}}"> <img class="hq" alt="{{media.description_alt}}" src="/{{media.getWebPath('medium')}}" type="{{media.mime}}" loading="lazy" height="{{media.height}}" onload="this.style.opacity=1; {% if media.hasBlurred %}this.closest('.lcp').getElementsByClassName('lq')[0].style.opacity=0;{% endif %}" style="opacity: 0;"> </picture> {% else %} <picture> <img class="hq" src="{{(WebshopSettings.getDefaultProductImage is not empty ? WebshopSettings.getDefaultProductImage : '/bundles/trinitywebshop/img/no-product-image.png')}}" loading="lazy" onload="this.style.opacity=1" style="opacity: 0;"> </picture> {% endif %} </div> </div> {% if OriginalProduct.media.count > 1 and WebshopSettings.imageSwap %} {% for i,media in OriginalProduct.media %} {% if i == 1 %} <div class="img-second"> <div class="lcp"> {% if media.hasBlurred %} <picture> {% if media.hasWebp() %} <source srcset="/{{media.getBlurredWebpPath('small')}}" type="image/webp"> {% endif %} <source srcset="/{{media.getBlurredWebPath('small')}}" type="{{media.mime}}"> <img class="lq" id="lq" alt="{{media.description_alt}}" src="/{{media.getBlurredWebPath('small')}}" type="{{media.mime}}" loading="lazy" height="{{media.height}}" style="opacity: 1;"> </picture> {% endif %} <picture> {% if media.hasWebp() %} <source srcset="/{{media.getWebpPath('medium')}}" type="image/webp"> {% endif %} <source srcset="/{{media.getWebPath('medium')}}" type="{{ media.mime }}"> <img class="hq" alt="{{media.description_alt}}" src="/{{media.getWebPath('medium')}}" type="{{media.mime}}" loading="lazy" height="{{media.height}}" onload="this.style.opacity=1; {% if media.hasBlurred %}this.closest('.lcp').getElementsByClassName('lq')[0].style.opacity=0;{% endif %}" style="opacity: 0;"> </picture> </div> </div> {% endif %} {% endfor %} {% endif %} </div> {% endif %} <div class="card-body"> <div class="card-content"> <h5 class="card-title"> {{(OriginalProduct.brand ? OriginalProduct.brand.label ~ ' ' : '') ~ (OriginalProduct.label|raw)}} </h5> {% if hide_intro is not defined %} <div class="intro-wrapper"> {# <div class="intro">{{OriginalProduct.intro|striptags}}</div> #} <div class="intro">{{OriginalProduct.intro|raw}}</div> </div> {% endif %} {% set reviewScore = OriginalProduct.getScore() %} {% if reviewScore is not empty and reviewScore > 0 and WebshopSettings.getEnableCardReviews() and OriginalProduct.type != 1 and OriginalProduct.type != 2 %} <div class="review-wrapper"> <div class="review-rating"> {% set half_marked = null %} {% for r in range( 0.5, 5, 0.5 ) %} {% if r matches '/^\\d+$/' %} {# full #} {% if r <= ( reviewScore ) %} {% if half_marked %} {% else %} <i class="fas fa-fw fa-star on"></i> {% endif %} {% else %} {# SOLID / ACTIVE #} {% if half_marked %} {% else %} <i class="far fa-fw fa-star"></i> {% endif %} {% endif %} {% set half_marked = false %} {% else %} {# half #} {% if ( reviewScore ) > r or( reviewScore ) < r %} {% else %} <i class="fas fa-fw fa-star-half-alt on"></i> {% set half_marked = true %} {% endif %} {% endif %} {% endfor %} <span class="review-amount">({{OriginalProduct.getModeratedReviewsCount()}})</span> </div> </div> {% endif %} </div> <div class="card-bottom"> <div class="card-col"> {# {{dump(OriginalProduct.label)}} #} {% if show_price %} <div class="pricing"> {{OriginalProduct.displayPrice(WebshopSettings, WebshopCustomer, app.user, true, false, null, null, false, false, null, (translator is defined ? translator : null))|trans_replace('webshop', language)|raw}} </div> {% endif %} </div> <div class="card-col"> {% if WebshopSettings.getB2b and WebshopSettings.hidePricesGuest %} {% else %} {% if allow_cart or allow_list %} {% if allow_cart and OriginalProduct.type != 1 and OriginalProduct.type != 2 %} {% if OriginalProduct.canOrder %} {% set cartimage = OriginalProduct.media is not empty ? '/' ~ OriginalProduct.media.first.getWebPath('small') : (WebshopSettings.getDefaultProductImage is not empty ? WebshopSettings.getDefaultProductImage : '/bundles/trinitywebshop/img/no-product-image.png') %} <button data-cartimage="{{cartimage}}" data-carttitle="{{Product.label}}" data-cartintro="{{Product.intro}}" data-cartprice="{{Product.getDisplayPrice((WebshopSettings is defined ? WebshopSettings : null), WebshopCustomer, app.user)}}" type="button" data-id="{{OriginalProduct.id}}" class="btn order" data-catid="{{Category.id}}" title="Toevoegen aan winkelwagen"> <i class="fa fa-shopping-cart"></i> <i class="fa fa-plus"></i> </button> {% else %} <button type="button" disabled="disabled" data-id="{{OriginalProduct.id}}" class="btn btn-disabled" data-catid="{{Category.id}}" title="Niet op voorraad"> <i class="fa fa-shopping-cart"></i> </button> {% endif %} {% endif %} {% endif %} {% endif %} </div> </div> {% set cardSpecs = OriginalProduct.getProductCardSpecValues() %} {% if cardSpecs is not empty %} <div class="card-footer"> <div class="card-col"> <table> <tbody> {% for label, value in cardSpecs %} <tr> <td>{{ label }}</td> <td>{{ value }}</td> </tr> {% endfor %} </tbody> </table> </div> </div> {% endif %} {# {% if OriginalProduct is defined and OriginalProduct.type == 1 %} <div id="multiple-options-available"> {{'Meerdere varianten beschikbaar.'|trans}} </div> {% endif %} #} </div> </a> </div>{% endif %}{# {% endif %} #}