{% extends 'base.html.twig' %}

{% block body_class %} front-body--recap-stories{% endblock %}

{% block title %}Récap — {{ team.name }} | LPF 2026{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <link rel="stylesheet" href="{{ asset('css/team-show.css') }}?v=11">
    <link rel="stylesheet" href="{{ asset('css/team-recap-stories.css') }}?v=6">
{% endblock %}

{% set team_logo_src = team.logo
    ? (team.logo starts with 'http' ? team.logo : asset(team.logo))
    : null %}
{% set bigballs_rate = team_summary.bigballs_attempted > 0
    ? ((team_summary.bigballs_succeeded / team_summary.bigballs_attempted) * 100)|round
    : null %}

{% block body %}
    <div
        class="recap-stories"
        data-recap-stories
        data-autoplay-ms="5500"
        role="region"
        aria-roledescription="carrousel"
        aria-label="Récapitulatif de compétition {{ team.name }}"
    >
        <div class="recap-stories__frame">
            <div class="recap-stories__progress" data-recap-progress aria-hidden="true"></div>

            <header class="recap-stories__top">
                <a href="{{ path('app_homepage') }}" class="recap-stories__close" aria-label="Fermer le récap">
                    <i class="ti ti-x" aria-hidden="true"></i>
                </a>
                <p class="recap-stories__brand">LPF’26</p>
            </header>

            <div class="recap-stories__viewport" data-recap-viewport>
                {# 1 — Intro #}
                <article class="recap-slide recap-slide--intro is-active" data-recap-slide>
                    <div class="recap-slide__bg" aria-hidden="true"></div>
                    {% if team_logo_src %}
                        <img class="recap-slide__logo" src="{{ team_logo_src }}" alt="" loading="eager">
                    {% else %}
                        <div class="recap-slide__logo-placeholder" aria-hidden="true">{{ team.name|first|upper }}</div>
                    {% endif %}
                    <p class="recap-slide__eyebrow">Fin de compétition</p>
                    <h1 class="recap-slide__title">{{ team.name }}</h1>
                    {% if team.slogan %}
                        <p class="recap-slide__quote">« {{ team.slogan }} »</p>
                    {% endif %}
                    <ul class="recap-slide__players" aria-label="Joueurs">
                        {% for member in team_members|default(team.members) %}
                            <li>{{ member.nickname }}</li>
                        {% endfor %}
                    </ul>
                    <p class="recap-slide__hint">Tape ou swipe pour continuer</p>
                </article>

                {# 2 — Classement final #}
                {% if final_snapshot %}
                    <article class="recap-slide recap-slide--rank" data-recap-slide hidden>
                        <div class="recap-slide__bg" aria-hidden="true"></div>
                        <p class="recap-slide__eyebrow">Classement final</p>
                        <p class="recap-slide__mega">#{{ final_snapshot.position }}</p>
                        <p class="recap-slide__sub">sur {{ latest_teams_count }} équipes</p>
                        <p class="recap-slide__stat-line">
                            <strong>{{ team_total_points|number_format(0, ',', ' ') }}</strong> points
                        </p>
                    </article>
                {% endif %}

                {# 3 — Meilleure place #}
                {% if best_snapshot %}
                    <article class="recap-slide recap-slide--best" data-recap-slide hidden>
                        <div class="recap-slide__bg" aria-hidden="true"></div>
                        <p class="recap-slide__eyebrow">Meilleure position</p>
                        <p class="recap-slide__mega">#{{ best_snapshot.position }}</p>
                        {% if best_snapshot.matchRef %}
                            <p class="recap-slide__sub">
                                après
                                {{ best_snapshot.matchRef.paysDomicile ? best_snapshot.matchRef.paysDomicile.nom : '?' }}
                                —
                                {{ best_snapshot.matchRef.paysExterieur ? best_snapshot.matchRef.paysExterieur.nom : '?' }}
                            </p>
                        {% endif %}
                        {% if final_position and best_snapshot.position < final_position %}
                            <p class="recap-slide__punch">Tu as même été plus haut que ta place finale.</p>
                        {% elseif final_position and best_snapshot.position == final_position %}
                            <p class="recap-slide__punch">Tu as fini sur ton meilleur rang.</p>
                        {% endif %}
                    </article>
                {% endif %}

                {# 4 — Évolution #}
                {% if ranking_chart and ranking_chart.points is not empty %}
                    <article class="recap-slide recap-slide--chart" data-recap-slide hidden>
                        <div class="recap-slide__bg" aria-hidden="true"></div>
                        <p class="recap-slide__eyebrow">Évolution du classement</p>
                        {% if first_position and final_position %}
                            <p class="recap-slide__stat-line recap-slide__stat-line--xl">
                                #{{ first_position }}
                                <span class="recap-slide__arrow" aria-hidden="true">→</span>
                                #{{ final_position }}
                            </p>
                        {% endif %}
                        <div class="recap-slide__chart">
                            {% include 'competition/_team_show_ranking_chart.html.twig' with {
                                ranking_evolution_chart: ranking_chart,
                            } only %}
                        </div>
                    </article>
                {% endif %}

                {# 5 — Scores exacts #}
                <article class="recap-slide recap-slide--exact" data-recap-slide hidden>
                    <div class="recap-slide__bg" aria-hidden="true"></div>
                    <p class="recap-slide__eyebrow">Scores exacts</p>
                    <p class="recap-slide__mega">{{ team_summary.scores_exacts_count }}</p>
                    <p class="recap-slide__sub">
                        {{ team_summary.points_score_exact|number_format(0, ',', ' ') }} pts
                    </p>
                    <p class="recap-slide__punch">
                        {% if team_summary.scores_exacts_count == 0 %}
                            Zéro carton plein… la prochaine fois.
                        {% elseif team_summary.scores_exacts_count < 5 %}
                            Rare mais précieux.
                        {% else %}
                            Belle série de cartons pleins.
                        {% endif %}
                    </p>
                </article>

                {# 6 — BigBalls #}
                <article class="recap-slide recap-slide--bigballs" data-recap-slide hidden>
                    <div class="recap-slide__bg" aria-hidden="true"></div>
                    <p class="recap-slide__eyebrow">{{ bigballs_term('name') }}</p>
                    {% if team_summary.bigballs_attempted == 0 %}
                        <p class="recap-slide__mega">0</p>
                        <p class="recap-slide__sub">Aucune tentative</p>
                        <p class="recap-slide__punch">Pas de risque partagé cette saison.</p>
                    {% else %}
                        <p class="recap-slide__mega">
                            {{ team_summary.bigballs_succeeded }}<span class="recap-slide__mega-frac">/{{ team_summary.bigballs_attempted }}</span>
                        </p>
                        <p class="recap-slide__sub">
                            {% if bigballs_rate is not null %}{{ bigballs_rate }}% de réussite · {% endif %}
                            {{ team_summary.points_bigballs|number_format(0, ',', ' ') }} pts
                        </p>
                        <p class="recap-slide__punch">
                            {% if bigballs_rate is not null and bigballs_rate >= 50 %}
                                Vous avez osé… et ça a souvent payé.
                            {% else %}
                                Le duo a tenté le même score — le risque, c’est vous.
                            {% endif %}
                        </p>
                    {% endif %}
                </article>

                {# 7 — Jokers #}
                <article class="recap-slide recap-slide--jokers" data-recap-slide hidden>
                    <div class="recap-slide__bg" aria-hidden="true"></div>
                    <p class="recap-slide__eyebrow">Jokers</p>
                    <p class="recap-slide__mega">{{ jokers_placed|length }}</p>
                    <p class="recap-slide__sub">posé{{ jokers_placed|length > 1 ? 's' : '' }} sur la compétition</p>
                    {% if jokers_placed is not empty %}
                        <ul class="recap-slide__chips">
                            {% for row in jokers_placed|slice(0, 4) %}
                                <li>{{ row.joker_name }}</li>
                            {% endfor %}
                        </ul>
                    {% else %}
                        <p class="recap-slide__punch">Les jokers sont restés dans la poche.</p>
                    {% endif %}
                    {% if jokers_suffered is not empty %}
                        <p class="recap-slide__footnote">
                            {{ jokers_suffered|length }} joker{{ jokers_suffered|length > 1 ? 's' : '' }} offensif{{ jokers_suffered|length > 1 ? 's' : '' }} subi{{ jokers_suffered|length > 1 ? 's' : '' }}
                        </p>
                    {% endif %}
                </article>

                {# Efficacité des jokers posés #}
                {% if joker_efficiency %}
                    <article class="recap-slide recap-slide--efficiency" data-recap-slide hidden>
                        <div class="recap-slide__bg" aria-hidden="true"></div>
                        <p class="recap-slide__eyebrow">Efficacité des jokers</p>
                        {% if joker_efficiency.success_rate is not null %}
                            <p class="recap-slide__mega">{{ joker_efficiency.success_rate }}%</p>
                            <p class="recap-slide__sub">
                                {{ joker_efficiency.landed_count }}/{{ joker_efficiency.offensive_count }} offensif{{ joker_efficiency.offensive_count > 1 ? 's' : '' }} passé{{ joker_efficiency.landed_count > 1 ? 's' : '' }}
                            </p>
                        {% else %}
                            <p class="recap-slide__mega">{{ joker_efficiency.placed_count }}</p>
                            <p class="recap-slide__sub">joker{{ joker_efficiency.placed_count > 1 ? 's' : '' }} posé{{ joker_efficiency.placed_count > 1 ? 's' : '' }} (aucun offensif)</p>
                        {% endif %}
                        {% if joker_efficiency.points_gained > 0 %}
                            <p class="recap-slide__stat-line">
                                <strong>+{{ joker_efficiency.points_gained|number_format(0, ',', ' ') }}</strong> pts via pique
                            </p>
                        {% endif %}
                        {% if joker_efficiency.blocked_count > 0 %}
                            <p class="recap-slide__footnote">
                                {{ joker_efficiency.blocked_count }} bloqué{{ joker_efficiency.blocked_count > 1 ? 's' : '' }} (bouclier / équipe favorite)
                            </p>
                        {% endif %}
                        <p class="recap-slide__punch">
                            {% if joker_efficiency.success_rate is null %}
                                Des jokers plutôt défensifs ou utilitaires.
                            {% elseif joker_efficiency.success_rate >= 70 %}
                                Clinique. Tes jokers ont fait mal.
                            {% elseif joker_efficiency.success_rate >= 40 %}
                                Du bon, du moins bon — classique.
                            {% else %}
                                L’orga adverse était bien préparée…
                            {% endif %}
                        </p>
                    </article>
                {% endif %}

                {# Équipe la plus attaquée #}
                {% if most_attacked %}
                    {% set attacked_logo_src = most_attacked.team_logo
                        ? (most_attacked.team_logo starts with 'http' ? most_attacked.team_logo : asset(most_attacked.team_logo))
                        : null %}
                    <article class="recap-slide recap-slide--attacked" data-recap-slide hidden>
                        <div class="recap-slide__bg" aria-hidden="true"></div>
                        <p class="recap-slide__eyebrow">Ta cible préférée</p>
                        {% if attacked_logo_src %}
                            <img class="recap-slide__logo recap-slide__logo--sm" src="{{ attacked_logo_src }}" alt="" loading="lazy">
                        {% endif %}
                        <p class="recap-slide__mega recap-slide__mega--text">{{ most_attacked.team_name }}</p>
                        <p class="recap-slide__sub">
                            {{ most_attacked.attacks_count }} attaque{{ most_attacked.attacks_count > 1 ? 's' : '' }}
                            {% if most_attacked.pique_count > 0 %}
                                · {{ most_attacked.pique_count }} pique{{ most_attacked.pique_count > 1 ? 's' : '' }}
                            {% endif %}
                        </p>
                        {% if most_attacked.points_inflicted > 0 %}
                            <p class="recap-slide__stat-line">
                                <strong>{{ most_attacked.points_inflicted|number_format(0, ',', ' ') }}</strong> pts infligés
                            </p>
                        {% endif %}
                        {% if most_attacked.joker_names is not empty %}
                            <ul class="recap-slide__chips">
                                {% for name in most_attacked.joker_names|slice(0, 4) %}
                                    <li>{{ name }}</li>
                                {% endfor %}
                            </ul>
                        {% endif %}
                        <p class="recap-slide__punch">L’équipe que tu as le plus ciblée.</p>
                    </article>
                {% endif %}

                {# Meilleur ennemi #}
                {% if best_enemy %}
                    {% set enemy_logo_src = best_enemy.team_logo
                        ? (best_enemy.team_logo starts with 'http' ? best_enemy.team_logo : asset(best_enemy.team_logo))
                        : null %}
                    <article class="recap-slide recap-slide--enemy" data-recap-slide hidden>
                        <div class="recap-slide__bg" aria-hidden="true"></div>
                        <p class="recap-slide__eyebrow">Ton meilleur ennemi</p>
                        {% if enemy_logo_src %}
                            <img class="recap-slide__logo recap-slide__logo--sm" src="{{ enemy_logo_src }}" alt="" loading="lazy">
                        {% endif %}
                        <p class="recap-slide__mega recap-slide__mega--text">{{ best_enemy.team_name }}</p>
                        <p class="recap-slide__sub">
                            {{ best_enemy.jokers_count }} joker{{ best_enemy.jokers_count > 1 ? 's' : '' }} reçu{{ best_enemy.jokers_count > 1 ? 's' : '' }}
                            {% if best_enemy.pique_count > 0 %}
                                · {{ best_enemy.pique_count }} pique{{ best_enemy.pique_count > 1 ? 's' : '' }}
                            {% endif %}
                        </p>
                        {% if best_enemy.points_stolen > 0 %}
                            <p class="recap-slide__stat-line">
                                <strong>{{ best_enemy.points_stolen|number_format(0, ',', ' ') }}</strong> pts volés / retirés
                            </p>
                        {% endif %}
                        {% if best_enemy.joker_names is not empty %}
                            <ul class="recap-slide__chips">
                                {% for name in best_enemy.joker_names|slice(0, 4) %}
                                    <li>{{ name }}</li>
                                {% endfor %}
                            </ul>
                        {% endif %}
                        <p class="recap-slide__punch">Ils t’ont le plus cherché cette saison.</p>
                    </article>
                {% endif %}

                {# Buteurs #}
                {% if buteurs %}
                    <article class="recap-slide recap-slide--buteurs" data-recap-slide hidden>
                        <div class="recap-slide__bg" aria-hidden="true"></div>
                        <p class="recap-slide__eyebrow">Tes buteurs</p>
                        <p class="recap-slide__stat-line recap-slide__stat-line--xl">
                            {{ buteurs.total_points|number_format(0, ',', ' ') }} pts
                        </p>
                        <p class="recap-slide__sub">
                            {{ buteurs.total_goals }} but{{ buteurs.total_goals > 1 ? 's' : '' }} au total
                        </p>
                        <ul class="recap-buteurs">
                            {% for row in buteurs.rows %}
                                <li class="recap-buteurs__item">
                                    {% if row.buteur_photo %}
                                        <img class="recap-buteurs__photo" src="{{ row.buteur_photo starts with 'http' ? row.buteur_photo : asset(row.buteur_photo) }}" alt="" loading="lazy">
                                    {% else %}
                                        <span class="recap-buteurs__photo-placeholder" aria-hidden="true">{{ row.buteur_name|first|upper }}</span>
                                    {% endif %}
                                    <div class="recap-buteurs__meta">
                                        <p class="recap-buteurs__name">{{ row.buteur_name }}</p>
                                        <p class="recap-buteurs__detail">
                                            {{ row.nickname }}
                                            {% if row.country %} · {{ row.country }}{% endif %}
                                        </p>
                                        <p class="recap-buteurs__stats">
                                            {{ row.goals }} but{{ row.goals > 1 ? 's' : '' }}
                                            · {{ row.points|number_format(0, ',', ' ') }} pts
                                        </p>
                                    </div>
                                </li>
                            {% endfor %}
                        </ul>
                    </article>
                {% endif %}

                {# Duel #}
                {% if duel %}
                    <article class="recap-slide recap-slide--duel" data-recap-slide hidden>
                        <div class="recap-slide__bg" aria-hidden="true"></div>
                        <p class="recap-slide__eyebrow">Duel interne</p>
                        <div class="recap-duel">
                            <div class="recap-duel__side">
                                <p class="recap-duel__name">{{ duel.leader_nickname }}</p>
                                <p class="recap-duel__pts">{{ duel.leader_points|number_format(0, ',', ' ') }} pts</p>
                                <p class="recap-duel__pct">{{ duel.leader_percent }}%</p>
                            </div>
                            <p class="recap-duel__vs" aria-hidden="true">VS</p>
                            <div class="recap-duel__side">
                                <p class="recap-duel__name">{{ duel.trailer_nickname }}</p>
                                <p class="recap-duel__pts">{{ duel.trailer_points|number_format(0, ',', ' ') }} pts</p>
                                <p class="recap-duel__pct">{{ duel.trailer_percent }}%</p>
                            </div>
                        </div>
                        {% if duel.gap_points > 0 %}
                            <p class="recap-slide__punch">Écart : {{ duel.gap_points|number_format(0, ',', ' ') }} pts</p>
                        {% else %}
                            <p class="recap-slide__punch">Match nul parfait.</p>
                        {% endif %}
                    </article>
                {% endif %}

                {# 9 — MVP #}
                {% if mvp %}
                    <article class="recap-slide recap-slide--mvp" data-recap-slide hidden>
                        <div class="recap-slide__bg" aria-hidden="true"></div>
                        <p class="recap-slide__eyebrow">MVP de l’équipe</p>
                        <p class="recap-slide__mega recap-slide__mega--text">{{ mvp.nickname }}</p>
                        <p class="recap-slide__sub">
                            {{ mvp.points_total|number_format(0, ',', ' ') }} pts
                            · {{ mvp.percent_of_team }}% de l’équipe
                        </p>
                        <p class="recap-slide__punch">Le moteur de la saison.</p>
                    </article>
                {% endif %}

                {# 10 — Mot de l’admin (avant-dernier) #}
                {% if team.hasRecapAdminMessage %}
                    <article class="recap-slide recap-slide--admin" data-recap-slide hidden>
                        <div class="recap-slide__bg" aria-hidden="true"></div>
                        <p class="recap-slide__eyebrow">Mot de l’orga</p>
                        {% if team.recapAdminTitle %}
                            <h2 class="recap-slide__title recap-slide__title--admin">{{ team.recapAdminTitle }}</h2>
                        {% endif %}
                        <p class="recap-slide__admin-body">{{ team.recapAdminBody|nl2br }}</p>
                        {% if recap_admin_persona %}
                            <footer class="recap-slide__admin-signature">
                                {% if recap_admin_persona.avatarPublicPath %}
                                    <img
                                        class="recap-slide__admin-avatar"
                                        src="{{ asset(recap_admin_persona.avatarPublicPath) }}"
                                        alt=""
                                        width="56"
                                        height="56"
                                        loading="lazy"
                                        decoding="async"
                                    >
                                {% else %}
                                    <span class="recap-slide__admin-avatar recap-slide__admin-avatar--placeholder" aria-hidden="true">
                                        {{ recap_admin_persona.displayName|first|upper }}
                                    </span>
                                {% endif %}
                                <p class="recap-slide__admin-author">
                                    — {{ team.recapAdminAuthor ?: recap_admin_persona.displayName }}
                                </p>
                            </footer>
                        {% elseif team.recapAdminAuthor %}
                            <p class="recap-slide__admin-author">— {{ team.recapAdminAuthor }}</p>
                        {% endif %}
                    </article>
                {% endif %}

                {# 11 — Clôture #}
                <article class="recap-slide recap-slide--outro" data-recap-slide hidden>
                    <div class="recap-slide__bg" aria-hidden="true"></div>
                    {% if team_logo_src %}
                        <img class="recap-slide__logo recap-slide__logo--sm" src="{{ team_logo_src }}" alt="" loading="lazy">
                    {% endif %}
                    <p class="recap-slide__eyebrow">Merci</p>
                    <h2 class="recap-slide__title">À très vite pour de nouvelles aventures</h2>
                    <p class="recap-slide__sub">
                        {{ team.name }} · {{ team_total_points|number_format(0, ',', ' ') }} pts
                        {% if final_snapshot %} · #{{ final_snapshot.position }}{% endif %}
                    </p>
                    <div class="recap-slide__actions">
                        <a href="{{ path('app_team_recap_detail', { id: team.id }) }}" class="btn btn-primary">
                            Voir le détail
                        </a>
                        <a href="{{ path('app_ranking') }}" class="btn btn-outline recap-slide__btn-ghost">
                            Classement
                        </a>
                    </div>
                </article>
            </div>

            <button type="button" class="recap-stories__hit recap-stories__hit--prev" data-recap-prev aria-label="Slide précédente"></button>
            <button type="button" class="recap-stories__hit recap-stories__hit--next" data-recap-next aria-label="Slide suivante"></button>
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script src="{{ asset('js/team-recap-stories.js') }}?v=2" defer></script>
{% endblock %}