{% trans_default_domain 'front_ec_international' %}

{% set i18n = teaser|i18n %}

{% if i18n %}

    {% set title = i18n.title %}
    {% set titleForce = i18n.titleForce ? i18n.titleForce : 2 %}
    {% set titleAlignment = i18n.titleAlignment ? i18n.titleAlignment : 'text-left' %}

    {% if title|striptags|length > 0 %}
        <h{{ titleForce }} class="title mb-4 {{ titleAlignment }}">{{ title|unescape|raw }}</h{{ titleForce }}>
    {% endif %}

{% endif %}

{% if teaser.hasSlider %}
    <div id="teaser-news-{{ teaser.slug }}" class="carousel slide carousel-fade" data-ride="carousel">
        <div class="carousel-inner">

            {% set isFirst = true %}

            {% for post in posts %}

                {% set entity = post.entity %}
                {% set category = post.entity.category %}

                <div class="carousel-item {% if loop.first %} active{% endif %}">
                    <div class="row">
                        <div class="col-lg-12 content pl-lg-5 mt-5 mt-lg-0 pr-3 pl-3 pr-lg-0 pl-lg-0"
                             data-aos="fade-right">
                            <div class="row m-lg-0">
                                <div class="col-12 col-lg-8 content-left">
                                    <div class="d-flex flex-column h-100">

                                        {% if not category.hideDate %}
                                            <div class="date mb-2 d-inline-block w-100">
                                                  <span class="day bold text-secondary">
                        {{ entity.publicationStart|localizeddate("medium", "none", app.request.locale, null, "dd") }}
                    </span>
                                                <span class="month text-primary font-weight-light">
                        {{ entity.publicationStart|localizeddate("medium", "none", app.request.locale, null, "MM") }}
                    </span>
                                                <span class="year text-primary font-weight-light">
                        {{ entity.publicationStart|localizeddate("medium", "none", app.request.locale, null, "yyyy") }}
                    </span>
                                            </div>
                                        {% endif %}

                                        {% if post.title|striptags|length > 0 %}
                                            {% if post.pageUrl and post.url %}
                                                <a href="{{ path('front_newscast_view', {'pageUrl': post.pageUrl, 'url': post.url}) }}" class="news-link d-flex">
                                            {% endif %}
                                            <i class="fal fa-arrow-right text-secondary"></i>
                                            <h5 class="ml-3 title {{ post.titleAlignment }}">{{ post.title|raw }}</h5>
                                            {% if post.pageUrl and post.url %}
                                                </a>
                                            {% endif %}
                                        {% endif %}

                                        {% if category.displayCategory %}
                                            {% set i18nCategory = category|i18n %}
                                            {% if i18nCategory and i18nCategory.title %}
                                                {% set titleCategory = i18nCategory.title %}
                                                <h{{ post.titleForce + 1 }}
                                                        class="news-category-title {{ post.titleAlignment }}">{{ titleCategory|unescape|raw }}</h{{ post.titleForce + 1 }}>
                                            {% endif %}
                                        {% endif %}
                                    </div>
                                </div>
                                <div class="d-none d-lg-block col-12 col-lg-4 content-right">
                                    <div class="d-flex flex-column h-100 text-center text-lg-right">

                                        {% if posts|length > 1 %}

                                            <div class="carousel-controls mt-3 mt-lg-3">
                                            <span class="carousel-control carousel-control-prev cursor"
                                                  href="#teaser-news-{{ teaser.slug }}" role="button" data-slide="prev"
                                                  aria-label="{{ "Précédent"|trans|raw }}">
                                                <i class="fal fa-chevron-left text-dark mr-3" aria-hidden="true"></i>
                                            </span>
                                                <span class="carousel-control carousel-control-next cursor"
                                                      href="#teaser-news-{{ teaser.slug }}" role="button"
                                                      data-slide="next" aria-label="{{ "Suivant"|trans|raw }}">
                                                <i class="fal fa-chevron-right text-dark" aria-hidden="true"></i>
                                            </span>
                                            </div>

                                        {% endif %}

                                    </div>
                                </div>
                                {% if posts|length > 1 and isDesktop() %}
                                    <ol class="carousel-indicators mt-5">
                                        {% for i in 0..(posts|length - 1) %}
                                            <li data-target="#teaser-news-{{ teaser.slug }}"
                                                data-slide-to="{{ i }}"{% if isFirst %} class="active"{% endif %}></li>
                                            {% set isFirst = false %}
                                        {% endfor %}
                                    </ol>
                                {% endif %}

                                {% if isMobile() or isTablet() %}
                                    <div class="col-12 text-center mt-4 mb-2">
                                        <ol class="carousel-indicators">
                                            {% for i in 0..(posts|length - 1) %}
                                                <li data-target="#teaser-news-{{ teaser.slug }}"
                                                    data-slide-to="{{ i }}"{% if isFirst %} class="active"{% endif %}></li>
                                                {% set isFirst = false %}
                                            {% endfor %}
                                        </ol>
                                    </div>
                                {% endif %}
                            </div>
                        </div>
                    </div>
                </div>

            {% endfor %}

        </div>
    </div>
{% else %}
    <div id="teaser-news-{{ teaser.slug }}" class="container">
        <div class="row">
            {% set isFirst = true %}

            {% for post in posts %}

                {% set entity = post.entity %}
                {% set category = post.entity.category %}

                <div class="col-12 col-lg-4 content mb-4 mb-lg-0">
                    <div class="row m-lg-0">
                        <div class="d-flex flex-column h-100">

                            {% if not category.hideDate %}
                                <div class="date mb-2 d-inline-block w-100">
                                                  <span class="day bold text-secondary">
                        {{ entity.publicationStart|localizeddate("medium", "none", app.request.locale, null, "dd") }}
                    </span>
                                    <span class="month text-primary font-weight-light">
                        {{ entity.publicationStart|localizeddate("medium", "none", app.request.locale, null, "MM") }}
                    </span>
                                    <span class="year text-primary font-weight-light">
                        {{ entity.publicationStart|localizeddate("medium", "none", app.request.locale, null, "yyyy") }}
                    </span>
                                </div>
                            {% endif %}

                            {% if post.title|striptags|length > 0 %}
                                {% if post.pageUrl and post.url %}
                                    <a href="{{ path('front_newscast_view', {'pageUrl': post.pageUrl, 'url': post.url}) }}" class="news-link d-flex">
                                {% endif %}
                                <i class="fal fa-arrow-right text-secondary"></i>
                                <h5 class="ml-3 title {{ post.titleAlignment }}">{{ post.title|raw }}</h5>
                                {% if post.pageUrl and post.url %}
                                    </a>
                                {% endif %}
                            {% endif %}

                            {% if category.displayCategory %}
                                {% set i18nCategory = category|i18n %}
                                {% if i18nCategory and i18nCategory.title %}
                                    {% set titleCategory = i18nCategory.title %}
                                    <h{{ post.titleForce + 1 }}
                                            class="news-category-title {{ post.titleAlignment }}">{{ titleCategory|unescape|raw }}</h{{ post.titleForce + 1 }}>
                                {% endif %}
                            {% endif %}
                        </div>
                    </div>
                </div>
            {% endfor %}
        </div>
    </div>
{% endif %}