Files
rdbms-playground/website/casts-src/casts.mjs
T
claude@clouddev1 bb7887ea82 feat(website): relationship-diagram cast on the relationships page
Third earmarked cast: declare a 1:n relationship, then `show relationship`
draws the two-table connector diagram — showcases the V1 relationship
visualization with motion a still block can't. Convert the relationships
reference page to .mdx and embed it above the syntax (the static diagrams
below remain the exact reference).

Recorded via `pnpm casts`; build clean (25 pages).
2026-06-10 14:13:14 +00:00

85 lines
3.2 KiB
JavaScript

/**
* Cast source definitions — the durable, human-readable source for the
* asciinema demos (ADR-website-001 §2). `pnpm casts` runs `generate.mjs`,
* which turns each definition into an autocast YAML and records it to
* `public/casts/<name>.cast`. Edit these and re-run to re-record as the app
* evolves; the `.cast` files are regenerable artifacts.
*
* Step kinds:
* { wait: ms } — pause (shown in the recording)
* { type: 'text', after: ms } — type the text + press Enter, then pause
* { type: 'text', enter: false } — type without pressing Enter
* { key: 'Tab'|'Enter', after: ms } — press a single named key
*
* Every cast must end by quitting the app (a `quit` step) so the driver
* returns to the shell prompt.
*/
/** The shared library narrative, trimmed per cast. */
export const casts = [
{
name: 'relationship-diagram',
title: 'Declare a relationship and see it drawn',
width: 90,
height: 26,
typeSpeed: '45ms',
steps: [
{ wait: 900 },
{ type: 'create table authors with pk author_id(serial)', after: 800 },
{ type: 'add column to authors: name (text)', after: 900 },
{ type: 'create table books with pk book_id(serial)', after: 800 },
{ type: 'add column to books: title (text)', after: 700 },
{ type: 'add column to books: author_id (int)', after: 1000 },
{
type: 'add 1:n relationship as books_author from authors.author_id to books.author_id on delete cascade',
after: 1400,
},
// the money shot: the two-table connector diagram
{ type: 'show relationship books_author', after: 2600 },
{ type: 'quit', after: 400 },
],
},
{
name: 'assistive-editor',
title: 'The input field helps as you type — completion and a live validity indicator',
width: 90,
height: 26,
typeSpeed: '55ms',
steps: [
{ wait: 1100 },
{ type: 'create table books with pk', after: 850 },
{ type: 'add column to books: title (text)', after: 1100 },
// Completion: type a partial table name, press Tab to complete it.
{ type: 'show data bo', enter: false, after: 1100 },
{ key: 'Tab', after: 1400 },
{ key: 'Enter', after: 1600 },
// Validity indicator: a misspelled table flags [ERR] before you submit.
{ type: 'show data boook', enter: false, after: 1900 },
{ key: 'Enter', after: 1700 },
// The corrected command runs cleanly.
{ type: 'show data books', after: 1600 },
{ type: 'quit', after: 400 },
],
},
{
name: 'quickstart',
title: 'RDBMS Playground — first table to first query',
width: 90,
height: 26,
typeSpeed: '45ms',
holdEnd: 2.5, // landing cast loops — pause on the final frame before restart
steps: [
{ wait: 1100 },
{ type: 'create table authors with pk', after: 1000 },
{ type: 'add column to authors: name (text)', after: 850 },
{ type: 'add column to authors: birth_year (int)', after: 900 },
{
type: "insert into authors (name, birth_year) values ('Ursula K. Le Guin', 1929)",
after: 1300,
},
{ type: 'show data authors', after: 1800 },
{ type: 'quit', after: 500 },
],
},
];