{% import "@SyliusShop/Common/Macro/money.html.twig" as money %}
{% extends '@SyliusShop/layout.html.twig' %}
{% block title %}
{{ taxon.seoTitle|default(taxon.name) }} | {{ parent() }}
{% endblock %}
{% block metatags %}
{{ parent() }}
{% if taxon.seoMetaDescription is not empty %}
<meta name="description" content="{{ taxon.seoMetaDescription }}" />
{% endif %}
{% endblock %}
{% block content %}
{# Fil d'ariane #}
{{ wo_render_breadcrumbs() }}
<div class="categorie {% if taxon.children|length == 0 %}lastlevel{% endif %}" >
{% if taxon.categoryType == 'category_type_fabric' %}
{# Tissu - Titre et description à gauche - Liste de sous-categorie à droite #}
<div class="categorie-top {% if taxon.children|length > 0 %}tissu{% endif %}">
{% if taxon.children|length > 0 %}
<div class="categorie-top-left">
<h1>{{ taxon.name }}</h1>
<div>
<input type="checkbox" id="expanded">
<div>{{ taxon.description|raw }}</div>
<label for="expanded" role="button">{{ 'app.front.global.btn_voirplus'|trans }}</label>
</div>
</div>
</div>
{% else %}
<div class="categorie-top-left">
<h1>{{ taxon.name }}</h1>
</div>
<div class="categorie-top-right">
{{ taxon.description|raw }}
</div>
{% endif %}
</div>
{% elseif taxon.categoryType == 'category_type_product' and taxon.imagesByType('image_taxon_mea_header')|length > 0 %}
{# Produits - MEA en en-tête - Titre et description à gauche #}
<div class="categorie-top categorie-top-mea">
<div class="categorie-top-left">
<h1>{{ taxon.name }}</h1>
{% if is_mobile() %}
<div>
<input type="checkbox" id="expanded">
<div>{{ taxon.description|raw }}</div>
<label for="expanded" role="button">{{ 'app.front.global.btn_voirplus'|trans }}</label>
</div>
{% else %}
<div>{{ taxon.description|raw }}</div>
{% endif %}
</div>
<div class="categorie-top-right">
<img class="ui image" src="{{ taxon.imagesByType('image_taxon_mea_header').first.path|imagine_filter('app_taxon_entete_mea') }}" />
</div>
</div>
{% else %}
{# Produits - Pas de "MEA" - Titre et description #}
<div class="categorie-top categorie-top-text-and-desc">
<div class="categorie-top-left {% if taxon.description is empty %}full{% endif %}">
<h1>{{ taxon.name }}</h1>
</div>
{% if taxon.description is not empty %}
<div class="categorie-top-right">
<input type="checkbox" id="expanded">
<div>{{ taxon.description|raw }}</div>
<label for="expanded" role="button">Voir plus</label>
</div>
{% endif %}
</div>
{% endif %}
{% if taxon.categoryType == 'category_type_product' and taxon.children|length > 0 %}
{% include 'partials/block-categorie-childrens.html.twig' with {'taxonsChilds': taxon.children} only %}
{% endif %}
{# Tissu - Liste des produits #}
{% if taxon.categoryType == 'category_type_fabric' %}
{% if variants|length < 5 %}
{% set bloc_image = 4 %}
{% elseif variants|length < 11 %}
{% set bloc_image = 10 %}
{% else %}
{% set bloc_image = 16 %}
{% endif %}
<div class="categorie-listing tissu">
<div id="products-top">
{# Filtres à facettes #}
{% include 'partials/block-facet-filters.html.twig' with {
'ajaxUrl': path('app_taxon_ajax_list', {'taxonId': taxon.id})
} %}
{# Ordre des résultats #}
{% include 'partials/block-sort-results.html.twig' %}
</div>
<div class="ui six cards listing1 containergrid containergrid{{ bloc_image }} js-ajax-list-products" id="products" {{ sylius_test_html_attribute('products') }} {% if filtreUrl != '' %}data-filtreUrl={{ filtreUrl }} {% endif %}>
{% include 'taxons/taxon_list_products_ajax.html.twig' with {
'variants': variants,
'taxon': taxon
} only %}
</div>
<div class="btn-lien" style="display: {{ totalResults > maxViewResults ? 'flex' : 'none' }};">
<button class="js-ajax-more-products" data-add-to-offset="{{ maxViewResults }}">Voir +</button>
</div>
{% if totalResults > maxViewResults %}
<div class="pagination" data-total="{{ totalResults }}"> <span>{{ maxViewResults }}</span> sur {{ totalResults }}</div>
{% endif %}
</div>
{% endif %}
{# Affiche les nouveautés uniquement si on est dans une catégorie "produit" (= non tissu) #}
{% if newestProducts is defined and newestProducts|length > 0 and taxon.categoryType == 'category_type_product' %}
<div class="categorie-produitsnouveaux">
<div class="categorie-produitsnouveaux-ctn">
<div class="title">
{{ 'app.front.categorie.produitsnouveaux1'|trans }}
<h2>{{ 'app.front.categorie.produitsnouveaux2'|trans }} <strong>{{ 'app.front.categorie.produitsnouveaux3'|trans }}</strong> !</h2>
</div>
<div class="listing1 caroussel">
{% for product in newestProducts %}
{% if product.hasImages %}
{% include 'products/single_product_in_circle.html.twig' with {'product': product} only %}
{% endif %}
{% endfor %}
</div>
<div class="btn-lien" style="display: flex; margin-top: 25px">
<a href="{{ path('app_search_result', {'facets[taxons]': taxon.id}) }}">{{ 'app.front.categorie.produitsnouveaux4'|trans }} {{ taxon.name|capitalize }}</a>
</div>
</div>
</div>
{% endif %}
{% if articles|length > 0 %}
{% include 'partials/block-list-article-guide.html.twig' with {
'title': taxon.singleArticleCategoryTitle,
'titleen': taxon.singleArticleCategoryTitleen,
'articles': articles
} only %}
{% endif %}
{% if ctas is defined and ctas is not empty %}
<div class="categorie-cta">
<div class="categorie-cta-ctn">
{% for cta in ctas|slice(0, 2) %}
<div class="cta">
{% if cta.link is not empty %}
<a href="{{ cta.link }}">
<img src="{{ cta.image_path|imagine_filter('app_taxon_image_ctas') }}" class="ui image" />
</a>
{% else %}
<img src="{{ cta.image_path|imagine_filter('app_taxon_image_ctas') }}" class="ui image" />
{% endif %}
</div>
{% endfor %}
</div>
</div>
{% endif %}
{# {% include 'partials/block-fidelity-program.html.twig' %} #}
{{ bitbag_cms_render_block('fidelite') }}
{% include 'partials/block-dejavu.html.twig' %}
{% include 'taxons/taxon_referencement_block.html.twig' with {
'taxon': taxon,
'referencementllinks': referencementllinks
} only %}
</div>
{% endblock %}