nouveau-theatre-de-besancon/site/templates/event.php

<?php snippet('header') ?>
<section class="key-infos">
  <ul>
    <li><p class="key-infos__key">Dates</p><p class="key-infos__info"><?= $page->schedule() ?></p></li>
    <li><p class="key-infos__key">Durée</p><p class="key-infos__info"><?= $page->duration() ?></p></li>
    <li><p class="key-infos__key">Public</p><p class="key-infos__info"><?= $page->public() ?></p></li>
    <li><p class="key-infos__key">Lieu</p><p class="key-infos__info"><?= $page->place() ?></p></li>
  </ul>
</section>

<section class="presentation">
  <div id="swiper" style="--span: 8; --color: <?= $page->color()->isNotEmpty() ? $page->color() : 'var(--color-season)' ?>">
  <div class="swiper-wrapper">
      <?php 
        $images = $page->gallery()->toFiles()->count() > 1 ? $page->gallery()->toFiles()->without($page->gallery()->toFiles()->first()) : $page->gallery()->toFiles();
        foreach($images as $slide): ?>
      <div class="swiper-slide">
        <?php snippet('picture', ['file' => $slide]) ?>
      </div>
      <?php endforeach ?>
    </div>

    <button class="swiper-button swiper-button-prev" title="précédente">←</button>
    <button class="swiper-button swiper-button-next" title="suivante">→</button>
  </div>
  <div class="presentation__text">
    <h2 class="h1 presentation__title"><?= $page->title() ?></h2>
    <h3 class="h2 presentation__authors"><?= $page->authors() ?></h3>
    <div class="presentation__chapo"><?= $page->chapo() ?></div>
    <div class="presentation__description"><?= $page->description() ?></div>
  </div>
</section>

<section class="collapsable-sections">
  <?php snippet('collapsable-section', ['title' => 'Réserver', 'padding' => false], slots: true) ?>
    <!--========== KIRBY EVENT ==========-->
    <?php if ($page->isMapadoEvent() != 'true'): ?>  
      
      <?php slot('content') ?>
      <div 
        class="sessions"
      >
      <?php
        $sessions = $page->sessions()->toStructure();
  
        foreach ($sessions as $session) :
          $date = new DateTime($session->date());
          $formatter = new IntlDateFormatter('fr_FR', IntlDateFormatter::FULL, IntlDateFormatter::NONE);
          $formattedDate = $formatter->format($date);
      ?>
        <div class="session collapsable__item--padding grid">
          <div class="left-column">
            <p><?= $formattedDate ?></p>
            <p><?= e($session->timeComplement()->isEmpty() == 'true', $session->time(), $session->time() . ' ' . $session->timeComplement()) ?></p>
            <p><?= $page->place() ?></p> 
          </div>
          <div class="right-column">
            <?php if ($page->bookingUrl()->isEmpty()): ?>
              <a class="ticket-link" title="Entrée libre" disabled><?php snippet('ticket') ?> Entrée libre</a>
            <?php else: ?>
              <a class="ticket-link" href="<?= $page->bookingUrl()->url() ?>" target="_blank" title="Plateforme de réservation"><?php snippet('ticket') ?> Réserver</a>
            <?php endif ?>
          </div>     
        </div>
      <?php endforeach ?>
      </div>
      <?php endslot() ?>
    
    <!--========== MAPADO EVENT ==========-->
    <?php else: ?>
      
      <?php slot('content') ?>
      <div 
        class="sessions"
        x-data="{
          stockThreshold: (<?= $page->totalStock()->value() ?> / 100) * 25,
          sessions: [],
          slug: null,
          eventDateId: null,
          async fetchSessions() {
            const event = await updateMapadoEvent('<?= $page->uri() ?>');
            this.sessions = event.remoteSessions
            this.slug = event.mapadoSlug
            this.eventDateId = event.eventDateId
          },
        }"
        x-init="
          if (<?= $page->isMapadoEvent() == 'true' ?>) {
            fetchSessions()
          }
        "
      >
        <template x-for="session in sessions">
          <div 
            x-data="{
              stockThreshold: (<?= $page->totalStock()->value() ?> / 100) * 25
            }"  
            class="collapsable__item--padding session grid"
          >
            <div class="left-column">
              <p x-text="dateToFrench(session.date)"></p>
              <p x-text="session.time"></p>
              <p><?= $page->place() ?></p>
            </div>
            <template x-if="!session.ticketingUrl">
              <a class="ticket-link" title="Plus de places disponibles" disabled><?php snippet('ticket') ?> Entrée libre</a>
            </template>
            <template x-if="session.bookableStock === 0">
              <a class="ticket-link" title="Plus de places disponibles" disabled><?php snippet('ticket') ?> Complet</a>
            </template>
            <template x-if="session.bookableStock > stockThreshold">
              <a class="ticket-link" title="Plateforme de réservation" :href="session.ticketingUrl" target="_blank"><?php snippet('ticket') ?> Billetterie</a>
            </template>
            <template x-if="session.bookableStock !== 0 && session.bookableStock < stockThreshold">
              <a class="ticket-link" title="Plateforme de réservation" :href="session.ticketingUrl" target="_blank"><?php snippet('ticket') ?> Plus que quelques places !</a>
            </template>
          </div>
        </template>
      </div>
      <?php endslot() ?>
    
    <?php endif ?>
  <?php endsnippet() ?>
  
  <?php if ($page->production()->isNotEmpty()): ?>  
    <?php snippet('collapsable-section', ['title' => 'Distribution et production'], slots: true) ?>
      <?php slot('content') ?>
        <div class="production">
          <?php foreach ($page->production()->toLayouts() as $layout): ?>
          <div class="collapsable__item--padding grid" id="<?= $layout->id() ?>">
            <?php foreach ($layout->columns() as $column): ?>
            <div class="grid__item" style="--span:<?= $column->span() ?>">
              <div class="blocks">
                <?= $column->blocks() ?>
              </div>
            </div>
            <?php endforeach ?>
          </div>
          <?php endforeach ?>
        </div>
      <?php endslot() ?>
    <?php endsnippet() ?>
  <?php endif ?>

  <?php if ($page->resources()->isNotEmpty()): ?>  
  <?php snippet('collapsable-section', ['title' => 'Ressources'], slots: true) ?>
    <?php slot('content') ?>
      <div class="resources">
        <div class="collapsable__item--padding grid">
        <?php foreach($page->resources()->toStructure() as $resource): ?>
            <div class="resource grid__item" style="--span: 4;">
              <p><?= $resource->name() ?></p><a href="<?= $resource->file()->toFile()->url() ?>" title="Télécharger le fichier" download>télécharger ↓</a>
            </div>
        <?php endforeach ?>
        </div>
      </div>
    <?php endslot() ?>
  <?php endsnippet() ?>
  <?php endif ?>
</section>

<?php if ($page->linkedPages()->isNotEmpty()): ?>
  <?php snippet('events-grid', ['title' => 'Pour aller plus loin', 'events' => $page->linkedPages()->toPages()]) ?>
<?php endif ?>

<?php snippet('callout') ?>

<?php snippet('footer') ?>