studio-variable/nouveau-theatre-de-besancon
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

vue programme fonctionne avec les filtre de categorie. Plus de switch vers vu calendrier. Pour autant si déjà dans calendrier ça continu de fonctionner comme avant

Browse source
This commit is contained in:
antonin gallon 2026-01-28 19:07:18 +01:00
parent 3900966800
commit fc828997d0
3 changed files with 67 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

3
assets/css/src/vanilla.css
View file

@ -10,6 +10,9 @@ footer {
section:not(:last-child, .collapsable, .collapsable-sections) {
border-bottom: var(--border);
}
.temporality-wrapper:not(:last-of-type) section.forced-border{
border-bottom: var(--border);
}
picture {
background-color: var(--color);

14
site/snippets/events-grid.php
View file

@ -1,4 +1,4 @@
<section class="events-grid">
<section class="events-grid forced-border">
<?php if (isset($title)): ?>
<h4><?= $title ?></h4>
<?php endif ?>
@ -13,9 +13,17 @@
if ($events->count() === 4) {
$span = 3;
}
}
snippet('event-card', ["event" => $event, "span" => $span, "color" => $event->color()->isNotEmpty() == 'true' ? $event->color() : null])
};
?>
<?php
$categories = $event->categories();
?>
<template
x-if=" tab === 'Programme' || ('<?= $categories ?>'.length > 0 && '<?= $categories ?>'.includes(tab))"
>
<?php snippet('event-card', ["event" => $event, "span" => $span, "color" => $event->color()->isNotEmpty() == 'true' ? $event->color() : null]) ?>
</template>
<?php endforeach ?>
</div>
</section>

67
site/templates/program.php
View file

@ -82,18 +82,24 @@
x-data="{
title: '<?= $filter ?>',
get filterTitle() {
return 'Calendrier — ' + this.title
if(tab.includes('Calendrier')){
return 'Calendrier — ' + this.title
}
else{
return this.title
}
}
}"
x-text="title"
:class="tab === filterTitle ? 'strong' : ''"
@click="
tab = filterTitle; filter = title
tab = filterTitle;
filter = title; /* où est utiliser cette vriable ? */
const url = new URL(window.location.href);
url.searchParams.set('tab', tab);
window.history.pushState({}, '', url);
setTimeout(scrollToNextClosestDate, 100)
setTimeout(scrollToNextClosestDate, 100);
"
></button>
<?php endforeach ?>
@ -101,20 +107,53 @@
<section class="page-title">
<h1 x-text="tab"></h1>
</section>
<!-- Programme -->
<template x-if="tab === 'Programme'">
<template x-if="!tab.includes('Calendrier')">
<div class="program-content__events">
<section class="yellow">
<h2>Prochainement — <?= $page->children()->first()->title() ?></h2>
</section>
<?php snippet('events-grid', ['events' => $events['next'], 'columns' => 3]) ?>
<?php if ($events['previous']->count() > 0): ?>
<?php
$categoriesInNextEvents = [];
foreach($events['next'] as $event) {
foreach($event->categories()->split() as $cat) {
$categoriesInNextEvents[] = $cat;
}
}
$categoriesInNextEvents = array_values(array_unique($categoriesInNextEvents));
$hasNextEvents = count($events['next']) > 0;
?>
<template
x-if="<?= $hasNextEvents ? 'true' : 'false' ?> && (tab === 'Programme' || <?= htmlspecialchars(json_encode($categoriesInNextEvents)) ?>.includes(tab))"
>
<div class="temporality-wrapper">
<section class="yellow">
<h2>Événements passés</h2>
<h2>Prochainement — <?= $page->children()->first()->title() ?></h2>
</section>
<?php snippet('events-grid', ['events' => $events['previous'], 'columns' => 3]) ?>
<?php endif ?>
<?php snippet('events-grid', ['events' => $events['next'], 'columns' => 3]) ?>
</div>
</template>
<?php
$categoriesInPrevEvents = [];
foreach($events['previous'] as $event) {
foreach($event->categories()->split() as $cat) {
$categoriesInPrevEvents[] = $cat;
}
}
$categoriesInPrevEvents = array_values(array_unique($categoriesInPrevEvents));
$hasPrevEvents = $events['previous']->count() > 0;
?>
<template
x-if="<?= $hasPrevEvents ? 'true' : 'false' ?> && (tab === 'Programme' || <?= htmlspecialchars(json_encode($categoriesInPrevEvents)) ?>.includes(tab))"
>
<div class="temporality-wrapper">
<section class="yellow">
<h2>Événements passés</h2>
</section>
<?php snippet('events-grid', ['events' => $events['previous'], 'columns' => 3]) ?>
</div>
</template>
</div>
</template>