orgasso/templates/components/Planning.html.twig

{# Template pour les plannings #}

{% set cols = event.getSpaces()|length +1 %}

{# début du block de grille #}
<div class="block">
    {# Nombre de colonnes = nombre d'espaces + colonne d'intro #}
    <div class="fixed-grid has-{{ cols }}-cols">
        <div class="grid is-gap-0">

            {# en-tête avec les noms des espaces #}
            <div class="cell planning-cell planning-cell-heading has-background-primary-light">
                Espaces
            </div>
            {% for space in event.getSpaces() %}
            <div class="cell planning-cell planning-cell-heading has-background-primary-light">
                {{ space.name }}
            </div>
            {% endfor %}

            {# On ajoute les horaires période par période #}
            {% for period in event.getPeriods() %}
                <div class="cell planning-cell planning-cell-wide is-col-span-{{ cols }}">
                    Période du {{ period.startOn|date('d/m/Y H:i', app_timezone) }} à {{ period.endOn|date('H:i', app_timezone) }}
                </div>

                {# On affiche tous les slots de la période, space par space #}
                {% for dateRef in this.getDateOrdered(period) %}
                    <div class="cell planning-cell planning-cell-heading has-background-primary-light">
                        {{ dateRef|date('H:i', app_timezone) }}
                    </div>
                    {% for space in event.getSpaces() %}
                        {# extraction du slot de cet espace, ce moment et cette période #}
                        {% set thisSlot = this.getThisSlot(dateRef, space, period) %}
                        
                        {# si le slot est Indisponible #}
                        {% if thisSlot.unavailable %}
                            {% if displayLocked %}
                            <div class="cell planning-cell planning-cell-locked" data-id="{{ thisSlot.id }}">
                                <div class="icon"><twig:ux:icon name="bi:lock-fill" /></div>
                            </div>
                            {% else %}
                            <div class="cell planning-cell planning-cell-hidden">
                            </div>
                            {% endif %}
                        {% endif %}
                        {# si une partie est sur le slot #}
                        {% if thisSlot.party  %}
                            {% if thisSlot == thisSlot.party.slots[0] and thisSlot.party.isValidated %}
                                {# Premier slot d'une partie ou partie non validée #}
                                <div class="cell planning-cell planning-cell-game-parent">
                                    <div class="planning-cell-game" style="height: {{ thisSlot.party.slots|length * 3 }}rem !important">
                                      {# Carte "jeu" DEBUT #}
                                        <div class="card" style="height: {{ thisSlot.party.slots|length * 3 }}rem !important">
                                            {% if pathFullSlot %}<a href="{{ path(pathFullSlot, {id: thisSlot.id}) }}">{% endif %}
                                                <div class="card-header">
                                                    {{ thisSlot.party.game.name }}
                                                </div>
                                                <div class="card-image">
                                                    <figure class="image is-3by1">
                                                        {% if thisSlot.party.game.picture %}
                                                        <img src="/images/games/{{ thisSlot.party.game.picture }}"  />
                                                        {% else %}
                                                        <img src="/images/games/placeholder.webp"  />
                                                        {% endif %}
                                                    </figure>
                                                </div>
                                                <div class="card-content">
                                                    <div class="content">
                                                    
                                                    </div>
                                                </div>
                                            {% if pathFullSlot %}</a>{% endif %}
                                        </div>                             
                                      {# Carte "jeu" FIN #}
                                    </div>
                                </div>
                            {% else %}
                                {# Slot suivants d'une partie #}
                                <div class="cell planning-cell planning-cell-game-parent">
                                </div>
                            {% endif %}
                        {% endif %}
                        {# si le slot est disponible et sans partie #}
                        {% if not thisSlot.unavailable and not thisSlot.party %}
                            {% if pathEmptySlot %}
                            <a href="{{ path(pathEmptySlot, {id: thisSlot.id}) }}">
                            <div class="cell planning-cell planning-cell-free" data-id="{{ thisSlot.id }}">
                                <div class="icon"><twig:ux:icon name="bi:plus-circle" /></div>
                            </div>
                            </a>
                            {% else %}
                            <div class="cell planning-cell planning-cell-free" data-id="{{ thisSlot.id }}">
                                
                            </div>                            
                            {% endif %}

                        {% endif %}               

                    {% endfor %}
                {% endfor %}

            {% endfor %}

{# fin du block de grille #}
        </div>
    </div>
</div>