From 8a87d3527d8f44abc813d99320d8fcf6a950d593 Mon Sep 17 00:00:00 2001
From: Eric Wagoner <ewagoner@gmail.com>
Date: Tue, 29 Sep 2026 13:03:36 -0400
Subject: [PATCH] Pages show the hall-wide notice, when there is one, at the
 top

The keeper's hall-announce writes one file on the shared host; the site
serves it at /hall/announcement.json, and the banner shows it with the time
in the reader's own clock, dismissable one notice at a time.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Jm2auWk6RP71CjaAb4FMoG
---
 deploy/Caddyfile.tmpl                  |   7 ++
 src/lib/components/Announcement.svelte | 119 +++++++++++++++++++++++++
 src/routes/+layout.svelte              |   2 +
 3 files changed, 128 insertions(+)
 create mode 100644 src/lib/components/Announcement.svelte

diff --git a/deploy/Caddyfile.tmpl b/deploy/Caddyfile.tmpl
index fd38a99..be8cb17 100644
--- a/deploy/Caddyfile.tmpl
+++ b/deploy/Caddyfile.tmpl
@@ -1,4 +1,11 @@
 __HOST__ {
+	# The hall-wide notice (hall-announce on the host): one file, served by every game's site.
+	handle_path /hall/* {
+		root * /var/lib/hall
+		header Cache-Control "no-store"
+		file_server
+	}
+
 	root * /opt/waving-hands/build
 	encode gzip zstd
 
diff --git a/src/lib/components/Announcement.svelte b/src/lib/components/Announcement.svelte
new file mode 100644
index 0000000..18f343f
--- /dev/null
+++ b/src/lib/components/Announcement.svelte
@@ -0,0 +1,119 @@
+<script lang="ts">
+	// The host's announcement, shown by every game of Kestrel's Hall: the keeper
+	// writes /var/lib/hall/announcement.json on the host (hall-announce), and each
+	// game's site serves it at /hall/announcement.json. It is checked when the page
+	// loads, every few minutes, and whenever the page is looked at again. A reader
+	// may dismiss one announcement; the next one still shows.
+	import { onMount } from 'svelte';
+
+	interface Announcement {
+		/** Names this announcement, so dismissing it does not hide the next. */
+		id: string;
+		text: string;
+		/** When what it announces happens, told in each reader's own time. */
+		at?: string;
+		/** After this it is no longer shown. */
+		until?: string;
+	}
+
+	const SOURCE = '/hall/announcement.json';
+	const CHECK_MS = 5 * 60_000;
+	const DISMISSED = 'hall:dismissed';
+
+	let current = $state<Announcement | null>(null);
+	let dismissed = $state<string | null>(null);
+	let now = $state(Date.now());
+
+	async function check() {
+		try {
+			const res = await fetch(SOURCE, { cache: 'no-store' });
+			const a: unknown = res.ok ? await res.json() : null;
+			current = a && typeof a === 'object' && typeof (a as Announcement).text === 'string' && (a as Announcement).text && typeof (a as Announcement).id === 'string' ? (a as Announcement) : null;
+		} catch {
+			// No announcement reachable: none shown.
+		}
+		now = Date.now();
+	}
+
+	onMount(() => {
+		try {
+			dismissed = localStorage.getItem(DISMISSED);
+		} catch {
+			// Without storage a dismissal lasts this visit.
+		}
+		void check();
+		const poll = setInterval(check, CHECK_MS);
+		const tick = setInterval(() => (now = Date.now()), 30_000);
+		const looked = () => {
+			if (document.visibilityState === 'visible') void check();
+		};
+		document.addEventListener('visibilitychange', looked);
+		return () => {
+			clearInterval(poll);
+			clearInterval(tick);
+			document.removeEventListener('visibilitychange', looked);
+		};
+	});
+
+	const shown = $derived(current && current.id !== dismissed && !(current.until && Date.parse(current.until) < now) ? current : null);
+
+	/** When it happens, in the reader's own clock: "in 25 minutes, at 7:00 AM", or the day and time further off. */
+	const when = $derived.by(() => {
+		const t = shown?.at ? Date.parse(shown.at) : NaN;
+		if (!Number.isFinite(t)) return '';
+		const minutes = Math.round((t - now) / 60_000);
+		if (minutes > 90) return ` (${new Date(t).toLocaleString([], { weekday: 'short', hour: 'numeric', minute: '2-digit' })}, your time)`;
+		if (minutes > 1) return ` (in ${minutes} minutes, at ${new Date(t).toLocaleTimeString([], { hour: 'numeric', minute: '2-digit' })})`;
+		return minutes >= -15 ? ' (now)' : '';
+	});
+
+	function dismiss() {
+		// Taken first: once dismissed, nothing is shown.
+		const id = shown?.id;
+		if (!id) return;
+		dismissed = id;
+		try {
+			localStorage.setItem(DISMISSED, id);
+		} catch {
+			// The dismissal still holds for this visit.
+		}
+	}
+</script>
+
+{#if shown}
+	<div class="hall-announcement" role="status">
+		<span>{shown.text}{when}</span>
+		<button type="button" aria-label="Dismiss this announcement" onclick={dismiss}>×</button>
+	</div>
+{/if}
+
+<style>
+	/* Its own colors, not the game's: the same notice reads the same in every game of the hall. */
+	.hall-announcement {
+		position: sticky;
+		top: 0;
+		z-index: 1000;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		gap: 0.8rem;
+		padding: 0.45rem 2.4rem 0.45rem 1rem;
+		background: #f2c45a;
+		color: #1d1a12;
+		font: 500 0.95rem/1.35 system-ui, -apple-system, 'Segoe UI', sans-serif;
+		text-align: center;
+		box-shadow: 0 1px 4px #0005;
+	}
+
+	button {
+		position: absolute;
+		right: 0.5rem;
+		background: none;
+		border: 0;
+		color: inherit;
+		font-size: 1.3rem;
+		line-height: 1;
+		padding: 0.2rem 0.5rem;
+		cursor: pointer;
+	}
+</style>
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index b93e9ba..33c1fca 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -1,7 +1,9 @@
 <script lang="ts">
 	import '../app.css';
+	import Announcement from '$lib/components/Announcement.svelte';
 
 	let { children } = $props();
 </script>
 
+<Announcement />
 {@render children()}