Add global all-events view at / and scope page summary to single page
All checks were successful
Build and Deploy / build-and-deploy (push) Successful in 53s

Root / shows all upcoming events across all pages with page badges.
/<slug>/ reverted to show only that page's events.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
giles
2026-02-22 23:13:14 +00:00
parent dad53fd1b5
commit 424c267110
10 changed files with 377 additions and 25 deletions

View File

@@ -0,0 +1,62 @@
{# List card for all events — one entry #}
{% set pi = page_info.get(entry.calendar_container_id, {}) %}
{% set page_slug = pi.get('slug', '') %}
{% set page_title = pi.get('title') %}
<article class="rounded-xl bg-white shadow-sm border border-stone-200 p-4">
<div class="flex flex-col sm:flex-row sm:items-start justify-between gap-3">
{# Left: event info #}
<div class="flex-1 min-w-0">
{% if page_slug %}
{% set day_href = events_url('/' ~ page_slug ~ '/calendars/' ~ entry.calendar_slug ~ '/day/' ~ entry.start_at.strftime('%Y/%-m/%-d') ~ '/') %}
{% else %}
{% set day_href = '' %}
{% endif %}
{% set entry_href = day_href ~ 'entries/' ~ entry.id ~ '/' if day_href else '' %}
{% if entry_href %}
<a href="{{ entry_href }}" class="hover:text-emerald-700">
<h2 class="text-lg font-semibold text-stone-900">{{ entry.name }}</h2>
</a>
{% else %}
<h2 class="text-lg font-semibold text-stone-900">{{ entry.name }}</h2>
{% endif %}
<div class="flex flex-wrap items-center gap-1.5 mt-1">
{% if page_title %}
<a href="{{ events_url('/' ~ page_slug ~ '/') }}"
class="inline-block px-2 py-0.5 rounded-full text-xs font-medium bg-amber-100 text-amber-800 hover:bg-amber-200">
{{ page_title }}
</a>
{% endif %}
{% if entry.calendar_name %}
<span class="inline-block px-2 py-0.5 rounded-full text-xs font-medium bg-sky-100 text-sky-700">
{{ entry.calendar_name }}
</span>
{% endif %}
</div>
<div class="mt-1 text-sm text-stone-500">
{% if day_href %}
<a href="{{ day_href }}" class="hover:text-stone-700">{{ entry.start_at.strftime('%a %-d %b') }}</a> &middot;
{% else %}
{{ entry.start_at.strftime('%a %-d %b') }} &middot;
{% endif %}
{{ entry.start_at.strftime('%H:%M') }}{% if entry.end_at %} &ndash; {{ entry.end_at.strftime('%H:%M') }}{% endif %}
</div>
{% if entry.cost %}
<div class="mt-1 text-sm font-medium text-green-600">
&pound;{{ '%.2f'|format(entry.cost) }}
</div>
{% endif %}
</div>
{# Right: ticket widget #}
{% if entry.ticket_price is not none %}
<div class="shrink-0">
{% set qty = pending_tickets.get(entry.id, 0) %}
{% set ticket_url = url_for('all_events.adjust_ticket') %}
{% include '_types/page_summary/_ticket_widget.html' %}
</div>
{% endif %}
</div>
</article>

View File

@@ -0,0 +1,60 @@
{# Tile card for all events — compact event tile #}
{% set pi = page_info.get(entry.calendar_container_id, {}) %}
{% set page_slug = pi.get('slug', '') %}
{% set page_title = pi.get('title') %}
<article class="rounded-xl bg-white shadow-sm border border-stone-200 overflow-hidden">
{% if page_slug %}
{% set day_href = events_url('/' ~ page_slug ~ '/calendars/' ~ entry.calendar_slug ~ '/day/' ~ entry.start_at.strftime('%Y/%-m/%-d') ~ '/') %}
{% else %}
{% set day_href = '' %}
{% endif %}
{% set entry_href = day_href ~ 'entries/' ~ entry.id ~ '/' if day_href else '' %}
<div class="p-3">
{% if entry_href %}
<a href="{{ entry_href }}" class="hover:text-emerald-700">
<h2 class="text-base font-semibold text-stone-900 line-clamp-2">{{ entry.name }}</h2>
</a>
{% else %}
<h2 class="text-base font-semibold text-stone-900 line-clamp-2">{{ entry.name }}</h2>
{% endif %}
<div class="flex flex-wrap items-center gap-1 mt-1">
{% if page_title %}
<a href="{{ events_url('/' ~ page_slug ~ '/') }}"
class="inline-block px-2 py-0.5 rounded-full text-xs font-medium bg-amber-100 text-amber-800 hover:bg-amber-200">
{{ page_title }}
</a>
{% endif %}
{% if entry.calendar_name %}
<span class="inline-block px-2 py-0.5 rounded-full text-xs font-medium bg-sky-100 text-sky-700">
{{ entry.calendar_name }}
</span>
{% endif %}
</div>
<div class="mt-1 text-xs text-stone-500">
{% if day_href %}
<a href="{{ day_href }}" class="hover:text-stone-700">{{ entry.start_at.strftime('%a %-d %b') }}</a>
{% else %}
{{ entry.start_at.strftime('%a %-d %b') }}
{% endif %}
&middot;
{{ entry.start_at.strftime('%H:%M') }}{% if entry.end_at %} &ndash; {{ entry.end_at.strftime('%H:%M') }}{% endif %}
</div>
{% if entry.cost %}
<div class="mt-1 text-sm font-medium text-green-600">
&pound;{{ '%.2f'|format(entry.cost) }}
</div>
{% endif %}
</div>
{# Ticket widget below card #}
{% if entry.ticket_price is not none %}
<div class="border-t border-stone-100 px-3 py-2">
{% set qty = pending_tickets.get(entry.id, 0) %}
{% set ticket_url = url_for('all_events.adjust_ticket') %}
{% include '_types/page_summary/_ticket_widget.html' %}
</div>
{% endif %}
</article>

View File

@@ -0,0 +1,31 @@
{% for entry in entries %}
{% if view == 'tile' %}
{% include "_types/all_events/_card_tile.html" %}
{% else %}
{# Date header when date changes (list view only) #}
{% set entry_date = entry.start_at.strftime('%A %-d %B %Y') %}
{% if loop.first or entry_date != entries[loop.index0 - 1].start_at.strftime('%A %-d %B %Y') %}
<div class="pt-2 pb-1">
<h3 class="text-sm font-semibold text-stone-500 uppercase tracking-wide">
{{ entry_date }}
</h3>
</div>
{% endif %}
{% include "_types/all_events/_card.html" %}
{% endif %}
{% endfor %}
{% if has_more %}
{# Infinite scroll sentinel #}
{% set entries_url = url_for('all_events.entries_fragment', page=page + 1, view=view if view != 'list' else '')|host %}
<div
id="sentinel-{{ page }}"
class="h-4 opacity-0 pointer-events-none"
hx-get="{{ entries_url }}"
hx-trigger="intersect once delay:250ms"
hx-swap="outerHTML"
role="status"
aria-hidden="true"
>
<div class="text-center text-xs text-stone-400">loading...</div>
</div>
{% endif %}

View File

@@ -0,0 +1,54 @@
{# View toggle bar - desktop only #}
<div class="hidden md:flex justify-end px-3 pt-3 gap-1">
{% set list_href = (current_local_href ~ {'view': None}|qs)|host %}
{% set tile_href = (current_local_href ~ {'view': 'tile'}|qs)|host %}
<a
href="{{ list_href }}"
hx-get="{{ list_href }}"
hx-target="#main-panel"
hx-select="{{hx_select_search}}"
hx-swap="outerHTML"
hx-push-url="true"
class="p-1.5 rounded {{ 'bg-stone-200 text-stone-800' if view != 'tile' else 'text-stone-400 hover:text-stone-600' }}"
title="List view"
_="on click js localStorage.removeItem('events_view') end"
>
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
<path stroke-linecap="round" stroke-linejoin="round" d="M4 6h16M4 12h16M4 18h16" />
</svg>
</a>
<a
href="{{ tile_href }}"
hx-get="{{ tile_href }}"
hx-target="#main-panel"
hx-select="{{hx_select_search}}"
hx-swap="outerHTML"
hx-push-url="true"
class="p-1.5 rounded {{ 'bg-stone-200 text-stone-800' if view == 'tile' else 'text-stone-400 hover:text-stone-600' }}"
title="Tile view"
_="on click js localStorage.setItem('events_view','tile') end"
>
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
<path stroke-linecap="round" stroke-linejoin="round" d="M4 5a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM14 5a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1V5zM4 15a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1H5a1 1 0 01-1-1v-4zM14 15a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z" />
</svg>
</a>
</div>
{# Cards container - list or grid based on view #}
{% if entries %}
{% if view == 'tile' %}
<div class="max-w-full px-3 py-3 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">
{% include "_types/all_events/_cards.html" %}
</div>
{% else %}
<div class="max-w-full px-3 py-3 space-y-3">
{% include "_types/all_events/_cards.html" %}
</div>
{% endif %}
{% else %}
<div class="px-3 py-12 text-center text-stone-400">
<i class="fa fa-calendar-xmark text-4xl mb-3" aria-hidden="true"></i>
<p class="text-lg">No upcoming events</p>
</div>
{% endif %}
<div class="pb-8"></div>

View File

@@ -0,0 +1,7 @@
{% extends '_types/root/_index.html' %}
{% block meta %}{% endblock %}
{% block content %}
{% include '_types/all_events/_main_panel.html' %}
{% endblock %}