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

{% block title %}Administration > Événement > Configurer{% endblock %}

{% block content %}

    <nav class="breadcrumb has-arrow-separator" aria-label="breadcrumbs">
      <ul>
        <li><a href="{{ path('app_main') }}">Accueil</a></li>
        <li><a href="{{ path('app_admin') }}">Administration</a></li>
        <li><a href="{{ path('app_admin_event') }}">Gestion des événements</a></li>
        <li class="is-active"><a>Configuration</a></li>
      </ul>
    </nav>

    <div class="box has-text-centered">
      <strong class="has-text-primary">{{ event.name }}</strong> du {{ event.startOn|date('d/m/Y H:i', app_timezone) }} au {{ event.endOn|date('d/m/Y H:i', app_timezone) }}
    </div>

    <div class="tabs is-boxed">
        <ul>
            <li><a href="{{ path('app_admin_event_config', {'id': event.id}) }}">Accueil</a></li>
            <li><a href="{{ path('app_admin_event_config_space', {'id': event.id}) }}">Espaces</a></li>
            <li><a href="{{ path('app_admin_event_config_period', {'id': event.id}) }}">Périodes</a></li>
            <li><a href="{{ path('app_admin_event_config_slot', {'id': event.id}) }}">Slots</a></li>
            <li class="is-active"><a>Meneur(euse)s de jeu</a></li>
            <li><a href="{{ path('app_admin_event_config_game', {'id': event.id}) }}">Jeux</a></li>
            <li><a href="{{ path('app_admin_event_config_party', {'id': event.id}) }}">Parties</a></li>
        </ul>
    </div>

    <div id="tabs-content">

      <div class="content">
        <h3 class="title is-3">Assignez les MJ</h3>
        <p>Cliquez sur les MJ à assigner à cet événement (un second clic pour les désassigner). La liste des jeux sera adaptées aux jeux que les MJ peuvent animer.</p>
      </div>

      <div class="grid is-col-min-12">
        {% for gamemaster in gamemasters %}

        <div class="cell">
          <div class="box" data-gamemaster-toggle-gamemaster-id-value="{{ gamemaster.id }}" data-gamemaster-toggle-event-id-value="{{ event.id }}" {{ stimulus_controller('gamemaster-toggle') }}>
          <article class="media"{% if gamemaster not in event.getGamemastersAssigned %} style="filter:grayscale(1) opacity(0.3);"{% endif %}>
            <figure class="media-left">
              <p class="image is-64x64">
                {% if gamemaster.picture %}
                <img src="/images/gamemasters/{{ gamemaster.picture }}"  />
                {% else %}
                <twig:ux:icon name="bi:person-fill"/>
                {% endif %}
              </p>
            </figure>
            <div class="media-content">
              <div class="content">
                <p>
                  <strong>{{ gamemaster.preferedName }}</strong>
                  <br/>
                  {{ gamemaster.description }}
                </p>
              </div>
            </div>
          </article>
          </div>
        </div>
        {% endfor %}
      </div>

    </div>

{% endblock %}