{% import 'fixture/_chip.html.twig' as pick_row %}
<h2>Składy</h2>

{# Liczba kolumn bierze sie z formatu, a nie z czworki na sztywno. Ukladem obu
   stron (obok siebie czy jedna pod druga) i liczba kolumn skladu w kazdej z
   nich rzadzi siatka Bootstrapa (row-cols-*): pojedynek i duety staja obok
   siebie od 768px, bo maja najwyzej dwie kolumny kazda, a trojki i czworka
   zawsze jedna strona pod druga, bo osiem kolumn nie miesci sie sensownie w
   jednym rzedzie. #}
{% set wrapCols = fixture.format.squadSize in [1, 2] ? 'row-cols-1 row-cols-md-2' : 'row-cols-1' %}
<div class="squads-wrap squads-wrap--{{ fixture.format.squadSize }} row {{ wrapCols }}">
{% for side, squad in {'mine': mySquad, 'opponent': opponentSquad} %}
    <section class="squads-side">
    <p class="squads__label side--{{ side }}">{{ squad.name }}</p>

    {% set squadsCols = {
        1: 'row-cols-1',
        2: 'row-cols-1 row-cols-md-2',
        3: 'row-cols-1 row-cols-md-2 row-cols-lg-3',
        4: 'row-cols-1 row-cols-md-2 row-cols-lg-4',
    }[fixture.format.squadSize] %}
    <div class="squads row {{ squadsCols }}">
        {% for entry in squad.entries %}
            {% set snapshot = view.snapshotFor(entry.id) %}
            {% set live = not fixture.gameweek.finished %}
            {% set waitingCount = live and snapshot and snapshot.hasData
                ? snapshot.startingPicks|filter(p => p.minutes == 0 and p.rawPoints == 0)|length
                : 0 %}
            {# Karta musi siedziec w osobnej kolumnie: Bootstrap wklada odstep
               jako wypelnienie dziecka wiersza, wiec gdy dzieckiem jest sama
               karta, odstep wpada pod jej tlo i karty sie stykaja. #}
            <div class="col">
            <details class="squad-picks side--{{ side }}" open>
                <summary>
                    <span class="squad-picks__name">{{ entry.teamName }}</span>
                    {% if waitingCount > 0 %}<span class="waiting-count">{{ waitingCount }} do gry</span>{% endif %}
                    <span class="squad-picks__total">{{ snapshot and snapshot.hasData ? snapshot.netPoints : '—' }}</span>
                </summary>

                {% if snapshot and snapshot.hasData %}
                    <table>
                        <tbody>
                        {% for pick in snapshot.startingPicks %}
                            {{ pick_row.row(pick, live, view.isClubPlayingNow(pick.element.plTeam.id)) }}
                        {% endfor %}
                        </tbody>
                    </table>

                    {# Przy chipie z grajaca lawka wszystkie pietnascie pozycji ma mnoznik
                       wiekszy od zera, wiec ta lista jest pusta i blok w ogole sie nie pojawia. #}
                    {% if snapshot.benchPicks is not empty %}
                        <div class="benchblock">
                            <p class="benchblock__label">Ławka</p>
                            <table>
                                <tbody>
                                {% for pick in snapshot.benchPicks %}
                                    {{ pick_row.row(pick, live, view.isClubPlayingNow(pick.element.plTeam.id)) }}
                                {% endfor %}
                                </tbody>
                            </table>
                        </div>
                    {% endif %}
                {% else %}
                    <p class="hint">Brak danych z FPL.</p>
                {% endif %}
            </details>
            </div>
        {% endfor %}
    </div>
    </section>
{% endfor %}
</div>