rpg-engine 0.0.0-stage → 0.1.1

package/dist/dashboard/api.js

@@ -0,0 +1,185 @@
+import { t } from "./text.js";
+/** What view gives: the party, with the last rolls, as many as asked; or a page. */
+export async function readView(page, rolls) {
+    const query = new URLSearchParams({ ...(page === undefined ? {} : { page }), ...(rolls === undefined ? {} : { rolls: String(rolls) }) });
+    const response = await fetch(query.size === 0 ? "/api/view" : `/api/view?${query}`);
+    const body = await response.json();
+    if ("error" in body) {
+        throw new Error(body.error);
+    }
+    return body;
+}
+/** The world map as the player character knows it (VIEW-7). */
+export async function readMap() {
+    const response = await fetch("/api/view?map=true");
+    const body = await response.json();
+    if ("error" in body) {
+        throw new Error(body.error);
+    }
+    if (body.kind !== "map") {
+        throw new Error(t("There is no player character yet: the map starts with one."));
+    }
+    return body;
+}
+/** The player's settings, with their values and what each means (D-341). */
+export async function readSettings() {
+    const response = await fetch("/api/view?settings=true");
+    const body = await response.json();
+    if ("error" in body) {
+        throw new Error(body.error);
+    }
+    return body.kind === "settings" ? body.settings : [];
+}
+/** The campaign's setup: its mode and name, what the next mode needs, and the setup's questions (D-370). */
+export async function readSetup() {
+    const response = await fetch("/api/view?setup=true");
+    const body = await response.json();
+    if ("error" in body) {
+        throw new Error(body.error);
+    }
+    if (body.kind !== "setup") {
+        throw new Error(t("The game gave no setup: reload the page."));
+    }
+    return body;
+}
+/** The player's word in the setup (D-370): a choice left to the master, or ready; undefined when it reached the game, else what went wrong. */
+export async function sendSetupWord(word) {
+    try {
+        const response = await fetch("/api/setup", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(word) });
+        return response.status === 202 ? undefined : ((await response.json()).error ?? t("It did not reach the game: try again."));
+    }
+    catch {
+        return t("It did not reach the game: try again.");
+    }
+}
+/** The quests the character knows and the story by scenes (D-367); none before there is a player character. */
+export async function readJournal() {
+    const response = await fetch("/api/view?journal=true");
+    const body = await response.json();
+    if ("error" in body) {
+        throw new Error(body.error);
+    }
+    return body.kind === "journal" ? body : undefined;
+}
+/** The player's notes, the last written first (D-371), and those shared that the master has not heard yet, which may be taken back (D-381). */
+export async function readNotes() {
+    const response = await fetch("/api/notes");
+    const body = await response.json().catch(() => ({ error: t("The notes did not come ({status}): reload the page.", { status: response.status }) }));
+    if ("error" in body) {
+        throw new Error(body.error);
+    }
+    return { notes: body.notes, pending: body.pending ?? [] };
+}
+// The notes reach the game one after another, in the order they were written.
+let noting = Promise.resolve();
+/**
+ * Writes, takes away or shares a note (D-371), after those sent before: undefined when done, else what went wrong. `leaving`, as the page closes, sends it at once,
+ * the request outliving the page.
+ */
+export async function sendNote(change, leaving = false) {
+    const post = async () => {
+        try {
+            const response = await fetch("/api/notes", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(change), keepalive: leaving });
+            return response.ok ? undefined : ((await response.json().catch(() => ({}))).error ?? t("The note was not saved: try again."));
+        }
+        catch {
+            return t("The note was not saved: the game is not connected.");
+        }
+    };
+    if (leaving) {
+        return post();
+    }
+    const sent = noting.then(post);
+    noting = sent;
+    return sent;
+}
+/** Sends the master a story for the player character, which they write in its page with the player (D-386): undefined when it reached the game, else what went wrong. */
+export async function sendStory(text) {
+    try {
+        const response = await fetch("/api/story", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ text }) });
+        return response.ok ? undefined : ((await response.json().catch(() => ({}))).error ?? t("The story did not reach the master: try again."));
+    }
+    catch {
+        return t("The story did not reach the master: the game is not connected.");
+    }
+}
+/** The story the player sent that the master has not written yet; undefined when none (D-386). */
+export async function readStory() {
+    const response = await fetch("/api/story");
+    return response.ok ? (await response.json()).proposed : undefined;
+}
+/** The campaign's saves, newest first, and what the mode lets the player do with them (D-359). */
+export async function readSaves() {
+    const response = await fetch("/api/view?saves=true");
+    const body = await response.json();
+    if ("error" in body) {
+        throw new Error(body.error);
+    }
+    if (body.kind !== "saves") {
+        throw new Error(t("The game gave no saves: reload the page."));
+    }
+    return body;
+}
+/** Saves, goes back to a save or starts the campaign over (D-359): undefined when done, else what went wrong, as the engine says it. */
+export async function changeSaves(change) {
+    try {
+        const response = await fetch("/api/saves", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(change) });
+        if (response.status === 202) {
+            return undefined;
+        }
+        const body = await response.json();
+        return body.error ?? t("It did not reach the game: try again.");
+    }
+    catch {
+        return t("It did not reach the game: try again.");
+    }
+}
+// The player's changes reach the game one after another, in the order they were made.
+let changing = Promise.resolve();
+/** Changes one of the player's settings (D-341), after those sent before: undefined when done, else what went wrong, as the engine says it. */
+export async function changeSetting(change) {
+    const sent = changing.then(() => sendChange(change));
+    changing = sent;
+    return sent;
+}
+async function sendChange(change) {
+    try {
+        const response = await fetch("/api/config", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(change) });
+        if (response.status === 202) {
+            return undefined;
+        }
+        const body = await response.json();
+        return body.error ?? t("The change did not reach the game: try again.");
+    }
+    catch {
+        return t("The change did not reach the game: try again.");
+    }
+}
+/** What the master asks the player now; undefined when nothing. */
+export async function readAsked() {
+    const response = await fetch("/api/asked");
+    const body = await response.json();
+    return body.asked ?? undefined;
+}
+/**
+ * The player's answer to what the master asks, a button by its place, their own words (ASK-10) or a square of the map (ASK-11): true when it counted, false when
+ * the master no longer asks it.
+ */
+export async function answer(asked, reply) {
+    const body = typeof reply === "number" ? { asked, choice: reply } : typeof reply === "string" ? { asked, text: reply } : { asked, square: reply.square };
+    const response = await fetch("/api/answer", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(body) });
+    return response.status === 202;
+}
+/** How each number of a group of someone's sheet is made, by field: what view gives for Page#Group. */
+export async function readExplanations(member, group) {
+    const section = await readView(`${member}#${group}`);
+    return section.kind === "section" ? explanations(section.lines) : new Map();
+}
+/** "insight +5: wis-mod +3, proficiency +2" as insight → [wis-mod +3, proficiency +2]; a line without what it came from tells nothing more. */
+export function explanations(lines) {
+    return new Map(lines.flatMap((line) => {
+        const colon = line.indexOf(": ");
+        const field = line.split(" ")[0];
+        return colon < 0 ? [] : [[field, line.slice(colon + 2).split(", ")]];
+    }));
+}

package/dist/dashboard/app.js

@@ -0,0 +1,217 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "preact/jsx-runtime";
+// The player's dashboard (D-269, D-272, D-276): the master and the campaign on top, the party's strip, what the master asks, the sheet of whom the address
+// names and the rolls beside it (D-279), read again whenever the server says something changed.
+import { render } from "preact";
+import { useEffect, useRef, useState } from "preact/hooks";
+import { readAddress, sectionAddress } from "./address.js";
+import { answer, readAsked, readView } from "./api.js";
+import { AskedBanner } from "./asked.js";
+import { CombatView } from "./combat.js";
+import { DiceTray } from "./dice/tray.js";
+import { PageFoot } from "./footer.js";
+import { readFree, withFree, writeFree } from "./free-rolls.js";
+import { Help } from "./help.js";
+import { Icon } from "./icons.js";
+import { FollowedQuest, JournalView } from "./journal.js";
+import { gameNotices, Notices } from "./notices.js";
+import { About, Upcoming } from "./pages.js";
+import { PartyStrip } from "./party.js";
+import { rollReaction } from "./reactions.js";
+import { requestedOf, RequestedRoll } from "./requested.js";
+import { RollLog } from "./rolls.js";
+import { SavesView } from "./saves.js";
+import { SceneView } from "./scene.js";
+import { SettingsView } from "./settings.js";
+import { SetupView, useSetup } from "./setup.js";
+import { MemberSheet } from "./sheet.js";
+import { pageDirection, setLanguage, setSystemWords, t } from "./text.js";
+import { restoreTheme } from "./theme.js";
+import { SetupCorner, Top } from "./top.js";
+import { WorldView } from "./world.js";
+/** The product's name, as the page writes it: here only (D-276). */
+const productName = "RPG Engine";
+// How many of the last rolls the page reads at first, and how many more each time the player asks for older ones (D-302).
+const firstRolls = 20;
+function App() {
+    const [shown, setShown] = useState({ party: [], sheet: [], text: "", rolls: [], rollsTotal: 0, version: 0 });
+    const [live, setLive] = useState(false);
+    // The section the address names, and whose sheet (D-276, D-309).
+    const [address, setAddress] = useState(() => readAddress(window.location.hash));
+    const reading = useRef(0);
+    // The rolls already read, from the first reading on: a check rolled after it is thrown on the page; the rolls new since come into the list as new.
+    const seen = useRef();
+    const [thrown, setThrown] = useState();
+    // The roll whose dice are in the air: its line comes into the rolls only as they go (D-300).
+    const [held, setHeld] = useState();
+    const [fresh, setFresh] = useState(new Set());
+    // How many of the last rolls the page reads: more when the player asks for older ones (D-302).
+    const rollsAsked = useRef(firstRolls);
+    // The robot's face for a moment (D-305): the master's last moment once it is new, or a new roll's reaction, whichever came last.
+    const [moment, setMoment] = useState();
+    const toldMoment = useRef();
+    // A number of the sheet rolled for fun, from its explanation (D-280): each a throw of its own, even of the same number.
+    const [sheetThrow, setSheetThrow] = useState();
+    // The question answered from the sheet or the tray, while the engine rolls it (D-330); the free rolls, in this browser alone.
+    const [answering, setAnswering] = useState();
+    const [free, setFree] = useState([]);
+    // Reads view again for whom the address names, or the player character, and what the master asks; an answer that comes after a newer one is left out.
+    const read = async () => {
+        const number = ++reading.current;
+        try {
+            const [overview, asked] = await Promise.all([readView(undefined, rollsAsked.current), readAsked().catch(() => undefined)]);
+            const party = overview.kind === "overview" ? overview.party : [];
+            const rolls = overview.kind === "overview" ? overview.rolls : [];
+            const member = party.find((candidate) => candidate.name === readAddress(window.location.hash).name) ?? party[0];
+            const page = member === undefined ? undefined : await readView(member.name);
+            // The page's words in the campaign's language (D-394), its file read once; its dates and screen readers follow the language too.
+            const language = overview.kind === "overview" || overview.kind === "none" ? overview.language : undefined;
+            await setLanguage(language);
+            setSystemWords(overview.kind === "overview" ? overview.words : undefined);
+            if (number === reading.current) {
+                document.documentElement.lang = language ?? "en";
+                document.documentElement.dir = pageDirection();
+                // New are only the rolls after the newest one read before: older ones read at a Load more are not (D-302).
+                const newestSeen = rolls.findLastIndex((roll) => seen.current?.has(roll.id) === true);
+                const added = seen.current === undefined ? [] : rolls.slice(newestSeen + 1);
+                const asking = added.filter((roll) => roll.by === "player" && roll.check !== undefined).at(-1);
+                seen.current = new Set(rolls.map((roll) => roll.id));
+                // A roll stays new through the readings that come while its dice roll, until it shows (D-303); the list draws it new once.
+                const addedIds = new Set(added.map((roll) => roll.id));
+                setFresh((before) => new Set(rolls.map((roll) => roll.id).filter((id) => before.has(id) || addedIds.has(id))));
+                // The robot reacts to a new roll as it comes in, to a check of the player's as its dice go; the master's own moment comes after it (D-305).
+                const coming = added.filter((roll) => roll.id !== asking?.id).at(-1);
+                if (coming !== undefined) {
+                    react(coming, party);
+                }
+                const told = overview.kind === "overview" ? overview.master?.moment : undefined;
+                if (told !== undefined && told.id !== toldMoment.current) {
+                    toldMoment.current = told.id;
+                    setMoment(told);
+                }
+                if (asking !== undefined) {
+                    setThrown(asking);
+                    setHeld(asking.id);
+                }
+                setShown((before) => ({
+                    campaign: overview.kind === "overview" ? overview.campaign : undefined,
+                    system: overview.kind === "overview" ? overview.system : undefined,
+                    now: overview.kind === "overview" ? overview.now : undefined,
+                    party,
+                    chosen: member?.name,
+                    headline: page?.kind === "page" ? page.headline : undefined,
+                    sheet: page?.kind === "page" ? page.sheet : [],
+                    cards: page?.kind === "page" ? page.cards : undefined,
+                    text: page?.kind === "page" ? page.text : "",
+                    story: page?.kind === "page" ? page.story : undefined,
+                    rolls,
+                    rollsTotal: overview.kind === "overview" ? overview.rollsTotal ?? rolls.length : 0,
+                    masterMood: overview.kind === "overview" ? overview.master?.mood : undefined,
+                    place: overview.kind === "overview" ? overview.place : undefined,
+                    openScene: overview.kind === "overview" ? overview.openScene : undefined,
+                    asked,
+                    version: before.version + 1,
+                    readAt: new Date(),
+                    noCharacter: overview.kind === "none",
+                    problems: overview.kind === "overview" ? overview.problems : undefined,
+                }));
+            }
+        }
+        catch (error) {
+            if (number === reading.current) {
+                setShown((before) => ({ ...before, problem: error instanceof Error ? error.message : String(error) }));
+            }
+        }
+    };
+    // A new roll's face on the robot, for a moment, when the roll is remarkable (D-305, 7).
+    const react = (roll, party) => {
+        const reaction = rollReaction(roll, party.map((member) => member.name));
+        if (reaction !== undefined) {
+            setMoment(reaction);
+        }
+    };
+    useEffect(() => {
+        const events = new EventSource("/events");
+        events.onopen = () => {
+            setLive(true);
+            void read();
+        };
+        events.addEventListener("changed", () => void read());
+        events.onerror = () => setLive(false);
+        const followAddress = () => {
+            setAddress(readAddress(window.location.hash));
+            void read();
+        };
+        window.addEventListener("hashchange", followAddress);
+        return () => {
+            events.close();
+            window.removeEventListener("hashchange", followAddress);
+        };
+    }, []);
+    // Each campaign's free rolls, as this browser kept them.
+    useEffect(() => setFree(readFree(shown.campaign)), [shown.campaign]);
+    const member = shown.party.find((candidate) => candidate.name === shown.chosen);
+    const lead = shown.party.find((candidate) => candidate.role === "pc");
+    // A number of a sheet thrown for fun, each a throw of its own (D-280).
+    const throwFromSheet = (roll, label, who) => setSheetThrow((before) => ({ number: (before?.number ?? 0) + 1, roll, label, ...(who === undefined ? {} : { who }) }));
+    // A check answered from its row of the sheet or the tray's dice (D-330): as its button, the engine rolls it; the banner folds away meanwhile.
+    const answerFrom = async (index) => {
+        const asked = shown.asked;
+        if (asked === undefined) {
+            return;
+        }
+        setAnswering(asked.id);
+        try {
+            await answer(asked.id, index);
+        }
+        catch {
+            setAnswering(undefined);
+        }
+        void read();
+    };
+    const requested = live ? requestedOf(answering === shown.asked?.id ? undefined : shown.asked, (index) => void answerFrom(index)) : undefined;
+    // A fight open, and whether the turn is the player's character's (D-314, D-315).
+    const fight = shown.openScene?.type === "combat";
+    const yourTurn = fight && lead !== undefined && shown.openScene?.turn === lead.name;
+    // The tab's title: the campaign's name and the product's, always the same.
+    useEffect(() => {
+        document.title = shown.campaign === undefined ? productName : `${shown.campaign} · ${productName}`;
+    }, [shown.campaign]);
+    const setup = useSetup(shown.version);
+    // While the campaign is in its setup, the page is its first configuration, as a portal's (D-370).
+    const inSetup = setup?.mode === "setup";
+    // The page's own messages, over it (D-298): a problem, the game away, a word to know.
+    const notices = [
+        ...(shown.problem === undefined ? [] : [{ kind: "problem", text: shown.problem }]),
+        ...(!live && shown.readAt !== undefined
+            ? [{ kind: "away", text: t("Not connected: the sheet as of {time}. It comes back when the game does.", { time: shown.readAt.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) }) }]
+            : []),
+        ...(shown.noCharacter && !inSetup ? [{ kind: "info", text: t("There is no player character yet: the sheet comes when the master writes one.") }] : []),
+        ...gameNotices(shown.problems),
+    ];
+    return (_jsx(RequestedRoll.Provider, { value: requested, children: _jsxs("div", { class: live ? "page" : "page stale", children: [!inSetup && (_jsx(Top, { campaign: shown.campaign, product: productName, system: shown.system?.name, now: shown.now, path: shown.place === undefined ? undefined : [...shown.place.within, shown.place.name], live: live, mood: shown.masterMood, moment: moment, asleep: !live && shown.readAt !== undefined, section: address.section, fight: fight, yourTurn: yourTurn })), inSetup && _jsx(SetupCorner, { live: live }), _jsx(Notices, { notices: notices }), live && shown.asked && _jsx(AskedBanner, { asked: shown.asked, yourTurn: yourTurn, map: shown.place?.map, place: shown.place?.name, answered: answering === shown.asked.id, onAnswered: () => void read() }), inSetup ? _jsx(SetupView, { setup: setup }) : (_jsxs(_Fragment, { children: [live && yourTurn && address.section !== "combat" && shown.asked === undefined && (_jsxs("a", { class: "turn-notice", href: sectionAddress("combat"), children: [_jsx(Icon, { name: "combat" }), _jsx("span", { children: shown.openScene?.round === undefined ? t("Your turn") : `${t("Your turn")} · ${t("Round {round}", { round: shown.openScene.round })}` }), _jsx("span", { class: "turn-notice-go", children: t("Go to Combat") })] })), address.section === "party" && _jsx(PartyStrip, { party: shown.party, chosen: shown.chosen, scene: shown.openScene }), _jsxs("div", { class: "body", children: [_jsxs("main", { children: [address.section === "about" && _jsx(About, { product: productName, system: shown.system }), address.section === "help" && _jsx(Help, {}), (address.section === "scene" || address.section === "combat") && _jsx(FollowedQuest, { version: shown.version, campaign: shown.campaign }), address.section === "scene" && _jsx(SceneView, { place: shown.place, scene: shown.openScene }), address.section === "combat" && (_jsx(CombatView, { scene: shown.openScene, map: shown.place?.map, place: shown.place?.name, lead: lead, party: shown.party, own: {
+                                                sheet: shown.chosen === lead?.name ? shown.sheet : [],
+                                                cards: shown.cards,
+                                                version: shown.version,
+                                                onRoll: throwFromSheet,
+                                            } })), address.section === "world" && _jsx(WorldView, { version: shown.version, lead: lead }), address.section === "settings" && _jsx(SettingsView, { version: shown.version }), address.section === "saves" && _jsx(SavesView, { version: shown.version, campaign: shown.campaign }), address.section === "journal" && _jsx(JournalView, { version: shown.version, campaign: shown.campaign }), !["party", "scene", "combat", "journal", "world", "about", "help", "settings", "saves"].includes(address.section) && _jsx(Upcoming, { section: address.section }), address.section === "party" && member && (_jsx(MemberSheet, { member: member, headline: shown.headline, sheet: shown.sheet, cards: shown.cards, text: shown.text, story: shown.story, version: shown.version, onRoll: throwFromSheet, scene: shown.openScene }, member.name))] }), _jsx(RollLog, { rolls: held === undefined ? shown.rolls : shown.rolls.filter((roll) => roll.id !== held), free: free, unread: shown.rollsTotal > shown.rolls.length, campaign: shown.campaign, party: shown.party, fresh: fresh, onMore: () => {
+                                        rollsAsked.current += firstRolls;
+                                        void read();
+                                    }, onClearFree: () => {
+                                        setFree([]);
+                                        writeFree(shown.campaign, []);
+                                    } }, shown.campaign)] }), _jsx(PageFoot, { product: productName, system: shown.system })] })), _jsx(DiceTray, { requested: thrown, sheetThrow: sheetThrow, party: shown.party, onShown: (id) => {
+                        setHeld((now) => (now === id ? undefined : now));
+                        if (thrown?.id === id) {
+                            react(thrown, shown.party);
+                        }
+                    }, onFree: (roll) => {
+                        setFree((before) => withFree(shown.campaign, before, roll));
+                        setFresh((before) => new Set([...before, roll.id]));
+                    } })] }) }));
+}
+// The theme the player picked before, from the start (D-300).
+restoreTheme();
+const root = document.getElementById("app");
+if (root !== null) {
+    render(_jsx(App, {}), root);
+}

package/dist/dashboard/asked.js

@@ -0,0 +1,132 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "preact/jsx-runtime";
+// What the master asks the player (D-279): the question, and a button for each check or answer; the click goes to the engine, which rolls the check and gives
+// the master its result. Or the player's own words, in place of a button (ASK-10). A banner over the page, which never changes section by itself (D-276). By
+// hand, as the player may choose for this browser, a check has no button: it is rolled from its row of the sheet or with the tray's dice (D-330).
+import { Fragment } from "preact";
+import { useEffect, useRef, useState } from "preact/hooks";
+import { answer } from "./api.js";
+import { trayThrows } from "./dice/pool.js";
+import { notationLabel } from "./game-words.js";
+import { Icon, NotationIcons } from "./icons.js";
+import { checkOf, notationModifier, sameDice, signed } from "./labels.js";
+import { MapSheet } from "./map-sheet.js";
+import { sheetAddress } from "./party.js";
+import { byHandPref, usePref } from "./prefs.js";
+import { t, tParts } from "./text.js";
+// How far below the top the banner stays, as in the style sheet; how many characters the player's own words may have, as the server takes them.
+const bannerTop = 16;
+const mostWords = 500;
+export function AskedBanner({ asked, yourTurn, map, place, answered, onAnswered }) {
+    const [sent, setSent] = useState();
+    const [byHand, setByHand] = usePref(byHandPref);
+    const [picking, setPicking] = useState(false);
+    const [problem, setProblem] = useState();
+    const [words, setWords] = useState("");
+    const banner = useRef(null);
+    const checks = asked.labels.map((label) => checkOf(label, asked.title));
+    const roll = checks.some((check) => check !== undefined);
+    // By hand, the note names the checks the sheet or the tray answer; the others keep their buttons (D-380).
+    const named = checks.flatMap((check, index) => (check !== undefined && byHandAnswers(asked, index) ? [check] : []));
+    // Answered from the sheet or the tray, the banner folds away as after a click.
+    const gone = sent !== undefined || answered === true;
+    // While the banner is there, the rolls beside the sheet stay in sight under it, as tall as it is, even as it folds away (D-291).
+    useEffect(() => {
+        const element = banner.current;
+        if (element === null) {
+            return;
+        }
+        const root = document.documentElement;
+        const observer = new ResizeObserver(() => root.style.setProperty("--asked-space", `${element.offsetHeight + bannerTop}px`));
+        observer.observe(element);
+        return () => {
+            observer.disconnect();
+            root.style.removeProperty("--asked-space");
+        };
+    }, []);
+    // A question asked again takes the place of the one before: its buttons start unclicked.
+    useEffect(() => {
+        setSent(undefined);
+        setProblem(undefined);
+        setWords("");
+        setPicking(false);
+    }, [asked.id]);
+    // A button by its place, the player's own words, or a square of the map.
+    const reply = async (given) => {
+        setSent(typeof given === "number" ? given : typeof given === "string" ? "words" : "square");
+        setPicking(false);
+        setProblem(undefined);
+        try {
+            // A click that comes too late counts for nothing: the page reads what the master asks now.
+            await answer(asked.id, given);
+        }
+        catch {
+            setSent(undefined);
+            setProblem(t("The answer did not reach the game: try again."));
+        }
+        onAnswered();
+    };
+    const own = (event) => {
+        event.preventDefault();
+        if (words.trim() !== "") {
+            void reply(words.trim());
+        }
+    };
+    return (_jsxs("section", { ref: banner, class: ["asked", roll ? "asked-roll" : "", gone ? "leaving" : ""].filter((name) => name !== "").join(" "), "aria-labelledby": `asked-${asked.id}`, children: [_jsx("img", { class: "asked-robot", src: "/assets/favicon.svg", alt: "" }), _jsxs("div", { class: "asked-body", children: [yourTurn && _jsx("p", { class: "asked-turn", children: t("Your turn") }), _jsx("h2", { class: "asked-title", children: asked.title }), _jsx("p", { id: `asked-${asked.id}`, class: "asked-question", role: "alert", children: asked.question }), named.length > 0 && byHand && (_jsxs("p", { class: "asked-hand-note", children: [_jsx(Icon, { name: "hand" }), _jsx("span", { children: tParts("Roll {checks} yourself, on {sheet} or with the dice.", {
+                                    checks: named.map((check, index) => (_jsxs(Fragment, { children: [index > 0 && (index === named.length - 1 ? ` ${t("or")} ` : ", "), _jsxs("a", { class: "asked-hand-check", href: sheetAddress(asked.who ?? ""), onClick: () => showRow(asked.fields?.[asked.labels.findIndex((label) => checkOf(label, asked.title)?.check === check.check)]), children: [_jsx(NotationIcons, { notation: check.dice }), check.check] })] }, check.check))),
+                                    sheet: _jsx("a", { href: sheetAddress(asked.who ?? ""), children: t("your sheet") }),
+                                }).map((part, index) => _jsx(Fragment, { children: part }, index)) })] })), _jsxs("div", { class: "asked-buttons", children: [asked.square && map !== undefined && (_jsxs("button", { type: "button", class: sent === "square" ? "asked-check sent" : "asked-check", disabled: gone, onClick: () => setPicking(true), children: [_jsx(Icon, { name: "world" }), _jsx("span", { class: "asked-check-name", children: t("Choose on the map") })] })), asked.labels.map((label, index) => {
+                                const check = checks[index];
+                                const kind = check !== undefined ? "asked-check" : roll ? "asked-other" : "asked-answer";
+                                // By hand a check has no button: its row of the sheet and the tray's dice answer it; one that neither answers keeps it.
+                                if (check !== undefined && byHand && byHandAnswers(asked, index)) {
+                                    return null;
+                                }
+                                return (_jsx("button", { type: "button", class: sent === index ? `${kind} sent` : kind, disabled: gone, title: notationLabel(asked.words?.[index] ?? undefined), onClick: () => void reply(index), children: check === undefined ? label : _jsx(CheckLabel, { check: check.check, dice: check.dice, name: asked.names?.[index] ?? keptName(check.dice) }) }, label));
+                            })] }), _jsxs("div", { class: "asked-foot", children: [_jsxs("form", { class: "asked-own", onSubmit: own, children: [_jsx("input", { type: "text", value: words, maxLength: mostWords, placeholder: t("Or write what you do…"), "aria-label": t("Or write what you do"), disabled: gone, onInput: (event) => setWords(event.currentTarget.value) }), _jsx("button", { type: "submit", class: "icon-button", "aria-label": t("Send"), "data-tip": t("Send"), disabled: gone || words.trim() === "", children: _jsx(Icon, { name: "send" }) })] }), roll && (_jsxs("label", { class: "asked-hand", children: [_jsx("input", { type: "checkbox", role: "switch", checked: byHand, onChange: (event) => setByHand(event.currentTarget.checked) }), _jsx(Icon, { name: "hand" }), t("By hand")] }))] }), problem && _jsx("p", { class: "asked-problem", role: "alert", children: problem })] }), picking && map !== undefined && _jsx(MapSheet, { map: map, place: place ?? "", question: asked.question, onPick: (square) => void reply({ square }), onClose: () => setPicking(false) })] }));
+}
+/** Whether a check can be answered by hand: a field of the sheet it alone names, whose row lights, or dice the tray can throw and tells from the other checks'. */
+function byHandAnswers(asked, index) {
+    const field = asked.fields?.[index] ?? null;
+    const ownRow = field !== null && asked.fields?.filter((other) => other === field).length === 1;
+    const dice = checkOf(asked.labels[index], asked.title)?.dice;
+    const ownDice = dice !== undefined && trayThrows(dice) && asked.labels.filter((label) => {
+        const other = checkOf(label, asked.title)?.dice;
+        return other !== undefined && sameDice(other, dice);
+    }).length === 1;
+    return ownRow || ownDice;
+}
+/** Sets the row of the sheet a check names in the middle of the window, with the focus on it, once the sheet the link leads to is drawn. */
+function showRow(field) {
+    if (field === null || field === undefined) {
+        return;
+    }
+    const started = Date.now();
+    const find = () => {
+        const row = document.querySelector(`[data-field="${CSS.escape(field)}"]`);
+        if (row !== null) {
+            row.scrollIntoView({ block: "center", behavior: matchMedia("(prefers-reduced-motion: reduce)").matches ? "auto" : "smooth" });
+            row.focus({ preventScroll: true });
+        }
+        else if (Date.now() - started < 2000) {
+            requestAnimationFrame(find);
+        }
+    };
+    requestAnimationFrame(find);
+}
+/**
+ * A check's button (D-297): its dice as pictures, one of two faded when only one counts, its name, the number added and what kind of roll it is in words, as
+ * "with advantage" (D-399); the notation is in the tooltip.
+ */
+function CheckLabel({ check, dice, name }) {
+    const modifier = notationModifier(dice);
+    return (_jsxs(_Fragment, { children: [_jsx(NotationIcons, { notation: dice }), _jsx("span", { class: "asked-check-name", children: check }), modifier !== 0 && _jsx("span", { class: "asked-dice", children: signed(modifier) }), name !== undefined && _jsx("span", { class: "asked-roll-name", children: name }), _jsx("span", { class: "visually-hidden", children: dice })] }));
+}
+/** A roll that keeps one die of several, in words any game reads, when its game gives it no name: "highest of 2", "lowest of 3" (D-399); undefined for any other. */
+function keptName(dice) {
+    const kept = /^(\d+)d(?:\d+|%)(kh1?|kl1?|dl1|dh1)(?:[+-]\d+)*$/.exec(dice.toLowerCase().replace(/\s+/g, "").replaceAll("−", "-"));
+    const count = Number(kept?.[1] ?? 0);
+    const rule = kept?.[2] ?? "";
+    const highest = rule.startsWith("kh") || (rule === "dl1" && count === 2);
+    const lowest = rule.startsWith("kl") || (rule === "dh1" && count === 2);
+    return count < 2 ? undefined : highest ? t("highest of {count}", { count }) : lowest ? t("lowest of {count}", { count }) : undefined;
+}

package/dist/dashboard/assets/dice/dice.json

@@ -0,0 +1 @@
+{"d4":{"shape":{"vertices":[[0.663953,0.663953,-0.663953],[0.663953,-0.663953,0.663953],[-0.663953,-0.663953,-0.663953],[-0.663953,0.663953,0.663953]],"faces":[[0,1,2],[0,3,1],[0,2,3],[1,3,2]]},"values":[{"value":1,"up":[0.57735,0.57735,-0.57735]},{"value":2,"up":[0.57735,-0.57735,0.57735]},{"value":3,"up":[-0.57735,-0.57735,-0.57735]},{"value":4,"up":[-0.57735,0.57735,0.57735]}]},"d6":{"shape":{"vertices":[[-0.675,-0.675,0.675],[-0.675,0.675,0.675],[-0.675,-0.675,-0.675],[-0.675,0.675,-0.675],[0.675,-0.675,0.675],[0.675,0.675,0.675],[0.675,-0.675,-0.675],[0.675,0.675,-0.675]],"faces":[[2,0,1,3],[1,0,4,5],[4,0,2,6],[3,1,5,7],[6,2,3,7],[5,4,6,7]]},"values":[{"value":1,"up":[0.0,0.0,-1.0],"top":[0.0,1.0,-0.0]},{"value":2,"up":[-1.0,0.0,-0.0],"top":[0.0,1.0,-0.0]},{"value":3,"up":[0.0,1.0,-0.0],"top":[0.0,0.0,-1.0]},{"value":4,"up":[0.0,-1.0,-0.0],"top":[0.0,0.0,-1.0]},{"value":5,"up":[1.0,0.0,-0.0],"top":[0.0,1.0,-0.0]},{"value":6,"up":[0.0,0.0,1.0],"top":[0.0,1.0,-0.0]}]},"d8":{"shape":{"vertices":[[1.08,0.0,-0.0],[-1.08,0.0,-0.0],[0.0,0.0,-1.08],[0.0,0.0,1.08],[0.0,1.08,-0.0],[0.0,-1.08,-0.0]],"faces":[[4,0,2],[2,0,5],[3,0,4],[5,0,3],[2,1,4],[5,1,2],[4,1,3],[3,1,5]]},"values":[{"value":1,"up":[-0.57735,-0.57735,0.57735],"top":[-0.816497,0.408248,-0.408248]},{"value":2,"up":[0.57735,-0.57735,-0.57735],"top":[-0.408248,0.408248,-0.816497]},{"value":3,"up":[-0.57735,0.57735,-0.57735],"top":[0.408248,0.816497,0.408248]},{"value":4,"up":[0.57735,0.57735,0.57735],"top":[-0.408248,0.816497,-0.408248]},{"value":5,"up":[-0.57735,-0.57735,-0.57735],"top":[0.408248,0.408248,-0.816497]},{"value":6,"up":[0.57735,-0.57735,0.57735],"top":[0.816497,0.408248,-0.408248]},{"value":7,"up":[-0.57735,0.57735,0.57735],"top":[0.408248,0.816497,-0.408248]},{"value":8,"up":[0.57735,0.57735,-0.57735],"top":[-0.408248,0.816497,0.408248]}]},"d10":{"shape":{"vertices":[[1.0,0.105573,-0.0],[0.809017,-0.105573,-0.587785],[0.309017,0.105573,-0.951057],[-0.309017,-0.105573,-0.951057],[-0.809017,0.105573,-0.587785],[-1.0,-0.105573,-0.0],[-0.809017,0.105573,0.587785],[-0.309017,-0.105573,0.951057],[0.309017,0.105573,0.951057],[0.809017,-0.105573,0.587785],[0.0,1.0,-0.0],[0.0,-1.0,-0.0]],"faces":[[10,0,1,2],[10,2,3,4],[10,4,5,6],[10,6,7,8],[10,8,9,0],[11,1,0,9],[11,3,2,1],[11,5,4,3],[11,7,6,5],[11,9,8,7]]},"values":[{"value":0,"up":[-0.599991,-0.67081,-0.435919],"top":[0.542697,-0.741629,0.394292]},{"value":1,"up":[-0.229176,0.67081,0.705331],"top":[0.207292,0.741629,-0.637978]},{"value":2,"up":[0.741629,-0.67081,-0.0],"top":[-0.67081,-0.741629,-0.0]},{"value":3,"up":[0.599991,0.67081,-0.435919],"top":[-0.542697,0.741629,0.394292]},{"value":4,"up":[0.229176,-0.67081,0.705331],"top":[-0.207292,-0.741629,-0.637978]},{"value":5,"up":[-0.229176,0.67081,-0.705331],"top":[0.207292,0.741629,0.637978]},{"value":6,"up":[-0.599991,-0.67081,0.435919],"top":[0.542697,-0.741629,-0.394292]},{"value":7,"up":[-0.741629,0.67081,-0.0],"top":[0.67081,0.741629,-0.0]},{"value":8,"up":[0.229176,-0.67081,-0.705331],"top":[-0.207292,-0.741629,0.637978]},{"value":9,"up":[0.599991,0.67081,0.435919],"top":[-0.542697,0.741629,-0.394292]}]},"d100":{"shape":{"vertices":[[1.0,0.105573,-0.0],[0.809017,-0.105573,-0.587785],[0.309017,0.105573,-0.951057],[-0.309017,-0.105573,-0.951057],[-0.809017,0.105573,-0.587785],[-1.0,-0.105573,-0.0],[-0.809017,0.105573,0.587785],[-0.309017,-0.105573,0.951057],[0.309017,0.105573,0.951057],[0.809017,-0.105573,0.587785],[0.0,1.0,-0.0],[0.0,-1.0,-0.0]],"faces":[[10,0,1,2],[10,2,3,4],[10,4,5,6],[10,6,7,8],[10,8,9,0],[11,1,0,9],[11,3,2,1],[11,5,4,3],[11,7,6,5],[11,9,8,7]]},"values":[{"value":0,"up":[-0.599991,-0.67081,-0.435919],"top":[0.542697,-0.741629,0.394292]},{"value":10,"up":[-0.229176,0.67081,0.705331],"top":[0.207292,0.741629,-0.637978]},{"value":20,"up":[0.741629,-0.67081,-0.0],"top":[-0.67081,-0.741629,-0.0]},{"value":30,"up":[0.599991,0.67081,-0.435919],"top":[-0.542697,0.741629,0.394292]},{"value":40,"up":[0.229176,-0.67081,0.705331],"top":[-0.207292,-0.741629,-0.637978]},{"value":50,"up":[-0.229176,0.67081,-0.705331],"top":[0.207292,0.741629,0.637978]},{"value":60,"up":[-0.599991,-0.67081,0.435919],"top":[0.542697,-0.741629,-0.394292]},{"value":70,"up":[-0.741629,0.67081,-0.0],"top":[0.67081,0.741629,-0.0]},{"value":80,"up":[0.229176,-0.67081,-0.705331],"top":[-0.207292,-0.741629,0.637978]},{"value":90,"up":[0.599991,0.67081,0.435919],"top":[-0.542697,0.741629,-0.394292]}]},"d12":{"shape":{"vertices":[[-0.57735,-0.57735,0.57735],[-0.57735,0.57735,0.57735],[-0.57735,-0.57735,-0.57735],[-0.57735,0.57735,-0.57735],[0.57735,-0.57735,0.57735],[0.57735,0.57735,0.57735],[0.57735,-0.57735,-0.57735],[0.57735,0.57735,-0.57735],[0.0,-0.934172,0.356822],[0.0,0.934172,0.356822],[0.0,-0.934172,-0.356822],[0.0,0.934172,-0.356822],[-0.356822,0.0,0.934172],[-0.356822,0.0,-0.934172],[0.356822,0.0,0.934172],[0.356822,0.0,-0.934172],[-0.934172,-0.356822,-0.0],[-0.934172,0.356822,-0.0],[0.934172,-0.356822,-0.0],[0.934172,0.356822,-0.0]],"faces":[[17,16,0,12,1],[10,8,0,16,2],[14,12,0,8,4],[3,17,1,9,11],[5,9,1,12,14],[3,13,2,16,17],[6,10,2,13,15],[15,13,3,11,7],[5,14,4,18,19],[6,18,4,8,10],[11,9,5,19,7],[19,18,6,15,7]]},"values":[{"value":1,"up":[0.0,0.525731,-0.850651],"top":[0.0,0.850651,0.525731]},{"value":2,"up":[0.0,0.525731,0.850651],"top":[0.0,0.850651,-0.525731]},{"value":3,"up":[0.525731,-0.850651,-0.0],"top":[0.850651,0.525731,-0.0]},{"value":4,"up":[-0.850651,-0.0,0.525731],"top":[0.16246,0.951057,0.262866]},{"value":5,"up":[-0.525731,-0.850651,0.0],"top":[-0.850651,0.525731,-0.0]},{"value":6,"up":[0.850651,0.0,0.525731],"top":[-0.16246,0.951057,0.262866]},{"value":7,"up":[-0.850651,0.0,-0.525731],"top":[0.16246,0.951057,-0.262866]},{"value":8,"up":[0.525731,0.850651,-0.0],"top":[-0.688191,0.425325,-0.587785]},{"value":9,"up":[0.850651,0.0,-0.525731],"top":[-0.16246,0.951057,-0.262866]},{"value":10,"up":[-0.525731,0.850651,-0.0],"top":[0.688191,0.425325,-0.587785]},{"value":11,"up":[0.0,-0.525731,-0.850651],"top":[0.587785,0.688191,-0.425325]},{"value":12,"up":[-0.0,-0.525731,0.850651],"top":[0.587785,0.688191,0.425325]}]},"d20":{"shape":{"vertices":[[0.0,-0.978248,0.604591],[0.0,0.978248,0.604591],[0.0,-0.978248,-0.604591],[0.0,0.978248,-0.604591],[-0.604591,0.0,0.978248],[-0.604591,0.0,-0.978248],[0.604591,0.0,0.978248],[0.604591,0.0,-0.978248],[-0.978248,-0.604591,-0.0],[-0.978248,0.604591,-0.0],[0.978248,-0.604591,-0.0],[0.978248,0.604591,-0.0]],"faces":[[2,0,8],[10,0,2],[4,0,6],[8,0,4],[6,0,10],[9,1,3],[3,1,11],[6,1,4],[4,1,9],[11,1,6],[7,2,5],[5,2,8],[10,2,7],[5,3,7],[9,3,5],[7,3,11],[8,4,9],[9,5,8],[11,6,10],[10,7,11]]},"values":[{"value":1,"up":[0.57735,0.57735,-0.57735],"top":[-0.755761,0.645497,-0.110264]},{"value":2,"up":[0.0,0.356822,0.934172],"top":[0.0,0.934172,-0.356822]},{"value":3,"up":[0.356822,-0.934172,-0.0],"top":[0.934172,0.356822,-0.0]},{"value":4,"up":[-0.57735,0.57735,0.57735],"top":[0.755761,0.645497,0.110264]},{"value":5,"up":[-0.356822,-0.934172,0.0],"top":[-0.934172,0.356822,-0.0]},{"value":6,"up":[-0.0,0.356822,-0.934172],"top":[0.0,0.934172,0.356822]},{"value":7,"up":[-0.934172,0.0,-0.356822],"top":[-0.178411,0.866025,0.467086]},{"value":8,"up":[-0.57735,-0.57735,-0.57735],"top":[-0.110264,0.755761,-0.645497]},{"value":9,"up":[0.934172,-0.0,-0.356822],"top":[0.178411,0.866025,0.467086]},{"value":10,"up":[0.57735,-0.57735,0.57735],"top":[0.110264,0.755761,0.645497]},{"value":11,"up":[-0.57735,0.57735,-0.57735],"top":[0.755761,0.645497,-0.110264]},{"value":12,"up":[-0.934172,0.0,0.356822],"top":[-0.178411,0.866025,-0.467086]},{"value":13,"up":[0.57735,0.57735,0.57735],"top":[-0.755761,0.645497,0.110264]},{"value":14,"up":[0.934172,0.0,0.356822],"top":[0.178411,0.866025,-0.467086]},{"value":15,"up":[0.0,-0.356822,0.934172],"top":[0.866025,0.467086,0.178411]},{"value":16,"up":[0.356822,0.934172,-0.0],"top":[-0.467086,0.178411,-0.866025]},{"value":17,"up":[0.57735,-0.57735,-0.57735],"top":[0.110264,0.755761,-0.645497]},{"value":18,"up":[-0.356822,0.934172,-0.0],"top":[0.467086,0.178411,-0.866025]},{"value":19,"up":[0.0,-0.356822,-0.934172],"top":[0.866025,0.467086,-0.178411]},{"value":20,"up":[-0.57735,-0.57735,0.57735],"top":[-0.110264,0.755761,0.645497]}]}}

package/dist/dashboard/assets/favicon.svg

@@ -0,0 +1,7 @@
+<svg class="robot" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" role="img">
+  <title>Robot game master</title>
+  <path class="robot-antenna" fill="#DCAA32" d="M25 1H28V8H25Z"/>
+  <rect class="robot-housing" x="1" y="5" width="30" height="26" rx="5" fill="#F4C84C"/>
+  <rect class="robot-display" x="4" y="10" width="24" height="16" rx="4" fill="#192D4D"/>
+  <g class="robot-eyes" fill="#FFF4D5"><rect x="9" y="16" width="4" height="4" rx="1"/><rect x="19" y="16" width="4" height="4" rx="1"/></g>
+</svg>