From fda24c47a8262388ada92722850a362da65aaa6e Mon Sep 17 00:00:00 2001
From: salmonik <salmonik@tuta.io>
Date: Sun, 8 Nov 2026 03:32:24 +0100
Subject: web: accept the serialized reels array and stop game loops on
 navigation

The Rust SlotsView serializes reels as an array of chars, so the browser joins it instead of String(array). The crash chart, reel animation and roulette observer now stop when another screen takes over, and a returning crash screen rebuilds its detached canvas. Action buttons ignore a double click before the server view arrives.

Also tightens the gateway session registry with a generation token, caps WebSocket messages at 64 KiB, uses the __Host- cookie prefix on HTTPS, and ships the systemd unit.
---
 web/play/src/slots.ts | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

(limited to 'web/play/src/slots.ts')

diff --git a/web/play/src/slots.ts b/web/play/src/slots.ts
index dba1e25..7c4677d 100644
--- a/web/play/src/slots.ts
+++ b/web/play/src/slots.ts
@@ -7,6 +7,7 @@ const SYMBOLS = "CLOGDS";
 const LINE_NAMES = ["top", "middle", "bottom", "V", "inverted V"];
 
 let spinUntil = 0;
+let lastSpin = 0;
 let animation: number | undefined;
 let latest: View | null = null;
 let latestBoard: HTMLElement | null = null;
@@ -15,6 +16,17 @@ export function requestSlotsSpin(): void {
   spinUntil = Date.now() + 900;
 }
 
+/// Stop the reel animation when another screen takes over.
+export function stopSlotsAnimation(): void {
+  if (animation !== undefined) {
+    window.clearInterval(animation);
+    animation = undefined;
+  }
+  latest = null;
+  latestBoard = null;
+  spinUntil = 0;
+}
+
 function spinning(view: View): boolean {
   return view.phase === "spinning" || Date.now() < spinUntil;
 }
@@ -42,7 +54,9 @@ export function renderSlots(
 
   const reels = node("div", "reels");
   const tiles: HTMLElement[] = [];
-  const flat = String(view.reels ?? "");
+  const flat = Array.isArray(view.reels)
+    ? view.reels.join("")
+    : String(view.reels ?? "");
   for (let column = 0; column < REELS; column += 1) {
     const reel = node("div", "reel");
     for (let row = 0; row < ROWS; row += 1) {
@@ -133,6 +147,8 @@ export function renderSlots(
   const spin = node("button", "btn primary wide big", active ? "SPINNING…" : "SPIN");
   spin.disabled = active;
   spin.addEventListener("click", () => {
+    if (Date.now() - lastSpin < 900) return;
+    lastSpin = Date.now();
     requestSlotsSpin();
     send("Spin");
   });
-- 
cgit v1.2.3