Jesse
62b6ed7e1b
The "Play multiplayer" door on index.html had sat disabled, labelled
"Coming soon", since before the server existed — Phases 2 through 4 built
a working lobby and nothing ever linked to it. Loading the site landed on
the same solitaire splash whether a real multiplayer server was behind it
or not, with no visible way in. Found packaging Phase 6 for StartOS.
The door is now a live link to ./play.html?lobby, and main.ts's start()
routes ?lobby straight to the lobby screen — the same showScreen('lobby');
runLobby(beginRemote) the in-game Multiplayer button already used —
instead of dealing a solitaire game first.
GET /api/health is new, and exists to be failed. The same dist/ ships both
served by src/server/ and uploaded as flat files by deploy-web.ts, and the
bundle is identical either way (D4), so the page cannot know from its own
build which it is; every other route 404s an unknown path exactly as a
static host does, so nothing distinguished them. The splash probes it on
load and closes the door when nothing names itself in reply.
The door starts open and only ever closes, deliberately: a wrong "no
server" is the bug above again — invisible, and it strands a player who
does have one — while a wrong "there is one" costs a click and a lobby
that says it cannot connect. The reply must name itself rather than merely
return 200, or a host answering every path with its index page would pass.
Verified: tsc clean; 659 tests pass (656 + 3); /api/health exercised live
against a running server — 200 with the right body, unauthenticated, while
an unknown path and a wrong method both still 404, which is what makes the
probe discriminate at all.
The probe's own test was vacuous on the first attempt — both its "closes"
cases reached close() through the .catch arm, so deleting the body-naming
check outright still passed. Caught by mutating splash.ts and re-running;
the test now covers all three closing routes and fails without the check.
115 lines
5.5 KiB
HTML
115 lines
5.5 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>Station Master</title>
|
|
<style>
|
|
:root{--bg:#12151a;--fg:#e6e9ee;--dim:#8b94a3;--line:#2c333d;--panel:#1a1f26}
|
|
*{box-sizing:border-box}
|
|
body{margin:0;background:var(--bg);color:var(--fg);
|
|
font:15px/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
|
|
min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px}
|
|
main{width:100%;max-width:760px}
|
|
.hero{display:flex;gap:24px;align-items:flex-start}
|
|
.hero-image{width:230px;flex:none;border-radius:9px;overflow:hidden;border:1px solid var(--line);cursor:zoom-in}
|
|
.hero-image img{display:block;width:100%;height:auto}
|
|
.hero-content{flex:1;min-width:0}
|
|
@media(max-width:640px){.hero{flex-direction:column}.hero-image{width:100%;max-width:280px}}
|
|
h1{font-size:32px;margin:0 0 2px;letter-spacing:.02em}
|
|
.tag{color:var(--dim);margin:0;font-size:14px}
|
|
.blurb{color:#c6ccd6;margin:16px 0 0;max-width:66ch}
|
|
.rule{height:1px;background:var(--line);margin:22px 0}
|
|
.doors{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-top:26px}
|
|
@media(max-width:640px){.doors{grid-template-columns:1fr}}
|
|
.door{display:block;text-decoration:none;color:inherit;background:var(--panel);
|
|
border:1px solid var(--line);border-radius:9px;padding:18px 18px 16px;transition:.12s}
|
|
a.door:hover{border-color:#4d6fa8;background:#1f2733;transform:translateY(-1px)}
|
|
.door h2{font-size:17px;margin:0 0 5px;color:#9fb6d8}
|
|
.door p{margin:0;color:var(--dim);font-size:13px;line-height:1.5}
|
|
.door .go{display:inline-block;margin-top:11px;font-size:12px;color:#5aa9e6}
|
|
.door.disabled .go{color:var(--dim)}
|
|
a.door.disabled{pointer-events:none}
|
|
a.door.disabled:hover{border-color:var(--line);background:var(--panel);transform:none}
|
|
.lightbox{position:fixed;inset:0;background:rgba(8,10,13,.92);display:flex;
|
|
align-items:center;justify-content:center;padding:32px;z-index:10;cursor:zoom-out}
|
|
.lightbox[hidden]{display:none}
|
|
.lightbox img{display:block;max-width:90vw;max-height:90vh;border-radius:6px;box-shadow:0 12px 40px rgba(0,0,0,.5)}
|
|
/* the rule between title and blurb is drawn as rail, not decorated */
|
|
svg.trackline{width:100%;height:24px;display:block;margin:10px 0 0}
|
|
.rail{stroke:#4a5361;stroke-width:1.6}
|
|
.tie{stroke:#39424e;stroke-width:1.1}
|
|
footer{margin-top:26px;color:var(--dim);font-size:11px;display:flex;gap:18px;flex-wrap:wrap}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<main>
|
|
<div class="hero">
|
|
<div class="hero-image" id="hero-image" tabindex="0" role="button" aria-label="View full-size box art">
|
|
<img src="./images/station-master-splash.jpg"
|
|
alt="Station Master — TimeTable & Train Order Railroading, 1840–1950. Box art: two trains meet at a junction beside a train order office."
|
|
width="560" height="700">
|
|
</div>
|
|
<div class="hero-content">
|
|
<h1>Station Master</h1>
|
|
<p class="tag">TimeTable and Train Order (TT&TO) railroading, 1840–1950.</p>
|
|
|
|
<svg class="trackline" viewBox="0 0 700 24" preserveAspectRatio="none" aria-hidden="true">
|
|
<line class="rail" x1="0" y1="10" x2="700" y2="10"/>
|
|
<line class="rail" x1="0" y1="15" x2="700" y2="15"/>
|
|
<g id="ties"></g>
|
|
</svg>
|
|
|
|
<p class="blurb">
|
|
As Station Master in your line-side office, you manage the town's railroad connection. You are
|
|
responsible for all track between your Limits, a district of industries hanging beneath it, and
|
|
trains that arrive whether or not you are ready for them. Spot the right cars, work the loads,
|
|
and get every train away again — a train with nowhere to stand is a collision, and a
|
|
collision costs more than the freight was worth.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="doors">
|
|
<a class="door" id="door-multiplayer" href="./play.html?lobby">
|
|
<h2>Play multiplayer</h2>
|
|
<p id="door-multiplayer-blurb">Play with your friends across the internet. You each run your
|
|
own office area within the entire division. You can play a normal game, or choose co-op or
|
|
cutthroat.</p>
|
|
<span class="go" id="door-multiplayer-go">Set up a game →</span>
|
|
</a>
|
|
|
|
<a class="door" href="./play.html">
|
|
<h2>Play solitaire</h2>
|
|
<p>Play by yourself and run the entire division for five full days. Your goal is 20 Revenue.
|
|
Your game data is saved in your browser — if you close the tab and reopen this site
|
|
without clearing your cache, your game is preserved and you can continue automatically.
|
|
During the game you can also explicitly save your progress for later replay.</p>
|
|
<span class="go">Start a game →</span>
|
|
</a>
|
|
|
|
<a class="door" href="./replays.html">
|
|
<h2>Replays</h2>
|
|
<p>Replay a saved game, step by step or advancing automatically through phases, Stages and
|
|
Days. Open one saved on the site, or a saved file that someone has sent you.</p>
|
|
<span class="go">Browse replays →</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="rule"></div>
|
|
|
|
<footer>
|
|
<span>build <span id="build">__BUILD__</span></span>
|
|
<span>solitaire runs entirely in your browser — no server code required</span>
|
|
</footer>
|
|
</main>
|
|
|
|
<div class="lightbox" id="lightbox" hidden>
|
|
<img src="./images/station-master-splash.jpg"
|
|
alt="Station Master — TimeTable & Train Order Railroading, 1840–1950. Box art: two trains meet at a junction beside a train order office.">
|
|
</div>
|
|
|
|
<script type="module" src="./web/splash.js"></script>
|
|
</body>
|
|
</html>
|