Files
rdbms-playground/website/casts-src/generate.mjs
T
claude@clouddev1 52860c3267 feat(website): casts for first-project/modes/undo-redo; quit invisibly via Ctrl-C
Three more casts on "doing" pages:
- first-project reuses the quickstart cast (the create→insert→show tour)
- modes (new): a simple command, then `mode advanced` where the same command
  also prints "Executing SQL: …" (the teaching echo — "learn the SQL underneath")
- undo-redo (new): insert two rows, `undo` (Y-confirm modal) backs one out,
  `redo` restores it

Also fix the cast endings (review feedback): scripts ended by typing a `quit`
command, which — once the trim drops the shell exit — left a dangling "quit" in
frame with no payoff. End every cast with Ctrl-C instead (the app's quit key,
KeyCode::Char('c')+CTRL): it types nothing, so the cast ends cleanly on the
last content frame. Generator gains a `CtrlC` key; all six casts regenerated.

Convert the three pages to .mdx and embed. Build clean (26 pages); 6 casts.
2026-06-10 16:36:07 +00:00

169 lines
6.1 KiB
JavaScript

#!/usr/bin/env node
/**
* generate.mjs — turn the cast definitions in `casts.mjs` into asciinema
* `.cast` recordings under `public/casts/`, using autocast (ADR-website-001
* §2; driver chosen by the 2026-06-10 spike — autocast drives the full-screen
* TUI correctly, asciinema-automation does not).
*
* Usage:
* pnpm casts # regenerate every cast
* pnpm casts quickstart # regenerate just one
*
* Requires `autocast` on PATH (cargo install autocast) and a built
* `rdbms-playground` binary at ../target/debug (run `cargo build` at the repo
* root first). The binary's dir is added to PATH for the autocast child so the
* recording shows a clean `$ rdbms-playground` launch line.
*/
import { spawnSync } from 'node:child_process';
import { mkdirSync, writeFileSync, readFileSync, rmSync } from 'node:fs';
import { dirname, resolve } from 'node:path';
import { fileURLToPath } from 'node:url';
import os from 'node:os';
import { casts } from './casts.mjs';
const here = dirname(fileURLToPath(import.meta.url));
const websiteRoot = resolve(here, '..');
const repoRoot = resolve(websiteRoot, '..');
const binDir = resolve(repoRoot, 'target', 'debug');
const outDir = resolve(websiteRoot, 'public', 'casts');
const cargoBin = resolve(os.homedir(), '.cargo', 'bin');
/** YAML-escape a single character for a double-quoted scalar. */
function charKey(ch) {
if (ch === '\\') return '"\\\\"';
if (ch === '"') return '"\\""';
return `"${ch}"`;
}
/** Named single keys → autocast control codes. */
const NAMED_KEYS = {
Enter: '^M',
Tab: '^I',
// Ctrl-C quits the app (Action::Quit). Used to end a cast *invisibly* — no
// `quit` command typed into the input — so the recording ends on the last
// content frame rather than a dangling, payoff-less `quit`.
CtrlC: '^C',
};
/** Build the autocast `keys:` list (one entry per line) for a cast's steps. */
function keysFor(steps) {
const keys = [];
for (const step of steps) {
if (step.wait != null) {
keys.push(`${step.wait}ms`);
continue;
}
if (step.key != null) {
const code = NAMED_KEYS[step.key];
if (!code) throw new Error(`unknown key: ${step.key}`);
keys.push(code);
if (step.after != null) keys.push(`${step.after}ms`);
continue;
}
if (step.type != null) {
for (const ch of step.type) keys.push(charKey(ch));
if (step.enter !== false) keys.push('^M'); // Enter = CR (the TUI submits on \r)
if (step.after != null) keys.push(`${step.after}ms`);
continue;
}
throw new Error(`unrecognised step: ${JSON.stringify(step)}`);
}
return keys;
}
/**
* Trim a recorded cast to just the in-app portion and (optionally) hold the
* final frame. The app enters the alternate screen (`?1049h`) right after
* launch and leaves it (`?1049l`) on quit, so keeping the events between those
* drops the shell prompt, the `$ rdbms-playground` launch line, and the
* return-to-shell frame — the cast starts with the app already running and
* ends on the last in-app frame (no stray cursor-under-prompt frame).
* `holdEnd` re-emits the final frame after a pause so a looping cast lingers
* before restarting.
*/
function trimCast(outPath, { holdEnd = 1.5 } = {}) {
const lines = readFileSync(outPath, 'utf8').split('\n').filter(Boolean);
const header = JSON.parse(lines[0]);
const events = lines.slice(1).map((l) => JSON.parse(l));
const isOut = (e) => Array.isArray(e) && e[1] === 'o' && typeof e[2] === 'string';
const start = events.findIndex((e) => isOut(e) && e[2].includes('?1049h'));
let end = -1;
for (let i = events.length - 1; i >= 0; i--) {
if (isOut(events[i]) && events[i][2].includes('?1049l')) {
end = i;
break;
}
}
const kept = events.slice(start < 0 ? 0 : start, end < 0 ? events.length : end);
if (kept.length === 0) return; // nothing matched — leave the cast untouched
const t0 = kept[0][0];
const rebased = kept.map((e) => [Number((e[0] - t0).toFixed(6)), e[1], e[2]]);
if (holdEnd > 0) {
const lastT = rebased[rebased.length - 1][0];
rebased.push([Number((lastT + holdEnd).toFixed(6)), 'o', '']); // hold final frame
}
delete header.duration; // let the player recompute from events
writeFileSync(
outPath,
[JSON.stringify(header), ...rebased.map((e) => JSON.stringify(e))].join('\n') + '\n'
);
}
function yamlFor(cast) {
const keys = keysFor(cast.steps)
.map((k) => ` - ${k}`)
.join('\n');
return [
'settings:',
` width: ${cast.width ?? 90}`,
` height: ${cast.height ?? 26}`,
` title: ${JSON.stringify(cast.title ?? cast.name)}`,
` type_speed: ${cast.typeSpeed ?? '45ms'}`,
' timeout: 90s',
' prompt: "$ "',
'instructions:',
' - !Interactive',
' command: rdbms-playground',
' keys:',
keys,
'',
].join('\n');
}
const only = process.argv[2];
const selected = only ? casts.filter((c) => c.name === only) : casts;
if (only && selected.length === 0) {
console.error(`no cast named "${only}". Known: ${casts.map((c) => c.name).join(', ')}`);
process.exit(1);
}
mkdirSync(outDir, { recursive: true });
const env = { ...process.env, PATH: `${binDir}:${cargoBin}:${process.env.PATH}` };
let failures = 0;
for (const cast of selected) {
const yamlPath = resolve(os.tmpdir(), `autocast-${cast.name}.yaml`);
const outPath = resolve(outDir, `${cast.name}.cast`);
writeFileSync(yamlPath, yamlFor(cast));
console.log(`▶ recording ${cast.name} → public/casts/${cast.name}.cast`);
const res = spawnSync('autocast', ['--overwrite', yamlPath, outPath], {
env,
stdio: 'inherit',
});
rmSync(yamlPath, { force: true });
if (res.status !== 0) {
console.error(`${cast.name} failed (autocast exit ${res.status})`);
failures += 1;
} else {
// Trim the shell launch/quit so the cast starts with the app already
// running (the default; opt out with `keepShell: true` for casts that
// deliberately document the CLI launch).
if (!cast.keepShell) trimCast(outPath, { holdEnd: cast.holdEnd ?? 1.5 });
console.log(`${cast.name}`);
}
}
if (failures) process.exit(1);
console.log(`Done — ${selected.length} cast(s).`);