Plateau jouable en PWA : interface, Web Worker, stockage, service worker

L'application est à la racine du site : plateau en SVG, saisie au toucher
(pion puis case d'arrivée, proposées à partir du moteur), boutons du jet,
du videau et de nouvelle partie, coup de l'ordinateur affiché avec son
temps, fin de partie, reprise depuis localStorage, aide lue dans les
copies de docs/. Le moteur tourne dans le Web Worker existant ; main.ts
est le seul assembleur (nouvelles règles dependency-cruiser). Le service
worker met tout le site en cache, avec une empreinte du contenu comme
version. Les pages de test du moteur passent sous /moteur/. Politique de
sécurité du contenu dans le Caddyfile ; make test-browser joue une partie
dans Chromium et Firefox sans écran (Playwright, hors de make test).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

scripts/make-icons.py

@@ -0,0 +1,73 @@
+#!/usr/bin/env python3
+# Produit les icônes PNG de l'application (web/icons/icon-192.png et
+# icon-512.png) à partir des formes de web/icons/icon.svg : un fond de bois
+# et deux pions. Icônes provisoires, en attendant l'identité définitive.
+#
+# Python seul, sans bibliothèque : chaque pixel est échantillonné 4 × 4 fois
+# pour adoucir les bords. À relancer seulement si les formes changent, dans
+# la chaîne C (Python 3) :
+#   docker run --rm --user "$(id -u):$(id -g)" -v "$PWD:/src" -w /src \
+#       ustagammon/build-c:2 python3 scripts/make-icons.py
+#
+# Copyright (C) 2026 les auteurs d'Ustagammon.
+# Licence : GPLv3 ou ultérieure (voir LICENSE).
+
+import struct
+import zlib
+
+BACKGROUND = (0x6B, 0x44, 0x26)
+# Pions dessinés dans l'ordre : (centre x, centre y, rayon, remplissage,
+# bord), en unités d'une icône de 512 pixels ; bord de 10 unités.
+CHECKERS = [
+    (300, 300, 120, (0x2B, 0x22, 0x1C), (0x0D, 0x0A, 0x08)),
+    (212, 212, 120, (0xFB, 0xF6, 0xEA), (0x7D, 0x6A, 0x52)),
+]
+EDGE = 10
+SAMPLES = 4
+
+
+def color_at(x, y):
+    """Couleur d'un point de l'icône, en unités de 512."""
+    color = BACKGROUND
+    for cx, cy, r, fill, edge in CHECKERS:
+        d2 = (x - cx) ** 2 + (y - cy) ** 2
+        if d2 <= (r + EDGE / 2) ** 2:
+            color = fill if d2 <= (r - EDGE / 2) ** 2 else edge
+    return color
+
+
+def render(size):
+    scale = 512 / size
+    rows = []
+    for py in range(size):
+        row = bytearray([0])  # filtre PNG « aucun »
+        for px in range(size):
+            total = [0, 0, 0]
+            for sy in range(SAMPLES):
+                for sx in range(SAMPLES):
+                    x = (px + (sx + 0.5) / SAMPLES) * scale
+                    y = (py + (sy + 0.5) / SAMPLES) * scale
+                    for i, c in enumerate(color_at(x, y)):
+                        total[i] += c
+            row += bytes(round(t / SAMPLES**2) for t in total)
+        rows.append(bytes(row))
+    return b"".join(rows)
+
+
+def png(size, pixels):
+    def chunk(kind, data):
+        body = kind + data
+        return struct.pack(">I", len(data)) + body + struct.pack(">I", zlib.crc32(body))
+
+    header = struct.pack(">IIBBBBB", size, size, 8, 2, 0, 0, 0)  # RVB, 8 bits
+    return (
+        b"\x89PNG\r\n\x1a\n"
+        + chunk(b"IHDR", header)
+        + chunk(b"IDAT", zlib.compress(pixels, 9))
+        + chunk(b"IEND", b"")
+    )
+
+
+for size in (192, 512):
+    with open(f"web/icons/icon-{size}.png", "wb") as f:
+        f.write(png(size, render(size)))

scripts/service-worker.sh

@@ -0,0 +1,40 @@
+#!/usr/bin/env bash
+# Complète le service worker d'un site assemblé (make site) : en tête de
+# <site>/sw.js (copie de web/sw.js), écrit la liste de tous les fichiers du
+# site, à mettre en cache pour le hors ligne, et la version du site, une
+# empreinte de leur contenu.
+#
+# Le navigateur compare sw.js octet par octet à chaque visite : le moindre
+# fichier modifié change l'empreinte, donc sw.js, ce qui déclenche la mise à
+# jour du cache. Un site identique garde le même sw.js : rien à
+# retélécharger.
+#
+# Usage : scripts/service-worker.sh build/site
+
+set -euo pipefail
+
+site="${1:?usage : scripts/service-worker.sh <dossier du site>}"
+cd "$site"
+[ -f sw.js ] || { echo "$site/sw.js absent" >&2; exit 1; }
+
+# Tous les fichiers sauf sw.js, triés pour que l'empreinte soit stable.
+mapfile -t files < <(find . -type f ! -path ./sw.js | sed 's|^\./||' | LC_ALL=C sort)
+version="$(sha256sum "${files[@]}" | sha256sum | cut -c1-16)"
+
+{
+	echo "// Généré par scripts/service-worker.sh (make site) : ne pas modifier."
+	echo "const VERSION = \"$version\";"
+	echo "const FILES = ["
+	for f in "${files[@]}"; do
+		# Une page index.html est aussi demandée sous le nom de son dossier.
+		case "$f" in
+			index.html) echo '    "./",' ;;
+			*/index.html) echo "    \"${f%index.html}\"," ;;
+		esac
+		echo "    \"$f\","
+	done
+	echo "];"
+	echo
+	cat sw.js
+} >sw.js.tmp
+mv sw.js.tmp sw.js