{% import "@SyliusShop/Common/Macro/money.html.twig" as money %}
{% extends '@SyliusShop/layout.html.twig' %}
{# {% block title %}
Collection {{ collection.title }} | {{ parent() }}
{% endblock %}
{% block metatags %}
{{ parent() }}
<meta name="description" content="Découvrez la Collection {{ collection.title }} - {{ type }} - Choisissez votre accessoire de mode ou votre tissu. Livraison gratuite en boutique." />
{% endblock %} #}
{% block title %}{{ bitbag_cms_render_block('metatitle-collection-show') }} {{ collection.title }} | {{ parent() }}{% endblock %}
{% block metatags %}
{{ parent() }}
<meta name="description" content="{{ collection.title }} - {{ type }} - {{ bitbag_cms_render_block('metadesc-collection-show')|striptags|raw|replace({"\n": "", "\r": "", "\t": ""}) }}" />
{% endblock %}
{% block container_css_classes %}
{% apply spaceless %}
bitbag_sylius_cms_plugin_shop_page_show
{% endapply %}
{% endblock %}
{% block content %}
<div class="page-content typecms3">
{# Fil d'ariane #}
{{ wo_render_breadcrumbs() }}
<div class="page-collection-ctn">
<div class="page-collection-left" style="background: {{ collection.mainColor|default('gray') }};">
{% if collection.getImagesByType('image_collection_main_left')|length > 0 %}
<img src="{{ collection.getImagesByType('image_collection_main_left').first.path|imagine_filter('sylius_shop_product_original') }}" class="ui image">
{% endif %}
</div>
<div class="page-collection-right">
<div class="page-collection-right-ctn">
<div class="top">
{% if collection.new == true %}
<span>{{ 'app.front.collections.new'|trans }}</span>
{% endif %}
Collection
</div>
<h1 class="bitbag-page-name">{{ collection.title }}</h1>
<div class="links">
<a href="#product-ancre-collection">{{ 'app.front.global.voirlesproduits'|trans }}</a>
{% if collection.replay is not empty %}
<a href="{{ collection.replay }}">Voir le live shopping</a>
{% elseif collection.singleArticle is not empty %}
<a href="{{ path('app_leguide_article', {'slugCategory': collection.singleArticle.articleCategory.slug, 'slug': collection.singleArticle.slug, 'articleId': collection.singleArticle.id}) }}">Voir notre look book</a>
{% endif %}
</div>
</div>
{% if complementaryFabric is not empty %}
<div class="badge-ctn">
<div>
<div id="circle">
<a href="{{ path('app_product_variant_show', {'slug': complementaryFabric.slug, 'id': complementaryFabric.id}) }}">
<img src="{{ asset('webapic-theme/images/txt-tournant-tissu.svg') }}" class="ui image" />
</a>
</div>
</div>
<div>
<a class="apercu-tissu" href="{{ path('app_product_variant_show', {'slug': complementaryFabric.slug, 'id': complementaryFabric.id}) }}">
{% if complementaryFabric.getImagesByType('image_product_main')|length > 0 %}
<img src="{{ complementaryFabric.getImagesByType('image_product_main').first.path|imagine_filter('app_product_fabric_small_thumbnail') }}" class="ui image" />
{% endif %}
</a>
</div>
</div>
{% endif %}
</div>
{% if collection.textSubtitle is not empty %}
<div class="page-collection-bottom">
<div>{{ collection.textSubtitle|raw }}</div>
{% if collection.colors|length > 0 %}
<div class="colors">
{% for color in collection.colors %}
<div class="color" style="background-color:{{ color }}"> </div>
{% endfor %}
</div>
{% endif %}
</div>
{% endif %}
{% if collection.getImagesByType('image_collection_parallax')|length > 0 %}
<div class="page-collection-parallaxe">
<div class="caroussel">
{% for image in collection.getImagesByType('image_collection_parallax') %}
<img src="{{ image.path|imagine_filter('sylius_shop_product_original') }}" class="ui image" />
{% endfor %}
</div>
</div>
{% endif %}
</div>
</div>
<div class="bitbag-block">
{# Text a gauche et image a droite #}
<div class="block-type2 block-type10">
<div class="block-type2-ctn">
<div class="block-type2-left block-type10-left">
{{ collection.textLeftPart|raw }}
</div>
<div class="block-type2-right">
{% if collection.getImagesByType('image_collection_main_right_text')|length > 0 %}
<img src="{{ collection.getImagesByType('image_collection_main_right_text').first.path|imagine_filter('sylius_shop_product_original') }}">
{% endif %}
</div>
</div>
</div>
{# Image à gauche et texte à droite #}
<div class="block-type11">
<div class="block-type11-ctn">
<div class="block-type11-left">
{% if collection.getImagesByType('image_collection_main_left_text')|length > 0 %}
<img src="{{ collection.getImagesByType('image_collection_main_left_text').first.path|imagine_filter('sylius_shop_product_original') }}">
{% endif %}
</div>
<div class="block-type11-right">
<div class="desc">
{{ collection.textRightPart|raw }}
</div>
</div>
</div>
</div>
{# Liste des produits #}
<div id="product-ancre-collection" class="bitbag-page-products listing1">
<div class="title">{{ 'app.front.collections.productsof'|trans }} <strong>collection {{ collection.title }}</strong></div>
{% for variant in variants %}
{% if variant.canAddItem() %}
{% include 'products/single_product_in_circle.html.twig' with {'product': variant} only %}
{% endif %}
{% endfor %}
</div>
{# Affiche le tissu et l'image #}
<div class="block-type12">
<div class="block-type12-ctn">
<div class="block-type12-left">
{% if collection.getImagesByType('image_collection_bottom_fabric')|length > 0 %}
<img src="{{ collection.getImagesByType('image_collection_bottom_fabric').first.path|imagine_filter('sylius_shop_product_original') }}">
{% endif %}
</div>
{% if complementaryFabric is not empty %}
<div class="block-type12-right">
<img src="/webapic-theme/images/collection-fleche.png" class="top ui image">
<div id="circle">
<img src="{{ asset('webapic-theme/images/txt-tournant-tissu.svg') }}" class="ui image" />
</div>
{% if complementaryFabric.imagesByType('image_product_hover') is not empty %}
{% set source_path = complementaryFabric.imagesByType('image_product_hover').first.path %}
{% set original_path = source_path|imagine_filter('sylius_shop_product_original') %}
{% set path = source_path|imagine_filter(filter|default('sylius_shop_product_large_thumbnail')) %}
{% elseif complementaryFabric.images.first %}
{% set source_path = complementaryFabric.images.first.path %}
{% set original_path = source_path|imagine_filter('sylius_shop_product_original') %}
{% set path = source_path|imagine_filter(filter|default('sylius_shop_product_large_thumbnail')) %}
{% else %}
{% set original_path = asset('assets/shop/img/400x300.png') %}
{% set path = original_path %}
{% endif %}
<div class="collection-right-product-ctn">
<a href="{{ path('app_product_variant_show', {'slug': complementaryFabric.slug, 'id': complementaryFabric.id}) }}">
<div class="img-ctn">
<div class=" img-ctn-content">
<img src="{{ path }}" id="main-image" alt="{{ complementaryFabric.name }}" {{ sylius_test_html_attribute('main-image') }} />
</div>
</div>
{% set price = money.calculatePrice(complementaryFabric) %}
{% set originalPrice = money.calculateOriginalPrice(complementaryFabric) %}
<div class="sylius-product-price price" {{ sylius_test_html_attribute('product-price') }}>
<span>{{ 'app.front.global.apartir'|trans }} </span>
{{ price }}/m
</div>
</a>
</div>
</div>
{% endif %}
</div>
</div>
{# Motif répétable #}
{% if complementaryFabric is not empty %}
<div class="block-type13">
{% if collection.getImagesByType('image_collection_pattern')|length > 0 %}
<img src="{{ collection.getImagesByType('image_collection_pattern').first.path|imagine_filter('sylius_shop_product_original') }}">
{% endif %}
</div>
{% endif %}
{# Collections qui matchent #}
{% if collectionMatchs|length > 0 %}
<div class="block-type14">
<div class="block-type14-ctn" data-bgtitle="{{ collection.title }}">
<div class="block-type14-top">
<span>{{ 'app.front.collections.match1'|trans }},</span>
<h3>{{ 'app.front.collections.match2'|trans }} <strong>{{ 'app.front.collections.match3'|trans }}</strong> !</h3>
</div>
<div class="block-type14-collections">
<div class="block-type14-collections-ctn">
{% for collectionMatch in collectionMatchs %}
{# {{ dump(collectionMatch) }} #}
<div class="taxon-ctn">
<div class="taxon">
<div class="img-ctn">
{% if collectionMatch.getImagesByType('image_collection_pattern').first.path is defined %}
<img src="{{ collectionMatch.getImagesByType('image_collection_pattern').first.path|imagine_filter('sylius_shop_product_original') }}" />
{% else %}
<img src="{{ asset('webapic-theme/images/slide-circle.svg') }}">
{% endif %}
</div>
<div class="content">
<span>{{ collectionMatch.title }}</span>
</div>
</div>
</div>
<div class="hover">
<div class="hover-ctn">
{% for variantMatch in variantsMatch[collectionMatch.id] %}
<div class="association-ctn-product">
{% include 'products/petite_touche_product.html.twig' with {'product': variantMatch} only %}
</div>
{% endfor %}
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</div>
{% endif %}
</div>
{% endblock %}