v0.7.0 — four game types, a lobby you can read and leave, and a multiplayer game that makes a sound
The multiplayer set-up, the lobby, the start of a game, and four signals a remote client had never been sent. Reasoning, the preset table and what was verified how: CHANGELOG.md. - Co-op, Competitive, Cutthroat, Solitaire and Custom, on both screens, from one shared block — they had drifted, and each was missing a question the other asked. - A player reads the whole rule set before taking a seat, may leave a lobby or a running game, and keeps a seat across a reload. The host may clear a chair. The browser remembers every game it is in, not just the last one. - The start of a game is drawn: a handoff beat, an announcement, the code and type in the header. - Sound, the timetable flash, announcements and the just-drawn badge now reach a remote client; justDrawn goes to the seat that drew it and nobody else. - Played on StartOS, which found the rest: an Extra belongs to the player who played it, the board never named the Superintendent, bot seats were reported as absent players, and rule section numbers are out of every string a player reads. Also carries the previous session's Heavy Grade documentation work — asked again, answer unchanged. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_016JczK5i33ZNSf2PtzZqdhS
This commit is contained in:
co-authored by
Claude Opus 5
parent
42adfda390
commit
06db36e5b5
+18
-3
@@ -266,8 +266,14 @@ function newTrainPhase(s: GameState, events: GameEvent[]): AdvanceResult {
|
||||
* chooser is the acting player; §7 says the player who PLAYED the card, which is the same person
|
||||
* in solitaire and needs `pendingExtras` to carry a player before it is not.
|
||||
*/
|
||||
if (s.pendingExtras.length > 0 && s.freeTrays.length > 0) {
|
||||
s.clock.currentActor = actorAt(s, s.clock.actorOffset % s.players.length);
|
||||
const extra = s.pendingExtras[0];
|
||||
if (extra !== undefined && s.freeTrays.length > 0) {
|
||||
// §7 — the player who PLAYED the card places it. `pendingExtras` carries them (2026-08-23);
|
||||
// before that it was a bare train number and this asked whoever the acting order was on, which
|
||||
// is the same person in solitaire and the wrong one at every table. Reported by Jesse from a
|
||||
// two-player game.
|
||||
if (s.clock.currentActor !== extra.player) events.push({ type: 'actorChanged', player: extra.player });
|
||||
s.clock.currentActor = extra.player;
|
||||
return { events, needsInput: true };
|
||||
}
|
||||
|
||||
@@ -285,7 +291,16 @@ function newTrainPhase(s: GameState, events: GameEvent[]): AdvanceResult {
|
||||
const filling = trainNeedingCars(s);
|
||||
if (filling) {
|
||||
const tray = s.trays.get(filling)!;
|
||||
const nextActor = actorAt(s, tray.consist.length % s.players.length);
|
||||
/**
|
||||
* TWO DIFFERENT RULES, and §7 states them a paragraph apart. A TIMETABLED train's consist is
|
||||
* built by the table — "starting with the Superintendent and working left, each player may place
|
||||
* ONE car" — while an EXTRA is loaded by the player who played it, "as he chooses". So an Extra
|
||||
* does not enter the round at all; it belongs to `builtBy` until it is full.
|
||||
*/
|
||||
const nextActor =
|
||||
tray.trainIsExtra && tray.builtBy !== undefined
|
||||
? tray.builtBy
|
||||
: actorAt(s, tray.consist.length % s.players.length);
|
||||
if (s.clock.currentActor !== nextActor) events.push({ type: 'actorChanged', player: nextActor });
|
||||
s.clock.currentActor = nextActor;
|
||||
return { events, needsInput: true };
|
||||
|
||||
+11
-3
@@ -1050,7 +1050,11 @@ export function check(s: GameState, player: PlayerIndex, i: Intent): RejectionCo
|
||||
// -- New Train ------------------------------------------------------------
|
||||
case 'newTrain.startExtra': {
|
||||
if (!inPhase(s, 'newTrain')) return 'WRONG_PHASE';
|
||||
if (!s.pendingExtras.includes(i.trainNumber)) return 'NO_EXTRA_PENDING';
|
||||
const pending = s.pendingExtras.find((x) => x.trainNumber === i.trainNumber);
|
||||
if (!pending) return 'NO_EXTRA_PENDING';
|
||||
// §7 — "the player who played the card MAY place the Crew Tray": it is theirs to place, and
|
||||
// nobody else's to place for them.
|
||||
if (pending.player !== player) return 'NOT_YOUR_EXTRA';
|
||||
if (s.freeTrays.length === 0) return 'NO_FREE_TRAY';
|
||||
const where = resolveExtraStart(s, player, i);
|
||||
if (typeof where === 'string') return where;
|
||||
@@ -2254,7 +2258,8 @@ export function reduce(s: GameState, e: GameEvent): void {
|
||||
}
|
||||
|
||||
case 'extraQueued':
|
||||
s.pendingExtras.push(e.trainNumber);
|
||||
// §7 hands this train to the player who played the card, so the queue records them.
|
||||
s.pendingExtras.push({ trainNumber: e.trainNumber, player: e.player });
|
||||
break;
|
||||
|
||||
case 'secondSectionOrdered':
|
||||
@@ -2284,11 +2289,14 @@ export function reduce(s: GameState, e: GameEvent): void {
|
||||
*/
|
||||
case 'extraStarted': {
|
||||
const trayId = s.freeTrays.pop()!;
|
||||
s.pendingExtras = s.pendingExtras.filter((n) => n !== e.trainNumber);
|
||||
s.pendingExtras = s.pendingExtras.filter((x) => x.trainNumber !== e.trainNumber);
|
||||
const { direction } = e;
|
||||
const base = {
|
||||
id: trayId, trainNumber: e.trainNumber, trainIsExtra: true, engineAt: 0,
|
||||
consist: [] as RollingStock[], direction, movesUsed: 0,
|
||||
// The queue is emptied here, before a single car goes on, so the tray carries the owner
|
||||
// from now on — §7 lets the player who played it load the consist as they choose.
|
||||
builtBy: e.player,
|
||||
};
|
||||
// Which way the tray physically points, for the cards it will pick up. A Division Point start
|
||||
// does not set it: those trays have never carried a facing and `enterMainline` does not read
|
||||
|
||||
+27
-6
@@ -504,8 +504,9 @@ export type MainlineKind =
|
||||
| 'uncontrolledSiding' | 'tunnel' | 'trestle' | 'interchange';
|
||||
|
||||
/**
|
||||
* Speed as printed. `60` and `30` appear on the cards; Hilly prints P60/F30, and Heavy Grade
|
||||
* prints "G" with the player setting orientation.
|
||||
* Speed as printed. `60` and `30` appear on the cards; Hilly prints P60/F30, and Heavy Grade prints
|
||||
* "G" — no number at all, plus "Player sets orientation", **which the game deliberately does not do**
|
||||
* (see `gradeReduction` below, and implications.md §10 Q11).
|
||||
*
|
||||
* WHAT THESE NUMBERS MEAN IS NOT YET SETTLED — see implications.md §10 Q2. Transcribed as data so
|
||||
* the answer can be applied without re-reading the cards.
|
||||
@@ -531,6 +532,14 @@ export const MAINLINE_PROFILES: readonly MainlineProfile[] = [
|
||||
{ kind: 'plains', name: 'Plains', speed: { kind: 'uniform', value: 60 }, trainsMayPass: false, sortsCars: false, entryPoints: ['start'] },
|
||||
{ kind: 'curves', name: 'Curves', speed: { kind: 'uniform', value: 30 }, trainsMayPass: false, sortsCars: false, entryPoints: ['start'] },
|
||||
{ kind: 'hilly', name: 'Hilly', speed: { kind: 'byTrainType', passenger: 60, freight: 30 }, trainsMayPass: false, sortsCars: false, entryPoints: ['passenger', 'freight'] },
|
||||
/**
|
||||
* `entryPoints` is TRANSCRIBED, NOT READ — nothing anywhere reads this field on any profile, and
|
||||
* the printed start positions are not modelled: `crossingStages` counts Stages instead. Recorded
|
||||
* here because implications.md §6 describes the card as having FIVE distinct starts (plain,
|
||||
* brakemen, airbrakes, plain, helpers) against the four listed, and that discrepancy should be
|
||||
* settled against `Mainline Cards.pdf` if the starts are ever implemented — not quietly "fixed"
|
||||
* now, when nothing depends on it either way.
|
||||
*/
|
||||
{ kind: 'heavyGrade', name: 'Heavy Grade', speed: { kind: 'grade' }, trainsMayPass: false, sortsCars: false, entryPoints: ['start', 'brakemen', 'airbrakes', 'helpers'] },
|
||||
{ kind: 'doubleTrack', name: 'Double Track', speed: { kind: 'uniform', value: 60 }, trainsMayPass: true, sortsCars: false, entryPoints: ['start'] },
|
||||
{ kind: 'uncontrolledSiding', name: 'Uncontrolled Siding', speed: { kind: 'uniform', value: 60 }, trainsMayPass: true, sortsCars: false, entryPoints: ['noPass', 'passingTrains'] },
|
||||
@@ -664,12 +673,24 @@ export function mainlineDescription(kind: MainlineKind, gradeUp: Direction = 'ea
|
||||
}
|
||||
|
||||
/**
|
||||
* Q11, answered: the Heavy Grade card prints "(Up)" and "Player sets orientation", so which way it
|
||||
* climbs is a property of the placed card, not a constant. `gradeUp` is the direction a train is
|
||||
* travelling when it goes UPHILL; a train heading the other way is descending.
|
||||
* WHICH WAY THE GRADE CLIMBS, AND WHY NO PLAYER CHOOSES IT.
|
||||
*
|
||||
* Q11, answered from the card: Heavy Grade prints "(Up)" and "Player sets orientation", so the climb
|
||||
* is a property of the PLACED CARD rather than a compass constant. `gradeUp` is the direction a train
|
||||
* is travelling when it goes UPHILL; a train heading the other way is descending.
|
||||
*
|
||||
* **The second half of that print is deliberately overridden.** No player sets it — `setup.ts` rolls
|
||||
* it from the seed. Settled v0.5.0 and re-confirmed 2026-08-23 after the question was raised again:
|
||||
* a Heavy Grade always sits BETWEEN two districts (or beyond an end Division Point next to one),
|
||||
* never inside one player's own, so there is no player with a fair claim to the choice — and the
|
||||
* choice is not cosmetic, because it decides which of the three modifiers below can ever pay and
|
||||
* therefore which direction of traffic is favoured, permanently. Giving it to the Superintendent was
|
||||
* considered and rejected in that re-examination: the office rotates every three Stages, the
|
||||
* advantage does not. Full reasoning in implications.md §10 Q11.
|
||||
*
|
||||
* Each applicable card takes a Stage off, never below one: a train cannot cross in no time.
|
||||
* Airbrakes only counts when Brakeman is already there, which the placement rule enforces.
|
||||
* Airbrakes only counts when Brakeman is already there, which the placement rule enforces
|
||||
* (`MAINLINE_MODIFIER_RULES`, `requiresOnCard`).
|
||||
*/
|
||||
function gradeReduction(
|
||||
profile: MainlineProfile,
|
||||
|
||||
@@ -258,6 +258,8 @@ export type RejectionCode =
|
||||
| 'NO_EMPTY_COACH_IN_YARD'
|
||||
| 'NOT_A_CONTROL_POINT'
|
||||
| 'NO_EXTRA_PENDING'
|
||||
/** §7 gives an Extra to the player who played the card; another seat may not place it for them. */
|
||||
| 'NOT_YOUR_EXTRA'
|
||||
| 'NO_FREE_TRAY'
|
||||
| 'NO_FREE_AD_TRACK'
|
||||
// -- §7, where an Extra may be started (`resolveExtraStart`)
|
||||
|
||||
+5
-3
@@ -79,7 +79,7 @@ function candidates(s: GameState, player: PlayerIndex): Intent[] {
|
||||
out.push(...localOpsCandidates(s, player));
|
||||
break;
|
||||
case 'newTrain':
|
||||
out.push(...newTrainCandidates(s));
|
||||
out.push(...newTrainCandidates(s, player));
|
||||
break;
|
||||
case 'loadUnload':
|
||||
out.push(...loadUnloadCandidates(s, player));
|
||||
@@ -257,7 +257,7 @@ function localOpsCandidates(s: GameState, player: PlayerIndex): Intent[] {
|
||||
return out;
|
||||
}
|
||||
|
||||
function newTrainCandidates(s: GameState): Intent[] {
|
||||
function newTrainCandidates(s: GameState, player: PlayerIndex): Intent[] {
|
||||
const out: Intent[] = [];
|
||||
for (const [trayId] of s.trays) {
|
||||
for (const carType of CAR_TYPES) {
|
||||
@@ -279,7 +279,9 @@ function newTrainCandidates(s: GameState): Intent[] {
|
||||
* is placed. In the middle of the railroad — an Interchange, a Control Point — both ways are real
|
||||
* runs, so those are offered twice, once per direction.
|
||||
*/
|
||||
for (const trainNumber of s.pendingExtras) {
|
||||
// Only the player who played it is offered anywhere to put it (§7) — `check` refuses anyone else
|
||||
// with NOT_YOUR_EXTRA, and offering options that are certain to be refused is how a menu lies.
|
||||
for (const { trainNumber } of s.pendingExtras.filter((x) => x.player === player)) {
|
||||
for (const side of ['west', 'east'] as const) {
|
||||
out.push({ type: 'newTrain.startExtra', trainNumber, start: { kind: 'divisionPoint', side } });
|
||||
}
|
||||
|
||||
+5
-1
@@ -254,7 +254,11 @@ function buildDivision(players: number, rng: Rng): DivisionNode[] {
|
||||
* district — so whichever direction climbs advantages one neighbour over the other, and there
|
||||
* is no single player who owns that call fairly. Orientation is rolled from the seed instead,
|
||||
* identically for solitaire and multiplayer, and this is not expected to change when setup
|
||||
* eventually gains an interactive phase for other decisions. See implications.md §10 Q11.
|
||||
* eventually gains an interactive phase for other decisions.
|
||||
*
|
||||
* RE-CONFIRMED 2026-08-23, when the question was raised again and giving the choice to the
|
||||
* Superintendent was considered and rejected — the office rotates every three Stages, the
|
||||
* advantage it would hand out does not. See implications.md §10 Q11.
|
||||
*/
|
||||
node.gradeUp = rng.nextInt(2) === 0 ? 'east' : 'west';
|
||||
}
|
||||
|
||||
+17
-1
@@ -371,6 +371,15 @@ export type CrewTray = {
|
||||
* bug `isBeingMadeUp` was tightened to kill, and an arriving train never carries this.
|
||||
*/
|
||||
beingMadeUp?: boolean;
|
||||
/**
|
||||
* WHOSE TRAIN THIS IS TO BUILD, for an Extra only.
|
||||
*
|
||||
* §7's Extra is loaded by the player who played the card, not by the Superintendent-first round
|
||||
* that fills a Timetabled train — so the tray has to remember them: `pendingExtras` is emptied the
|
||||
* moment the Extra starts, which is before a single car goes on. Undefined on every Timetabled
|
||||
* train, where the round decides instead.
|
||||
*/
|
||||
builtBy?: PlayerIndex;
|
||||
/**
|
||||
* WHERE THE ENGINE SITS IN THE TRAY, as an index into `consist`.
|
||||
*
|
||||
@@ -831,8 +840,15 @@ export type GameState = {
|
||||
/**
|
||||
* §7 — Extra Trains played from hand, waiting for a free Crew Tray. An Extra is not scheduled:
|
||||
* it runs once, immediately, then its card goes to the Salvage Yard (§2.3).
|
||||
*
|
||||
* CARRIES WHO PLAYED IT (2026-08-23, Jesse's call). §7 gives an Extra to the player who played the
|
||||
* card — "may place the Crew Tray at either Division Point ... and may load the consist as he
|
||||
* chooses" — which is a different rule from the Timetabled make-up round, where the table goes
|
||||
* round starting at the Superintendent. This was a bare `number[]`, so the engine could not tell
|
||||
* whose Extra it was and asked whoever the acting order happened to be on: correct in solitaire,
|
||||
* where there is only one player, and wrong at every table.
|
||||
*/
|
||||
pendingExtras: number[];
|
||||
pendingExtras: { trainNumber: number; player: PlayerIndex }[];
|
||||
/**
|
||||
* Q9 — train numbers ordered to run a second section. The next New Train Phase makes up an
|
||||
* identical train behind the first, if a Crew Tray is free.
|
||||
|
||||
+129
-3
@@ -41,6 +41,7 @@ import { createSession } from './session.ts';
|
||||
import type { GameSession, Push } from './session.ts';
|
||||
import {
|
||||
createLobby,
|
||||
leaveLobby,
|
||||
freshGameCode,
|
||||
playerCountAllowed,
|
||||
joinLobby,
|
||||
@@ -129,6 +130,15 @@ async function serveStatic(distDir: string, urlPath: string, res: ServerResponse
|
||||
* simply ending, indistinguishable from a network hiccup that `EventSource` would otherwise retry.
|
||||
*/
|
||||
type LobbyPush = { lobby: Lobby; you: PlayerIndex; started: boolean };
|
||||
/** What `/api/lobby/preview` answers with — everything a player weighing a join needs, and nothing
|
||||
* that would spoil the game. THE SEED IS NOT IN IT: it decides every shuffle and every roll. */
|
||||
type LobbyPreview = {
|
||||
gameCode: string;
|
||||
hostName: string;
|
||||
config: GameConfig;
|
||||
players: number;
|
||||
seated: { seat: number; who: string | null; bot: boolean }[];
|
||||
};
|
||||
|
||||
export function startServer(opts: ServerOptions): void {
|
||||
const games = opts.initialGames;
|
||||
@@ -143,6 +153,8 @@ export function startServer(opts: ServerOptions): void {
|
||||
const gameConnections = new Map<string, Map<PlayerIndex, ServerResponse>>();
|
||||
const gameEventIds = new Map<string, Map<PlayerIndex, number>>();
|
||||
const lobbyConnections = new Map<string, Map<string, ServerResponse>>();
|
||||
/** Which seats of a game have ever held a connection in THIS process — see `presenceOfOthers`. */
|
||||
const everConnected = new Map<string, Set<PlayerIndex>>();
|
||||
|
||||
function writeSse(res: ServerResponse, id: number, data: unknown): void {
|
||||
res.write(`id: ${id}\ndata: ${JSON.stringify(data)}\n\n`);
|
||||
@@ -176,11 +188,37 @@ export function startServer(opts: ServerOptions): void {
|
||||
if (!conns) return;
|
||||
for (const [other, res] of conns) {
|
||||
if (other === seat) continue;
|
||||
const push: Push = { menu: null, lines: [], presence: { seat, connected } };
|
||||
const push: Push = { menu: null, lines: [], presence: [{ seat, connected, seen: true }] };
|
||||
writeSse(res, nextEventId(gameId, other), push);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* EVERY OTHER SEAT'S STATE, for a client that has just connected.
|
||||
*
|
||||
* `broadcastPresence` only ever reports a CHANGE, so a player arriving at a table where two people
|
||||
* had not opened the game yet was told nothing about them at all — and "is everyone here?" is the
|
||||
* question at the moment a game starts. `seen` separates a seat that was here and dropped from one
|
||||
* that has never connected; it is remembered only for as long as this process runs, so after a
|
||||
* restart every absent seat reads as "not here yet", which is the more cautious of the two.
|
||||
*/
|
||||
function presenceOfOthers(
|
||||
gameId: string,
|
||||
seat: PlayerIndex,
|
||||
session: GameSession,
|
||||
): NonNullable<Push['presence']> {
|
||||
const conns = gameConnections.get(gameId);
|
||||
const ever = everConnected.get(gameId) ?? new Set<PlayerIndex>();
|
||||
const out: NonNullable<Push['presence']> = [];
|
||||
for (let other = 0 as PlayerIndex; other < session.playerCount; other++) {
|
||||
// A bot holds no connection and never will, so reporting it would put "waiting on Bot 1 — not
|
||||
// here yet" on every screen for the whole game. Found by playing a real 3-seat game.
|
||||
if (other === seat || session.isBot(other)) continue;
|
||||
out.push({ seat: other, connected: conns?.has(other) === true, seen: ever.has(other) });
|
||||
}
|
||||
return out;
|
||||
}
|
||||
|
||||
function broadcastLobby(gameId: string): void {
|
||||
const lobby = lobbies.get(gameId);
|
||||
const conns = lobbyConnections.get(gameId);
|
||||
@@ -389,7 +427,12 @@ export function startServer(opts: ServerOptions): void {
|
||||
await persistLobby(result.lobby);
|
||||
await persistSession(result.session);
|
||||
broadcastLobby(lobby.gameId);
|
||||
sendJson(res, 200, { gameId: lobby.gameId, token: result.session.token, player: result.session.player });
|
||||
sendJson(res, 200, {
|
||||
gameId: lobby.gameId,
|
||||
gameCode: lobby.gameCode,
|
||||
token: result.session.token,
|
||||
player: result.session.player,
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -418,6 +461,83 @@ export function startServer(opts: ServerOptions): void {
|
||||
return;
|
||||
}
|
||||
|
||||
/**
|
||||
* GIVING UP A SEAT — the player's own, or (host only) somebody else's.
|
||||
*
|
||||
* There was no door out of a lobby before this: a mis-join or a player who wandered off left a
|
||||
* chair that could not be freed, and a table that cannot start until every chair is taken.
|
||||
* The host's "remove" and a player's "Leave" are the same act from opposite ends, so they are
|
||||
* one route — `seat` names somebody else's chair and is refused to anyone but the host.
|
||||
*/
|
||||
if (url.pathname === '/api/lobby/leave' && req.method === 'POST') {
|
||||
const body = (await readJson(req)) as { token?: string; seat?: number };
|
||||
const ps = typeof body.token === 'string' ? sessions.get(body.token) : undefined;
|
||||
const lobby = ps ? lobbies.get(ps.gameId) : undefined;
|
||||
if (!ps || !lobby) {
|
||||
sendJson(res, 404, { error: 'no such lobby' });
|
||||
return;
|
||||
}
|
||||
const seat = typeof body.seat === 'number' ? (body.seat as PlayerIndex) : undefined;
|
||||
if (seat !== undefined && seat !== ps.player && lobby.hostToken !== ps.token) {
|
||||
sendJson(res, 403, { error: 'NOT_HOST' });
|
||||
return;
|
||||
}
|
||||
const result = leaveLobby(lobby, ps.token, seat);
|
||||
if (result.empty) {
|
||||
// Nobody human is left to start it. Everything about this lobby goes, including the code,
|
||||
// so it cannot be joined into a game that will never begin.
|
||||
lobbies.delete(lobby.gameId);
|
||||
gameCodes.delete(lobby.gameCode);
|
||||
for (const [, watcher] of lobbyConnections.get(lobby.gameId) ?? []) watcher.end();
|
||||
lobbyConnections.delete(lobby.gameId);
|
||||
await deleteLobby(opts.dataDir, lobby.gameId);
|
||||
// The row goes with the lobby rather than being marked: a game that never started is not a
|
||||
// game an administrator has any use for a record of.
|
||||
await removeIndexEntry(opts.dataDir, lobby.gameId);
|
||||
sendJson(res, 200, { ok: true, closed: true });
|
||||
return;
|
||||
}
|
||||
await persistLobby(result.lobby);
|
||||
broadcastLobby(lobby.gameId);
|
||||
sendJson(res, 200, { ok: true });
|
||||
return;
|
||||
}
|
||||
|
||||
/**
|
||||
* WHAT AM I ABOUT TO JOIN? Read-only, takes no seat, and gated by the same join secret the
|
||||
* door itself is.
|
||||
*
|
||||
* A player used to have to take a chair before they could see a single rule of the game they
|
||||
* were sitting down to — and until 2026-08-23 there was then no way back out of it.
|
||||
*/
|
||||
if (url.pathname === '/api/lobby/preview' && req.method === 'GET') {
|
||||
if (url.searchParams.get('secret') !== opts.joinSecret) {
|
||||
sendJson(res, 403, { error: 'bad or missing secret' });
|
||||
return;
|
||||
}
|
||||
const code = (url.searchParams.get('gameCode') ?? '').trim().toUpperCase();
|
||||
const gameId = gameCodes.get(code);
|
||||
const lobby = gameId ? lobbies.get(gameId) : undefined;
|
||||
if (!lobby) {
|
||||
sendJson(res, 404, { error: 'no open lobby with that code' });
|
||||
return;
|
||||
}
|
||||
const hostSeat = lobby.seats.find((seat) => seat?.kind === 'human' && seat.token === lobby.hostToken);
|
||||
const preview: LobbyPreview = {
|
||||
gameCode: lobby.gameCode,
|
||||
hostName: hostSeat?.kind === 'human' ? hostSeat.displayName : 'unknown',
|
||||
config: lobby.config,
|
||||
players: lobby.seats.length,
|
||||
seated: lobby.seats.map((seat, i) => ({
|
||||
seat: i,
|
||||
who: seat?.kind === 'human' ? seat.displayName : null,
|
||||
bot: seat?.kind === 'bot',
|
||||
})),
|
||||
};
|
||||
sendJson(res, 200, preview);
|
||||
return;
|
||||
}
|
||||
|
||||
if (url.pathname === '/api/lobby/start' && req.method === 'POST') {
|
||||
const body = (await readJson(req)) as { token?: string };
|
||||
const ps = typeof body.token === 'string' ? sessions.get(body.token) : undefined;
|
||||
@@ -523,7 +643,13 @@ export function startServer(opts: ServerOptions): void {
|
||||
const conns = gameConnections.get(gameId) ?? new Map<PlayerIndex, ServerResponse>();
|
||||
conns.set(seat, res);
|
||||
gameConnections.set(gameId, conns);
|
||||
writeSse(res, nextEventId(gameId, seat), session.connect(seat));
|
||||
const ever = everConnected.get(gameId) ?? new Set<PlayerIndex>();
|
||||
ever.add(seat);
|
||||
everConnected.set(gameId, ever);
|
||||
// The board, and who else is at the table — the second half used to be missing entirely.
|
||||
const first = session.connect(seat);
|
||||
first.presence = presenceOfOthers(gameId, seat, session);
|
||||
writeSse(res, nextEventId(gameId, seat), first);
|
||||
broadcastPresence(gameId, seat, true);
|
||||
// Idle for minutes at a time is the expected shape of this game (multiplayer.md §9) — a
|
||||
// silent SSE connection is exactly what a proxy in the path may reap. A comment line is not a
|
||||
|
||||
+48
-1
@@ -50,7 +50,12 @@ export type Lobby = {
|
||||
};
|
||||
|
||||
export type CreateResult = { lobby: Lobby; session: PlayerSession };
|
||||
export type JoinResult = { ok: true; lobby: Lobby; session: PlayerSession } | { ok: false; code: 'LOBBY_FULL' | 'ALREADY_STARTED' };
|
||||
export type JoinResult =
|
||||
| { ok: true; lobby: Lobby; session: PlayerSession }
|
||||
| { ok: false; code: 'LOBBY_FULL' | 'ALREADY_STARTED' | 'NAME_TAKEN' };
|
||||
/** `empty` when the last human has gone — the caller drops the lobby rather than leaving a table of
|
||||
* bots waiting for a host who no longer exists. */
|
||||
export type LeaveResult = { lobby: Lobby; empty: boolean };
|
||||
export type StartResult = { ok: true; playerNames: string[]; botSeats: PlayerIndex[] } | { ok: false; code: 'NOT_HOST' | 'BAD_PLAYER_COUNT' };
|
||||
|
||||
/**
|
||||
@@ -140,6 +145,19 @@ export function joinLobby(lobby: Lobby, displayName: string): JoinResult {
|
||||
const seatIndex = lobby.seats.findIndex((s) => s === null);
|
||||
if (seatIndex < 0) return { ok: false, code: 'LOBBY_FULL' };
|
||||
|
||||
/**
|
||||
* TWO PLAYERS CANNOT SHARE A NAME (2026-08-23).
|
||||
*
|
||||
* The name is not decoration: it labels the district on the Division map, it is what the turn
|
||||
* chart means by "waiting on Jesse", and `record()` puts it in front of every line that player
|
||||
* causes. Two identical names make all three ambiguous, and there is no way to fix it once the
|
||||
* game starts — the names are locked into the session at `Lobby.Start`. Refused rather than
|
||||
* silently suffixed: a player should play under the name they chose, or be told to choose again.
|
||||
*/
|
||||
const wanted = displayName.trim().toLowerCase();
|
||||
const clash = lobby.seats.some((s) => s?.kind === 'human' && s.displayName.trim().toLowerCase() === wanted);
|
||||
if (clash) return { ok: false, code: 'NAME_TAKEN' };
|
||||
|
||||
const token = randomUUID();
|
||||
const session: PlayerSession = { token, gameId: lobby.gameId, player: seatIndex, displayName };
|
||||
const seats = [...lobby.seats];
|
||||
@@ -151,6 +169,35 @@ export function joinLobby(lobby: Lobby, displayName: string): JoinResult {
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* GIVING UP A SEAT — a player leaving, or the host clearing somebody out of a chair.
|
||||
*
|
||||
* There was no way out of a lobby at all before 2026-08-23: a mis-join or a player who wandered off
|
||||
* wedged the table, because Start needs every chair filled and `setBotSeat` refuses to touch an
|
||||
* occupied human seat. One function serves both, since they differ only in whose seat is named, and
|
||||
* `http.ts` is what checks that a caller naming somebody else's seat is the host.
|
||||
*
|
||||
* Host rights move exactly as they do on a dropped connection (`reassignHost`), and the caller is
|
||||
* told when the last human has gone so the lobby can be dropped rather than left orphaned.
|
||||
*/
|
||||
export function leaveLobby(lobby: Lobby, token: string, seat?: PlayerIndex): LeaveResult {
|
||||
const index =
|
||||
seat === undefined ? lobby.seats.findIndex((s) => s?.kind === 'human' && s.token === token) : seat;
|
||||
const occupant = index >= 0 ? (lobby.seats[index] ?? null) : null;
|
||||
if (index < 0 || occupant?.kind !== 'human') return { lobby, empty: false };
|
||||
|
||||
const seats = [...lobby.seats];
|
||||
seats[index] = null;
|
||||
const departing = occupant.token;
|
||||
const withoutThem: Lobby = {
|
||||
...lobby,
|
||||
seats,
|
||||
joinOrder: lobby.joinOrder.filter((t) => t !== departing),
|
||||
};
|
||||
const empty = !seats.some((s) => s?.kind === 'human');
|
||||
return { lobby: reassignHost(withoutThem, departing), empty };
|
||||
}
|
||||
|
||||
/** Host-only in effect (`http.ts` checks the caller's token against `hostToken` before calling
|
||||
* this) — marks an empty seat as bot-filled, or clears one back to empty. Never touches an occupied
|
||||
* human seat; the host removes a person by them leaving, not by overwriting their seat. */
|
||||
|
||||
+65
-6
@@ -42,14 +42,33 @@ export type Push = {
|
||||
/** Narration since the LAST push to this specific seat, not the whole game's log. */
|
||||
lines: { text: string; tone: string }[];
|
||||
/**
|
||||
* Connection news about ANOTHER seat — never this push's own recipient. `lobby-and-sessions.md`
|
||||
* Connection news about OTHER seats — never this push's own recipient. `lobby-and-sessions.md`
|
||||
* §5: a disconnect is server-layer news about a connection, not a `GameEvent`, so it must not go
|
||||
* through the engine or the shared narration log (which must stay replayable from a seed). Built
|
||||
* and broadcast entirely by `http.ts`, which already owns the connection table; `session.ts` never
|
||||
* sets this field itself — every `Push` `session.ts` builds carries a real `frame` and no
|
||||
* `presence`, and `http.ts`'s presence notices carry no `frame` and no `menu`.
|
||||
*
|
||||
* A LIST, since 2026-08-23: a connecting client is told about every other seat at once. It used to
|
||||
* learn of a seat only when that seat disconnected AFTER it connected, so a player arriving at a
|
||||
* table where two people had not shown up yet was told nothing at all. `seen` distinguishes "was
|
||||
* here and dropped" from "has never opened the game".
|
||||
*/
|
||||
presence?: { seat: PlayerIndex; connected: boolean };
|
||||
presence?: { seat: PlayerIndex; connected: boolean; seen: boolean }[];
|
||||
/**
|
||||
* THE FOUR TRANSIENT SIGNALS (2026-08-23) — what solitaire has always drawn and multiplayer never
|
||||
* did: sound cues, the timetable slot a D12 just filled, a one-line announcement, and the card
|
||||
* that just came into this seat's hand.
|
||||
*
|
||||
* The first three are SHARED — a collision anywhere on the Division, the Stage bell, a train
|
||||
* running off the end pays everyone — so they are identical in every seat's push and drained once
|
||||
* per broadcast. `justDrawn` is not: it goes ONLY to the seat that drew it (`game.justDrawn` is
|
||||
* one field for the whole game and does not say whose). `test/redaction.test.ts` is the guard.
|
||||
*/
|
||||
cues?: string[];
|
||||
scheduled?: number | null;
|
||||
announcement?: string | null;
|
||||
justDrawn?: string | null;
|
||||
};
|
||||
|
||||
/**
|
||||
@@ -141,6 +160,9 @@ function buildSession(
|
||||
lastMoveAtInit: number,
|
||||
): GameSession {
|
||||
let lastMoveAt = lastMoveAtInit;
|
||||
/** Who drew the card `game.justDrawn` names. The engine records WHICH card came into hand but not
|
||||
* whose hand it went into, and that is the whole difference between a badge and a leak. */
|
||||
let lastDraw: { seat: PlayerIndex; cardId: string } | null = null;
|
||||
const lastSeq = new Map<PlayerIndex, number>();
|
||||
const lastFrame = new Map<PlayerIndex, Frame>();
|
||||
const sentLines = new Map<PlayerIndex, number>();
|
||||
@@ -166,16 +188,41 @@ function buildSession(
|
||||
return seat === currentActor(game) ? actionMenu(game, seat) : null;
|
||||
}
|
||||
|
||||
function pushFor(seat: PlayerIndex): Push {
|
||||
/** What the last batch of events earned, drained from the game exactly once and then handed to
|
||||
* every seat. `null` on a (re)connect: a fresh connection is drawing a STATE, and replaying the
|
||||
* sounds of everything it missed would be a burst of noise about the past. */
|
||||
type Moment = { cues: string[]; scheduled: number | null; announcement: string | null };
|
||||
|
||||
function takeMoment(): Moment {
|
||||
const cues = game.cues.splice(0, game.cues.length);
|
||||
const scheduled = game.scheduled;
|
||||
game.scheduled = null;
|
||||
const announcement = game.announced;
|
||||
game.announced = null;
|
||||
return { cues, scheduled, announcement };
|
||||
}
|
||||
|
||||
function pushFor(seat: PlayerIndex, moment: Moment | null): Push {
|
||||
const frame = frameFor(seat);
|
||||
const delta = deltaFrame(lastFrame.get(seat) ?? null, frame);
|
||||
lastFrame.set(seat, frame);
|
||||
return { frame: delta, menu: menuFor(seat), lines: linesSince(seat) };
|
||||
const push: Push = { frame: delta, menu: menuFor(seat), lines: linesSince(seat) };
|
||||
if (moment) {
|
||||
if (moment.cues.length > 0) push.cues = moment.cues;
|
||||
if (moment.scheduled !== null) push.scheduled = moment.scheduled;
|
||||
if (moment.announcement !== null) push.announcement = moment.announcement;
|
||||
}
|
||||
// The drawer's own card, and nobody else's — on a reconnect too, so the badge survives a refresh.
|
||||
if (lastDraw !== null && lastDraw.seat === seat) push.justDrawn = lastDraw.cardId;
|
||||
return push;
|
||||
}
|
||||
|
||||
function pushesForAll(): Map<PlayerIndex, Push> {
|
||||
const moment = takeMoment();
|
||||
const out = new Map<PlayerIndex, Push>();
|
||||
for (let seat = 0; seat < playerNames.length; seat++) out.set(seat as PlayerIndex, pushFor(seat as PlayerIndex));
|
||||
for (let seat = 0; seat < playerNames.length; seat++) {
|
||||
out.set(seat as PlayerIndex, pushFor(seat as PlayerIndex, moment));
|
||||
}
|
||||
return out;
|
||||
}
|
||||
|
||||
@@ -224,13 +271,21 @@ function buildSession(
|
||||
const options = legalActions(game.state, actor);
|
||||
if (options.length === 0) return;
|
||||
const choice = developerBot.choose(game.state, actor, options);
|
||||
const drawnBefore = game.justDrawn;
|
||||
const ok = submit(game, choice);
|
||||
if (game.justDrawn !== drawnBefore && game.justDrawn !== null) {
|
||||
lastDraw = { seat: actor, cardId: game.justDrawn };
|
||||
}
|
||||
/* c8 ignore next -- `options` came from `legalActions`, so `choice` is always legal. */
|
||||
if (!ok) throw new Error(`driveBots: developerBot chose an illegal action for seat ${actor}`);
|
||||
settleTiming();
|
||||
}
|
||||
}
|
||||
driveBots();
|
||||
// Whatever the opening bot turns earned belongs to a game nobody was connected to yet — dropped
|
||||
// here rather than fired at the first client to arrive. (It also stops `game.cues` growing without
|
||||
// bound on a server, which nothing was draining before this.)
|
||||
takeMoment();
|
||||
|
||||
return {
|
||||
playerCount: playerNames.length,
|
||||
@@ -240,7 +295,7 @@ function buildSession(
|
||||
// A (re)connect always starts from a clean slate — no cache to trust across a lost connection
|
||||
// (or a server restart, Phase 3) — so the honest thing is a full Frame, not a delta.
|
||||
lastFrame.delete(seat);
|
||||
return pushFor(seat);
|
||||
return pushFor(seat, null);
|
||||
},
|
||||
|
||||
intent(seat, seq, i) {
|
||||
@@ -259,7 +314,11 @@ function buildSession(
|
||||
const code = check(game.state, seat, i);
|
||||
if (code) return { accepted: false, code };
|
||||
|
||||
const drawnBefore = game.justDrawn;
|
||||
const applied = submit(game, i);
|
||||
if (game.justDrawn !== drawnBefore && game.justDrawn !== null) {
|
||||
lastDraw = { seat, cardId: game.justDrawn };
|
||||
}
|
||||
/* c8 ignore next -- `check` above already proved this intent is legal; `submit` cannot then refuse it. */
|
||||
if (!applied) return { accepted: false, code: 'REJECTED' };
|
||||
|
||||
|
||||
+1
-1
@@ -139,7 +139,7 @@ export function makeDeveloperBot(tweaks: BotTweaks): BotPolicy {
|
||||
choose(s, player, options) {
|
||||
lastReason = 'no specific reason — first legal option';
|
||||
const clearance = ruleOnClearance(options);
|
||||
if (clearance) return because('the Superintendent must rule on a following train (§8.1)', clearance);
|
||||
if (clearance) return because('the Superintendent must rule on a following train', clearance);
|
||||
|
||||
// Red Flags come before anything else — protection is only worth playing at the moment the
|
||||
// collision is actually pending, and that moment passes.
|
||||
|
||||
+12
-12
@@ -267,7 +267,7 @@ export function narrate(e: GameEvent, ctx: NarrateContext = {}): Narration {
|
||||
case 'secondSectionOrdered':
|
||||
return {
|
||||
tone: 'bad',
|
||||
text: `SECOND SECTION ordered on Train ${e.trainNumber} — an identical train will run right behind it, which forces the Superintendent to rule on a following train (§8.1)`,
|
||||
text: `SECOND SECTION ordered on Train ${e.trainNumber} — an identical train will run right behind it, which forces the Superintendent to rule on a following train`,
|
||||
};
|
||||
/**
|
||||
* WHERE THE PLAYER PUT IT, not where its number would have sent it.
|
||||
@@ -382,7 +382,7 @@ export function narrate(e: GameEvent, ctx: NarrateContext = {}): Narration {
|
||||
return {
|
||||
tone: 'good',
|
||||
text: bumped
|
||||
? `Train ${e.trainNumber} SCHEDULED at Stage ${e.slot + 1} — rolled ${e.roll}, but Stage ${e.roll} was already taken, so it moved down the column to the next free Stage (§7)`
|
||||
? `Train ${e.trainNumber} SCHEDULED at Stage ${e.slot + 1} — rolled ${e.roll}, but Stage ${e.roll} was already taken, so it moved down the column to the next free Stage`
|
||||
: `Train ${e.trainNumber} SCHEDULED to depart at Stage ${e.slot + 1} (rolled ${e.roll}) — it will run at this time EVERY Day from now on`,
|
||||
};
|
||||
}
|
||||
@@ -400,9 +400,9 @@ export function narrate(e: GameEvent, ctx: NarrateContext = {}): Narration {
|
||||
// player the score had changed and nothing else.
|
||||
const why =
|
||||
e.reason === 'no free A/D track'
|
||||
? `it arrived at ${e.where} with every A/D track already occupied — there was nowhere to put it (§8.3)`
|
||||
? `it arrived at ${e.where} with every A/D track already occupied — there was nowhere to put it`
|
||||
: e.reason === 'cars fouling the Running Track'
|
||||
? `it ran into cars left standing on ${e.where} between the Limits and the Office (§8.3)`
|
||||
? `it ran into cars left standing on ${e.where} between the Limits and the Office`
|
||||
: e.reason;
|
||||
const wrecked = e.trains
|
||||
.map((t) => `${t.label} (${t.consist.length ? carsLabel(t.consist) : 'no cars'})`)
|
||||
@@ -411,7 +411,7 @@ export function narrate(e: GameEvent, ctx: NarrateContext = {}): Narration {
|
||||
tone: 'bad',
|
||||
text:
|
||||
`COLLISION — ${wrecked} destroyed: ${why}. Engines and cabooses go back to the Division ` +
|
||||
`Yard, all other cars to the Classification Yard (§10). A Timetabled train card returns ` +
|
||||
`Yard, all other cars to the Classification Yard. A Timetabled train card returns ` +
|
||||
`to its slot and runs again next Day; an Extra is gone for good.`,
|
||||
};
|
||||
}
|
||||
@@ -420,7 +420,7 @@ export function narrate(e: GameEvent, ctx: NarrateContext = {}): Narration {
|
||||
return {
|
||||
tone: 'bad',
|
||||
text:
|
||||
`SUPERINTENDENT MUST RULE (§8.1): ${train(e.trainId)} wants to enter the Mainline card ` +
|
||||
`SUPERINTENDENT MUST RULE: ${train(e.trainId)} wants to enter the Mainline card ` +
|
||||
`that ${train(e.occupiedBy)} is still crossing. Allow it and ${train(e.trainId)} may run ` +
|
||||
`into the back of ${train(e.occupiedBy)} — a collision costs 5 Revenue. Hold it and it ` +
|
||||
`waits where it is, losing time but safe.`,
|
||||
@@ -440,13 +440,13 @@ export function narrate(e: GameEvent, ctx: NarrateContext = {}): Narration {
|
||||
return {
|
||||
tone: 'good',
|
||||
where: e.at,
|
||||
text: `Porter boarded passengers at ${at(e.at)} — one coach per Porter per Stage (§9.2)`,
|
||||
text: `Porter boarded passengers at ${at(e.at)} — one coach per Porter per Stage`,
|
||||
};
|
||||
case 'passengersDetrained':
|
||||
return {
|
||||
tone: 'good',
|
||||
where: e.at,
|
||||
text: `Porter de-trained passengers at ${at(e.at)} — one coach per Porter per Stage (§9.2)`,
|
||||
text: `Porter de-trained passengers at ${at(e.at)} — one coach per Porter per Stage`,
|
||||
};
|
||||
|
||||
// -- freight pipeline
|
||||
@@ -562,7 +562,7 @@ export function impediments(s: GameState, player: PlayerIndex = 0): Impediment[]
|
||||
why: blockedByBox
|
||||
? 'green box has a load but MEN is occupied'
|
||||
: `a load is staged but no empty ${want} is spotted on this industry's track — it stays ` +
|
||||
'in the green box until a crew sets one out here (§9.3)',
|
||||
'in the green box until a crew sets one out here',
|
||||
severity: blockedByBox ? 'waiting' : 'stuck',
|
||||
});
|
||||
}
|
||||
@@ -583,7 +583,7 @@ export function impediments(s: GameState, player: PlayerIndex = 0): Impediment[]
|
||||
why: spotted
|
||||
? 'green box empty — nothing to load (needs a Freight Agent action)'
|
||||
: `green box empty — the Freight Agent can stage a load now, but no empty ${want} is ` +
|
||||
'spotted here, so a crew must set one out before Laborers can work it (§9.3)',
|
||||
'spotted here, so a crew must set one out before Laborers can work it',
|
||||
severity: 'waiting',
|
||||
});
|
||||
}
|
||||
@@ -668,7 +668,7 @@ export function impediments(s: GameState, player: PlayerIndex = 0): Impediment[]
|
||||
|
||||
if (pf.porters < 1) {
|
||||
say(
|
||||
'this Office has NO Porters — a Whistle Post is not a Passenger Facility (§9) and cannot ' +
|
||||
'this Office has NO Porters — a Whistle Post is not a Passenger Facility and cannot ' +
|
||||
'work passengers at all. Upgrade it to a Depot or better.',
|
||||
'stuck',
|
||||
);
|
||||
@@ -691,7 +691,7 @@ export function impediments(s: GameState, player: PlayerIndex = 0): Impediment[]
|
||||
);
|
||||
}
|
||||
if (loadedOnTrain && !s.yards.divisionYard.some((c) => c.type === 'coach' && !c.loaded)) {
|
||||
say('no EMPTY coach in the Division Yard to swap into the train (§9.2 requires one)');
|
||||
say('no EMPTY coach in the Division Yard to swap into the train — one is required');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
+5
-1
@@ -492,7 +492,11 @@ function boxes(items, cap, cls) {
|
||||
|
||||
function render() {
|
||||
const f = FRAMES[i];
|
||||
$('turnchart').innerHTML = turnChartHtml(f, f.actor === null ? null : 'Player ' + (f.actor + 1));
|
||||
$('turnchart').innerHTML = turnChartHtml(
|
||||
f,
|
||||
f.actor === null ? null : 'Player ' + (f.actor + 1),
|
||||
f.players.length > 1 ? 'Player ' + (f.superintendent + 1) : null,
|
||||
);
|
||||
$('super').textContent = 'P' + f.superintendent;
|
||||
$('rev').textContent = f.revenue;
|
||||
$('rev').className = 'big ' + (f.revenue < 0 ? 't-bad' : f.revenue > 0 ? 't-good' : '');
|
||||
|
||||
+27
-2
@@ -27,7 +27,18 @@ export type TurnChartFrame = {
|
||||
* The first three are the rules text; Cargo and Supervisor Shift are written from what the engine
|
||||
* does, since the recovered sheet does not spell them out.
|
||||
*/
|
||||
export function turnChartHtml(f: TurnChartFrame, actorName: string | null): string {
|
||||
/**
|
||||
* `superName` is the player holding the Fedora, or null for a table where saying so is noise — one
|
||||
* seat, where it is always you.
|
||||
*
|
||||
* REPORTED BY JESSE 2026-08-23, from a two-player game on StartOS: seat 1 played a train card and
|
||||
* seat 2 was asked to build the train, "what's the rule for WHICH player builds a train?" The engine
|
||||
* was right — §7 makes up a consist "starting with the Superintendent and working left" — but the
|
||||
* board did not name the Superintendent ANYWHERE, so the question could not be answered from the
|
||||
* screen. `Frame` has carried `superintendent` all along and the standalone replay printed it; the
|
||||
* live game never did.
|
||||
*/
|
||||
export function turnChartHtml(f: TurnChartFrame, actorName: string | null, superName: string | null = null): string {
|
||||
const PHASES: { key: string; label: string; tip: string; icon: string }[] = [
|
||||
{
|
||||
key: 'localOps',
|
||||
@@ -39,7 +50,10 @@ export function turnChartHtml(f: TurnChartFrame, actorName: string | null): stri
|
||||
{
|
||||
key: 'newTrain',
|
||||
label: 'New Train',
|
||||
tip: 'Timetabled trains for this Stage are built. New timetabled trains are randomly placed on the timetable. Held trains are built. Extra trains are built.',
|
||||
// Says WHO builds, which is the question this phase actually raises at a table: the round
|
||||
// starts with the Superintendent and works left, one car each, repeating (§7, Gap 9) — not
|
||||
// with whoever played the card. An Extra is the exception: its player loads it as they choose.
|
||||
tip: 'Timetabled trains for this Stage are built: starting with the Superintendent and working left, each player adds ONE car, going round again until the consist is full or the Division Yard has nothing suitable. New timetabled trains are rolled onto the timetable. Held trains are built. An Extra is loaded by the player who played it.',
|
||||
// a locomotive being made up
|
||||
icon: '<rect class="ic" x="2" y="6" width="9" height="7" rx="1"/><path class="ic" d="M11 9h4v4h-4"/><circle class="icf" cx="5" cy="15" r="1.5"/><circle class="icf" cx="13" cy="15" r="1.5"/>',
|
||||
},
|
||||
@@ -81,12 +95,18 @@ export function turnChartHtml(f: TurnChartFrame, actorName: string | null): stri
|
||||
|
||||
// An automatic phase is waiting on nobody, and saying so is more use than a blank.
|
||||
const who = actorName ?? 'nobody — the Division is running itself';
|
||||
const fedora =
|
||||
superName === null
|
||||
? ''
|
||||
: `<div class="tc-super" data-tip="The Superintendent holds the Fedora. Every third Stage — 3, 6, 9 and 12 — it passes one seat to the left. The office rules on whether a following train may depart, and every round that goes round the table starts here: the New Train make-up round, and the acting order within a phase." tabindex="0">` +
|
||||
`<span aria-hidden="true">🎩</span> Superintendent <b>${esc(superName)}</b></div>`;
|
||||
|
||||
return (
|
||||
`<div class="tc-when"><b>Day ${f.day}</b><span>Stage ${f.stage} of 12</span>` +
|
||||
`<span class="dim">${esc(f.clock)}</span></div>` +
|
||||
`<div class="tc-now">phase <b>${esc(f.phase)}</b></div>` +
|
||||
`<div class="tc-who">waiting on <b>${esc(who)}</b></div>` +
|
||||
fedora +
|
||||
`<ol class="tc-phases">${chips}</ol>`
|
||||
);
|
||||
}
|
||||
@@ -112,6 +132,11 @@ export const TURNCHART_CSS = `
|
||||
.tc-who{display:flex;align-items:center;gap:6px;font-size:12px;color:#8b94a3}
|
||||
.tc-who b{color:#b98cf0;background:rgba(150,110,230,.16);border:1px solid #8b6ad0;
|
||||
border-radius:11px;padding:1px 9px;font-size:12px}
|
||||
/* WHO HOLDS THE FEDORA. Violet like the rest of the chart — this is "where you are" news, not
|
||||
something to press — but unfilled, so the eye still lands on "waiting on" first: that is the one
|
||||
that changes every turn, while this changes four times a Day. */
|
||||
.tc-super{display:flex;align-items:center;gap:6px;font-size:12px;color:#8b94a3;cursor:help}
|
||||
.tc-super b{color:#cbb6f2;border:1px solid #6b5a94;border-radius:11px;padding:1px 9px;font-size:12px}
|
||||
ol.tc-phases{display:flex;gap:6px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
|
||||
.tc-phase{display:flex;align-items:center;gap:6px;border:1px solid #2c333d;border-radius:14px;
|
||||
padding:3px 10px 3px 7px;font-size:11px;color:#8b94a3;background:#1a1f26;cursor:help}
|
||||
|
||||
+13
-1
@@ -46,7 +46,7 @@ import {
|
||||
mainlineDescription,
|
||||
} from '../engine/content.ts';
|
||||
import type { Intent } from '../engine/intents.ts';
|
||||
import type { Facility, GameState, PlayerIndex, SeatIndex, TrackCard, TurnoutOrientation } from '../engine/state.ts';
|
||||
import type { Facility, GameConfig, GameState, PlayerIndex, SeatIndex, TrackCard, TurnoutOrientation } from '../engine/state.ts';
|
||||
import { carsOn, playerAtSeat, railFacingOf, seatOf, turnOf } from '../engine/state.ts';
|
||||
import type { Hand, HouseRules, TrackGeometry } from '../engine/content.ts';
|
||||
import type { Port } from '../engine/track.ts';
|
||||
@@ -374,6 +374,16 @@ export type Frame = {
|
||||
* must be able to answer. Resolved, never partial, so nobody downstream re-applies defaults.
|
||||
*/
|
||||
houseRules: HouseRules;
|
||||
/**
|
||||
* WHICH GAME THIS IS — the mode it is scored under and Appendix B's three switches.
|
||||
*
|
||||
* Added 2026-08-23 with the game types (`web/presets.ts`). Everything else needed to name a game
|
||||
* "Co-op" or "Cutthroat" was already here; `mode` and `optionalRules` were the two missing pieces,
|
||||
* so a remote client could see the dials but not what they added up to — and a Cutthroat game
|
||||
* looked exactly like a Co-op one from the board.
|
||||
*/
|
||||
mode: GameConfig['mode'];
|
||||
optionalRules: GameConfig['optionalRules'];
|
||||
/**
|
||||
* The victory-condition dials this game was configured with (`GameConfig`, `state.ts`), plus the
|
||||
* running collision counts — same reasoning as `houseRules`: a remote client holds no `GameState`
|
||||
@@ -1313,6 +1323,8 @@ export function snapshot(
|
||||
wasted,
|
||||
option: turnOf(s, viewer).option,
|
||||
houseRules: houseRules(s.config),
|
||||
mode: s.config.mode,
|
||||
optionalRules: s.config.optionalRules,
|
||||
days: s.config.days,
|
||||
minCombinedRevenue: s.config.minCombinedRevenue,
|
||||
maxCollisionsPerDay: s.config.maxCollisionsPerDay,
|
||||
|
||||
+15
-1
@@ -121,6 +121,14 @@ export type NewGameOptions = {
|
||||
minCombinedRevenue?: number;
|
||||
maxCollisionsPerDay?: number;
|
||||
maxCollisionsTotal?: number;
|
||||
/**
|
||||
* Appendix B's three, added 2026-08-23 when the New Game dialog gained them.
|
||||
*
|
||||
* The lobby has offered these since v0.6.0 and the solitaire dialog could not, which meant a
|
||||
* solitaire game could never be played under Employee Rotation or the Emergency Toolbox at all.
|
||||
* Partial like `houseRules`: a caller names only what it is setting.
|
||||
*/
|
||||
optionalRules?: Partial<GameConfig['optionalRules']>;
|
||||
};
|
||||
|
||||
/** The same config with the New Game dialog's answers in it. */
|
||||
@@ -131,6 +139,7 @@ export function configWith(opts: NewGameOptions): GameConfig {
|
||||
minCombinedRevenue: opts.minCombinedRevenue ?? SOLO_CONFIG.minCombinedRevenue,
|
||||
maxCollisionsPerDay: opts.maxCollisionsPerDay ?? SOLO_CONFIG.maxCollisionsPerDay,
|
||||
maxCollisionsTotal: opts.maxCollisionsTotal ?? SOLO_CONFIG.maxCollisionsTotal,
|
||||
optionalRules: { ...SOLO_CONFIG.optionalRules, ...(opts.optionalRules ?? {}) },
|
||||
houseRules: houseRules(opts.houseRules ? { houseRules: opts.houseRules } : {}),
|
||||
};
|
||||
}
|
||||
@@ -1136,10 +1145,15 @@ function configFor(save: Save, config: GameConfig): GameConfig {
|
||||
*
|
||||
* Returns null when there is nothing to undo, so the caller can leave the button disabled.
|
||||
*/
|
||||
export function undo(game: Game, config: GameConfig = SOLO_CONFIG): Game | null {
|
||||
export function undo(game: Game, config: GameConfig = game.state.config): Game | null {
|
||||
if (game.history.length === 0) return null;
|
||||
// `toSave` first, so the rules this game was dealt under come with it. Rebuilding the save by hand
|
||||
// here dropped them, and undo re-dealt the game under the defaults instead of its own settings.
|
||||
//
|
||||
// THE VICTORY DIALS COME FROM THE GAME ITSELF for the same reason (2026-08-23). `Save` carries only
|
||||
// the house rules, so defaulting this parameter to `SOLO_CONFIG` meant undoing a game dealt over
|
||||
// eight Days replayed it as a five-Day game — the length, the Revenue floor and both collision
|
||||
// caps all quietly reverting to the defaults.
|
||||
return fromSave({ ...toSave(game), history: game.history.slice(0, -1) }, config);
|
||||
}
|
||||
|
||||
|
||||
+519
-135
@@ -1,10 +1,22 @@
|
||||
/**
|
||||
* The lobby screen — Phase 4 of `docs/architecture/multiplayer.md` (§12 steps 17-20).
|
||||
* The lobby screen — Phase 4 of `docs/architecture/multiplayer.md` (§12 steps 17-20), rebuilt
|
||||
* 2026-08-23 (Jesse's cleanup pass).
|
||||
*
|
||||
* Everything in `#lobby` (`play.html`) is owned here: the join-secret gate, creating or joining a
|
||||
* game by code, and the seating screen up to `Lobby.Start`. `main.ts` calls `runLobby` once, at
|
||||
* `start()`, only when there is no stored session to reconnect with — see `main.ts`'s own comment
|
||||
* on why a stored `{token, gameId, seat}` skips this module entirely.
|
||||
* Everything in `#lobby` (`play.html`) is owned here: the join-secret gate, the two doors (join a
|
||||
* game, create one), the read-only preview a player reads BEFORE taking a seat, and the seating
|
||||
* screen up to `Lobby.Start`.
|
||||
*
|
||||
* WHAT CHANGED, and why each one was worth changing:
|
||||
* - JOINING CAME FIRST. It used to be a heading below the whole create form — fifteen fields a
|
||||
* player who was handed a code has no use for.
|
||||
* - A SEAT SURVIVES A RELOAD. The token was held in a closure and only written to `localStorage`
|
||||
* at `Lobby.Start`, so a refresh before the host started orphaned the chair: the player could
|
||||
* not get back and the seat could not be freed. `onSeated` hands it to `main.ts` immediately.
|
||||
* - THERE IS A WAY OUT. `/api/lobby/leave` frees a seat, so a mis-join or a player who wanders off
|
||||
* no longer wedges a table that cannot start until every chair is taken.
|
||||
* - THE STREAM CAN FAIL OUT LOUD. `onmessage` was the only handler; a dropped connection left the
|
||||
* seating screen frozen and silent.
|
||||
* - THE RULES ARE VISIBLE TO EVERYONE, not just the host who typed them.
|
||||
*
|
||||
* MIRRORS SERVER TYPES RATHER THAN IMPORTING THEM, same choice `web/session.ts` already made for
|
||||
* `Push`: this file must never depend on anything under `src/server/`, even at the type level, since
|
||||
@@ -12,12 +24,36 @@
|
||||
*/
|
||||
|
||||
import type { GameConfig, PlayerIndex } from '../engine/state.ts';
|
||||
import { defaultMultiplayerConfig } from './game.ts';
|
||||
import { STARTING_HAND_LABELS, houseRules } from '../engine/content.ts';
|
||||
import type { StartingHand } from '../engine/content.ts';
|
||||
import {
|
||||
closestPreset,
|
||||
configFromSettings,
|
||||
gameTypeLabel,
|
||||
preset,
|
||||
presetSettings,
|
||||
} from './presets.ts';
|
||||
import type { GameType, PresetName } from './presets.ts';
|
||||
import { rulesListHtml, settingsForm } from './settings-form.ts';
|
||||
import { seatLabel } from '../sim/view.ts';
|
||||
|
||||
export type LobbyReady = { token: string; gameId: string; seat: PlayerIndex };
|
||||
export type LobbyReady = { token: string; gameId: string; seat: PlayerIndex; gameCode: string };
|
||||
|
||||
/** What the page must do with a seat this screen takes or gives up. `main.ts` owns the storage; this
|
||||
* module owns the moments. */
|
||||
export type LobbyHandlers = {
|
||||
/** The game has begun — tear this screen down and build a `RemoteSession`. Called at most once. */
|
||||
onReady: (r: LobbyReady) => void;
|
||||
/** A seat is now held. Called before the game starts, so a reload can come back to it. */
|
||||
onSeated: (s: { token: string; gameId: string; gameCode: string }) => void;
|
||||
/** The seat is gone — left, removed, or the lobby closed under us. Forget the stored record. */
|
||||
onLeft: (gameId?: string) => void;
|
||||
/** Every game this browser still holds a seat in — the page owns the storage, this screen only
|
||||
* draws it. */
|
||||
known?: () => { gameId: string; gameCode: string; stage: 'lobby' | 'game' }[];
|
||||
/** Re-enter one of them. */
|
||||
rejoin?: (gameId: string) => void;
|
||||
/** Give one up for good: the token is the only proof of identity, so this cannot be undone. */
|
||||
forget?: (gameId: string) => void;
|
||||
};
|
||||
|
||||
type LobbySeat = { kind: 'human'; token: string; displayName: string } | { kind: 'bot' } | null;
|
||||
type Lobby = {
|
||||
@@ -30,12 +66,46 @@ type Lobby = {
|
||||
createdAt: number;
|
||||
};
|
||||
type LobbyPush = { lobby: Lobby; you: PlayerIndex; started: boolean };
|
||||
type Preview = {
|
||||
gameCode: string;
|
||||
hostName: string;
|
||||
config: GameConfig;
|
||||
players: number;
|
||||
seated: { seat: number; who: string | null; bot: boolean }[];
|
||||
};
|
||||
|
||||
/** Per-origin, same reasoning `lobby-and-sessions.md` §1 gives for the session token itself — a
|
||||
* secret typed at one address means nothing at another. */
|
||||
const SECRET_KEY = 'stationmaster-joinsecret';
|
||||
/** The name is not a credential; it is remembered for the same reason the secret is — nobody should
|
||||
* retype what they typed last time. */
|
||||
const NAME_KEY = 'stationmaster-displayname';
|
||||
|
||||
const $ = <T extends HTMLElement = HTMLElement>(id: string): T => document.getElementById(id) as T;
|
||||
const has = (id: string): boolean => document.getElementById(id) !== null;
|
||||
|
||||
/**
|
||||
* A server code turned into a sentence.
|
||||
*
|
||||
* `LOBBY_FULL` and `BAD_PLAYER_COUNT` used to be printed at the player exactly as the server said
|
||||
* them. The codes are the server's vocabulary, not the table's.
|
||||
*/
|
||||
function explain(code: unknown, fallback: string): string {
|
||||
const messages: Record<string, string> = {
|
||||
LOBBY_FULL: 'That table is already full — every chair is taken.',
|
||||
ALREADY_STARTED: 'That game has already started.',
|
||||
BAD_PLAYER_COUNT: 'That table size cannot start a game — 2 to 4 players.',
|
||||
NOT_HOST: 'Only the host can do that.',
|
||||
NAME_TAKEN: 'Somebody at that table is already using that name — pick another.',
|
||||
'bad or missing secret': 'That join secret was not accepted by this server.',
|
||||
// What a lobby answers once it has become a GAME — most often seen by a host pressing Start
|
||||
// twice, and by a tab left open on a lobby that started somewhere else.
|
||||
'no such lobby': 'That game is no longer waiting to start — it has either begun or been closed.',
|
||||
'no open lobby with that code': 'No game is waiting under that code. Check it, or ask for a new one — a game that has already started cannot be joined.',
|
||||
};
|
||||
const key = typeof code === 'string' ? code : '';
|
||||
return messages[key] ?? (key !== '' ? key : fallback);
|
||||
}
|
||||
|
||||
async function postJson(path: string, body: unknown): Promise<{ status: number; body: Record<string, unknown> }> {
|
||||
const res = await fetch(path, {
|
||||
@@ -46,21 +116,73 @@ async function postJson(path: string, body: unknown): Promise<{ status: number;
|
||||
return { status: res.status, body: (await res.json()) as Record<string, unknown> };
|
||||
}
|
||||
|
||||
async function getJson(path: string): Promise<{ status: number; body: Record<string, unknown> }> {
|
||||
const res = await fetch(path);
|
||||
return { status: res.status, body: (await res.json().catch(() => ({}))) as Record<string, unknown> };
|
||||
}
|
||||
|
||||
/**
|
||||
* Shows `#lobby`, drives it through creating or joining a game and then seating, and calls
|
||||
* `onReady` exactly once — the instant `Lobby.Start` fires, from WHICHEVER browser tab started it.
|
||||
* Never calls back more than once; the caller is expected to tear this screen down (`main.ts` hides
|
||||
* `#lobby` and shows `#gameui`) as its very first action inside `onReady`.
|
||||
* Shows `#lobby` and drives it. `resume` re-enters the seating screen for a browser that already
|
||||
* holds a seat (a reload before the host started) rather than starting at the doors.
|
||||
*/
|
||||
export function runLobby(onReady: (r: LobbyReady) => void): void {
|
||||
export function runLobby(handlers: LobbyHandlers, resume?: { token: string; gameId: string; gameCode: string }): void {
|
||||
// Nothing below exists on a page that is not `play.html` — and `main.ts` is imported by tests that
|
||||
// stub only part of the DOM. Bail rather than throwing through the module's caller.
|
||||
if (!has('lobby') || !has('lb-choice-section')) return;
|
||||
$('lobby').hidden = false;
|
||||
$<HTMLInputElement>('lb-secret').value = localStorage.getItem(SECRET_KEY) ?? '';
|
||||
|
||||
const form = settingsForm('lb-');
|
||||
let source: EventSource | null = null;
|
||||
let done = false;
|
||||
|
||||
function setError(id: string, message: string): void {
|
||||
$(id).textContent = message;
|
||||
/**
|
||||
* THE GAMES THIS BROWSER IS ALREADY IN.
|
||||
*
|
||||
* Rejoining is what the stored token is FOR, and until now the only thing that ever used one was a
|
||||
* bare page load — so a player who left a game, or who joined a second, had no way to get back to
|
||||
* the first. Drawn from the page's own storage (`main.ts`), never from this module.
|
||||
*/
|
||||
function renderKnown(): void {
|
||||
if (!has('lb-known')) return;
|
||||
const games = handlers.known?.() ?? [];
|
||||
$('lb-known').hidden = games.length === 0;
|
||||
if (games.length === 0) return;
|
||||
$('lb-known-list').innerHTML = games
|
||||
.map(
|
||||
(g) =>
|
||||
`<div class="lb-known-row"><span class="code">${escapeHtml(g.gameCode || g.gameId.slice(0, 8))}</span>` +
|
||||
`<span class="dim">${g.stage === 'lobby' ? 'waiting to start' : 'in play'}</span>` +
|
||||
`<button class="lb-rejoin" data-game="${escapeHtml(g.gameId)}">Rejoin</button>` +
|
||||
`<button class="lb-forget ghost" data-game="${escapeHtml(g.gameId)}">Forget</button></div>`,
|
||||
)
|
||||
.join('');
|
||||
for (const btn of Array.from($('lb-known-list').querySelectorAll<HTMLButtonElement>('.lb-rejoin'))) {
|
||||
btn.onclick = () => handlers.rejoin?.(btn.dataset['game'] ?? '');
|
||||
}
|
||||
for (const btn of Array.from($('lb-known-list').querySelectorAll<HTMLButtonElement>('.lb-forget'))) {
|
||||
btn.onclick = () => {
|
||||
// Confirmed, because it is not recoverable from this browser: the token IS the identity
|
||||
// (`lobby-and-sessions.md` §1), and nothing else on this server will accept a claim to that
|
||||
// seat.
|
||||
const code = btn.previousElementSibling?.previousElementSibling?.textContent ?? 'that game';
|
||||
if (!confirm(`Forget ${code}? This browser will not be able to rejoin it — your seat stays in the game, and only whoever runs the server could let you back in.`)) return;
|
||||
handlers.forget?.(btn.dataset['game'] ?? '');
|
||||
renderKnown();
|
||||
};
|
||||
}
|
||||
}
|
||||
renderKnown();
|
||||
|
||||
// -- the join secret ------------------------------------------------------------------------
|
||||
|
||||
function showSecret(saved: boolean): void {
|
||||
$('lb-secret-saved').hidden = !saved;
|
||||
$('lb-secret-ask').hidden = saved;
|
||||
}
|
||||
const storedSecret = localStorage.getItem(SECRET_KEY) ?? '';
|
||||
$<HTMLInputElement>('lb-secret').value = storedSecret;
|
||||
showSecret(storedSecret !== '');
|
||||
$<HTMLButtonElement>('lb-secret-change').onclick = () => showSecret(false);
|
||||
|
||||
function secret(): string {
|
||||
const value = $<HTMLInputElement>('lb-secret').value;
|
||||
@@ -68,25 +190,248 @@ export function runLobby(onReady: (r: LobbyReady) => void): void {
|
||||
return value;
|
||||
}
|
||||
|
||||
/** A rejected secret re-opens the field it is about — the error used to appear a screen away from
|
||||
* the box that caused it. */
|
||||
function secretRejected(status: number): boolean {
|
||||
if (status !== 403) return false;
|
||||
showSecret(false);
|
||||
$<HTMLInputElement>('lb-secret').focus();
|
||||
return true;
|
||||
}
|
||||
|
||||
// -- display name ---------------------------------------------------------------------------
|
||||
|
||||
const nameField = $<HTMLInputElement>('lb-name');
|
||||
nameField.value = localStorage.getItem(NAME_KEY) ?? '';
|
||||
function displayName(): string {
|
||||
const value = nameField.value.trim();
|
||||
if (value !== '') localStorage.setItem(NAME_KEY, value);
|
||||
return value;
|
||||
}
|
||||
|
||||
// -- the two doors --------------------------------------------------------------------------
|
||||
|
||||
function door(which: 'join' | 'create'): void {
|
||||
$('lb-join-panel').hidden = which !== 'join';
|
||||
$('lb-create-panel').hidden = which !== 'create';
|
||||
$('lb-door-join').classList.toggle('active', which === 'join');
|
||||
$('lb-door-create').classList.toggle('active', which === 'create');
|
||||
}
|
||||
$<HTMLButtonElement>('lb-door-join').onclick = () => door('join');
|
||||
$<HTMLButtonElement>('lb-door-create').onclick = () => door('create');
|
||||
|
||||
// -- the create form ------------------------------------------------------------------------
|
||||
|
||||
/** The named type the form is currently measured against — and, for a Custom game, the type it is
|
||||
* scored as. Custom is only ever reached FROM one of these, so there is always an answer. */
|
||||
let base: PresetName = 'coop';
|
||||
let type: GameType = 'coop';
|
||||
/** Once the host types a Revenue floor it is theirs; players and days stop re-deriving it. */
|
||||
let floorTyped = false;
|
||||
|
||||
const players = (): number => Number($<HTMLSelectElement>('lb-players').value) || 4;
|
||||
const days = (): number => {
|
||||
const raw = Number($<HTMLInputElement>('lb-days').value);
|
||||
return Number.isFinite(raw) && raw >= 1 ? Math.round(raw) : 5;
|
||||
};
|
||||
|
||||
function typeRadios(): HTMLInputElement[] {
|
||||
return Array.from(document.querySelectorAll<HTMLInputElement>('input[name="lb-type"]'));
|
||||
}
|
||||
|
||||
/** Reset every rule to a named type. Seed, players and days are parameters, and are left alone. */
|
||||
function selectPreset(name: PresetName): void {
|
||||
base = name;
|
||||
type = name;
|
||||
floorTyped = false;
|
||||
const values = presetSettings(name, players(), days());
|
||||
form.write(values, values);
|
||||
form.setEmployeeRotationAvailable(true);
|
||||
refresh();
|
||||
}
|
||||
|
||||
function refresh(): void {
|
||||
const differing = form.mark(base, players(), days());
|
||||
if (differing.length > 0) type = 'custom';
|
||||
else if (type === 'custom') type = base;
|
||||
for (const r of typeRadios()) r.checked = r.value === type;
|
||||
|
||||
const scoring = preset(base).scoring;
|
||||
const note = $('lb-type-note');
|
||||
if (type === 'custom') {
|
||||
note.textContent =
|
||||
`${gameTypeLabel('custom', scoring)} · ${differing.length} ` +
|
||||
`${differing.length === 1 ? 'setting differs' : 'settings differ'} from ${preset(base).label}.`;
|
||||
note.className = 'ng-note changed-note';
|
||||
// A Custom game is nobody's default: open the block that says how it differs.
|
||||
$<HTMLDetailsElement>('lb-settings').open = true;
|
||||
} else {
|
||||
note.textContent = preset(type as PresetName).blurb;
|
||||
note.className = 'ng-note';
|
||||
}
|
||||
}
|
||||
|
||||
for (const r of typeRadios()) {
|
||||
// Solitaire is on this screen so the two screens read as one list, but there is nothing here to
|
||||
// deal it with — the New Game dialog is where a solitaire game comes from.
|
||||
if (r.value === 'solitaire') markUnavailable(r, 'dealt with the New game button, not here');
|
||||
r.onchange = () => {
|
||||
if (!r.checked) return;
|
||||
if (r.value === 'custom') {
|
||||
// Clicking Custom keeps everything as it stands, and keeps the scoring of the type it came
|
||||
// from (Jesse, 2026-08-23) — it is only ever reached from one of the named types.
|
||||
type = 'custom';
|
||||
refresh();
|
||||
return;
|
||||
}
|
||||
selectPreset(r.value as PresetName);
|
||||
};
|
||||
}
|
||||
|
||||
form.onEdit((key) => {
|
||||
// The floor is derived until somebody sets it; ticking the condition off counts as setting it.
|
||||
if (key === 'minCombinedRevenue') floorTyped = true;
|
||||
type = 'custom';
|
||||
refresh();
|
||||
});
|
||||
|
||||
/** Players and days are parameters, not settings: they re-derive the floor and never make a game
|
||||
* Custom by themselves. */
|
||||
function paramsChanged(): void {
|
||||
if (!floorTyped) {
|
||||
const values = form.read();
|
||||
const want = presetSettings(base, players(), days());
|
||||
form.write({ ...values, minCombinedRevenue: want.minCombinedRevenue }, want);
|
||||
}
|
||||
refresh();
|
||||
}
|
||||
$<HTMLSelectElement>('lb-players').onchange = paramsChanged;
|
||||
$<HTMLInputElement>('lb-days').oninput = paramsChanged;
|
||||
|
||||
selectPreset('coop');
|
||||
door('join');
|
||||
|
||||
// -- creating -------------------------------------------------------------------------------
|
||||
|
||||
$<HTMLButtonElement>('lb-create').onclick = () => {
|
||||
const name = displayName();
|
||||
if (name === '') {
|
||||
$('lb-create-err').textContent = 'Enter a display name first.';
|
||||
return;
|
||||
}
|
||||
const asked = $<HTMLInputElement>('lb-seed').value.trim();
|
||||
// Blank or unparseable both mean "surprise me", which is what leaving the box alone asks for.
|
||||
const seed = asked === '' || !Number.isFinite(Number(asked)) ? null : Math.trunc(Number(asked));
|
||||
const config = configFromSettings(form.read(), preset(base).scoring, days(), preset(base).pvpCards);
|
||||
|
||||
$('lb-create-err').textContent = '';
|
||||
void postJson('/api/lobby/create', {
|
||||
secret: secret(),
|
||||
config,
|
||||
displayName: name,
|
||||
players: players(),
|
||||
seed,
|
||||
}).then(({ status, body }) => {
|
||||
if (status !== 200) {
|
||||
secretRejected(status);
|
||||
$('lb-create-err').textContent = explain(body['error'], 'Could not create the game.');
|
||||
return;
|
||||
}
|
||||
enterSeating(body['gameId'] as string, body['token'] as string, body['gameCode'] as string);
|
||||
});
|
||||
};
|
||||
|
||||
// -- joining --------------------------------------------------------------------------------
|
||||
|
||||
let previewed: Preview | null = null;
|
||||
|
||||
function showPreview(p: Preview): void {
|
||||
previewed = p;
|
||||
$('lb-preview').hidden = false;
|
||||
$('lb-preview-code').textContent = p.gameCode;
|
||||
const near = closestPreset(p.config, p.players, p.config.days);
|
||||
const label = gameTypeLabel(
|
||||
near.differing.length === 0 ? near.name : 'custom',
|
||||
p.config.mode,
|
||||
);
|
||||
$('lb-preview-type').textContent =
|
||||
near.differing.length === 0
|
||||
? label
|
||||
: `${label} · ${near.differing.length} ${near.differing.length === 1 ? 'setting differs' : 'settings differ'} from ${preset(near.name).label}`;
|
||||
const taken = p.seated.filter((s) => s.who !== null || s.bot).length;
|
||||
const names = p.seated
|
||||
.map((s) => (s.bot ? 'a bot' : (s.who ?? 'empty')))
|
||||
.join(', ');
|
||||
$('lb-preview-who').textContent = `Host: ${p.hostName} · ${taken} of ${p.players} seats taken — ${names}`;
|
||||
$('lb-preview-rules').innerHTML = rulesListHtml(p.config, p.players, p.config.days);
|
||||
}
|
||||
|
||||
$<HTMLButtonElement>('lb-look').onclick = () => {
|
||||
const code = $<HTMLInputElement>('lb-code').value.trim().toUpperCase();
|
||||
$('lb-preview').hidden = true;
|
||||
if (code === '') {
|
||||
$('lb-join-err').textContent = 'Enter the game code you were given.';
|
||||
return;
|
||||
}
|
||||
$('lb-join-err').textContent = '';
|
||||
void getJson(
|
||||
`/api/lobby/preview?gameCode=${encodeURIComponent(code)}&secret=${encodeURIComponent(secret())}`,
|
||||
).then(({ status, body }) => {
|
||||
if (status !== 200) {
|
||||
secretRejected(status);
|
||||
$('lb-join-err').textContent = explain(body['error'], 'Could not look up that game.');
|
||||
return;
|
||||
}
|
||||
showPreview(body as unknown as Preview);
|
||||
});
|
||||
};
|
||||
|
||||
$<HTMLButtonElement>('lb-join').onclick = () => {
|
||||
const name = displayName();
|
||||
const code = previewed?.gameCode ?? $<HTMLInputElement>('lb-code').value.trim().toUpperCase();
|
||||
if (name === '') {
|
||||
$('lb-join-err').textContent = 'Enter a display name first.';
|
||||
return;
|
||||
}
|
||||
$('lb-join-err').textContent = '';
|
||||
void postJson('/api/lobby/join', { secret: secret(), gameCode: code, displayName: name }).then(
|
||||
({ status, body }) => {
|
||||
if (status !== 200) {
|
||||
secretRejected(status);
|
||||
$('lb-join-err').textContent = explain(body['error'], 'Could not join that game.');
|
||||
return;
|
||||
}
|
||||
enterSeating(body['gameId'] as string, body['token'] as string, code);
|
||||
},
|
||||
);
|
||||
};
|
||||
|
||||
// -- seating --------------------------------------------------------------------------------
|
||||
|
||||
function renderSeating(lobby: Lobby, you: PlayerIndex, token: string): void {
|
||||
$('lb-gamecode').textContent = lobby.gameCode;
|
||||
const isHost = lobby.hostToken === token;
|
||||
|
||||
let html = '';
|
||||
// Bots are numbered here exactly as `startLobby` numbers them at the moment the game starts, so
|
||||
// the table you set up is the table that appears on the board.
|
||||
let botNumber = 0;
|
||||
for (let seat = 0; seat < lobby.seats.length; seat++) {
|
||||
const occupant = lobby.seats[seat] ?? null;
|
||||
const isYou = occupant?.kind === 'human' && occupant.token === token;
|
||||
const isSeatHost = occupant?.kind === 'human' && occupant.token === lobby.hostToken;
|
||||
if (occupant?.kind === 'bot') botNumber++;
|
||||
const who =
|
||||
occupant === null
|
||||
? '<span class="dim">— waiting —</span>'
|
||||
: occupant.kind === 'bot'
|
||||
? 'Bot'
|
||||
: `${occupant.displayName}${isYou ? ' (you)' : ''}${isSeatHost ? ' — host' : ''}`;
|
||||
? `Bot ${botNumber}`
|
||||
: `${escapeHtml(occupant.displayName)}${isYou ? ' (you)' : ''}${isSeatHost ? ' — host' : ''}`;
|
||||
let action = '';
|
||||
if (isHost) {
|
||||
if (occupant === null) action = `<button class="lb-bot-add" data-seat="${seat}">+ bot</button>`;
|
||||
else if (occupant.kind === 'bot') action = `<button class="lb-bot-remove" data-seat="${seat}">remove bot</button>`;
|
||||
else if (!isYou) action = `<button class="lb-kick" data-seat="${seat}">remove</button>`;
|
||||
}
|
||||
html += `<div class="lb-seat"><span class="dim">Seat ${seatLabel(seat)}</span><span class="who">${who}</span>${action}</div>`;
|
||||
}
|
||||
@@ -94,21 +439,30 @@ export function runLobby(onReady: (r: LobbyReady) => void): void {
|
||||
|
||||
/**
|
||||
* The code is the whole invitation, so it has to leave this screen by some route other than
|
||||
* being read off it and retyped. `navigator.clipboard` is unavailable on an insecure origin
|
||||
* and can be refused outright, so a failure says the code is there to be selected rather than
|
||||
* silently doing nothing.
|
||||
* being read off it and retyped. Two buttons because they are two different acts: the CODE is
|
||||
* what you read aloud on a call and works at whatever address each player reaches the box by;
|
||||
* the LINK is what you paste into a chat, and only works for someone who can reach this address.
|
||||
* Neither carries the join secret — that is the door key, and it travels out of band.
|
||||
*
|
||||
* `navigator.clipboard` is unavailable on an insecure origin and can be refused outright, so a
|
||||
* failure says the code is there to be selected rather than silently doing nothing.
|
||||
*/
|
||||
const copyBtn = $<HTMLButtonElement>('lb-copy');
|
||||
copyBtn.onclick = () => {
|
||||
const say = (m: string): void => {
|
||||
$('lb-copied').textContent = m;
|
||||
setTimeout(() => ($('lb-copied').textContent = ''), 4000);
|
||||
};
|
||||
const say = (m: string): void => {
|
||||
$('lb-copied').textContent = m;
|
||||
setTimeout(() => ($('lb-copied').textContent = ''), 4000);
|
||||
};
|
||||
const copy = (text: string, ok: string): void => {
|
||||
void navigator.clipboard
|
||||
?.writeText(lobby.gameCode)
|
||||
.then(() => say('Copied.'))
|
||||
?.writeText(text)
|
||||
.then(() => say(ok))
|
||||
.catch(() => say('Could not copy — select the code above instead.'));
|
||||
};
|
||||
$<HTMLButtonElement>('lb-copy').onclick = () => copy(lobby.gameCode, 'Code copied.');
|
||||
$<HTMLButtonElement>('lb-copylink').onclick = () =>
|
||||
copy(
|
||||
`${location.origin}${location.pathname}?lobby&code=${encodeURIComponent(lobby.gameCode)}`,
|
||||
'Invite link copied — the join secret is not in it.',
|
||||
);
|
||||
|
||||
for (const btn of Array.from($('lb-seats').querySelectorAll<HTMLButtonElement>('.lb-bot-add'))) {
|
||||
btn.onclick = () => void postJson('/api/lobby/bot', { token, seat: Number(btn.dataset['seat']), filled: true });
|
||||
@@ -116,135 +470,165 @@ export function runLobby(onReady: (r: LobbyReady) => void): void {
|
||||
for (const btn of Array.from($('lb-seats').querySelectorAll<HTMLButtonElement>('.lb-bot-remove'))) {
|
||||
btn.onclick = () => void postJson('/api/lobby/bot', { token, seat: Number(btn.dataset['seat']), filled: false });
|
||||
}
|
||||
for (const btn of Array.from($('lb-seats').querySelectorAll<HTMLButtonElement>('.lb-kick'))) {
|
||||
btn.onclick = () => {
|
||||
void postJson('/api/lobby/leave', { token, seat: Number(btn.dataset['seat']) }).then(({ status, body }) => {
|
||||
if (status !== 200) $('lb-start-note').textContent = explain(body['error'], 'Could not clear that seat.');
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
// What everyone at the table is about to play — the host chose it, and until now nobody else
|
||||
// could see any of it.
|
||||
const near = closestPreset(lobby.config, lobby.seats.length, lobby.config.days);
|
||||
const label = gameTypeLabel(near.differing.length === 0 ? near.name : 'custom', lobby.config.mode);
|
||||
$('lb-seating-type').textContent =
|
||||
near.differing.length === 0
|
||||
? label
|
||||
: `${label} · ${near.differing.length} ${near.differing.length === 1 ? 'setting differs' : 'settings differ'} from ${preset(near.name).label}`;
|
||||
$('lb-seating-rules').innerHTML = rulesListHtml(lobby.config, lobby.seats.length, lobby.config.days);
|
||||
|
||||
const waiting = lobby.seats.filter((s) => s === null).length;
|
||||
const startBtn = $<HTMLButtonElement>('lb-start');
|
||||
startBtn.hidden = !isHost;
|
||||
startBtn.disabled = waiting > 0;
|
||||
$('lb-start-note').textContent = isHost
|
||||
? waiting === 0
|
||||
? ''
|
||||
: `Waiting on ${waiting} more ${waiting === 1 ? 'player' : 'players'} — add a bot to any empty chair to start now.`
|
||||
: 'Waiting for the host to start the game.';
|
||||
startBtn.textContent = 'Start game';
|
||||
$('lb-start-note').textContent = '';
|
||||
const waitNote = $('lb-stream-note');
|
||||
if (waitNote.dataset['reason'] !== 'stream') {
|
||||
waitNote.hidden = waiting === 0 && isHost;
|
||||
waitNote.textContent = isHost
|
||||
? waiting === 0
|
||||
? ''
|
||||
: `Waiting on ${waiting} more ${waiting === 1 ? 'player' : 'players'} — add a bot to any empty chair to start now.`
|
||||
: 'Waiting for the host to start the game.';
|
||||
waitNote.hidden = waitNote.textContent === '';
|
||||
}
|
||||
startBtn.onclick = () => {
|
||||
// No busy state used to mean a second press posted a second start, whose 409 landed on screen
|
||||
// as a raw code.
|
||||
startBtn.disabled = true;
|
||||
startBtn.textContent = 'Starting…';
|
||||
void postJson('/api/lobby/start', { token }).then(({ status, body }) => {
|
||||
if (status !== 200) setError('lb-start-note', String(body['error'] ?? 'could not start'));
|
||||
if (status !== 200) {
|
||||
startBtn.disabled = false;
|
||||
startBtn.textContent = 'Start game';
|
||||
$('lb-start-note').textContent = explain(body['error'], 'Could not start the game.');
|
||||
}
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
function enterSeating(gameId: string, token: string): void {
|
||||
function streamNote(message: string): void {
|
||||
const el = $('lb-stream-note');
|
||||
el.dataset['reason'] = message === '' ? '' : 'stream';
|
||||
el.textContent = message;
|
||||
el.hidden = message === '';
|
||||
}
|
||||
|
||||
function enterSeating(gameId: string, token: string, gameCode: string): void {
|
||||
handlers.onSeated({ token, gameId, gameCode });
|
||||
$('lb-choice-section').hidden = true;
|
||||
$('lb-seating-section').hidden = false;
|
||||
|
||||
$<HTMLButtonElement>('lb-leave').onclick = () => {
|
||||
void postJson('/api/lobby/leave', { token }).then(() => {
|
||||
source?.close();
|
||||
handlers.onLeft(gameId);
|
||||
$('lb-seating-section').hidden = true;
|
||||
$('lb-choice-section').hidden = false;
|
||||
renderKnown();
|
||||
notice('');
|
||||
});
|
||||
};
|
||||
|
||||
source = new EventSource(`/api/lobby/stream?token=${encodeURIComponent(token)}`);
|
||||
source.onmessage = (ev: MessageEvent<string>) => {
|
||||
streamNote('');
|
||||
const push = JSON.parse(ev.data) as LobbyPush;
|
||||
if (push.started) {
|
||||
source?.close();
|
||||
onReady({ token, gameId, seat: push.you });
|
||||
if (done) return;
|
||||
done = true;
|
||||
handlers.onReady({ token, gameId, seat: push.you, gameCode: push.lobby.gameCode });
|
||||
return;
|
||||
}
|
||||
renderSeating(push.lobby, push.you, token);
|
||||
};
|
||||
}
|
||||
|
||||
const chosenMode = (): 'competitive' | 'coop' =>
|
||||
($('lb-choice-section').querySelector<HTMLInputElement>('input[name="lb-mode"]:checked')?.value ??
|
||||
'competitive') as 'competitive' | 'coop';
|
||||
const chosenPlayers = (): number => Number($<HTMLSelectElement>('lb-players').value) || 4;
|
||||
const num = (id: string): number => Number($<HTMLInputElement>(id).value);
|
||||
|
||||
/**
|
||||
* Mode and table size only move the DEFAULTS, exactly as the solitaire dialog's own presets do —
|
||||
* every field stays editable afterwards, so "Co-op, 3 players" is a starting point rather than a
|
||||
* fixed ruleset. Re-running this on a change is also what keeps the combined-Revenue floor
|
||||
* honest: it is derived from the player count, and the count is a control on this form.
|
||||
*/
|
||||
function applyDefaults(): void {
|
||||
const c = defaultMultiplayerConfig(chosenMode(), chosenPlayers());
|
||||
const rules = houseRules(c);
|
||||
$<HTMLInputElement>('lb-days').value = String(c.days);
|
||||
$<HTMLInputElement>('lb-minrev').value = String(c.minCombinedRevenue);
|
||||
$<HTMLInputElement>('lb-colday').value = String(c.maxCollisionsPerDay);
|
||||
$<HTMLInputElement>('lb-coltotal').value = String(c.maxCollisionsTotal);
|
||||
$<HTMLInputElement>('lb-passenger').value = String(rules.revenue.passengerPerCoach);
|
||||
$<HTMLInputElement>('lb-freight').value = String(rules.revenue.freightPerLoad);
|
||||
$<HTMLInputElement>('lb-transit').value = String(rules.revenue.trainPerTransit);
|
||||
// Co-op has no valid target for the opponent-directed cards, so the toggle is forced off rather
|
||||
// than merely defaulted off — the same rule `buildDeck` applies.
|
||||
const pvp = $<HTMLInputElement>('lb-pvp');
|
||||
pvp.checked = c.pvpCardsAllowed;
|
||||
pvp.disabled = chosenMode() !== 'competitive';
|
||||
}
|
||||
for (const input of Array.from(
|
||||
$('lb-choice-section').querySelectorAll<HTMLInputElement>('input[name="lb-mode"]'),
|
||||
)) {
|
||||
input.onchange = applyDefaults;
|
||||
}
|
||||
$<HTMLSelectElement>('lb-players').onchange = applyDefaults;
|
||||
applyDefaults();
|
||||
|
||||
$<HTMLButtonElement>('lb-create').onclick = () => {
|
||||
const displayName = $<HTMLInputElement>('lb-name').value.trim();
|
||||
const mode = chosenMode();
|
||||
if (displayName === '') {
|
||||
setError('lb-create-err', 'enter a display name first');
|
||||
return;
|
||||
}
|
||||
const players = chosenPlayers();
|
||||
const hand = $('lb-settings').querySelector<HTMLInputElement>('input[name="lb-hand"]:checked')?.value;
|
||||
// Blank or unparseable both mean "surprise me", which is what leaving the box alone asks for.
|
||||
const asked = $<HTMLInputElement>('lb-seed').value.trim();
|
||||
const seed = asked === '' || !Number.isFinite(Number(asked)) ? null : Math.trunc(Number(asked));
|
||||
|
||||
const config: GameConfig = {
|
||||
...defaultMultiplayerConfig(mode, players),
|
||||
days: Math.max(1, Math.round(num('lb-days')) || 5),
|
||||
minCombinedRevenue: Math.max(0, Math.round(num('lb-minrev')) || 0),
|
||||
maxCollisionsPerDay: Math.max(0, Math.round(num('lb-colday')) || 0),
|
||||
maxCollisionsTotal: Math.max(0, Math.round(num('lb-coltotal')) || 0),
|
||||
pvpCardsAllowed: $<HTMLInputElement>('lb-pvp').checked && mode === 'competitive',
|
||||
optionalRules: {
|
||||
reducedVisibility: $<HTMLInputElement>('lb-visibility').checked,
|
||||
employeeRotation: $<HTMLInputElement>('lb-rotation').checked,
|
||||
emergencyToolbox: $<HTMLInputElement>('lb-toolbox').checked,
|
||||
},
|
||||
houseRules: {
|
||||
...(STARTING_HAND_LABELS.some((o) => o.value === hand) ? { startingHand: hand as StartingHand } : {}),
|
||||
revenue: {
|
||||
passengerPerCoach: num('lb-passenger'),
|
||||
freightPerLoad: num('lb-freight'),
|
||||
trainPerTransit: num('lb-transit'),
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
void postJson('/api/lobby/create', { secret: secret(), config, displayName, players, seed }).then(
|
||||
({ status, body }) => {
|
||||
if (status !== 200) {
|
||||
setError('lb-create-err', String(body['error'] ?? 'could not create the game'));
|
||||
/**
|
||||
* A DEAD LOBBY AND A BLIP LOOK IDENTICAL HERE, so ask — the same shape `session.ts` already uses
|
||||
* for the game stream, which the lobby never got.
|
||||
*
|
||||
* Three answers matter. The game may have STARTED while we were disconnected (the `started` push
|
||||
* is sent once and then the connection closes, so a drop at the wrong moment loses it) —
|
||||
* `/api/session` knows, and we go straight in. The lobby may still be there, in which case
|
||||
* `EventSource` is already retrying and the note is all that is needed. Or it is gone, and
|
||||
* sitting on a frozen seating screen is the one thing that must not happen.
|
||||
*/
|
||||
source.onerror = () => {
|
||||
if (done) return;
|
||||
streamNote('Connection lost — retrying. You can leave and rejoin if this does not clear.');
|
||||
void getJson(`/api/session?token=${encodeURIComponent(token)}`).then(({ status, body }) => {
|
||||
if (done) return;
|
||||
if (status === 200) {
|
||||
done = true;
|
||||
source?.close();
|
||||
handlers.onReady({ token, gameId, seat: body['player'] as PlayerIndex, gameCode });
|
||||
return;
|
||||
}
|
||||
setError('lb-create-err', '');
|
||||
enterSeating(body['gameId'] as string, body['token'] as string);
|
||||
},
|
||||
);
|
||||
};
|
||||
void getJson(
|
||||
`/api/lobby/preview?gameCode=${encodeURIComponent(gameCode)}&secret=${encodeURIComponent(secret())}`,
|
||||
).then(({ status: lobbyStatus }) => {
|
||||
if (done || lobbyStatus === 200) return;
|
||||
source?.close();
|
||||
handlers.onLeft(gameId);
|
||||
$('lb-seating-section').hidden = true;
|
||||
$('lb-choice-section').hidden = false;
|
||||
renderKnown();
|
||||
streamNote('');
|
||||
notice('That game is no longer waiting on this server — it was ended, or the last player left.');
|
||||
});
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
$<HTMLButtonElement>('lb-join').onclick = () => {
|
||||
const displayName = $<HTMLInputElement>('lb-name').value.trim();
|
||||
const gameCode = $<HTMLInputElement>('lb-code').value.trim();
|
||||
if (displayName === '' || gameCode === '') {
|
||||
setError('lb-join-err', 'enter a display name and a game code');
|
||||
return;
|
||||
}
|
||||
void postJson('/api/lobby/join', { secret: secret(), gameCode, displayName }).then(({ status, body }) => {
|
||||
if (status !== 200) {
|
||||
setError('lb-join-err', String(body['error'] ?? 'could not join that game'));
|
||||
return;
|
||||
}
|
||||
setError('lb-join-err', '');
|
||||
enterSeating(body['gameId'] as string, body['token'] as string);
|
||||
});
|
||||
};
|
||||
if (resume) enterSeating(resume.gameId, resume.token, resume.gameCode);
|
||||
}
|
||||
|
||||
/** The lobby-wide message slot: why you are looking at this screen, when it was not your own click. */
|
||||
export function notice(message: string): void {
|
||||
const el = document.getElementById('lb-notice');
|
||||
if (!el) return;
|
||||
el.textContent = message;
|
||||
el.hidden = message === '';
|
||||
}
|
||||
|
||||
/** Prefills the code from an invite link and opens the join door on it. */
|
||||
export function prefillCode(code: string): void {
|
||||
const field = document.getElementById('lb-code') as HTMLInputElement | null;
|
||||
if (field) field.value = code.toUpperCase();
|
||||
}
|
||||
|
||||
/**
|
||||
* A CHOICE THAT CANNOT BE TAKEN HAS TO SAY SO.
|
||||
*
|
||||
* Reported by Jesse 2026-08-23: "solitaire is disabled, but really hard to tell." A bare `disabled`
|
||||
* on a radio leaves the whole row at full strength — the dot simply refuses the click, which reads
|
||||
* as a broken control rather than an unavailable one. Dims the row and says why, once.
|
||||
*/
|
||||
function markUnavailable(radio: HTMLInputElement, why: string): void {
|
||||
radio.disabled = true;
|
||||
const row = radio.closest('label');
|
||||
if (!row) return;
|
||||
row.classList.add('disabled');
|
||||
if (row.querySelector('.lb-why')) return;
|
||||
const note = document.createElement('span');
|
||||
note.className = 'lb-why';
|
||||
note.textContent = ` — ${why}`;
|
||||
row.querySelector('span')?.appendChild(note);
|
||||
}
|
||||
|
||||
function escapeHtml(s: string): string {
|
||||
return s.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"');
|
||||
}
|
||||
|
||||
+537
-107
@@ -14,12 +14,9 @@ import { PANEL_CSS, blockedHtml, facilitiesHtml, pilesHtml, timetableHtml, yardH
|
||||
import { TOOLTIP_CSS, installTooltips } from './tooltip.ts';
|
||||
import { playCue } from './sound.ts';
|
||||
import {
|
||||
DEFAULT_MAX_COLLISIONS_PER_DAY,
|
||||
DEFAULT_MAX_COLLISIONS_TOTAL,
|
||||
MOVES_PER_LOCAL_OPS,
|
||||
EXTRA_START_LABELS,
|
||||
STARTING_HAND_LABELS,
|
||||
collectiveRevenueFloor,
|
||||
houseRules,
|
||||
} from '../engine/content.ts';
|
||||
import type { ExtraStartRule, HouseRuleOverrides, HouseRules, RevenueRules, StartingHand } from '../engine/content.ts';
|
||||
@@ -27,8 +24,19 @@ import type { NewGameOptions } from './game.ts';
|
||||
import type { LocalSession, Session } from './session.ts';
|
||||
import { createLocalSession, createRemoteSession } from './session.ts';
|
||||
import type { PlayerIndex } from '../engine/state.ts';
|
||||
import { runLobby } from './lobby.ts';
|
||||
import { notice, prefillCode, runLobby } from './lobby.ts';
|
||||
import type { LobbyReady } from './lobby.ts';
|
||||
import {
|
||||
closestPreset,
|
||||
configFromFrame,
|
||||
gameTypeLabel,
|
||||
preset,
|
||||
presetOf,
|
||||
presetSettings,
|
||||
settingsOf,
|
||||
} from './presets.ts';
|
||||
import type { GameType, PresetName } from './presets.ts';
|
||||
import { settingsForm } from './settings-form.ts';
|
||||
|
||||
const SAVE_KEY = 'station-master.save.v1';
|
||||
const SETTINGS_KEY = 'station-master.settings.v1';
|
||||
@@ -227,7 +235,11 @@ function piecePreview(links: string[], label: string): string {
|
||||
*/
|
||||
function renderTurnChart(f: Frame): void {
|
||||
const actorName = f.actor === null ? null : (f.players[f.actor]?.name ?? null);
|
||||
$('turnchart').innerHTML = turnChartHtml(f, actorName);
|
||||
// Named only at a table with more than one seat: in solitaire the Fedora is always yours, and a
|
||||
// chip that can never change is a chip to read past.
|
||||
const superName =
|
||||
f.players.length > 1 ? (f.players.find((p) => p.index === f.superintendent)?.name ?? null) : null;
|
||||
$('turnchart').innerHTML = turnChartHtml(f, actorName, superName);
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -271,6 +283,19 @@ const VICTORY_PARAMS = {
|
||||
coltotal: 'maxCollisionsTotal',
|
||||
} as const;
|
||||
|
||||
/**
|
||||
* Appendix B's three, in the URL like everything else the dialog asks (2026-08-23).
|
||||
*
|
||||
* The dialog navigates to a URL and `start()` reads the game back out of it, so a setting missing
|
||||
* from here is a setting the dialog silently discards — which is exactly what happened to these
|
||||
* three for as long as only the lobby offered them.
|
||||
*/
|
||||
const OPTIONAL_PARAMS = {
|
||||
vis: 'reducedVisibility',
|
||||
rot: 'employeeRotation',
|
||||
tool: 'emergencyToolbox',
|
||||
} as const;
|
||||
|
||||
function gameOptionsFromUrl(params: URLSearchParams): NewGameOptions {
|
||||
const rules: HouseRuleOverrides = {};
|
||||
const hand = params.get('hand');
|
||||
@@ -296,9 +321,52 @@ function gameOptionsFromUrl(params: URLSearchParams): NewGameOptions {
|
||||
options[key] = Math.max(0, Math.round(Number(raw)));
|
||||
}
|
||||
}
|
||||
const optional: Partial<NonNullable<NewGameOptions['optionalRules']>> = {};
|
||||
for (const [param, key] of Object.entries(OPTIONAL_PARAMS)) {
|
||||
const raw = params.get(param);
|
||||
// Present and not "0" means on: `?rot=1` and `?rot` alike, since a bare flag reads as ''.
|
||||
if (raw !== null) optional[key] = raw !== '0';
|
||||
}
|
||||
if (Object.keys(optional).length > 0) options.optionalRules = optional;
|
||||
return options;
|
||||
}
|
||||
|
||||
/**
|
||||
* THE SOLITAIRE GAME TYPE'S RULES, under whatever the URL actually named.
|
||||
*
|
||||
* `SOLO_CONFIG` is the ENGINE's fallback and stays where it is — every engine test and every sim run
|
||||
* is measured against it, and moving it would silently re-deal all of them. What a PLAYER is dealt
|
||||
* when they open the page is a different question, and its answer is the Solitaire game type
|
||||
* (`presets.ts`) — which since 2026-08-23 opens with six cards, like every other type, so that the
|
||||
* New Game dialog and the lobby agree about what "Solitaire" means.
|
||||
*/
|
||||
function solitaireDefaults(options: NewGameOptions): NewGameOptions {
|
||||
const days = options.days ?? 5;
|
||||
const p = presetSettings('solitaire', 1, days);
|
||||
const revenue = options.houseRules?.revenue ?? {};
|
||||
return {
|
||||
days,
|
||||
minCombinedRevenue: options.minCombinedRevenue ?? p.minCombinedRevenue,
|
||||
maxCollisionsPerDay: options.maxCollisionsPerDay ?? p.maxCollisionsPerDay,
|
||||
maxCollisionsTotal: options.maxCollisionsTotal ?? p.maxCollisionsTotal,
|
||||
optionalRules: {
|
||||
reducedVisibility: options.optionalRules?.reducedVisibility ?? p.reducedVisibility,
|
||||
// One player, so there is nobody to rotate with whatever a hand-edited URL says.
|
||||
employeeRotation: false,
|
||||
emergencyToolbox: options.optionalRules?.emergencyToolbox ?? p.emergencyToolbox,
|
||||
},
|
||||
houseRules: {
|
||||
startingHand: options.houseRules?.startingHand ?? p.startingHand,
|
||||
extraStart: options.houseRules?.extraStart ?? p.extraStart,
|
||||
revenue: {
|
||||
passengerPerCoach: revenue.passengerPerCoach ?? p.passengerPerCoach,
|
||||
freightPerLoad: revenue.freightPerLoad ?? p.freightPerLoad,
|
||||
trainPerTransit: revenue.trainPerTransit ?? p.trainPerTransit,
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
function rulesToUrl(rules: HouseRules, options: NewGameOptions, seed: string): string {
|
||||
const params = new URLSearchParams();
|
||||
if (seed !== '') params.set('seed', seed);
|
||||
@@ -311,18 +379,212 @@ function rulesToUrl(rules: HouseRules, options: NewGameOptions, seed: string): s
|
||||
const value = options[key];
|
||||
if (value !== undefined) params.set(param, String(value));
|
||||
}
|
||||
for (const [param, key] of Object.entries(OPTIONAL_PARAMS)) {
|
||||
// Only the ones that are ON: a URL that spells out three `=0`s says nothing extra and is three
|
||||
// parameters longer.
|
||||
if (options.optionalRules?.[key] === true) params.set(param, '1');
|
||||
}
|
||||
return `?${params}`;
|
||||
}
|
||||
|
||||
function loadRemote(): LobbyReady | null {
|
||||
/**
|
||||
* WHAT THIS BROWSER REMEMBERS ABOUT A MULTIPLAYER GAME, and when.
|
||||
*
|
||||
* It used to be written only at `Lobby.Start`, which meant a refresh while SEATED — before the host
|
||||
* started — orphaned the chair: the token existed nowhere else, so the player could not return and
|
||||
* the seat could not be freed, and a table that needs every chair filled could no longer start.
|
||||
* The record is written the moment a seat is taken, and `stage` says how far it got.
|
||||
*/
|
||||
type RemoteRecord = {
|
||||
token: string;
|
||||
gameId: string;
|
||||
gameCode: string;
|
||||
/** Only known once the game exists; a lobby-stage record has no seat yet. */
|
||||
seat?: PlayerIndex;
|
||||
stage: 'lobby' | 'game';
|
||||
};
|
||||
|
||||
/**
|
||||
* EVERY multiplayer game this browser holds a seat in, and which was last played.
|
||||
*
|
||||
* It used to be ONE record under one key, so joining a second game overwrote the first — and since
|
||||
* the token IS the identity (`lobby-and-sessions.md` §1), that seat was then locked out for good.
|
||||
* `TODO.md` had it as "a second, nearer limit" under the lost-token item; Jesse hit it from the
|
||||
* other side, asking how to leave a game and play a different one later.
|
||||
*/
|
||||
type RemoteStore = { games: Record<string, RemoteRecord>; last: string | null };
|
||||
|
||||
function readStore(): RemoteStore {
|
||||
try {
|
||||
const raw = localStorage.getItem(REMOTE_KEY);
|
||||
return raw ? (JSON.parse(raw) as LobbyReady) : null;
|
||||
if (!raw) return { games: {}, last: null };
|
||||
const parsed = JSON.parse(raw) as Partial<RemoteStore> & Partial<RemoteRecord>;
|
||||
// The single-record shape written before 2026-08-23 — carried across rather than dropped, so an
|
||||
// update does not throw away the game somebody is in the middle of.
|
||||
if (typeof parsed.token === 'string' && typeof parsed.gameId === 'string') {
|
||||
const one: RemoteRecord = {
|
||||
token: parsed.token,
|
||||
gameId: parsed.gameId,
|
||||
gameCode: parsed.gameCode ?? '',
|
||||
...(parsed.seat === undefined ? {} : { seat: parsed.seat }),
|
||||
stage: parsed.stage ?? 'game',
|
||||
};
|
||||
return { games: { [one.gameId]: one }, last: one.gameId };
|
||||
}
|
||||
const games = parsed.games ?? {};
|
||||
return { games, last: parsed.last ?? null };
|
||||
} catch {
|
||||
return null;
|
||||
return { games: {}, last: null };
|
||||
}
|
||||
}
|
||||
|
||||
function writeStore(store: RemoteStore): void {
|
||||
try {
|
||||
localStorage.setItem(REMOTE_KEY, JSON.stringify(store));
|
||||
} catch {
|
||||
// A full or disabled localStorage must not take the game down with it — the session in memory
|
||||
// keeps working, it simply will not survive a reload.
|
||||
}
|
||||
}
|
||||
|
||||
/** The game to re-enter on a bare page load: the one most recently played. */
|
||||
function loadRemote(): RemoteRecord | null {
|
||||
const store = readStore();
|
||||
return store.last === null ? null : (store.games[store.last] ?? null);
|
||||
}
|
||||
|
||||
function saveRemote(record: RemoteRecord): void {
|
||||
const store = readStore();
|
||||
store.games[record.gameId] = record;
|
||||
store.last = record.gameId;
|
||||
writeStore(store);
|
||||
}
|
||||
|
||||
/** Deliberate, and the one irreversible thing on the lobby screen: the token is the only proof of
|
||||
* who you are, so forgetting it gives up the seat with no way back from this browser. */
|
||||
function forgetRemote(gameId: string): void {
|
||||
const store = readStore();
|
||||
delete store.games[gameId];
|
||||
if (store.last === gameId) store.last = null;
|
||||
writeStore(store);
|
||||
}
|
||||
|
||||
function knownRemote(): RemoteRecord[] {
|
||||
return Object.values(readStore().games);
|
||||
}
|
||||
|
||||
/** The handlers the lobby drives this page through — one place, since four callers open a lobby.
|
||||
* Storage lives here rather than in `lobby.ts`, which owns the screen and not the browser. */
|
||||
const lobbyHandlers = {
|
||||
onReady: (ready: LobbyReady): void => beginRemote(ready),
|
||||
onSeated: (s: { token: string; gameId: string; gameCode: string }): void =>
|
||||
saveRemote({ ...s, stage: 'lobby' }),
|
||||
onLeft: (gameId?: string): void => {
|
||||
const target = gameId ?? readStore().last;
|
||||
if (target !== null && target !== undefined) forgetRemote(target);
|
||||
},
|
||||
known: (): { gameId: string; gameCode: string; stage: 'lobby' | 'game' }[] =>
|
||||
knownRemote().map((r) => ({ gameId: r.gameId, gameCode: r.gameCode, stage: r.stage })),
|
||||
forget: (gameId: string): void => forgetRemote(gameId),
|
||||
rejoin: (gameId: string): void => {
|
||||
const record = readStore().games[gameId];
|
||||
if (!record) return;
|
||||
if (record.stage === 'game' && record.seat !== undefined) {
|
||||
beginRemote({ ...record, seat: record.seat });
|
||||
return;
|
||||
}
|
||||
// Still seated in a lobby that had not started: the stream puts us back on the seating screen,
|
||||
// and its own probe handles a game that began while we were away.
|
||||
showScreen('lobby');
|
||||
runLobby(lobbyHandlers, { token: record.token, gameId: record.gameId, gameCode: record.gameCode });
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* THE GAME CODE THIS PAGE IS IN, once it is in one.
|
||||
*
|
||||
* It ended at the lobby door before 2026-08-23 — `LobbyReady` carried the token, the game id and the
|
||||
* seat, and the code (the only one of the four a person can read out) was dropped. A seated player
|
||||
* could not say which game they were in, match it against the administrator's Games in Progress
|
||||
* list, or pass it to a latecomer. Empty in solitaire, where there is no code.
|
||||
*/
|
||||
let gameCode = '';
|
||||
|
||||
/** How long the handoff curtain holds, so the start of a game is a moment rather than a snap. */
|
||||
const HANDOFF_BEAT_MS = 1500;
|
||||
/** How long to wait before saying the board has not arrived. */
|
||||
const HANDOFF_STALL_MS = 8000;
|
||||
let handoffOpenedAt = 0;
|
||||
let handoffStall: number | null = null;
|
||||
let firstFrameSeen = false;
|
||||
|
||||
function setText(id: string, text: string): void {
|
||||
const el = document.getElementById(id);
|
||||
if (el) el.textContent = text;
|
||||
}
|
||||
|
||||
/** The curtain between `Lobby.Start` and the first Frame — see `#handoff` in `play.html`. */
|
||||
function openHandoff(): void {
|
||||
const el = document.getElementById('handoff');
|
||||
if (!el) return;
|
||||
firstFrameSeen = false;
|
||||
handoffOpenedAt = Date.now();
|
||||
el.classList.add('shown');
|
||||
setText('handoff-title', 'Dealing the railroad…');
|
||||
setText('handoff-note', 'Laying out the Division and rolling for seats.');
|
||||
if (handoffStall !== null) clearTimeout(handoffStall);
|
||||
handoffStall = window.setTimeout(() => {
|
||||
if (firstFrameSeen) return;
|
||||
setText('handoff-title', 'Still waiting for the server');
|
||||
setText(
|
||||
'handoff-note',
|
||||
'The game exists, but its board has not arrived yet. It will appear as soon as the server sends it.',
|
||||
);
|
||||
}, HANDOFF_STALL_MS);
|
||||
}
|
||||
|
||||
function closeHandoff(): void {
|
||||
document.getElementById('handoff')?.classList.remove('shown');
|
||||
if (handoffStall !== null) clearTimeout(handoffStall);
|
||||
handoffStall = null;
|
||||
}
|
||||
|
||||
/** Flash a one-line announcement over the board. Shared by the session's own announcements and by
|
||||
* the "the game has begun" line, which comes from the page rather than from an event. */
|
||||
function flashAnnounce(text: string): void {
|
||||
const el = document.getElementById('announce');
|
||||
if (!el) return;
|
||||
el.textContent = text;
|
||||
el.className = 'shown';
|
||||
window.setTimeout(() => {
|
||||
if (el.textContent === text) el.className = '';
|
||||
}, 4200);
|
||||
}
|
||||
|
||||
/**
|
||||
* THE FIRST FRAME OF A MULTIPLAYER GAME — the one moment nobody had ever seen drawn.
|
||||
*
|
||||
* The board simply appeared, mid-Local-Operations, with a log already several bot turns deep and
|
||||
* nothing saying this was the game just set up. `#phasenote` cannot help: it announces a CHANGE of
|
||||
* phase, and there is no previous phase to have changed from.
|
||||
*/
|
||||
function noteFirstFrame(f: Frame): void {
|
||||
if (firstFrameSeen || isLocal(session)) return;
|
||||
firstFrameSeen = true;
|
||||
const held = Date.now() - handoffOpenedAt;
|
||||
const config = configFromFrame(f);
|
||||
const type = gameTypeLabel(presetOf(config, f.players.length, f.days), f.mode);
|
||||
window.setTimeout(
|
||||
() => {
|
||||
closeHandoff();
|
||||
flashAnnounce(
|
||||
`The game has begun — ${type} · ${f.players.length} players · Day ${f.day}, Stage ${f.stage}`,
|
||||
);
|
||||
},
|
||||
Math.max(0, HANDOFF_BEAT_MS - held),
|
||||
);
|
||||
}
|
||||
|
||||
/** Toggles the two mutually-exclusive top-level screens `play.html` defines — `#lobby` (Phase 4)
|
||||
* and `#gameui` (the board, whether local or remote). Both start `hidden` in the markup so neither
|
||||
* ever flashes before `start()` decides which one this load actually needs. */
|
||||
@@ -338,12 +600,14 @@ function showScreen(which: 'lobby' | 'gameui'): void {
|
||||
* so it is always written back here before anything else happens.
|
||||
*/
|
||||
function beginRemote(ready: LobbyReady): void {
|
||||
localStorage.setItem(REMOTE_KEY, JSON.stringify(ready));
|
||||
saveRemote({ token: ready.token, gameId: ready.gameId, gameCode: ready.gameCode, seat: ready.seat, stage: 'game' });
|
||||
gameCode = ready.gameCode;
|
||||
showScreen('gameui');
|
||||
// Nothing can be drawn until the first push arrives, and a page showing nothing at all is
|
||||
// indistinguishable from a page that is broken — which is exactly what a dead session used to
|
||||
// look like, forever.
|
||||
$('presence').textContent = '… connecting to the game';
|
||||
// look like, forever. This is its own state now rather than a borrowed line in the DISCONNECT
|
||||
// banner (`#presence`), and it holds a beat so the game visibly begins.
|
||||
openHandoff();
|
||||
session = createRemoteSession(ready.token, ready.seat, abandonRemote);
|
||||
applyCapabilities();
|
||||
// A LocalSession has data the instant it is constructed; a RemoteSession does not — its first
|
||||
@@ -366,16 +630,19 @@ function beginRemote(ready: LobbyReady): void {
|
||||
* Forgetting the token is what makes the next load land in the lobby instead of repeating it.
|
||||
*/
|
||||
function abandonRemote(): void {
|
||||
localStorage.removeItem(REMOTE_KEY);
|
||||
// That one game is gone; any OTHER game this browser is in is untouched.
|
||||
const store = readStore();
|
||||
if (store.last !== null) forgetRemote(store.last);
|
||||
closeHandoff();
|
||||
showScreen('lobby');
|
||||
$('presence').textContent = '';
|
||||
runLobby(beginRemote);
|
||||
const note = document.getElementById('lb-create-err');
|
||||
if (note) {
|
||||
note.textContent =
|
||||
'That game is no longer on this server — it was either ended by whoever runs it, or the ' +
|
||||
'service was updated, which does not carry games in progress across. Create or join a new one.';
|
||||
}
|
||||
runLobby(lobbyHandlers);
|
||||
// The lobby's own notice slot, not the create form's error line: the player may well have been a
|
||||
// joiner, and with the two doors that line is behind a panel they are not looking at.
|
||||
notice(
|
||||
'That game is no longer on this server — it was either ended by whoever runs it, or the ' +
|
||||
'service was updated, which does not carry games in progress across. Create or join a new one.',
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -388,21 +655,44 @@ function abandonRemote(): void {
|
||||
function start(): void {
|
||||
const params = new URLSearchParams(location.search);
|
||||
|
||||
/**
|
||||
* ASKING FOR THE LOBBY BEATS RESUMING A GAME.
|
||||
*
|
||||
* The splash's "Play multiplayer" door and an invite link both land here with `?lobby`, and both
|
||||
* mean "I want to pick a game" — but a remembered session used to be checked first, so anyone
|
||||
* already in a game was dropped straight back into it and could never reach the lobby from the
|
||||
* door at all. A BARE load still resumes, which is the common case and the one D11 is about.
|
||||
*/
|
||||
const invited = params.get('code');
|
||||
if (params.get('lobby') !== null || invited !== null) {
|
||||
showScreen('lobby');
|
||||
if (invited !== null && invited !== '') prefillCode(invited);
|
||||
runLobby(lobbyHandlers);
|
||||
return;
|
||||
}
|
||||
|
||||
// Entered without checking it still exists — deliberately. Verifying up front would mean an
|
||||
// await before anything renders on the common path, where the game IS still there; instead the
|
||||
// session reports a dead game through `abandonRemote`, which lands in the lobby.
|
||||
const remembered = loadRemote();
|
||||
if (remembered) {
|
||||
beginRemote(remembered);
|
||||
if (remembered && remembered.stage === 'game' && remembered.seat !== undefined) {
|
||||
beginRemote({ ...remembered, seat: remembered.seat });
|
||||
return;
|
||||
}
|
||||
|
||||
// The splash's "Play multiplayer" door (index.html) lands here — straight into the lobby,
|
||||
// rather than dealing a solitaire game first and leaving the player to find the in-game
|
||||
// Multiplayer button themselves.
|
||||
if (params.get('lobby') !== null) {
|
||||
/**
|
||||
* A SEAT TAKEN BUT NOT YET PLAYING — this browser reloaded while the lobby was still seating.
|
||||
*
|
||||
* The lobby stream answers all three cases from here without another route: it pushes the seating
|
||||
* screen if the lobby is still open, and its `onerror` probe finds either a game that started
|
||||
* while we were away (straight in) or a lobby that is gone (back to the doors, with a reason).
|
||||
*/
|
||||
if (remembered) {
|
||||
showScreen('lobby');
|
||||
runLobby(beginRemote);
|
||||
runLobby(lobbyHandlers, {
|
||||
token: remembered.token,
|
||||
gameId: remembered.gameId,
|
||||
gameCode: remembered.gameCode,
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -410,7 +700,7 @@ function start(): void {
|
||||
const requested = params.get('seed');
|
||||
// A seed in the URL makes a game shareable and reproducible: same link, same deal.
|
||||
const seed = requested !== null ? Number(requested) || 1 : Math.floor(Math.random() * 1e9);
|
||||
const local = createLocalSession(seed, gameOptionsFromUrl(params));
|
||||
const local = createLocalSession(seed, solitaireDefaults(gameOptionsFromUrl(params)));
|
||||
session = local;
|
||||
|
||||
// A saved game carries its OWN rules and re-deals itself under them, whatever the URL says — see
|
||||
@@ -445,6 +735,8 @@ function applyCapabilities(): void {
|
||||
// Creating or joining ANOTHER multiplayer game from inside a running one is not a thing this
|
||||
// page offers — same reasoning as `newgame`, and the same capability answers both.
|
||||
hide('multiplayer', c.newGame);
|
||||
// The mirror of the three above: leaving a game is the one control that only a REMOTE session has.
|
||||
hide('leavegame', !c.newGame);
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -489,16 +781,67 @@ function renderSeatingChain(f: Frame): void {
|
||||
* collapses the banner rather than leaving a reassuring "all connected" line nobody needs to read.
|
||||
*/
|
||||
function renderPresence(f: Frame): void {
|
||||
const away = session
|
||||
.presence()
|
||||
.filter((p) => !p.connected)
|
||||
.map((p) => f.players.find((pl) => pl.index === p.seat)?.name ?? `Seat ${seatLabel(p.seat)}`);
|
||||
$('presence').textContent = away.length === 0 ? '' : `⚠ waiting on ${away.join(', ')} — disconnected`;
|
||||
const name = (seat: PlayerIndex): string =>
|
||||
f.players.find((pl) => pl.index === seat)?.name ?? `Seat ${seatLabel(seat)}`;
|
||||
const presence = session.presence();
|
||||
/**
|
||||
* TWO DIFFERENT ABSENCES, and they call for two different things from the table.
|
||||
*
|
||||
* A seat the server has never heard from has not opened the game yet — somebody needs to send them
|
||||
* the link. A seat that WAS here and dropped will probably be back. The server reports both from
|
||||
* `/api/stream`'s connect push (2026-08-23); before that a client learnt of a seat only when it
|
||||
* disconnected AFTER you connected, so a table where two people had not shown up yet said nothing
|
||||
* at all.
|
||||
*/
|
||||
const dropped = presence.filter((p) => p.seen && !p.connected).map((p) => name(p.seat));
|
||||
const never = presence.filter((p) => !p.seen).map((p) => name(p.seat));
|
||||
const parts: string[] = [];
|
||||
if (dropped.length > 0) parts.push(`${dropped.join(', ')} — disconnected`);
|
||||
if (never.length > 0) parts.push(`${never.join(', ')} — not here yet`);
|
||||
$('presence').textContent = parts.length === 0 ? '' : `⚠ waiting on ${parts.join(' · ')}`;
|
||||
}
|
||||
|
||||
/**
|
||||
* WHICH GAME THIS IS, in the header: its code and its type.
|
||||
*
|
||||
* Neither used to be anywhere on the board. The code ended at the lobby door, and the type was never
|
||||
* on the Frame at all — so a player could read what a load paid but not whether they were in a Co-op
|
||||
* game or a Cutthroat one, which is the difference between helping the table and racing it.
|
||||
*/
|
||||
function renderGameIdentity(f: Frame): void {
|
||||
const codeEl = document.getElementById('gamecode');
|
||||
if (codeEl) codeEl.textContent = gameCode === '' ? '' : `game ${gameCode}`;
|
||||
|
||||
const el = document.getElementById('gametype');
|
||||
if (!el) return;
|
||||
const config = configFromFrame(f);
|
||||
const players = f.players.length;
|
||||
const type = presetOf(config, players, f.days);
|
||||
const near = closestPreset(config, players, f.days);
|
||||
el.textContent = gameTypeLabel(type, f.mode);
|
||||
el.title =
|
||||
type === 'custom'
|
||||
? `A custom game, scored as ${preset(near.name).scoring === 'coop' ? 'Co-op' : 'Competitive'}. ` +
|
||||
`${near.differing.length} ${near.differing.length === 1 ? 'setting differs' : 'settings differ'} ` +
|
||||
`from ${preset(near.name).label}.\n\n${rulesSummary(f)}`
|
||||
: `${preset(type).blurb}\n\n${rulesSummary(f)}`;
|
||||
}
|
||||
|
||||
/** The victory conditions in force, spelled out for the header's tooltip. */
|
||||
function rulesSummary(f: Frame): string {
|
||||
const off = (n: number): string => (n === 0 ? 'off' : String(n));
|
||||
return (
|
||||
`Days: ${f.days}\n` +
|
||||
`Combined Revenue floor: ${off(f.minCombinedRevenue)}\n` +
|
||||
`Collisions in one Day that end the game: ${off(f.maxCollisionsPerDay)}\n` +
|
||||
`Collisions in the whole game that end it: ${off(f.maxCollisionsTotal)}`
|
||||
);
|
||||
}
|
||||
|
||||
function render(): void {
|
||||
const f = session.view();
|
||||
const menu = session.menu();
|
||||
noteFirstFrame(f);
|
||||
|
||||
// Which squares the selected card or track piece may go on. Highlighting them is what turns the
|
||||
// coordinate list into a board: you pick the thing, then click where it goes.
|
||||
@@ -535,6 +878,7 @@ function render(): void {
|
||||
// The seed is never sent to a remote client at all (it would leak every future shuffle and roll,
|
||||
// `multiplayer.md` §7) — `RemoteSession` has no `.seed()` because there is nothing to return.
|
||||
$('seed').textContent = isLocal(session) ? String(session.seed()) : `Seat ${seatLabel(session.seat())}`;
|
||||
renderGameIdentity(f);
|
||||
renderHouseRules(f.houseRules);
|
||||
|
||||
// -- division
|
||||
@@ -809,10 +1153,20 @@ function render(): void {
|
||||
|
||||
// -- log
|
||||
const log = $('log');
|
||||
log.innerHTML = session.lines()
|
||||
.slice(-60)
|
||||
.map((l) => `<div class="line t-${l.tone}">${esc(l.text)}</div>`)
|
||||
.join('');
|
||||
const allLines = session.lines();
|
||||
const shownLines = allLines.slice(-60);
|
||||
/**
|
||||
* WHERE THE GAME BEGAN. In a multiplayer game the bots move the instant the host presses Start, so
|
||||
* by the time the board paints the log already has several turns in it and nothing says which of
|
||||
* them are yours to have missed. Only drawn while the whole log is on screen: past sixty lines the
|
||||
* top of the panel is no longer the start of the game, and a marker claiming otherwise would lie.
|
||||
*/
|
||||
const startMarker =
|
||||
!isLocal(session) && allLines.length === shownLines.length
|
||||
? '<div class="line t-phase">— the game began —</div>'
|
||||
: '';
|
||||
log.innerHTML =
|
||||
startMarker + shownLines.map((l) => `<div class="line t-${l.tone}">${esc(l.text)}</div>`).join('');
|
||||
log.scrollTop = log.scrollHeight;
|
||||
|
||||
/**
|
||||
@@ -837,14 +1191,7 @@ function render(): void {
|
||||
* out loud rather than left in the log. Drained, so it shows once and does not re-fire on a redraw.
|
||||
*/
|
||||
const announcement = session.takeAnnouncement();
|
||||
if (announcement) {
|
||||
const el = $('announce');
|
||||
el.textContent = announcement;
|
||||
el.className = 'shown';
|
||||
window.setTimeout(() => {
|
||||
if (el.textContent === announcement) el.className = '';
|
||||
}, 4200);
|
||||
}
|
||||
if (announcement) flashAnnounce(announcement);
|
||||
|
||||
renderDistrict(f);
|
||||
renderActions(menu, f, justSet);
|
||||
@@ -1074,13 +1421,13 @@ function renderActions(
|
||||
*/
|
||||
const scheduledNote =
|
||||
justSet !== null && f.timetable[justSet] != null
|
||||
? `<div class="scheduled" data-tip="§7 — the Stage is rolled on 1D12 when the card is played; if that Stage is taken the train works down the column to the next free one. From now on it runs at this time every Day.">` +
|
||||
? `<div class="scheduled" data-tip="The Stage is rolled on 1D12 when the card is played; if that Stage is taken the train works down the column to the next free one. From now on it runs at this time every Day.">` +
|
||||
`Train ${f.timetable[justSet]} is scheduled to depart at Stage ${justSet + 1} — see the Timetable</div>`
|
||||
: '';
|
||||
|
||||
const movesNote =
|
||||
f.movesLeft !== null
|
||||
? `<div class="moves${f.movesLeft === 0 ? ' spent' : ''}" data-tip="§6.1 — six Moves a turn. A Move runs any distance in one direction; changing direction costs another, which is why a run-around has to be planned inside the count.">` +
|
||||
? `<div class="moves${f.movesLeft === 0 ? ' spent' : ''}" data-tip="Six Moves a turn. A Move runs any distance in one direction; changing direction costs another, which is why a run-around has to be planned inside the count.">` +
|
||||
`${f.movesLeft} of ${MOVES_PER_LOCAL_OPS} Moves left</div>`
|
||||
: '';
|
||||
|
||||
@@ -1163,7 +1510,7 @@ function renderActions(
|
||||
? `Click a car in the Division Yard below to add it — ${addable} kind${addable === 1 ? '' : 's'} it may take are highlighted there.`
|
||||
: menu.makeUp.pass !== null
|
||||
? 'The Division Yard is bare, so there is nothing to add. Send the train out as it stands.'
|
||||
: 'Nothing in the Division Yard may join this train, and §7 does not allow passing while the yard holds cars.') +
|
||||
: 'Nothing in the Division Yard may join this train, and passing is not allowed while the yard holds cars.') +
|
||||
`</div>` +
|
||||
/**
|
||||
* WHICH ORDER TO ADD THEM IN, when the order is what decides whether the train can work.
|
||||
@@ -1177,7 +1524,7 @@ function renderActions(
|
||||
? `<div class="makeup-advice ${menu.makeUp.advice.tone}">${esc(menu.makeUp.advice.text)}</div>`
|
||||
: '') +
|
||||
(menu.makeUp.pass !== null
|
||||
? `<button class="act" data-i="${menu.makeUp.pass}" data-tip="§8.2 — a train may depart with FEWER cars than its card lists, but never with the wrong ones. This sends it out as it stands.">no more cars — send it out</button>`
|
||||
? `<button class="act" data-i="${menu.makeUp.pass}" data-tip="A train may depart with FEWER cars than its card lists, but never with the wrong ones. This sends it out as it stands.">no more cars — send it out</button>`
|
||||
: '') +
|
||||
`</div>`;
|
||||
}
|
||||
@@ -1237,11 +1584,11 @@ function renderActions(
|
||||
*/
|
||||
const stuck = f.handDiscardable.length > 0 && f.handDiscardable.every((d) => !d);
|
||||
const tip = stuck
|
||||
? '§6.2 — you may not end a turn holding more than three cards, and a TRAIN CARD IS NEVER ' +
|
||||
? 'You may not end a turn holding more than three cards, and a TRAIN CARD IS NEVER ' +
|
||||
'DISCARDED. Every card you hold is a train, so the only way on is to play one onto the ' +
|
||||
'timetable. A train may be held for as many Stages and Days as you like; it just cannot be ' +
|
||||
'thrown away.'
|
||||
: '§6.2 — you may not end a turn holding more than three cards (four with a Red Flag). Play ' +
|
||||
: 'You may not end a turn holding more than three cards (four with a Red Flag). Play ' +
|
||||
'one onto the board, or discard one face-up to a Department slot. A train card is never ' +
|
||||
'discardable and can only be played.';
|
||||
html +=
|
||||
@@ -1356,7 +1703,35 @@ if (multiplayerBtn) {
|
||||
const started = f.status === 'active' && (f.day > 1 || f.stage > 1);
|
||||
if (started && !confirm(`Leave this game (seed ${session.seed()}, Day ${f.day}) for multiplayer?`)) return;
|
||||
showScreen('lobby');
|
||||
runLobby(beginRemote);
|
||||
runLobby(lobbyHandlers);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* LEAVE A RUNNING GAME — back to the lobby, seat and token kept.
|
||||
*
|
||||
* Reported by Jesse 2026-08-23: a player who has to go had no way out at all. The page re-entered
|
||||
* the same game on every load, and the only thing that ever let go of a session was the game itself
|
||||
* being destroyed. Leaving does NOT give up the seat: `lobby-and-sessions.md` §5 keeps it and the
|
||||
* table waits, which is the design — nothing moves on an absent player's behalf. The token is kept
|
||||
* too, so the game can be re-entered from "Games you are in"; forgetting it is a separate, deliberate
|
||||
* act on that list, because the token is the only proof of who you are.
|
||||
*/
|
||||
const leaveBtn = document.getElementById('leavegame');
|
||||
if (leaveBtn) {
|
||||
leaveBtn.onclick = () => {
|
||||
if (isLocal(session)) return;
|
||||
const f = session.view();
|
||||
const code = gameCode === '' ? 'this game' : gameCode;
|
||||
if (!confirm(`Leave ${code} (Day ${f.day}, Stage ${f.stage})? Your seat is kept and the game waits for you.`)) return;
|
||||
// Stop listening before leaving the screen, so the table sees the seat go quiet rather than
|
||||
// being told somebody is present who is not.
|
||||
session.close?.();
|
||||
closeHandoff();
|
||||
showScreen('lobby');
|
||||
$('presence').textContent = '';
|
||||
runLobby(lobbyHandlers);
|
||||
notice(`You left ${code}. It is still yours — rejoin it under "Games you are in" whenever you like.`);
|
||||
};
|
||||
}
|
||||
|
||||
@@ -1364,38 +1739,99 @@ const newBtn = document.getElementById('newgame');
|
||||
const dlg = document.getElementById('newgamedlg') as HTMLDialogElement | null;
|
||||
if (newBtn && dlg) {
|
||||
const field = <T extends HTMLElement>(id: string): T => document.getElementById(id) as T;
|
||||
type Mode = 'solitaire' | 'competitive' | 'coop';
|
||||
const ngForm = settingsForm('ng-');
|
||||
|
||||
/**
|
||||
* PICKING A TYPE JUST SETS THE FIELDS BELOW TO THAT TYPE'S DEFAULTS (Jesse's design, 2026-08-20) —
|
||||
* every number stays editable afterward, so "Competitive" isn't a fixed ruleset, it's a starting
|
||||
* point. `players = 4` for Competitive/Co-op is a nominal stand-in: there's no lobby yet to ask who
|
||||
* is actually seated (Phase 4), so this is a suggestion a real seat count will replace.
|
||||
* THE SAME FIVE GAME TYPES THE LOBBY OFFERS, and the same shared rules block under them.
|
||||
*
|
||||
* Only Solitaire can be dealt today — Deal disables itself for the other two, with a note, rather
|
||||
* than pretending a click would do something (`RemoteSession` is Phase 2).
|
||||
* The dialog used to carry its own copy of the questions and its own idea of the defaults, which
|
||||
* is how it ended up with "where an Extra may start" that the lobby did not have and none of the
|
||||
* three optional rules that it did. Both screens now read `presets.ts` and drive their block
|
||||
* through `settings-form.ts`; only Solitaire can actually be DEALT here, so the three multiplayer
|
||||
* types are shown disabled rather than hidden — what this screen offers and what the lobby offers
|
||||
* should read as one list, not two.
|
||||
*/
|
||||
function applyModePreset(mode: Mode): void {
|
||||
const days = 5;
|
||||
const players = mode === 'solitaire' ? 1 : 4;
|
||||
field<HTMLInputElement>('ng-days').value = String(days);
|
||||
field<HTMLInputElement>('ng-minrev').value = String(collectiveRevenueFloor(players, days));
|
||||
field<HTMLInputElement>('ng-colday').value = String(DEFAULT_MAX_COLLISIONS_PER_DAY);
|
||||
field<HTMLInputElement>('ng-coltotal').value = String(DEFAULT_MAX_COLLISIONS_TOTAL);
|
||||
let ngBase: PresetName = 'solitaire';
|
||||
let ngType: GameType = 'solitaire';
|
||||
/** As in the lobby: the floor is derived from the length until the player sets one themselves. */
|
||||
let ngFloorTyped = false;
|
||||
|
||||
// No valid target for these cards in Solitaire or Co-op — forced off, not merely defaulted off.
|
||||
const pvp = field<HTMLInputElement>('ng-pvp');
|
||||
pvp.checked = mode === 'competitive';
|
||||
pvp.disabled = mode !== 'competitive';
|
||||
const ngDays = (): number => {
|
||||
const raw = Number(field<HTMLInputElement>('ng-days').value);
|
||||
return Number.isFinite(raw) && raw >= 1 ? Math.round(raw) : 5;
|
||||
};
|
||||
|
||||
field<HTMLButtonElement>('ng-deal').disabled = mode !== 'solitaire';
|
||||
field<HTMLElement>('ng-multiplayer-note').style.visibility = mode === 'solitaire' ? 'hidden' : 'visible';
|
||||
const ngTypeRadios = (): HTMLInputElement[] =>
|
||||
Array.from(dlg.querySelectorAll<HTMLInputElement>('input[name="ng-type"]'));
|
||||
|
||||
function ngRefresh(): void {
|
||||
const differing = ngForm.mark(ngBase, 1, ngDays());
|
||||
if (differing.length > 0) ngType = 'custom';
|
||||
else if (ngType === 'custom') ngType = ngBase;
|
||||
for (const r of ngTypeRadios()) r.checked = r.value === ngType;
|
||||
const note = field<HTMLElement>('ng-type-note');
|
||||
note.textContent =
|
||||
ngType === 'custom'
|
||||
? `${gameTypeLabel('custom', preset(ngBase).scoring)} · ${differing.length} ` +
|
||||
`${differing.length === 1 ? 'setting differs' : 'settings differ'} from ${preset(ngBase).label}.`
|
||||
: preset(ngType as PresetName).blurb;
|
||||
}
|
||||
|
||||
for (const input of dlg.querySelectorAll<HTMLInputElement>('input[name="ng-mode"]')) {
|
||||
input.onchange = () => applyModePreset(input.value as Mode);
|
||||
function ngSelectPreset(name: PresetName): void {
|
||||
ngBase = name;
|
||||
ngType = name;
|
||||
ngFloorTyped = false;
|
||||
const values = presetSettings(name, 1, ngDays());
|
||||
ngForm.write(values, values);
|
||||
ngRefresh();
|
||||
}
|
||||
|
||||
for (const r of ngTypeRadios()) {
|
||||
// Nothing here can deal a multiplayer game: a `LocalSession` runs the engine in this browser and
|
||||
// a table needs a server. The lobby is the door, and the row says so rather than just refusing
|
||||
// the click (Jesse, 2026-08-23 — a disabled radio that looks enabled reads as a broken one).
|
||||
if (r.value !== 'solitaire' && r.value !== 'custom') {
|
||||
r.disabled = true;
|
||||
const row = r.closest('label');
|
||||
if (row && !row.querySelector('.lb-why')) {
|
||||
row.classList.add('disabled');
|
||||
const note = document.createElement('span');
|
||||
note.className = 'lb-why';
|
||||
note.textContent = ' — use the Multiplayer button; a table needs a server';
|
||||
row.querySelector('span')?.appendChild(note);
|
||||
}
|
||||
}
|
||||
r.onchange = () => {
|
||||
if (!r.checked) return;
|
||||
if (r.value === 'custom') {
|
||||
ngType = 'custom';
|
||||
ngRefresh();
|
||||
return;
|
||||
}
|
||||
ngSelectPreset(r.value as PresetName);
|
||||
};
|
||||
}
|
||||
|
||||
ngForm.onEdit((key) => {
|
||||
if (key === 'minCombinedRevenue') ngFloorTyped = true;
|
||||
ngType = 'custom';
|
||||
ngRefresh();
|
||||
});
|
||||
|
||||
// Days is a parameter, not a rule: it re-derives the floor and never makes a game Custom by itself.
|
||||
field<HTMLInputElement>('ng-days').oninput = () => {
|
||||
if (!ngFloorTyped) {
|
||||
const values = ngForm.read();
|
||||
const want = presetSettings(ngBase, 1, ngDays());
|
||||
ngForm.write({ ...values, minCombinedRevenue: want.minCombinedRevenue }, want);
|
||||
}
|
||||
ngRefresh();
|
||||
};
|
||||
|
||||
// "Everyone moves one chair left" has no meaning at a table of one — disabled with the rest of the
|
||||
// block still visible, so the two screens read the same.
|
||||
ngForm.setEmployeeRotationAvailable(false);
|
||||
|
||||
/**
|
||||
* ASK FOR ALL OF IT, rather than documenting URL parameters in the title bar.
|
||||
*
|
||||
@@ -1405,8 +1841,9 @@ if (newBtn && dlg) {
|
||||
*
|
||||
* The dialog OPENS ON THE RULES IN PLAY rather than on the defaults: dealing a second game to
|
||||
* compare against the first is the common case, and re-entering settings each time is how a
|
||||
* comparison silently stops comparing. Mode always reopens on Solitaire — it's the only one a
|
||||
* previous session could actually have been, since Deal is disabled for the other two.
|
||||
* comparison silently stops comparing. Which TYPE that is comes out of the comparison — a game
|
||||
* dealt at the Solitaire defaults reopens on Solitaire, and one that was tuned reopens on Custom
|
||||
* with every changed field marked.
|
||||
*/
|
||||
newBtn.onclick = () => {
|
||||
// The button itself is hidden for a session that cannot deal (`applyCapabilities`), but the
|
||||
@@ -1420,26 +1857,15 @@ if (newBtn && dlg) {
|
||||
const started = f.status === 'active' && (day > 1 || f.stage > 1);
|
||||
if (started && !confirm(`Forget this game (seed ${local.seed()}, Day ${day}) and deal a new one?`)) return;
|
||||
|
||||
const current = f.houseRules;
|
||||
field<HTMLInputElement>('ng-seed').value = '';
|
||||
for (const input of dlg.querySelectorAll<HTMLInputElement>('input[name="ng-mode"]')) {
|
||||
input.checked = input.value === 'solitaire';
|
||||
}
|
||||
applyModePreset('solitaire');
|
||||
for (const input of dlg.querySelectorAll<HTMLInputElement>('input[name="ng-hand"]')) {
|
||||
input.checked = input.value === current.startingHand;
|
||||
}
|
||||
for (const input of dlg.querySelectorAll<HTMLInputElement>('input[name="ng-extra"]')) {
|
||||
input.checked = input.value === current.extraStart;
|
||||
}
|
||||
field<HTMLInputElement>('ng-passenger').value = String(current.revenue.passengerPerCoach);
|
||||
field<HTMLInputElement>('ng-freight').value = String(current.revenue.freightPerLoad);
|
||||
field<HTMLInputElement>('ng-transit').value = String(current.revenue.trainPerTransit);
|
||||
// Overwrite the preset with the actual rules in play — solitaire is the only real session today.
|
||||
field<HTMLInputElement>('ng-days').value = String(f.days);
|
||||
field<HTMLInputElement>('ng-minrev').value = String(f.minCombinedRevenue);
|
||||
field<HTMLInputElement>('ng-colday').value = String(f.maxCollisionsPerDay);
|
||||
field<HTMLInputElement>('ng-coltotal').value = String(f.maxCollisionsTotal);
|
||||
ngBase = 'solitaire';
|
||||
ngType = 'solitaire';
|
||||
ngFloorTyped = false;
|
||||
// The rules actually in play, then the comparison decides what to call them.
|
||||
ngForm.write(settingsOf(configFromFrame(f)), presetSettings('solitaire', 1, f.days));
|
||||
ngForm.setEmployeeRotationAvailable(false);
|
||||
ngRefresh();
|
||||
dlg.showModal();
|
||||
};
|
||||
|
||||
@@ -1449,8 +1875,6 @@ if (newBtn && dlg) {
|
||||
*
|
||||
* The answers go into the URL and the page navigates, which is the same path `?seed=` already
|
||||
* took: `start()` reads them back, so there is exactly one place that turns a URL into a game.
|
||||
* Deal is disabled whenever the mode radio isn't Solitaire, so this never actually runs for the
|
||||
* other two — nothing here needs to branch on mode.
|
||||
*/
|
||||
dlg.addEventListener('close', () => {
|
||||
if (dlg.returnValue !== 'deal') return;
|
||||
@@ -1459,24 +1883,30 @@ if (newBtn && dlg) {
|
||||
// A seed the browser cannot parse is not a reason to refuse to deal — blank and unparseable
|
||||
// both mean "surprise me", which is what leaving the box alone plainly asks for.
|
||||
const seed = asked === '' || !Number.isFinite(Number(asked)) ? '' : String(Math.trunc(Number(asked)));
|
||||
const picked = dlg.querySelector<HTMLInputElement>('input[name="ng-hand"]:checked')?.value;
|
||||
const extra = dlg.querySelector<HTMLInputElement>('input[name="ng-extra"]:checked')?.value;
|
||||
const settings = ngForm.read();
|
||||
const rules = houseRules({
|
||||
houseRules: {
|
||||
...(STARTING_HAND_LABELS.some((o) => o.value === picked) ? { startingHand: picked as StartingHand } : {}),
|
||||
...(EXTRA_START_LABELS.some((o) => o.value === extra) ? { extraStart: extra as ExtraStartRule } : {}),
|
||||
startingHand: settings.startingHand,
|
||||
extraStart: settings.extraStart,
|
||||
revenue: {
|
||||
passengerPerCoach: Number(field<HTMLInputElement>('ng-passenger').value),
|
||||
freightPerLoad: Number(field<HTMLInputElement>('ng-freight').value),
|
||||
trainPerTransit: Number(field<HTMLInputElement>('ng-transit').value),
|
||||
passengerPerCoach: settings.passengerPerCoach,
|
||||
freightPerLoad: settings.freightPerLoad,
|
||||
trainPerTransit: settings.trainPerTransit,
|
||||
},
|
||||
},
|
||||
});
|
||||
const victory: NewGameOptions = {
|
||||
days: Math.max(1, Math.round(Number(field<HTMLInputElement>('ng-days').value)) || 5),
|
||||
minCombinedRevenue: Math.max(0, Math.round(Number(field<HTMLInputElement>('ng-minrev').value)) || 0),
|
||||
maxCollisionsPerDay: Math.max(0, Math.round(Number(field<HTMLInputElement>('ng-colday').value)) || 0),
|
||||
maxCollisionsTotal: Math.max(0, Math.round(Number(field<HTMLInputElement>('ng-coltotal').value)) || 0),
|
||||
days: Math.max(1, ngDays()),
|
||||
minCombinedRevenue: settings.minCombinedRevenue,
|
||||
maxCollisionsPerDay: settings.maxCollisionsPerDay,
|
||||
maxCollisionsTotal: settings.maxCollisionsTotal,
|
||||
optionalRules: {
|
||||
reducedVisibility: settings.reducedVisibility,
|
||||
// Never on at a table of one, whatever the box says — the control is disabled for the same
|
||||
// reason, and this is the half that reaches the engine.
|
||||
employeeRotation: false,
|
||||
emergencyToolbox: settings.emergencyToolbox,
|
||||
},
|
||||
};
|
||||
|
||||
clearSave();
|
||||
|
||||
+2
-2
@@ -34,7 +34,7 @@ export function handHtml(f: Frame, canPlay: (boolean | null)[] = []): string {
|
||||
// §6.2 (Gitea#6) — say so on the card itself. A player who cannot discard a train needs to read
|
||||
// that on the train, not deduce it from a button that is not there.
|
||||
const held = 'You may hold this for as many Stages and Days as you like — but a train card is ' +
|
||||
'never discarded (§6.2). The only way it leaves your hand is onto the timetable.';
|
||||
'never discarded. The only way it leaves your hand is onto the timetable.';
|
||||
return f.hand.length
|
||||
? f.hand
|
||||
.map((h, i) => {
|
||||
@@ -291,7 +291,7 @@ export function facilitiesHtml(f: Frame): string {
|
||||
: '') +
|
||||
`<div class="fstat ${x.jammed ? 'bad' : x.canFinish ? 'good' : 'idle'}" data-tip="${
|
||||
x.jammed
|
||||
? 'A load is sitting on MEN|AT|WORK with no spotted car to receive it. That locks the industry track, which blocks the very car that would clear it (§9.3).'
|
||||
? 'A load is sitting on MEN|AT|WORK with no spotted car to receive it. That locks the industry track, which blocks the very car that would clear it.'
|
||||
: x.canFinish
|
||||
? 'A matching empty car is spotted on this industry\'s track, so a load worked here can come off onto it.'
|
||||
: 'No matching car is spotted. Starting a load here would park it on WORK and jam the facility.'
|
||||
|
||||
+470
-129
@@ -80,7 +80,22 @@ main{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:14px;padding:14p
|
||||
@media(max-width:1100px){main{grid-template-columns:1fr}}
|
||||
section{background:var(--panel);border:1px solid var(--line);border-radius:7px;
|
||||
padding:10px 12px;margin-bottom:12px}
|
||||
#lobby{max-width:640px;margin:0 auto;padding:14px}
|
||||
#lobby{max-width:1040px;margin:0 auto;padding:14px}
|
||||
/* The create form is two short lists, not one long one: what game this is on the left, what its
|
||||
rules are on the right. Collapses to one column where there is no room for two. */
|
||||
.lb-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:22px;align-items:start}
|
||||
@media(max-width:860px){.lb-two{grid-template-columns:1fr;gap:0}}
|
||||
.lb-col{min-width:0}
|
||||
.lb-span{grid-column:1/-1;min-width:0}
|
||||
/* The rules in as many columns as the width allows — one in the New Game dialog, which is narrow. */
|
||||
.set-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:0 26px;align-items:start}
|
||||
.set-group{min-width:0;break-inside:avoid}
|
||||
.set-group h3:first-child{margin-top:4px}
|
||||
/* A DISABLED CHOICE HAS TO LOOK DISABLED. Reported by Jesse: Solitaire is not selectable in the
|
||||
lobby and nothing on it said so — a radio that silently refuses reads as a broken radio. */
|
||||
.ng-radio.disabled{opacity:.45;cursor:not-allowed}
|
||||
.ng-radio.disabled:hover{background:none}
|
||||
.lb-why{color:#e0b060;font-size:11px}
|
||||
#lobby h2{margin-top:0}
|
||||
#lobby h3{margin-bottom:2px}
|
||||
.lb-seat{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid var(--line)}
|
||||
@@ -227,6 +242,57 @@ h3.actions-hd{font-size:13px;text-transform:none;letter-spacing:.01em;color:#cfe
|
||||
ul.blocked{list-style:none;margin:0;padding:0;font-size:12px}
|
||||
ul.blocked li{padding:2px 0}
|
||||
.sev-warn{color:#e0b060}.sev-stop{color:#e58080}
|
||||
/* THE RULES BLOCK, shared by the lobby and the New Game dialog (`settings-form.ts`).
|
||||
`.changed` is the one signal that says "this game is not the type it claims" — amber, the palette's
|
||||
attention colour, never red: a changed rule is a choice, not an error. */
|
||||
.set-row{padding:3px 0}
|
||||
.set-row.changed{border-left:3px solid #e0b060;padding-left:9px;margin-left:-12px;
|
||||
background:rgba(224,176,96,.08);border-radius:0 4px 4px 0}
|
||||
.set-hint{display:block;font-size:11px;color:var(--dim);margin:2px 0 0}
|
||||
/* The line under the type radios when a game is no longer the type it started as. */
|
||||
.changed-note{color:#e0b060}
|
||||
.set-row.changed .set-hint{color:#e0b060}
|
||||
.set-row.unavailable{opacity:.5}
|
||||
.ng-gate{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:3px 0}
|
||||
.ng-gate input[type=checkbox]{flex:none}
|
||||
.gate-num{width:82px}
|
||||
.ng-gate input:disabled{opacity:.45}
|
||||
.lb-params{display:flex;gap:14px;flex-wrap:wrap;align-items:end;margin:8px 0}
|
||||
.lb-params .ng-num{flex:1 1 150px}
|
||||
/* An error a player must not scroll past. The grey `.dim` line this replaced was routinely missed —
|
||||
it looked like the note above it. Red is the palette's `.sev-stop`. */
|
||||
.lb-error{color:#e58080;font-size:14px;font-weight:600;margin:8px 0;padding:8px 11px;
|
||||
border-left:3px solid #e58080;background:rgba(229,128,128,.12);border-radius:0 5px 5px 0;
|
||||
empty-cells:hide}
|
||||
.lb-error:empty{display:none}
|
||||
.lb-warn{color:#e0b060;font-size:13px;margin:8px 0}
|
||||
.lb-doors{display:flex;gap:9px;margin:14px 0 12px}
|
||||
.lb-door{flex:1;background:#222831;color:var(--fg);border:1px solid var(--line);border-radius:7px;
|
||||
padding:9px 12px;cursor:pointer;font:inherit;font-size:14px}
|
||||
.lb-door:hover{border-color:#4d6fa8}
|
||||
.lb-door.active{background:#2f3a4b;border-color:#6f8fc8;color:#cfe0f5;font-weight:600}
|
||||
.lb-saved{display:flex;align-items:center;gap:10px}
|
||||
.lb-known-row{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid var(--line)}
|
||||
.lb-known-row:last-child{border-bottom:none}
|
||||
.lb-known-row .code{font-weight:700;letter-spacing:.06em;color:#f2e6cf;flex:1}
|
||||
.lb-type{font-size:15px;font-weight:600;color:#cfe0f5;margin:2px 0 8px}
|
||||
.lb-preview-head{background:#1e242c;border:1px solid var(--line);border-radius:7px;padding:10px 12px;margin:0 0 10px}
|
||||
/* The read-only rule set — what a joining player reads before sitting down, and what the seating
|
||||
screen keeps showing afterwards. Generated, never a form: nobody but the host may change these. */
|
||||
.rules-list{border:1px solid var(--line);border-radius:7px;background:#171c23;padding:4px 12px;margin:0 0 12px}
|
||||
.rules-list dl{display:grid;grid-template-columns:minmax(140px,auto) 1fr;gap:2px 14px;margin:8px 0}
|
||||
.rules-list dt{color:var(--dim);font-size:12px}
|
||||
.rules-list dd{margin:0;font-size:13px}
|
||||
.rules-list dd.changed{color:#e0b060}
|
||||
.rules-list h4{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--dim);margin:10px 0 0}
|
||||
/* THE HANDOFF. Between the host pressing Start and the first Frame arriving there is nothing to
|
||||
draw — and a blank board is what a broken game looks like too. */
|
||||
#handoff{position:fixed;inset:0;z-index:20;display:none;align-items:center;justify-content:center;
|
||||
background:rgba(18,21,26,.94);text-align:center;padding:20px}
|
||||
#handoff.shown{display:flex}
|
||||
#handoff .hand-inner{max-width:460px}
|
||||
#handoff h2{font-size:15px;text-transform:none;letter-spacing:.01em;color:#cfe0f5}
|
||||
#handoff .hand-note{color:var(--dim);font-size:13px;margin-top:8px}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -234,102 +300,251 @@ ul.blocked li{padding:2px 0}
|
||||
<!-- THE LOBBY (Phase 4) — shown instead of the game UI whenever there is no game yet to play: no
|
||||
stored session token, or a token whose game hasn't started. `lobby.ts` owns everything in here;
|
||||
`main.ts` only decides whether THIS div or `#gameui` below is the one currently visible.
|
||||
`#newgamedlg` at the very end of the body is solitaire-only and untouched by any of this. -->
|
||||
`#newgamedlg` at the very end of the body is solitaire-only, and asks the same questions through
|
||||
the same shared module (`settings-form.ts`) — the two blocks are generated from one template. -->
|
||||
<div id="lobby" hidden>
|
||||
<header><b><a href="./index.html" class="home">Station Master</a></b> — <span class="dim">Multiplayer</span></header>
|
||||
|
||||
<!-- Whatever brought the player here when it was not their own click: a game that was ended under
|
||||
them, or a lobby that closed. Never a field-level error — those sit with their fields. -->
|
||||
<p class="lb-error" id="lb-notice" role="alert" hidden></p>
|
||||
|
||||
<section id="lb-secret-section">
|
||||
<h2>Join secret</h2>
|
||||
<p class="ng-note">Whoever is running this server gave you a secret out of band (a chat message, not a public page). It is kept in this browser only, never shown back, and sent with every lobby request.</p>
|
||||
<label class="ng-num"><span>Join secret</span><input id="lb-secret" type="password" autocomplete="off"></label>
|
||||
<!-- Saved: one line, not a password field asking to be filled in again. `lobby.ts` swaps these
|
||||
two, and re-opens the ask automatically when the server answers 403. -->
|
||||
<div id="lb-secret-saved" class="lb-saved" hidden>
|
||||
<span class="dim">Join secret · saved in this browser</span>
|
||||
<button id="lb-secret-change" class="ghost" type="button">Change</button>
|
||||
</div>
|
||||
<div id="lb-secret-ask">
|
||||
<p class="ng-note">Whoever is running this server gave you a secret out of band (a chat message, not a public page). It is kept in this browser only, never shown back, and sent with every lobby request.</p>
|
||||
<label class="ng-num"><span>Join secret</span><input id="lb-secret" type="password" autocomplete="off"></label>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- EVERY GAME THIS BROWSER IS IN. `localStorage` used to hold exactly ONE multiplayer session, so
|
||||
joining a second silently overwrote the first and locked that seat out for good. Keyed by game
|
||||
now, and this is where they are picked between — and forgotten deliberately rather than by
|
||||
accident. -->
|
||||
<section id="lb-known" hidden>
|
||||
<h2>Games you are in</h2>
|
||||
<p class="ng-note">This browser holds a seat in these. Rejoining needs the token kept here, so
|
||||
<b>Forget</b> is the one thing that cannot be undone from this screen.</p>
|
||||
<div id="lb-known-list"></div>
|
||||
</section>
|
||||
|
||||
<section id="lb-choice-section">
|
||||
<h2>Create or join a game</h2>
|
||||
<label class="ng-num"><span>Your display name</span><input id="lb-name" type="text" autocomplete="off" maxlength="40"></label>
|
||||
|
||||
<h3>Create a new game</h3>
|
||||
<p class="ng-note">You become the host — you choose the mode and, once everyone's seated, start the game. 2 to 4 players.</p>
|
||||
<label class="ng-radio"><input type="radio" name="lb-mode" value="competitive" checked>
|
||||
<span><b>Competitive</b><br><span class="dim">Highest Revenue wins, unless the table misses the combined minimum — then everyone loses.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="lb-mode" value="coop">
|
||||
<span><b>Co-op</b><br><span class="dim">Everyone's Revenue counts as one table score, against the same kind of combined minimum.</span></span></label>
|
||||
<label class="ng-num"><span>Players at the table</span>
|
||||
<select id="lb-players">
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4" selected>4</option>
|
||||
</select></label>
|
||||
<details id="lb-settings">
|
||||
<summary>Game settings</summary>
|
||||
<p class="ng-note">The same dials the solitaire New Game dialog has. Picking a mode or a table
|
||||
size sets them to that game's defaults; every one stays yours to change. They are fixed when
|
||||
the game is created and cannot be changed once it starts.</p>
|
||||
<!-- TWO DOORS, one panel at a time. Joining used to be a heading at the BOTTOM of the create
|
||||
form: someone sent a code had to scroll past fifteen fields they had no use for. -->
|
||||
<div class="lb-doors">
|
||||
<button id="lb-door-join" class="lb-door active" type="button">Join a game</button>
|
||||
<button id="lb-door-create" class="lb-door" type="button">Create a game</button>
|
||||
</div>
|
||||
|
||||
<h3>Seed</h3>
|
||||
<section id="lb-join-panel">
|
||||
<h2>Join a game</h2>
|
||||
<p class="ng-note">Ask whoever created the game for its code. You will see the whole rule set
|
||||
before you take a seat.</p>
|
||||
<label class="ng-num"><span>Game code</span><input id="lb-code" type="text" autocomplete="off" placeholder="RAIL-1234"></label>
|
||||
<button id="lb-look" type="button">Look up game</button>
|
||||
<p class="lb-error" id="lb-join-err" role="alert"></p>
|
||||
|
||||
<!-- Filled by `/api/lobby/preview` — the config, who is seated, and nothing else. The SEED is
|
||||
never in that response: it decides every shuffle in the game. -->
|
||||
<div id="lb-preview" hidden>
|
||||
<h3>Before you sit down</h3>
|
||||
<div class="lb-preview-head">
|
||||
<div class="lb-invite-code" id="lb-preview-code"></div>
|
||||
<div id="lb-preview-type" class="lb-type"></div>
|
||||
<div id="lb-preview-who" class="dim"></div>
|
||||
</div>
|
||||
<div id="lb-preview-rules" class="rules-list"></div>
|
||||
<button id="lb-join" type="button">Join this game</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="lb-create-panel" hidden>
|
||||
<h2>Create a new game</h2>
|
||||
<p class="ng-note">You become the host — you choose the game type and, once everyone is seated, start the game. 2 to 4 players.</p>
|
||||
|
||||
<!-- TWO COLUMNS WHERE THERE IS ROOM. One 640px-wide column made this form a very long scroll
|
||||
for what is really two short lists: what game this is, and what its rules are. -->
|
||||
<div class="lb-two">
|
||||
<div class="lb-col">
|
||||
|
||||
<!-- THE PARAMETERS, above the type. Changing one of these does NOT make the game Custom: the
|
||||
types are formulas in the table size and the length, so the Revenue floor re-derives and
|
||||
"Co-op, 3 players, 8 days" is still Co-op. -->
|
||||
<div class="lb-params">
|
||||
<label class="ng-num"><span>Seed</span>
|
||||
<input id="lb-seed" type="text" inputmode="numeric" autocomplete="off" placeholder="blank for a random seed"></label>
|
||||
<label class="ng-num"><span>Players at the table</span>
|
||||
<select id="lb-players">
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4" selected>4</option>
|
||||
</select></label>
|
||||
<label class="ng-num"><span>Days</span>
|
||||
<input id="lb-days" type="number" min="1" max="20" step="1" value="5"></label>
|
||||
</div>
|
||||
<p class="ng-note">The same seed and the same settings always deal the same railroad, so a game
|
||||
can be shared, compared or replayed. Leave it blank for a random one.</p>
|
||||
<input id="lb-seed" type="text" inputmode="numeric" autocomplete="off" placeholder="blank for a random seed">
|
||||
<!-- WITH THE TABLE SIZE IT IS ABOUT, not below the rules block — reported by Jesse, who found
|
||||
it separated from the control it explains by fifteen settings. -->
|
||||
<p class="ng-note">Every chair has to be taken before the game can start — by a person or by a
|
||||
bot. Pick the size of the table now; it cannot change once the game is created.</p>
|
||||
</div>
|
||||
|
||||
<div class="lb-col">
|
||||
<h3>Game type</h3>
|
||||
<div class="set-row" id="lb-type-row">
|
||||
<label class="ng-radio"><input type="radio" name="lb-type" value="solitaire">
|
||||
<span><b>Solitaire</b><br><span class="dim">One railroad, one player. The whole Division is yours to run.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="lb-type" value="coop" checked>
|
||||
<span><b>Co-op</b><br><span class="dim">Everyone’s Revenue is one table score. You win together or lose together.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="lb-type" value="competitive">
|
||||
<span><b>Competitive</b><br><span class="dim">Highest Revenue wins — unless the table misses its combined minimum, and then everyone loses.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="lb-type" value="cutthroat">
|
||||
<span><b>Cutthroat</b><br><span class="dim">Highest Revenue wins, and nothing is shared — the only way everyone loses is three collisions in one Day.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="lb-type" value="custom">
|
||||
<span><b>Custom</b><br><span class="dim">Whatever you set below. Selected for you the moment you change a rule; it is scored as the type you started from.</span></span></label>
|
||||
</div>
|
||||
|
||||
<p class="ng-note" id="lb-type-note"></p>
|
||||
</div>
|
||||
|
||||
<!-- FULL WIDTH WHEN IT OPENS. Reported by Jesse: opened inside the right-hand column it made a
|
||||
very long scroll with the left column standing empty beside it. It is a grid child of its
|
||||
own now, spanning both, and its five groups flow into as many columns as fit. -->
|
||||
<details id="lb-settings" class="lb-span">
|
||||
<summary>Game settings</summary>
|
||||
<p class="ng-note">Every rule the game type sets, and every one of them yours to change.
|
||||
Changing any of them selects <b>Custom</b>, which keeps the scoring of the type you
|
||||
started from; clicking a type again resets all of them back to it. They are fixed when the
|
||||
game is created and cannot be changed once it starts.</p>
|
||||
<div class="set-groups">
|
||||
|
||||
<div class="set-group">
|
||||
<h3>Starting hand</h3>
|
||||
<p class="ng-note">What each player is dealt before the first turn. The hand limit is three
|
||||
either way — deal six and the first turn is spent choosing which of them to keep.</p>
|
||||
<label class="ng-radio"><input type="radio" name="lb-hand" value="threeRandom" checked>
|
||||
<span>Three random cards</span></label>
|
||||
<label class="ng-radio"><input type="radio" name="lb-hand" value="sixRandom">
|
||||
<span>Six random cards</span></label>
|
||||
<label class="ng-radio"><input type="radio" name="lb-hand" value="threeTrackThreeOther">
|
||||
<span>Three track and three other</span></label>
|
||||
<div class="set-row" id="lb-hand-row">
|
||||
<label class="ng-radio"><input type="radio" name="lb-hand" value="threeRandom">
|
||||
<span><b>Three random cards</b><br><span class="dim">The original rule. At the hand limit already, and no guarantee of track.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="lb-hand" value="sixRandom" checked>
|
||||
<span><b>Six random cards</b><br><span class="dim">Twice the choice, still no guaranteed track — the first turn is a discard.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="lb-hand" value="threeTrackThreeOther">
|
||||
<span><b>Three random track and three random non-track cards</b><br><span class="dim">Dealt from two piles, so the district you can build is dealt rather than waited for.</span></span></label>
|
||||
<span class="set-hint" id="lb-hand-hint"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="set-group">
|
||||
<h3>Where an Extra may start</h3>
|
||||
<p class="ng-note">The player who plays an Extra Train card chooses where its Crew Tray goes,
|
||||
and the place decides which way it runs — a Division Point sends it away from itself; in the
|
||||
middle of the railroad the player picks east or west. The Division Points and the Interchange
|
||||
belong to nobody and are always available. Starting one inside a district is the part that
|
||||
favours a seat, so it is set here. An Office must be a Control Point whatever this says: a
|
||||
Whistle Post never qualifies.</p>
|
||||
<div class="set-row" id="lb-extra-row">
|
||||
<label class="ng-radio"><input type="radio" name="lb-extra" value="divisionPointsOnly">
|
||||
<span><b>Division Points and the Interchange only</b><br><span class="dim">The strictest reading. Every Extra begins on shared ground.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="lb-extra" value="ownOffice">
|
||||
<span><b>Also the playing player’s own Control Point</b><br><span class="dim">You may start one at home, but not in somebody else’s district.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="lb-extra" value="anyOffice">
|
||||
<span><b>Also any player’s Control Point</b><br><span class="dim">The most permissive — an Extra may be planted in another player’s district.</span></span></label>
|
||||
<span class="set-hint" id="lb-extra-hint"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="set-group">
|
||||
<h3>Revenue</h3>
|
||||
<p class="ng-note">What each piece of work pays, 0 to 5. Zero switches an economy off so the
|
||||
others can be read.</p>
|
||||
<label class="ng-num"><span>Passenger revenue per coach</span>
|
||||
<input id="lb-passenger" type="number" min="0" max="5" step="1" value="1"></label>
|
||||
<label class="ng-num"><span>Freight revenue per load</span>
|
||||
<input id="lb-freight" type="number" min="0" max="5" step="1" value="1"></label>
|
||||
<label class="ng-num"><span>Train revenue per transit</span>
|
||||
<input id="lb-transit" type="number" min="0" max="5" step="1" value="0"></label>
|
||||
<p class="ng-note">What each piece of work pays, 0 to 5. A coach pays when it is boarded and
|
||||
again when it is detrained; a load pays when it is made up and again when it is broken. Zero
|
||||
switches an economy off so the others can be read.</p>
|
||||
<div class="set-row" id="lb-passenger-row">
|
||||
<label class="ng-num"><span>Passenger revenue per coach</span>
|
||||
<input id="lb-passenger" type="number" min="0" max="5" step="1" value="1"></label>
|
||||
<span class="set-hint" id="lb-passenger-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="lb-freight-row">
|
||||
<label class="ng-num"><span>Freight revenue per load</span>
|
||||
<input id="lb-freight" type="number" min="0" max="5" step="1" value="1"></label>
|
||||
<span class="set-hint" id="lb-freight-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="lb-transit-row">
|
||||
<label class="ng-num"><span>Train revenue per transit</span>
|
||||
<input id="lb-transit" type="number" min="0" max="5" step="1" value="0"></label>
|
||||
<span class="set-hint" id="lb-transit-hint"></span>
|
||||
</div>
|
||||
<p class="ng-note">A transit pays every player, once, when a train runs off the end of the
|
||||
Division — the one thing nobody has to work for.</p>
|
||||
</div>
|
||||
|
||||
<div class="set-group">
|
||||
<h3>Victory conditions</h3>
|
||||
<p class="ng-note">How long the game runs, and the ways it can end. 0 turns any of these off.
|
||||
The combined-Revenue default is sized for the table you chose above.</p>
|
||||
<label class="ng-num"><span>Days</span>
|
||||
<input id="lb-days" type="number" min="1" max="20" step="1" value="5"></label>
|
||||
<label class="ng-num"><span>Minimum combined Revenue to avoid a loss</span>
|
||||
<input id="lb-minrev" type="number" min="0" step="1" value="60"></label>
|
||||
<label class="ng-num"><span>Collisions in one Day that end the game</span>
|
||||
<input id="lb-colday" type="number" min="0" step="1" value="3"></label>
|
||||
<label class="ng-num"><span>Collisions across the whole game that end it</span>
|
||||
<input id="lb-coltotal" type="number" min="0" step="1" value="5"></label>
|
||||
<label class="ng-num"><span>Allow the opponent-directed cards</span>
|
||||
<input id="lb-pvp" type="checkbox"></label>
|
||||
<p class="ng-note" id="lb-pvp-note">Not yet built (<code>TODO.md</code>) — this has no effect
|
||||
either way until then.</p>
|
||||
<p class="ng-note">The ways this game can end badly. Each one is switched on or off in its own
|
||||
right; how long the game runs is set above, with the table size.</p>
|
||||
<div class="set-row" id="lb-minrev-row">
|
||||
<label class="ng-gate"><input type="checkbox" id="lb-minrev-on" checked>
|
||||
<span>Everyone loses if combined Revenue at the end is under</span>
|
||||
<input id="lb-minrev" type="number" min="0" step="1" class="gate-num"></label>
|
||||
<span class="set-hint" id="lb-minrev-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="lb-colday-row">
|
||||
<label class="ng-gate"><input type="checkbox" id="lb-colday-on" checked>
|
||||
<span>The game ends and everyone loses if collisions in one Day reach</span>
|
||||
<input id="lb-colday" type="number" min="0" step="1" class="gate-num"></label>
|
||||
<span class="set-hint" id="lb-colday-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="lb-coltotal-row">
|
||||
<label class="ng-gate"><input type="checkbox" id="lb-coltotal-on" checked>
|
||||
<span>The game ends and everyone loses after this many collisions in the whole game</span>
|
||||
<input id="lb-coltotal" type="number" min="0" step="1" class="gate-num"></label>
|
||||
<span class="set-hint" id="lb-coltotal-hint"></span>
|
||||
</div>
|
||||
<p class="ng-note">The opponent-directed cards — Derail, Watertower, Hobo Jungle and the
|
||||
nineteen others, along with the seven that answer them — are not implemented yet, so no game
|
||||
type deals them whatever else is set here.</p>
|
||||
</div>
|
||||
|
||||
<div class="set-group">
|
||||
<h3>Optional rules</h3>
|
||||
<p class="ng-note">Appendix B. Off by default; each one changes how the game plays.</p>
|
||||
<label class="ng-num"><span>Reduced Visibility — five switching Moves instead of six in the
|
||||
night Stages (1–3 and 11–12)</span>
|
||||
<input id="lb-visibility" type="checkbox"></label>
|
||||
<label class="ng-num"><span>Employee Rotation — at the end of each Day everyone moves one chair
|
||||
left and takes over the next station up the line. Your Revenue and the Fedora go with you;
|
||||
the district stays where it is</span>
|
||||
<input id="lb-rotation" type="checkbox"></label>
|
||||
<label class="ng-num"><span>Emergency Toolbox — everyone starts holding a Red Flag, so a hand of
|
||||
four; play or discard down to three on the first turn</span>
|
||||
<input id="lb-toolbox" type="checkbox"></label>
|
||||
</details>
|
||||
<p class="ng-note">Every chair has to be taken before the game can start — by a person or by a
|
||||
bot. Pick the size of the table now; it cannot change once the game is created.</p>
|
||||
<button id="lb-create">Create game</button>
|
||||
<p class="dim" id="lb-create-err" role="alert"></p>
|
||||
<p class="ng-note">Off in every game type; each one changes how the game plays.</p>
|
||||
<div class="set-row" id="lb-visibility-row">
|
||||
<label class="ng-num"><span>Reduced Visibility — five switching Moves instead of six in the
|
||||
night Stages (1–3 and 11–12)</span>
|
||||
<input id="lb-visibility" type="checkbox"></label>
|
||||
<span class="set-hint" id="lb-visibility-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="lb-rotation-row">
|
||||
<label class="ng-num"><span>Employee Rotation — at the end of each Day everyone moves one
|
||||
chair left and takes over the next station up the line. Your Revenue and the Fedora go with
|
||||
you; the district stays where it is</span>
|
||||
<input id="lb-rotation" type="checkbox"></label>
|
||||
<span class="set-hint" id="lb-rotation-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="lb-toolbox-row">
|
||||
<label class="ng-num"><span>Emergency Toolbox — everyone starts holding a Red Flag, so a hand
|
||||
of four; play or discard down to three on the first turn</span>
|
||||
<input id="lb-toolbox" type="checkbox"></label>
|
||||
<span class="set-hint" id="lb-toolbox-hint"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>Join a game</h3>
|
||||
<p class="ng-note">Ask whoever created the game for its code.</p>
|
||||
<label class="ng-num"><span>Game code</span><input id="lb-code" type="text" autocomplete="off" placeholder="RAIL-1234"></label>
|
||||
<button id="lb-join">Join game</button>
|
||||
<p class="dim" id="lb-join-err" role="alert"></p>
|
||||
</div>
|
||||
</details>
|
||||
|
||||
<div class="lb-span">
|
||||
<button id="lb-create" type="button">Create game</button>
|
||||
<p class="lb-error" id="lb-create-err" role="alert"></p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<!-- Shown once created or joined, in place of the choice above, until the host starts the game. -->
|
||||
@@ -337,20 +552,28 @@ ul.blocked li{padding:2px 0}
|
||||
<h2>Seating</h2>
|
||||
<div class="lb-invite">
|
||||
<div>
|
||||
<div class="lb-invite-label">Send this code to your players</div>
|
||||
<div class="lb-invite-label">Send this to your players</div>
|
||||
<div class="lb-invite-code" id="lb-gamecode"></div>
|
||||
</div>
|
||||
<button id="lb-copy" class="ghost">Copy</button>
|
||||
<button id="lb-copy" class="ghost" type="button">Copy code</button>
|
||||
<button id="lb-copylink" class="ghost" type="button">Copy invite link</button>
|
||||
<span class="ng-note" id="lb-copied"></span>
|
||||
</div>
|
||||
<p class="ng-note">They enter it under <b>Join a game</b>, along with the same join secret you used.</p>
|
||||
<p class="ng-note">The host may fill an empty seat with a bot, and starts the game once every
|
||||
seat is either a player or a bot. <b>These chairs are not the running order</b> — who sits
|
||||
where along the Division is decided by a D12 roll when the game starts (§4.4), and the map
|
||||
shows the result.</p>
|
||||
<p class="ng-note">They enter the code under <b>Join a game</b>, along with the same join secret
|
||||
you used — the link carries the code, never the secret.</p>
|
||||
<p class="ng-note">The host may fill an empty seat with a bot or clear an occupied one, and
|
||||
starts the game once every seat is either a player or a bot. <b>These chairs are not the
|
||||
running order</b> — who sits where along the Division is decided by a D12 roll when the game
|
||||
starts, and the map shows the result.</p>
|
||||
<div id="lb-seats"></div>
|
||||
<p class="lb-warn" id="lb-stream-note" role="status" hidden></p>
|
||||
<button id="lb-start" disabled>Start game</button>
|
||||
<p class="dim" id="lb-start-note"></p>
|
||||
<button id="lb-leave" class="ghost" type="button">Leave</button>
|
||||
<p class="lb-error" id="lb-start-note" role="alert"></p>
|
||||
|
||||
<h3>The game you are in</h3>
|
||||
<div id="lb-seating-type" class="lb-type"></div>
|
||||
<div id="lb-seating-rules" class="rules-list"></div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
@@ -363,6 +586,14 @@ ul.blocked li{padding:2px 0}
|
||||
engine's guess at what your score ought to be were noise on the one line that must not wrap. -->
|
||||
<span id="objective" class="pace">—</span>
|
||||
<span class="dim">seed <span id="seed">—</span></span>
|
||||
<!-- THE GAME CODE SURVIVES THE LOBBY. It used to end at `Lobby.Start` — the code was never carried
|
||||
into `LobbyReady` — so a seated player could not say which game they were in, could not match
|
||||
it against the administrator's Games in Progress list, and could not pass it to a latecomer.
|
||||
Empty (and collapsed) in solitaire, where there is no code. -->
|
||||
<span class="dim" id="gamecode" title="The code this game was created under. The administrator's Games in Progress list uses it, and it is how you say which game you mean."></span>
|
||||
<!-- Co-op, Competitive, Cutthroat or Custom, derived from the config the Frame carries
|
||||
(`presets.ts`). A Cutthroat game used to look exactly like a Co-op one from the board. -->
|
||||
<span class="dim" id="gametype" title=""></span>
|
||||
<!-- WHICH RULES THIS GAME IS BEING PLAYED UNDER. The settings are chosen when the game is dealt
|
||||
and then never mentioned again, which makes a playtest note ("scored 4") unreadable a week
|
||||
later: at 0 revenue per transit that is a different game from the same seed at 5. Short enough
|
||||
@@ -379,6 +610,12 @@ ul.blocked li{padding:2px 0}
|
||||
<button id="savefile" title="Download this game as a save file you can replay or share">Save replay</button>
|
||||
<button id="newgame" title="Deal a fresh game. You choose the seed, the opening hand and what the three economies pay. Undo steps back one action at a time; this throws the whole game away, so download the replay first if you want to keep it.">New game</button>
|
||||
<button id="multiplayer" title="Create or join a Competitive or Co-op game on this server, with other players.">Multiplayer</button>
|
||||
<!-- LEAVING A RUNNING GAME. Reported by Jesse 2026-08-23: "if I'm a player in the middle of the
|
||||
game and I need to leave, how do I leave the game, clear the token from my browser so I can
|
||||
play a different game later?" There was no way at all — the page rejoined the same game on
|
||||
every load and nothing let go of it. This keeps your seat — the table waits for you — and
|
||||
your token, and puts you back at the lobby, which lists every game this browser is in. -->
|
||||
<button id="leavegame" hidden title="Go back to the lobby. Your seat is kept and the game waits for you — the lobby lists it under Games you are in, so you can come back or hand the browser to a different game.">Leave game</button>
|
||||
<a class="home" href="./replays.html" style="font-size:12px">replays</a>
|
||||
<span class="dim build" title="what is actually deployed">__BUILD__</span>
|
||||
</header>
|
||||
@@ -471,60 +708,152 @@ ul.blocked li{padding:2px 0}
|
||||
<form method="dialog" id="newgameform">
|
||||
<h2 class="big" id="ng-title">New game</h2>
|
||||
|
||||
<!-- THE SAME BLOCK THE LOBBY USES, same shared module, same order — the two screens are one
|
||||
design. Only Solitaire can be dealt here; the multiplayer types are shown disabled rather
|
||||
than hidden, so what this screen offers and what the lobby offers read as one list. -->
|
||||
<div class="lb-params">
|
||||
<label class="ng-num"><span>Seed</span>
|
||||
<input id="ng-seed" type="text" inputmode="numeric" autocomplete="off" placeholder="blank for a random seed"></label>
|
||||
<label class="ng-num"><span>Days</span>
|
||||
<input id="ng-days" type="number" min="1" max="20" step="1" value="5"></label>
|
||||
</div>
|
||||
<p class="ng-note">The same seed and the same settings always deal the same railroad, so a game
|
||||
can be shared, compared or replayed. Leave it blank for a random one.</p>
|
||||
|
||||
<h3>Game type</h3>
|
||||
<p class="ng-note">Picking a type just sets the fields below to that type's defaults — every number stays yours to change afterward. Solitaire is the only type that can be dealt today; Competitive and Co-op need a server (coming soon).</p>
|
||||
<label class="ng-radio"><input type="radio" name="ng-mode" value="solitaire" checked>
|
||||
<span><b>Solitaire</b><br><span class="dim">One railroad, one player. Everything below is real today.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-mode" value="competitive">
|
||||
<span><b>Competitive</b><br><span class="dim">Highest Revenue wins, unless the table misses the combined minimum — then everyone loses.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-mode" value="coop">
|
||||
<span><b>Co-op</b><br><span class="dim">Everyone's Revenue counts as one table score, against the same kind of combined minimum.</span></span></label>
|
||||
<div class="set-row" id="ng-type-row">
|
||||
<label class="ng-radio"><input type="radio" name="ng-type" value="solitaire">
|
||||
<span><b>Solitaire</b><br><span class="dim">One railroad, one player. The whole Division is yours to run.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-type" value="coop" checked>
|
||||
<span><b>Co-op</b><br><span class="dim">Everyone’s Revenue is one table score. You win together or lose together.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-type" value="competitive">
|
||||
<span><b>Competitive</b><br><span class="dim">Highest Revenue wins — unless the table misses its combined minimum, and then everyone loses.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-type" value="cutthroat">
|
||||
<span><b>Cutthroat</b><br><span class="dim">Highest Revenue wins, and nothing is shared — the only way everyone loses is three collisions in one Day.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-type" value="custom">
|
||||
<span><b>Custom</b><br><span class="dim">Whatever you set below. Selected for you the moment you change a rule; it is scored as the type you started from.</span></span></label>
|
||||
</div>
|
||||
|
||||
<h3>Seed</h3>
|
||||
<p class="ng-note">The same seed and the same settings always deal the same railroad, so a game can be shared, compared or replayed. Leave it blank for a random one.</p>
|
||||
<input id="ng-seed" type="text" inputmode="numeric" autocomplete="off" placeholder="blank for a random seed">
|
||||
<p class="ng-note" id="ng-type-note"></p>
|
||||
|
||||
<h3>Starting hand</h3>
|
||||
<p class="ng-note">What each player is dealt before the first turn. The hand limit is three either way — deal six and the first turn is spent choosing which of them to keep.</p>
|
||||
<label class="ng-radio"><input type="radio" name="ng-hand" value="threeRandom" checked>
|
||||
<span><b>Three random cards</b><br><span class="dim">The original rule. At the hand limit already, and no guarantee of track.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-hand" value="sixRandom">
|
||||
<span><b>Six random cards</b><br><span class="dim">Twice the choice, still no guaranteed track — the first turn is a discard.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-hand" value="threeTrackThreeOther">
|
||||
<span><b>Three random track and three random non-track cards</b><br><span class="dim">Dealt from two piles, so the district you can build is dealt rather than waited for.</span></span></label>
|
||||
<details id="ng-settings" open>
|
||||
<summary>Game settings</summary>
|
||||
<p class="ng-note">Every rule the game type sets, and every one of them yours to change.
|
||||
Changing any of them selects <b>Custom</b>; clicking a type again resets all of them back
|
||||
to it.</p>
|
||||
<div class="set-groups">
|
||||
|
||||
<h3>Where an Extra may start</h3>
|
||||
<p class="ng-note">The player who plays an Extra Train card chooses where its Crew Tray goes, and the place decides which way it runs — a Division Point sends it away from itself; in the middle of the railroad the player picks east or west. The Division Points and the Interchange belong to nobody and are always available. Starting one inside a district is the part that favours a seat, so it is set here. An Office must be a Control Point whatever this says: a Whistle Post never qualifies.</p>
|
||||
<label class="ng-radio"><input type="radio" name="ng-extra" value="divisionPointsOnly">
|
||||
<span><b>Division Points and the Interchange only</b><br><span class="dim">The strictest reading of §7. Every Extra begins on shared ground.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-extra" value="ownOffice">
|
||||
<span><b>Also the playing player’s own Control Point</b><br><span class="dim">You may start one at home, but not in somebody else’s district.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-extra" value="anyOffice" checked>
|
||||
<span><b>Also any player’s Control Point</b><br><span class="dim">The most permissive, and what the game did before this setting existed.</span></span></label>
|
||||
<div class="set-group">
|
||||
<h3>Starting hand</h3>
|
||||
<p class="ng-note">What each player is dealt before the first turn. The hand limit is three
|
||||
either way — deal six and the first turn is spent choosing which of them to keep.</p>
|
||||
<div class="set-row" id="ng-hand-row">
|
||||
<label class="ng-radio"><input type="radio" name="ng-hand" value="threeRandom">
|
||||
<span><b>Three random cards</b><br><span class="dim">The original rule. At the hand limit already, and no guarantee of track.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-hand" value="sixRandom" checked>
|
||||
<span><b>Six random cards</b><br><span class="dim">Twice the choice, still no guaranteed track — the first turn is a discard.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-hand" value="threeTrackThreeOther">
|
||||
<span><b>Three random track and three random non-track cards</b><br><span class="dim">Dealt from two piles, so the district you can build is dealt rather than waited for.</span></span></label>
|
||||
<span class="set-hint" id="ng-hand-hint"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>Revenue</h3>
|
||||
<p class="ng-note">What each piece of work pays, 0 to 5. A coach pays when it is boarded and again when it is detrained; a load pays when it is made up and again when it is broken. Zero switches an economy off so the others can be read.</p>
|
||||
<label class="ng-num"><span>Passenger revenue per coach</span>
|
||||
<input id="ng-passenger" type="number" min="0" max="5" step="1" value="1"></label>
|
||||
<label class="ng-num"><span>Freight revenue per load</span>
|
||||
<input id="ng-freight" type="number" min="0" max="5" step="1" value="1"></label>
|
||||
<label class="ng-num"><span>Train revenue per transit</span>
|
||||
<input id="ng-transit" type="number" min="0" max="5" step="1" value="0"></label>
|
||||
<p class="ng-note">A transit pays every player, once, when a train runs off the end of the Division — the one thing nobody has to work for. It defaults to 0 for that reason.</p>
|
||||
<div class="set-group">
|
||||
<h3>Where an Extra may start</h3>
|
||||
<p class="ng-note">The player who plays an Extra Train card chooses where its Crew Tray goes,
|
||||
and the place decides which way it runs — a Division Point sends it away from itself; in the
|
||||
middle of the railroad the player picks east or west. The Division Points and the Interchange
|
||||
belong to nobody and are always available. Starting one inside a district is the part that
|
||||
favours a seat, so it is set here. An Office must be a Control Point whatever this says: a
|
||||
Whistle Post never qualifies.</p>
|
||||
<div class="set-row" id="ng-extra-row">
|
||||
<label class="ng-radio"><input type="radio" name="ng-extra" value="divisionPointsOnly">
|
||||
<span><b>Division Points and the Interchange only</b><br><span class="dim">The strictest reading. Every Extra begins on shared ground.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-extra" value="ownOffice">
|
||||
<span><b>Also the playing player’s own Control Point</b><br><span class="dim">You may start one at home, but not in somebody else’s district.</span></span></label>
|
||||
<label class="ng-radio"><input type="radio" name="ng-extra" value="anyOffice">
|
||||
<span><b>Also any player’s Control Point</b><br><span class="dim">The most permissive — an Extra may be planted in another player’s district.</span></span></label>
|
||||
<span class="set-hint" id="ng-extra-hint"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>Victory conditions</h3>
|
||||
<p class="ng-note">How long the game runs, and the ways it can end. 0 turns any of these off. The combined-Revenue suggestion updates for Competitive/Co-op — it assumes a 4-player table until there's a lobby to ask who's actually seated.</p>
|
||||
<label class="ng-num"><span>Days</span>
|
||||
<input id="ng-days" type="number" min="1" max="20" step="1" value="5"></label>
|
||||
<label class="ng-num"><span>Minimum combined Revenue to avoid a loss</span>
|
||||
<input id="ng-minrev" type="number" min="0" step="1" value="15"></label>
|
||||
<label class="ng-num"><span>Collisions in one Day that end the game</span>
|
||||
<input id="ng-colday" type="number" min="0" step="1" value="3"></label>
|
||||
<label class="ng-num"><span>Collisions across the whole game that end it</span>
|
||||
<input id="ng-coltotal" type="number" min="0" step="1" value="5"></label>
|
||||
<label class="ng-num"><span>Allow the opponent-directed cards</span>
|
||||
<input id="ng-pvp" type="checkbox"></label>
|
||||
<p class="ng-note" id="ng-pvp-note">Not yet built (<code>TODO.md</code>) — this has no effect either way until then.</p>
|
||||
<div class="set-group">
|
||||
<h3>Revenue</h3>
|
||||
<p class="ng-note">What each piece of work pays, 0 to 5. A coach pays when it is boarded and
|
||||
again when it is detrained; a load pays when it is made up and again when it is broken. Zero
|
||||
switches an economy off so the others can be read.</p>
|
||||
<div class="set-row" id="ng-passenger-row">
|
||||
<label class="ng-num"><span>Passenger revenue per coach</span>
|
||||
<input id="ng-passenger" type="number" min="0" max="5" step="1" value="1"></label>
|
||||
<span class="set-hint" id="ng-passenger-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="ng-freight-row">
|
||||
<label class="ng-num"><span>Freight revenue per load</span>
|
||||
<input id="ng-freight" type="number" min="0" max="5" step="1" value="1"></label>
|
||||
<span class="set-hint" id="ng-freight-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="ng-transit-row">
|
||||
<label class="ng-num"><span>Train revenue per transit</span>
|
||||
<input id="ng-transit" type="number" min="0" max="5" step="1" value="0"></label>
|
||||
<span class="set-hint" id="ng-transit-hint"></span>
|
||||
</div>
|
||||
<p class="ng-note">A transit pays every player, once, when a train runs off the end of the
|
||||
Division — the one thing nobody has to work for.</p>
|
||||
</div>
|
||||
|
||||
<div class="set-group">
|
||||
<h3>Victory conditions</h3>
|
||||
<p class="ng-note">The ways this game can end badly. Each one is switched on or off in its own
|
||||
right; how long the game runs is set above, with the table size.</p>
|
||||
<div class="set-row" id="ng-minrev-row">
|
||||
<label class="ng-gate"><input type="checkbox" id="ng-minrev-on" checked>
|
||||
<span>Everyone loses if combined Revenue at the end is under</span>
|
||||
<input id="ng-minrev" type="number" min="0" step="1" class="gate-num"></label>
|
||||
<span class="set-hint" id="ng-minrev-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="ng-colday-row">
|
||||
<label class="ng-gate"><input type="checkbox" id="ng-colday-on" checked>
|
||||
<span>The game ends and everyone loses if collisions in one Day reach</span>
|
||||
<input id="ng-colday" type="number" min="0" step="1" class="gate-num"></label>
|
||||
<span class="set-hint" id="ng-colday-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="ng-coltotal-row">
|
||||
<label class="ng-gate"><input type="checkbox" id="ng-coltotal-on" checked>
|
||||
<span>The game ends and everyone loses after this many collisions in the whole game</span>
|
||||
<input id="ng-coltotal" type="number" min="0" step="1" class="gate-num"></label>
|
||||
<span class="set-hint" id="ng-coltotal-hint"></span>
|
||||
</div>
|
||||
<p class="ng-note">The opponent-directed cards — Derail, Watertower, Hobo Jungle and the
|
||||
nineteen others, along with the seven that answer them — are not implemented yet, so no game
|
||||
type deals them whatever else is set here.</p>
|
||||
</div>
|
||||
|
||||
<div class="set-group">
|
||||
<h3>Optional rules</h3>
|
||||
<p class="ng-note">Off in every game type; each one changes how the game plays.</p>
|
||||
<div class="set-row" id="ng-visibility-row">
|
||||
<label class="ng-num"><span>Reduced Visibility — five switching Moves instead of six in the
|
||||
night Stages (1–3 and 11–12)</span>
|
||||
<input id="ng-visibility" type="checkbox"></label>
|
||||
<span class="set-hint" id="ng-visibility-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="ng-rotation-row">
|
||||
<label class="ng-num"><span>Employee Rotation — at the end of each Day everyone moves one
|
||||
chair left and takes over the next station up the line. Your Revenue and the Fedora go with
|
||||
you; the district stays where it is</span>
|
||||
<input id="ng-rotation" type="checkbox"></label>
|
||||
<span class="set-hint" id="ng-rotation-hint"></span>
|
||||
</div>
|
||||
<div class="set-row" id="ng-toolbox-row">
|
||||
<label class="ng-num"><span>Emergency Toolbox — everyone starts holding a Red Flag, so a hand
|
||||
of four; play or discard down to three on the first turn</span>
|
||||
<input id="ng-toolbox" type="checkbox"></label>
|
||||
<span class="set-hint" id="ng-toolbox-hint"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</details>
|
||||
|
||||
<menu class="ng-buttons">
|
||||
<span class="ng-note" id="ng-multiplayer-note" style="margin:0 auto 0 0">Use the <b>Multiplayer</b> button instead — it creates or joins a game on this server.</span>
|
||||
@@ -534,6 +863,18 @@ ul.blocked li{padding:2px 0}
|
||||
</form>
|
||||
</dialog>
|
||||
|
||||
<!-- THE HANDOFF, between `Lobby.Start` and the first Frame.
|
||||
`beginRemote` used to write "… connecting to the game" into `#presence` — the DISCONNECT banner,
|
||||
whose job is `⚠ waiting on Alice`. It worked only because the first render overwrote it, and it
|
||||
had nothing to say when the first push never came. This is its own state: it opens on the way
|
||||
into a game, holds a deliberate beat so the game visibly begins, and closes on the first Frame. -->
|
||||
<div id="handoff">
|
||||
<div class="hand-inner">
|
||||
<h2 id="handoff-title">Dealing the railroad…</h2>
|
||||
<div id="handoff-note" class="hand-note"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="module" src="./web/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -0,0 +1,351 @@
|
||||
/**
|
||||
* THE FOUR GAME TYPES, and what "Custom" means.
|
||||
*
|
||||
* Jesse's design, 2026-08-23. A game type is not a mode and not a ruleset — it is a NAMED SET OF
|
||||
* DEFAULTS that the host may then edit. Editing any of them selects `custom`, which keeps the
|
||||
* values and inherits the scoring of the type it was edited away from; clicking a named type again
|
||||
* resets every rule back to it.
|
||||
*
|
||||
* WHY THIS FILE EXISTS RATHER THAN A CONSTANT IN EACH SCREEN. The lobby (`lobby.ts`) and the
|
||||
* solitaire New Game dialog (`main.ts`) ask the same questions, and they had already drifted apart
|
||||
* before this was written: the dialog had "where an Extra may start" and no optional rules, the
|
||||
* lobby had the optional rules and no Extra rule — so a multiplayer game silently played the most
|
||||
* permissive Extra rule and nobody was ever asked. One description of the defaults, imported by
|
||||
* both, is what stops that happening a third time.
|
||||
*
|
||||
* PARAMETERS ARE NOT SETTINGS. Seed, player count and Day count sit ABOVE the type radios on both
|
||||
* screens and never select `custom`: the presets are formulas in players and days, so "Co-op, 3
|
||||
* players, 8 days" is still Co-op and its Revenue floor re-derives. Everything below the radios is
|
||||
* a rule, and changing one is what makes a game Custom.
|
||||
*/
|
||||
|
||||
import {
|
||||
DEFAULT_MAX_COLLISIONS_PER_DAY,
|
||||
DEFAULT_MAX_COLLISIONS_TOTAL,
|
||||
collectiveRevenueFloor,
|
||||
houseRules,
|
||||
} from '../engine/content.ts';
|
||||
import type { ExtraStartRule, RevenueRules, StartingHand } from '../engine/content.ts';
|
||||
import type { GameConfig, GameMode } from '../engine/state.ts';
|
||||
|
||||
export type PresetName = 'solitaire' | 'coop' | 'competitive' | 'cutthroat';
|
||||
/** What the radio group answers: one of the four named types, or the state of having edited one. */
|
||||
export type GameType = PresetName | 'custom';
|
||||
|
||||
/**
|
||||
* Every rule a game type sets, flattened to one value per control.
|
||||
*
|
||||
* Flat rather than shaped like `GameConfig` because this is what the FORM compares against: each key
|
||||
* is one field on screen, so "which fields differ from the preset" is a key-by-key comparison rather
|
||||
* than a walk through nested objects. `configFromSettings` puts the shape back.
|
||||
*/
|
||||
export type Settings = {
|
||||
startingHand: StartingHand;
|
||||
extraStart: ExtraStartRule;
|
||||
passengerPerCoach: number;
|
||||
freightPerLoad: number;
|
||||
trainPerTransit: number;
|
||||
/** 0 means the condition is off — the engine's convention (`state.ts`). The form draws a checkbox. */
|
||||
minCombinedRevenue: number;
|
||||
maxCollisionsPerDay: number;
|
||||
maxCollisionsTotal: number;
|
||||
reducedVisibility: boolean;
|
||||
employeeRotation: boolean;
|
||||
emergencyToolbox: boolean;
|
||||
};
|
||||
|
||||
export const SETTING_KEYS: readonly (keyof Settings)[] = [
|
||||
'startingHand',
|
||||
'extraStart',
|
||||
'passengerPerCoach',
|
||||
'freightPerLoad',
|
||||
'trainPerTransit',
|
||||
'minCombinedRevenue',
|
||||
'maxCollisionsPerDay',
|
||||
'maxCollisionsTotal',
|
||||
'reducedVisibility',
|
||||
'employeeRotation',
|
||||
'emergencyToolbox',
|
||||
];
|
||||
|
||||
export type Preset = {
|
||||
name: PresetName;
|
||||
label: string;
|
||||
/** One line under the radio, saying what winning and losing mean in this type. */
|
||||
blurb: string;
|
||||
/** The engine mode this type is scored under — what a `custom` game inherits. */
|
||||
scoring: GameMode;
|
||||
/**
|
||||
* Whether the 22 opponent-directed cards would be dealt, once they exist. Not a form control any
|
||||
* more: it is a property of the type (`TODO.md` — the cards are unbuilt, so `buildDeck` holds them
|
||||
* out regardless, and a checkbox that cannot do anything is worse than a sentence saying so).
|
||||
*/
|
||||
pvpCards: boolean;
|
||||
/**
|
||||
* The Revenue floor this type asks for, as a function of the table and the length. Co-op keeps the
|
||||
* engine's own `collectiveRevenueFloor` (3 per player per Day); Competitive asks two thirds of it,
|
||||
* because a table racing each other is not also pulling in one direction; Cutthroat asks nothing.
|
||||
*/
|
||||
revenueFloor: (players: number, days: number) => number;
|
||||
rules: Omit<Settings, 'minCombinedRevenue'>;
|
||||
};
|
||||
|
||||
const NO_OPTIONAL_RULES = {
|
||||
reducedVisibility: false,
|
||||
employeeRotation: false,
|
||||
emergencyToolbox: false,
|
||||
} as const;
|
||||
|
||||
/** Every type deals six now (Jesse, 2026-08-23) — the hand limit is three, so the first turn is a
|
||||
* discard whichever three you keep. Solitaire moved with the rest so the two screens agree. */
|
||||
const SIX: StartingHand = 'sixRandom';
|
||||
|
||||
export const PRESETS: readonly Preset[] = [
|
||||
{
|
||||
name: 'solitaire',
|
||||
label: 'Solitaire',
|
||||
blurb: 'One railroad, one player. The whole Division is yours to run.',
|
||||
scoring: 'solitaire',
|
||||
pvpCards: false,
|
||||
revenueFloor: (players, days) => collectiveRevenueFloor(players, days),
|
||||
rules: {
|
||||
startingHand: SIX,
|
||||
// Nobody else's district exists, so "any Control Point" and "your own" are the same rule.
|
||||
extraStart: 'anyOffice',
|
||||
passengerPerCoach: 1,
|
||||
freightPerLoad: 1,
|
||||
trainPerTransit: 0,
|
||||
maxCollisionsPerDay: DEFAULT_MAX_COLLISIONS_PER_DAY,
|
||||
maxCollisionsTotal: DEFAULT_MAX_COLLISIONS_TOTAL,
|
||||
...NO_OPTIONAL_RULES,
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'coop',
|
||||
label: 'Co-op',
|
||||
blurb: 'Everyone’s Revenue is one table score. You win together or lose together.',
|
||||
scoring: 'coop',
|
||||
// Never, even once the cards are built: there is no opponent to point them at when the table is
|
||||
// one side.
|
||||
pvpCards: false,
|
||||
revenueFloor: (players, days) => collectiveRevenueFloor(players, days),
|
||||
rules: {
|
||||
startingHand: SIX,
|
||||
extraStart: 'ownOffice',
|
||||
passengerPerCoach: 1,
|
||||
freightPerLoad: 1,
|
||||
// The one economy that pays every player at once, for work nobody had to do — which is the
|
||||
// co-operative one, so it is the type that switches it on.
|
||||
trainPerTransit: 1,
|
||||
maxCollisionsPerDay: DEFAULT_MAX_COLLISIONS_PER_DAY,
|
||||
maxCollisionsTotal: DEFAULT_MAX_COLLISIONS_TOTAL,
|
||||
...NO_OPTIONAL_RULES,
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'competitive',
|
||||
label: 'Competitive',
|
||||
blurb: 'Highest Revenue wins — unless the table misses its combined minimum, and then everyone loses.',
|
||||
scoring: 'competitive',
|
||||
pvpCards: true,
|
||||
revenueFloor: (players, days) => 2 * players * days,
|
||||
rules: {
|
||||
startingHand: SIX,
|
||||
extraStart: 'ownOffice',
|
||||
passengerPerCoach: 1,
|
||||
freightPerLoad: 1,
|
||||
trainPerTransit: 0,
|
||||
maxCollisionsPerDay: DEFAULT_MAX_COLLISIONS_PER_DAY,
|
||||
maxCollisionsTotal: DEFAULT_MAX_COLLISIONS_TOTAL,
|
||||
...NO_OPTIONAL_RULES,
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'cutthroat',
|
||||
label: 'Cutthroat',
|
||||
blurb: 'Highest Revenue wins, and nothing is shared — the only way everyone loses is three collisions in one Day.',
|
||||
scoring: 'competitive',
|
||||
pvpCards: true,
|
||||
// Off. Cutthroat has no collective obligation of any kind.
|
||||
revenueFloor: () => 0,
|
||||
rules: {
|
||||
startingHand: SIX,
|
||||
// The one type that lets you plant an Extra in somebody else's district.
|
||||
extraStart: 'anyOffice',
|
||||
passengerPerCoach: 1,
|
||||
freightPerLoad: 1,
|
||||
trainPerTransit: 0,
|
||||
maxCollisionsPerDay: DEFAULT_MAX_COLLISIONS_PER_DAY,
|
||||
// Off, with the per-Day check left standing: a table can bleed collisions all game, but three
|
||||
// in one Day still ends it.
|
||||
maxCollisionsTotal: 0,
|
||||
...NO_OPTIONAL_RULES,
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
export function preset(name: PresetName): Preset {
|
||||
const found = PRESETS.find((p) => p.name === name);
|
||||
if (!found) throw new Error(`no such preset: ${name}`);
|
||||
return found;
|
||||
}
|
||||
|
||||
/** Every rule a named type sets, at the table size and length the form currently shows. */
|
||||
export function presetSettings(name: PresetName, players: number, days: number): Settings {
|
||||
const p = preset(name);
|
||||
return { ...p.rules, minCombinedRevenue: p.revenueFloor(players, days) };
|
||||
}
|
||||
|
||||
/** The settings a config is actually carrying — the other half of every comparison below. */
|
||||
export function settingsOf(config: GameConfig): Settings {
|
||||
const rules = houseRules(config);
|
||||
return {
|
||||
startingHand: rules.startingHand,
|
||||
extraStart: rules.extraStart,
|
||||
passengerPerCoach: rules.revenue.passengerPerCoach,
|
||||
freightPerLoad: rules.revenue.freightPerLoad,
|
||||
trainPerTransit: rules.revenue.trainPerTransit,
|
||||
minCombinedRevenue: config.minCombinedRevenue,
|
||||
maxCollisionsPerDay: config.maxCollisionsPerDay,
|
||||
maxCollisionsTotal: config.maxCollisionsTotal,
|
||||
reducedVisibility: config.optionalRules.reducedVisibility,
|
||||
employeeRotation: config.optionalRules.employeeRotation,
|
||||
emergencyToolbox: config.optionalRules.emergencyToolbox,
|
||||
};
|
||||
}
|
||||
|
||||
/** Which controls differ from a named type — what the form paints amber and counts in its summary. */
|
||||
export function differencesFrom(
|
||||
name: PresetName,
|
||||
settings: Settings,
|
||||
players: number,
|
||||
days: number,
|
||||
): (keyof Settings)[] {
|
||||
const want = presetSettings(name, players, days);
|
||||
return SETTING_KEYS.filter((k) => settings[k] !== want[k]);
|
||||
}
|
||||
|
||||
/**
|
||||
* WHICH TYPE IS THIS, derived rather than stored.
|
||||
*
|
||||
* Nothing writes a type name into `GameConfig` — a saved game is its numbers, and a name in the save
|
||||
* would be one more thing that can disagree with them. So the screens ask this instead, which means
|
||||
* a hand-tuned game that happens to match Competitive exactly reads as Competitive, and that is the
|
||||
* honest answer: it IS one.
|
||||
*
|
||||
* `mode` is part of the comparison, so a Co-op game whose dials happen to equal Competitive's is
|
||||
* still not Competitive.
|
||||
*/
|
||||
export function presetOf(config: GameConfig, players: number, days: number): GameType {
|
||||
const settings = settingsOf(config);
|
||||
const match = PRESETS.find(
|
||||
(p) => p.scoring === config.mode && differencesFrom(p.name, settings, players, days).length === 0,
|
||||
);
|
||||
return match?.name ?? 'custom';
|
||||
}
|
||||
|
||||
/**
|
||||
* A `Frame`'s copy of the config, as a `GameConfig` the functions above can read.
|
||||
*
|
||||
* The page has a Frame, never a `GameState` — a remote client holds no game — and the Frame carries
|
||||
* every field these comparisons need. Structurally typed rather than importing `Frame` so this
|
||||
* module stays free of `sim/view.ts`.
|
||||
*/
|
||||
export function configFromFrame(f: {
|
||||
mode: GameMode;
|
||||
days: number;
|
||||
minCombinedRevenue: number;
|
||||
maxCollisionsPerDay: number;
|
||||
maxCollisionsTotal: number;
|
||||
optionalRules: GameConfig['optionalRules'];
|
||||
houseRules: { startingHand: StartingHand; extraStart: ExtraStartRule; revenue: RevenueRules };
|
||||
}): GameConfig {
|
||||
return {
|
||||
mode: f.mode,
|
||||
days: f.days,
|
||||
minCombinedRevenue: f.minCombinedRevenue,
|
||||
maxCollisionsPerDay: f.maxCollisionsPerDay,
|
||||
maxCollisionsTotal: f.maxCollisionsTotal,
|
||||
// Never shown from a Frame — the cards are unbuilt, and the type carries the answer.
|
||||
pvpCardsAllowed: false,
|
||||
optionalRules: f.optionalRules,
|
||||
houseRules: {
|
||||
startingHand: f.houseRules.startingHand,
|
||||
extraStart: f.houseRules.extraStart,
|
||||
revenue: f.houseRules.revenue,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* The named type a config is NEAREST to, for a screen that has to describe someone else's game.
|
||||
*
|
||||
* The create form always knows which type was clicked, so it compares against that. A join preview
|
||||
* and the seating screen do not — they are handed a finished config and nothing else — and "Custom"
|
||||
* on its own tells a player nothing about what they are joining. Comparing against the same-scoring
|
||||
* type with the fewest differences answers the question they actually have: how far from a normal
|
||||
* game is this, and which normal game?
|
||||
*/
|
||||
export function closestPreset(
|
||||
config: GameConfig,
|
||||
players: number,
|
||||
days: number,
|
||||
): { name: PresetName; differing: (keyof Settings)[] } {
|
||||
const settings = settingsOf(config);
|
||||
const candidates = PRESETS.filter((p) => p.scoring === config.mode);
|
||||
const scored = (candidates.length > 0 ? candidates : PRESETS).map((p) => ({
|
||||
name: p.name,
|
||||
differing: differencesFrom(p.name, settings, players, days),
|
||||
}));
|
||||
return scored.reduce((best, c) => (c.differing.length < best.differing.length ? c : best));
|
||||
}
|
||||
|
||||
/**
|
||||
* The label a screen shows for the current state of the form — including what a Custom game is being
|
||||
* scored as, which is the one thing a player cannot see from the dials.
|
||||
*/
|
||||
export function gameTypeLabel(type: GameType, scoring: GameMode): string {
|
||||
if (type !== 'custom') return preset(type).label;
|
||||
const named = PRESETS.find((p) => p.scoring === scoring && p.name !== 'cutthroat');
|
||||
return `Custom — scored as ${named?.label ?? scoring}`;
|
||||
}
|
||||
|
||||
/** Assembles the config a form's answers describe. `players` reaches the caller separately: it sizes
|
||||
* the lobby's seat array rather than being part of the rules. */
|
||||
export function configFromSettings(
|
||||
settings: Settings,
|
||||
scoring: GameMode,
|
||||
days: number,
|
||||
pvpCards: boolean,
|
||||
): GameConfig {
|
||||
return {
|
||||
mode: scoring,
|
||||
days,
|
||||
minCombinedRevenue: settings.minCombinedRevenue,
|
||||
maxCollisionsPerDay: settings.maxCollisionsPerDay,
|
||||
maxCollisionsTotal: settings.maxCollisionsTotal,
|
||||
// Inert until the cards are built (`setup.ts`'s `buildDeck` ANDs it with `cardsImplemented`),
|
||||
// and no longer a control on any screen — it is a property of the game type.
|
||||
pvpCardsAllowed: pvpCards,
|
||||
optionalRules: {
|
||||
reducedVisibility: settings.reducedVisibility,
|
||||
employeeRotation: settings.employeeRotation,
|
||||
emergencyToolbox: settings.emergencyToolbox,
|
||||
},
|
||||
houseRules: {
|
||||
startingHand: settings.startingHand,
|
||||
extraStart: settings.extraStart,
|
||||
revenue: {
|
||||
passengerPerCoach: settings.passengerPerCoach,
|
||||
freightPerLoad: settings.freightPerLoad,
|
||||
trainPerTransit: settings.trainPerTransit,
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
/** The whole config a named type produces, with nothing edited. */
|
||||
export function configFromPreset(name: PresetName, players: number, days: number): GameConfig {
|
||||
const p = preset(name);
|
||||
return configFromSettings(presetSettings(name, players, days), p.scoring, days, p.pvpCards);
|
||||
}
|
||||
+4
-1
@@ -117,7 +117,10 @@ function show(i: number): void {
|
||||
// A replay carries the seat names in the frame's own lines rather than a player table, so the
|
||||
// solitaire seat is named directly; a multi-player replay reports the index it has.
|
||||
const actorName = f.actor === null ? null : `Player ${f.actor + 1}`;
|
||||
$('turnchart').innerHTML = turnChartHtml(f, actorName);
|
||||
// A replay of a multi-player game gets the Fedora too — it is the answer to "why is it asking
|
||||
// THEM", which a replay raises exactly as a live game does.
|
||||
const superName = f.players.length > 1 ? `Player ${f.superintendent + 1}` : null;
|
||||
$('turnchart').innerHTML = turnChartHtml(f, actorName, superName);
|
||||
$('vrev').textContent = String(f.revenue);
|
||||
$('vpos').textContent = `${at} / ${steps.length - 1}`;
|
||||
($('vscrub') as HTMLInputElement).value = String(at);
|
||||
|
||||
+74
-10
@@ -99,9 +99,23 @@ export type Session = {
|
||||
* the seat and waits; this is what lets the page say why, instead of going quiet with no
|
||||
* explanation. Reflects the last presence push for each seat the server has ever mentioned, not
|
||||
* only the ones currently disconnected — a seat that reconnects updates its own entry rather than
|
||||
* disappearing, so the page can tell "never heard from" apart from "was here, then left."
|
||||
* disappearing.
|
||||
*
|
||||
* `seen` is what separates the two absences the page must not conflate: a seat that has connected
|
||||
* at some point and dropped, against one that has never opened the game at all. The server now
|
||||
* reports every other seat on connect (2026-08-23), so this is answerable at the moment a game
|
||||
* starts — which is exactly when "is everyone here?" is the question.
|
||||
*/
|
||||
presence(): { seat: PlayerIndex; connected: boolean }[];
|
||||
presence(): { seat: PlayerIndex; connected: boolean; seen: boolean }[];
|
||||
/**
|
||||
* Stop listening, for good.
|
||||
*
|
||||
* Only a remote session has anything to close, and only one caller needs it: a player LEAVING a
|
||||
* running game (2026-08-23). Without it the page went back to the lobby with its `EventSource`
|
||||
* still open, so the server — and therefore every other seat — went on reporting them as present
|
||||
* at a table they had walked away from.
|
||||
*/
|
||||
close?(): void;
|
||||
};
|
||||
|
||||
/**
|
||||
@@ -205,7 +219,24 @@ type Push = {
|
||||
frame?: FrameDelta;
|
||||
menu: Menu | null;
|
||||
lines: { text: string; tone: string }[];
|
||||
presence?: { seat: PlayerIndex; connected: boolean };
|
||||
/** One entry for a change; every other seat at once on the connect push. */
|
||||
presence?: { seat: PlayerIndex; connected: boolean; seen: boolean }[];
|
||||
/**
|
||||
* THE FOUR TRANSIENT SIGNALS, added 2026-08-23.
|
||||
*
|
||||
* A remote session used to return nothing for any of them, so multiplayer had no sound at all, no
|
||||
* timetable flash when the D12 filled a slot, no announcement when a completed run paid the table,
|
||||
* and no highlight on the card you had just drawn — four things solitaire has had all along, and
|
||||
* most of why a multiplayer game felt inert.
|
||||
*
|
||||
* `cues` and `announcement` are SHARED events (a collision anywhere, the Stage bell, a train
|
||||
* leaving the Division) and reach every seat; `justDrawn` is the recipient's own card and nobody
|
||||
* else's — `test/redaction.test.ts` covers exactly that.
|
||||
*/
|
||||
cues?: string[];
|
||||
scheduled?: number | null;
|
||||
announcement?: string | null;
|
||||
justDrawn?: string | null;
|
||||
};
|
||||
|
||||
/**
|
||||
@@ -239,7 +270,11 @@ export function createRemoteSession(
|
||||
let frame: Frame | null = null;
|
||||
let menu: Menu | null = null;
|
||||
let lines: { text: string; tone: string }[] = [];
|
||||
const presence = new Map<PlayerIndex, boolean>();
|
||||
const presence = new Map<PlayerIndex, { connected: boolean; seen: boolean }>();
|
||||
let cues: string[] = [];
|
||||
let scheduled: number | null = null;
|
||||
let announcement: string | null = null;
|
||||
let justDrawnCard: string | null = null;
|
||||
let nextSeq = 1;
|
||||
const listeners = new Set<() => void>();
|
||||
const changed = (): void => {
|
||||
@@ -282,7 +317,14 @@ export function createRemoteSession(
|
||||
menu = push.menu;
|
||||
}
|
||||
lines = [...lines, ...push.lines];
|
||||
if (push.presence) presence.set(push.presence.seat, push.presence.connected);
|
||||
for (const p of push.presence ?? []) presence.set(p.seat, { connected: p.connected, seen: p.seen });
|
||||
// Accumulated rather than replaced: two pushes can arrive between two renders, and a cue that
|
||||
// was earned is a cue that should be heard.
|
||||
if (push.cues) cues = [...cues, ...push.cues];
|
||||
if (push.scheduled !== undefined && push.scheduled !== null) scheduled = push.scheduled;
|
||||
if (push.announcement !== undefined && push.announcement !== null) announcement = push.announcement;
|
||||
// Persists until another draw replaces it, matching the local session's own `justDrawn`.
|
||||
if (push.justDrawn !== undefined) justDrawnCard = push.justDrawn;
|
||||
changed();
|
||||
};
|
||||
|
||||
@@ -317,10 +359,32 @@ export function createRemoteSession(
|
||||
capabilities: { undo: false, saveLocal: false, newGame: false },
|
||||
|
||||
lines: () => lines,
|
||||
takeCues: () => [],
|
||||
takeScheduled: () => null,
|
||||
takeAnnouncement: () => null,
|
||||
justDrawn: () => null,
|
||||
presence: () => [...presence].map(([s, connected]) => ({ seat: s, connected })),
|
||||
// Draining, exactly as the local session's are: each of these marks a moment, so it plays once
|
||||
// and is gone by the next render rather than re-firing on every redraw.
|
||||
takeCues: () => {
|
||||
const out = cues;
|
||||
cues = [];
|
||||
return out;
|
||||
},
|
||||
takeScheduled: () => {
|
||||
const out = scheduled;
|
||||
scheduled = null;
|
||||
return out;
|
||||
},
|
||||
takeAnnouncement: () => {
|
||||
const out = announcement;
|
||||
announcement = null;
|
||||
return out;
|
||||
},
|
||||
justDrawn: () => justDrawnCard,
|
||||
presence: () => [...presence].map(([seat, p]) => ({ seat, connected: p.connected, seen: p.seen })),
|
||||
close() {
|
||||
// `reportedGone` first: closing the stream fires `onerror`, and this is a deliberate exit, not
|
||||
// a game that vanished — `onGone` must not be called and land the page in "that game is no
|
||||
// longer on this server".
|
||||
reportedGone = true;
|
||||
source.close();
|
||||
listeners.clear();
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
@@ -0,0 +1,353 @@
|
||||
/**
|
||||
* THE RULES BLOCK, driven identically on both screens.
|
||||
*
|
||||
* The lobby (`lobby.ts`) and the solitaire New Game dialog (`main.ts`) ask the same eleven questions.
|
||||
* They used to ask them in two hand-written copies and had already drifted — the dialog had "where
|
||||
* an Extra may start" and no optional rules, the lobby the reverse — so this module owns reading,
|
||||
* writing, comparing and annotating the block, and each screen supplies only the id prefix its
|
||||
* markup uses (`lb-` or `ng-`).
|
||||
*
|
||||
* THE MARKUP ITSELF STAYS STATIC IN `play.html`, deliberately. Generating it here would be less
|
||||
* duplication, but `test/web.test.ts` drives the emitted bundle against a hand-built DOM stub with
|
||||
* no HTML parser in it (there is no jsdom in this project, and adding one to test a form is a poor
|
||||
* trade), and the ids in that stub come from scanning the real `play.html`. A test in the same suite
|
||||
* asserts both screens carry every key below, which is the drift guard the shared markup would have
|
||||
* been.
|
||||
*/
|
||||
|
||||
import { REVENUE_MAX, REVENUE_MIN } from '../engine/content.ts';
|
||||
import type { ExtraStartRule, StartingHand } from '../engine/content.ts';
|
||||
import { closestPreset, differencesFrom, presetOf, presetSettings, settingsOf } from './presets.ts';
|
||||
import type { PresetName, Settings } from './presets.ts';
|
||||
import type { GameConfig } from '../engine/state.ts';
|
||||
|
||||
/**
|
||||
* How each rule is asked on screen.
|
||||
*
|
||||
* `gated` is the pair introduced 2026-08-23: a checkbox that says whether the condition applies at
|
||||
* all, plus the number it applies at. The engine's convention is that `0` switches these off, which
|
||||
* is exact but unreadable — a Cutthroat game showed two zeroes and left the player to know the
|
||||
* convention. Unchecked still WRITES 0, so nothing under this changed.
|
||||
*/
|
||||
type Field =
|
||||
| { key: keyof Settings; kind: 'radio'; id: string }
|
||||
| { key: keyof Settings; kind: 'number'; id: string }
|
||||
| { key: keyof Settings; kind: 'checkbox'; id: string }
|
||||
| { key: keyof Settings; kind: 'gated'; id: string };
|
||||
|
||||
export const FIELDS: readonly Field[] = [
|
||||
{ key: 'startingHand', kind: 'radio', id: 'hand' },
|
||||
{ key: 'extraStart', kind: 'radio', id: 'extra' },
|
||||
{ key: 'passengerPerCoach', kind: 'number', id: 'passenger' },
|
||||
{ key: 'freightPerLoad', kind: 'number', id: 'freight' },
|
||||
{ key: 'trainPerTransit', kind: 'number', id: 'transit' },
|
||||
{ key: 'minCombinedRevenue', kind: 'gated', id: 'minrev' },
|
||||
{ key: 'maxCollisionsPerDay', kind: 'gated', id: 'colday' },
|
||||
{ key: 'maxCollisionsTotal', kind: 'gated', id: 'coltotal' },
|
||||
{ key: 'reducedVisibility', kind: 'checkbox', id: 'visibility' },
|
||||
{ key: 'employeeRotation', kind: 'checkbox', id: 'rotation' },
|
||||
{ key: 'emergencyToolbox', kind: 'checkbox', id: 'toolbox' },
|
||||
];
|
||||
|
||||
/**
|
||||
* What `play.html` must contain for a screen to be able to ask all eleven questions — the exact
|
||||
* attribute text, so `test/web.test.ts` can assert it against the built page.
|
||||
*
|
||||
* THIS IS THE DRIFT GUARD. The two blocks are generated from one template today; this is what says
|
||||
* so tomorrow, when someone edits one of them by hand.
|
||||
*/
|
||||
export function fieldSelectors(prefix: string): string[] {
|
||||
const out: string[] = [];
|
||||
for (const f of FIELDS) {
|
||||
// A radio group is addressed by NAME — there is no one element carrying the field's id.
|
||||
out.push(f.kind === 'radio' ? `name="${prefix}${f.id}"` : `id="${prefix}${f.id}"`);
|
||||
if (f.kind === 'gated') out.push(`id="${prefix}${f.id}-on"`);
|
||||
out.push(`id="${prefix}${f.id}-row"`, `id="${prefix}${f.id}-hint"`);
|
||||
}
|
||||
return out;
|
||||
}
|
||||
|
||||
/** The label each field goes under in the read-only view below. */
|
||||
const FIELD_LABELS: Record<keyof Settings, string> = {
|
||||
startingHand: 'Starting hand',
|
||||
extraStart: 'An Extra may start at',
|
||||
passengerPerCoach: 'Passenger per coach',
|
||||
freightPerLoad: 'Freight per load',
|
||||
trainPerTransit: 'Train per transit',
|
||||
minCombinedRevenue: 'Combined Revenue floor',
|
||||
maxCollisionsPerDay: 'Collisions in one Day',
|
||||
maxCollisionsTotal: 'Collisions in the game',
|
||||
reducedVisibility: 'Reduced Visibility',
|
||||
employeeRotation: 'Employee Rotation',
|
||||
emergencyToolbox: 'Emergency Toolbox',
|
||||
};
|
||||
|
||||
const esc = (s: string): string =>
|
||||
s.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"');
|
||||
|
||||
/**
|
||||
* THE WHOLE RULE SET, READ-ONLY — what a player weighing a join reads before taking a seat, and what
|
||||
* the seating screen keeps showing afterwards.
|
||||
*
|
||||
* Generated rather than a fourth copy of the form: nobody may change these, so form controls would
|
||||
* be a lie, and a `<dl>` says "this is what you are joining" in a third of the space. Fields that
|
||||
* differ from the nearest named type are amber here for the same reason they are amber in the form —
|
||||
* a non-standard game should never be a surprise.
|
||||
*/
|
||||
export function rulesListHtml(config: GameConfig, players: number, days: number): string {
|
||||
const settings = settingsOf(config);
|
||||
const type = presetOf(config, players, days);
|
||||
const near = closestPreset(config, players, days);
|
||||
const differing = type === 'custom' ? near.differing : [];
|
||||
|
||||
const rows = (keys: (keyof Settings)[]): string =>
|
||||
keys
|
||||
.map((k) => {
|
||||
const changed = differing.includes(k) ? ' class="changed"' : '';
|
||||
return `<dt>${esc(FIELD_LABELS[k])}</dt><dd${changed}>${esc(describe(k, settings[k]))}</dd>`;
|
||||
})
|
||||
.join('');
|
||||
|
||||
const head =
|
||||
`<dl><dt>Players</dt><dd>${players}</dd><dt>Days</dt><dd>${days}</dd>` +
|
||||
`<dt>Opponent-directed cards</dt><dd>not implemented yet</dd></dl>`;
|
||||
|
||||
return (
|
||||
head +
|
||||
`<h4>Opening</h4><dl>${rows(['startingHand', 'extraStart'])}</dl>` +
|
||||
`<h4>Revenue</h4><dl>${rows(['passengerPerCoach', 'freightPerLoad', 'trainPerTransit'])}</dl>` +
|
||||
`<h4>Victory conditions</h4><dl>${rows(['minCombinedRevenue', 'maxCollisionsPerDay', 'maxCollisionsTotal'])}</dl>` +
|
||||
`<h4>Optional rules</h4><dl>${rows(['reducedVisibility', 'employeeRotation', 'emergencyToolbox'])}</dl>`
|
||||
);
|
||||
}
|
||||
|
||||
/** What a value looks like beside its label — "Co-op default: 75", "Co-op default: six random cards". */
|
||||
function describe(key: keyof Settings, value: Settings[keyof Settings]): string {
|
||||
if (typeof value === 'boolean') return value ? 'on' : 'off';
|
||||
if (key === 'startingHand') {
|
||||
const words: Record<StartingHand, string> = {
|
||||
threeRandom: 'three random',
|
||||
sixRandom: 'six random',
|
||||
threeTrackThreeOther: 'three track and three other',
|
||||
};
|
||||
return words[value as StartingHand];
|
||||
}
|
||||
if (key === 'extraStart') {
|
||||
const words: Record<ExtraStartRule, string> = {
|
||||
divisionPointsOnly: 'Division Points only',
|
||||
ownOffice: 'your own Control Point',
|
||||
anyOffice: 'any Control Point',
|
||||
};
|
||||
return words[value as ExtraStartRule];
|
||||
}
|
||||
// A victory condition at 0 is not "0" on screen, it is a condition that does not apply.
|
||||
if (value === 0 && (key === 'minCombinedRevenue' || key === 'maxCollisionsPerDay' || key === 'maxCollisionsTotal')) {
|
||||
return 'off';
|
||||
}
|
||||
return String(value);
|
||||
}
|
||||
|
||||
export type SettingsForm = {
|
||||
read(): Settings;
|
||||
/** `suggestions` fills the placeholder of a switched-off condition, so ticking it back on has a
|
||||
* number to offer rather than an empty box. */
|
||||
write(values: Settings, suggestions: Settings): void;
|
||||
/**
|
||||
* Paint the block against a named type: every field that differs goes amber and every field gets
|
||||
* its "<Type> default: x" hint. Returns what differs, for the summary line the screen draws.
|
||||
*/
|
||||
mark(name: PresetName, players: number, days: number): (keyof Settings)[];
|
||||
/** Custom with no named baseline to compare against — clears the paint rather than lying. */
|
||||
clearMarks(): void;
|
||||
/** Called whenever the player changes any rule; the screen answers by selecting Custom. */
|
||||
onEdit(fn: (key: keyof Settings) => void): void;
|
||||
/** Read-only for the join preview and the seating screen: shown in full, changeable by nobody. */
|
||||
setEditable(on: boolean): void;
|
||||
/** Employee Rotation is meaningless at one player — disabled with a note rather than hidden, so
|
||||
* the two screens still read the same. */
|
||||
setEmployeeRotationAvailable(on: boolean): void;
|
||||
};
|
||||
|
||||
const $ = <T extends HTMLElement = HTMLElement>(id: string): T | null =>
|
||||
document.getElementById(id) as T | null;
|
||||
|
||||
export function settingsForm(prefix: string): SettingsForm {
|
||||
const el = <T extends HTMLElement = HTMLElement>(id: string): T | null => $<T>(`${prefix}${id}`);
|
||||
const radios = (name: string): HTMLInputElement[] =>
|
||||
Array.from(document.querySelectorAll<HTMLInputElement>(`input[name="${prefix}${name}"]`));
|
||||
const checkedRadio = (name: string): string | null =>
|
||||
radios(name).find((r) => r.checked)?.value ?? null;
|
||||
|
||||
let editHandler: ((key: keyof Settings) => void) | null = null;
|
||||
let editable = true;
|
||||
|
||||
function num(id: string, fallback: number): number {
|
||||
const raw = el<HTMLInputElement>(id)?.value ?? '';
|
||||
return raw.trim() === '' || !Number.isFinite(Number(raw)) ? fallback : Math.round(Number(raw));
|
||||
}
|
||||
|
||||
function readGated(id: string): number {
|
||||
// Unchecked IS zero — the engine's "off". The number in the box is kept so re-ticking restores it.
|
||||
if (el<HTMLInputElement>(`${id}-on`)?.checked !== true) return 0;
|
||||
return Math.max(0, num(id, 0));
|
||||
}
|
||||
|
||||
function read(): Settings {
|
||||
return {
|
||||
startingHand: (checkedRadio('hand') ?? 'sixRandom') as StartingHand,
|
||||
extraStart: (checkedRadio('extra') ?? 'anyOffice') as ExtraStartRule,
|
||||
passengerPerCoach: clampRevenue(num('passenger', 1)),
|
||||
freightPerLoad: clampRevenue(num('freight', 1)),
|
||||
trainPerTransit: clampRevenue(num('transit', 0)),
|
||||
minCombinedRevenue: readGated('minrev'),
|
||||
maxCollisionsPerDay: readGated('colday'),
|
||||
maxCollisionsTotal: readGated('coltotal'),
|
||||
reducedVisibility: el<HTMLInputElement>('visibility')?.checked === true,
|
||||
employeeRotation: el<HTMLInputElement>('rotation')?.checked === true,
|
||||
emergencyToolbox: el<HTMLInputElement>('toolbox')?.checked === true,
|
||||
};
|
||||
}
|
||||
|
||||
function write(values: Settings, suggestions: Settings): void {
|
||||
for (const r of radios('hand')) r.checked = r.value === values.startingHand;
|
||||
for (const r of radios('extra')) r.checked = r.value === values.extraStart;
|
||||
setNumber('passenger', values.passengerPerCoach);
|
||||
setNumber('freight', values.freightPerLoad);
|
||||
setNumber('transit', values.trainPerTransit);
|
||||
writeGated('minrev', values.minCombinedRevenue, suggestions.minCombinedRevenue);
|
||||
writeGated('colday', values.maxCollisionsPerDay, suggestions.maxCollisionsPerDay);
|
||||
writeGated('coltotal', values.maxCollisionsTotal, suggestions.maxCollisionsTotal);
|
||||
setChecked('visibility', values.reducedVisibility);
|
||||
setChecked('rotation', values.employeeRotation);
|
||||
setChecked('toolbox', values.emergencyToolbox);
|
||||
}
|
||||
|
||||
function setNumber(id: string, value: number): void {
|
||||
const input = el<HTMLInputElement>(id);
|
||||
if (input) input.value = String(value);
|
||||
}
|
||||
|
||||
function setChecked(id: string, on: boolean): void {
|
||||
const input = el<HTMLInputElement>(id);
|
||||
if (input) input.checked = on;
|
||||
}
|
||||
|
||||
function writeGated(id: string, value: number, suggestion: number): void {
|
||||
const box = el<HTMLInputElement>(`${id}-on`);
|
||||
const input = el<HTMLInputElement>(id);
|
||||
if (box) box.checked = value > 0;
|
||||
if (input) {
|
||||
// A switched-off condition shows an empty box with the suggestion as its placeholder, rather
|
||||
// than a `0` the player has to decode.
|
||||
input.value = value > 0 ? String(value) : '';
|
||||
input.placeholder = String(suggestion);
|
||||
input.disabled = !editable || value === 0;
|
||||
}
|
||||
}
|
||||
|
||||
function mark(name: PresetName, players: number, days: number): (keyof Settings)[] {
|
||||
const want = presetSettings(name, players, days);
|
||||
const differing = differencesFrom(name, read(), players, days);
|
||||
const label = presetLabelOf(name);
|
||||
for (const f of FIELDS) {
|
||||
const row = el(`${f.id}-row`);
|
||||
const hint = el(`${f.id}-hint`);
|
||||
const off = differing.includes(f.key);
|
||||
row?.classList.toggle('changed', off);
|
||||
if (hint) hint.textContent = `${label} default: ${describe(f.key, want[f.key])}`;
|
||||
}
|
||||
return differing;
|
||||
}
|
||||
|
||||
function clearMarks(): void {
|
||||
for (const f of FIELDS) {
|
||||
el(`${f.id}-row`)?.classList.remove('changed');
|
||||
const hint = el(`${f.id}-hint`);
|
||||
if (hint) hint.textContent = '';
|
||||
}
|
||||
}
|
||||
|
||||
function setEditable(on: boolean): void {
|
||||
editable = on;
|
||||
for (const f of FIELDS) {
|
||||
if (f.kind === 'radio') {
|
||||
for (const r of radios(f.id)) r.disabled = !on;
|
||||
continue;
|
||||
}
|
||||
const input = el<HTMLInputElement>(f.id);
|
||||
if (input) {
|
||||
// A gated number stays disabled when its own condition is off, whatever the block's state.
|
||||
const gatedOff = f.kind === 'gated' && el<HTMLInputElement>(`${f.id}-on`)?.checked !== true;
|
||||
input.disabled = !on || gatedOff;
|
||||
}
|
||||
if (f.kind === 'gated') {
|
||||
const box = el<HTMLInputElement>(`${f.id}-on`);
|
||||
if (box) box.disabled = !on;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function setEmployeeRotationAvailable(on: boolean): void {
|
||||
const input = el<HTMLInputElement>('rotation');
|
||||
if (input) {
|
||||
input.disabled = !on || !editable;
|
||||
if (!on) input.checked = false;
|
||||
}
|
||||
el('rotation-row')?.classList.toggle('unavailable', !on);
|
||||
}
|
||||
|
||||
/** One change handler for every control — the screens all answer it the same way (select Custom). */
|
||||
for (const f of FIELDS) {
|
||||
const fire = (): void => editHandler?.(f.key);
|
||||
if (f.kind === 'radio') {
|
||||
for (const r of radios(f.id)) r.onchange = fire;
|
||||
continue;
|
||||
}
|
||||
const input = el<HTMLInputElement>(f.id);
|
||||
if (input) {
|
||||
input.oninput = fire;
|
||||
input.onchange = fire;
|
||||
}
|
||||
if (f.kind === 'gated') {
|
||||
const box = el<HTMLInputElement>(`${f.id}-on`);
|
||||
if (box) {
|
||||
box.onchange = () => {
|
||||
const number = el<HTMLInputElement>(f.id);
|
||||
if (number) {
|
||||
number.disabled = !box.checked || !editable;
|
||||
// Ticking a condition back on with an empty box takes the suggestion showing in it,
|
||||
// so "on" never means "on, at zero".
|
||||
if (box.checked && number.value.trim() === '') number.value = number.placeholder;
|
||||
}
|
||||
fire();
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
read,
|
||||
write,
|
||||
mark,
|
||||
clearMarks,
|
||||
onEdit: (fn) => void (editHandler = fn),
|
||||
setEditable,
|
||||
setEmployeeRotationAvailable,
|
||||
};
|
||||
}
|
||||
|
||||
function clampRevenue(n: number): number {
|
||||
return Math.max(REVENUE_MIN, Math.min(REVENUE_MAX, n));
|
||||
}
|
||||
|
||||
/** Kept local rather than imported from `presets.ts`'s `preset()`, which would drag the whole table
|
||||
* in for one word — and this is the only place a hint needs it. */
|
||||
function presetLabelOf(name: PresetName): string {
|
||||
const labels: Record<PresetName, string> = {
|
||||
solitaire: 'Solitaire',
|
||||
coop: 'Co-op',
|
||||
competitive: 'Competitive',
|
||||
cutthroat: 'Cutthroat',
|
||||
};
|
||||
return labels[name];
|
||||
}
|
||||
Reference in New Issue
Block a user