eric/wizwar6e
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Room invite links: /join/<CODE> recruits with a card of its own

Browse Source 
A living room's link unfurls as an invitation (waiting rooms beckon a
seat, started games a gallery view) via the shared ogPage baker. The
client follows the path: a held seat resumes, a waiting room offers
join-or-watch from the lobby, a started game is watched at once. The
address bar carries the invite link at any table, with a copy button
beside the roster.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_015RCWSTnb1KYTPyL4GmhGnF
This commit is contained in:
Eric Wagoner
2026-08-29 21:57:38 -04:00
co-authored by Claude Fable 5
parent e93bcc15a2
commit 691f44d858
2 changed files with 126 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/server/src/index.ts
+60 -14
View File
@@ -147,19 +147,26 @@ function shareData(id: string): ShareData | null {
const escapeHtml = (t: string) =>
t.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
/** index.html with this share's OpenGraph card folded into its head —
* crawlers never run the app, so the unfurl must arrive pre-baked. */
function shareHtml(id: string, data: ShareData, rawHost: string, rawProto: string): string {
// Host and proto arrive from request headers — attacker-writable text
// that must never reach an HTML attribute raw.
const proto = /^https?$/.test(rawProto) ? rawProto : "https";
const host = escapeHtml(rawHost);
// The stock page carries its own generic card; strip it, or crawlers
// (which take the FIRST tag they meet) never see this turn's.
const html = readFileSync(join(staticRoot!, "index.html"), "utf8")
/** index.html with a bespoke OpenGraph card folded into its head —
* crawlers never run the app, so the unfurl must arrive pre-baked. The
* stock page carries its own generic card; strip it, or crawlers (which
* take the FIRST tag they meet) never see this page's. */
function ogPage(metas: string[]): string {
return readFileSync(join(staticRoot!, "index.html"), "utf8")
.replace(/<meta (?:property="og:|name="twitter:)[^>]*>\s*/g, "")
.replace(/<title>[^<]*<\/title>\s*/, "");
const base = `${proto}://${host}`;
.replace(/<title>[^<]*<\/title>\s*/, "")
.replace("</head>", ` ${metas.join("\n ")}\n </head>`);
}
/** Host and proto arrive from request headers — attacker-writable text
* that must never reach an HTML attribute raw. */
function safeBase(rawHost: string, rawProto: string): string {
const proto = /^https?$/.test(rawProto) ? rawProto : "https";
return `${proto}://${escapeHtml(rawHost)}`;
}
function shareHtml(id: string, data: ShareData, rawHost: string, rawProto: string): string {
const base = safeBase(rawHost, rawProto);
const title = data.whole
? "The whole tale — a game of Wiz-War, replayed"
: `${escapeHtml(data.actor)}'s turn — a Wiz-War instant replay`;
@@ -179,8 +186,34 @@ function shareHtml(id: string, data: ShareData, rawHost: string, rawProto: strin
`<meta property="og:image:height" content="630"/>`,
`<meta name="twitter:card" content="summary_large_image"/>`,
`<meta name="twitter:image" content="${base}/watch/${id}/og.png"/>`,
].join("\n ");
return html.replace("</head>", ` ${metas}\n </head>`);
];
return ogPage(metas);
}
/** The recruiting card for a /join/<code> link: an invitation while the
* room waits to start, a summons to the gallery once it has. */
function inviteHtml(room: Room, rawHost: string, rawProto: string): string {
const base = safeBase(rawHost, rawProto);
const seats = room.players.length;
const wizards = `${seats} wizard${seats === 1 ? "" : "s"}`;
const title = `You're summoned — Wiz-War room ${room.id}`;
const desc = room.state
? `The duel is underway, ${wizards} in the labyrinth. Follow the link to watch it live from the Peanut Gallery.`
: `${wizards} at the table, waiting to flip the boards. Follow the link, pick a name, and take a seat.`;
const metas = [
`<title>${title}</title>`,
`<meta property="og:type" content="website"/>`,
`<meta property="og:site_name" content="Wiz-War"/>`,
`<meta property="og:title" content="${title}"/>`,
`<meta property="og:description" content="${desc}"/>`,
`<meta property="og:url" content="${base}/join/${room.id}"/>`,
`<meta property="og:image" content="${base}/og.png"/>`,
`<meta property="og:image:width" content="1200"/>`,
`<meta property="og:image:height" content="630"/>`,
`<meta name="twitter:card" content="summary_large_image"/>`,
`<meta name="twitter:image" content="${base}/og.png"/>`,
];
return ogPage(metas);
}
const httpServer = createServer((req, res) => {
try {
@@ -233,6 +266,19 @@ const httpServer = createServer((req, res) => {
res.end(shareHtml(watch[1]!, data, hostname, proto));
return;
}
// Room invitations: a living room gets its recruiting card; a dead
// code falls through to the app, which reports it in the lobby.
const invite = url.match(/^\/join\/([A-Za-z0-9]{4})$/);
if (invite) {
const room = getRoom(invite[1]!);
if (room) {
const proto = String(req.headers["x-forwarded-proto"] ?? "http").split(",")[0]!.trim();
const hostname = String(req.headers.host ?? `localhost:${port}`);
res.writeHead(200, { "content-type": "text/html", "cache-control": "no-cache" });
res.end(inviteHtml(room, hostname, proto));
return;
}
}
let file = normalize(join(staticRoot, url === "/" ? "index.html" : url));
if (file !== staticRoot && !file.startsWith(staticRoot + sep)) {
res.writeHead(403).end();