Add docs/karaoke-pipeline.md covering the full streaming pipeline from MPS through unsandbox API to zerotrust container and back. Includes two Graphviz dot diagrams (rendered to SVG): - karaoke-pipeline.dot: full system flow across MPS, API, pool, container - karaoke-ondemand.dot: watch mode on-demand user flow Update architecture.md feature toggle matrix and related docs table. Update CLAUDE.md karaoke section with streaming path and on-demand info.
30 lines
1.5 KiB
Text
30 lines
1.5 KiB
Text
// On-Demand Karaoke — Watch Mode User Flow
|
|
// Render: dot -Tsvg docs/karaoke-ondemand.dot -o docs/karaoke-ondemand.dot.svg
|
|
digraph karaoke_ondemand {
|
|
rankdir=TB;
|
|
node [shape=box, style="rounded,filled", fontname="monospace", fontsize=10];
|
|
edge [fontname="monospace", fontsize=9];
|
|
|
|
click [label="User clicks 🎤\n(watch.js)", fillcolor="#e0f2f1"];
|
|
check [label="Has tracks?", shape=diamond, fillcolor="#fff8e1"];
|
|
cycle [label="cycleKaraoke()\nOriginal → Instrumentals → Vocals", fillcolor="#e8f5e9"];
|
|
post [label="POST /karaoke/{id}\n(fetch, non-blocking)", fillcolor="#e8eaf6"];
|
|
fork [label="Server forks\ndetached grandchild", fillcolor="#e8eaf6"];
|
|
process [label="process_karaoke()\n(~30-120s)", fillcolor="#fce4ec"];
|
|
hourglass [label="Button shows ⌛\nkaraokeProcessing=true", fillcolor="#e0f2f1"];
|
|
refresh [label="10s URL refresh\nfetchWatchData()", fillcolor="#e0f2f1"];
|
|
detect [label="instrumentals_url\nappears in JSON?", shape=diamond, fillcolor="#fff8e1"];
|
|
autoswitch [label="Auto-switch to\ninstrumentals 🎤", fillcolor="#e8f5e9"];
|
|
|
|
click -> check;
|
|
check -> cycle [label="yes"];
|
|
check -> post [label="no (eligible)"];
|
|
post -> fork [label="200 {status: processing}"];
|
|
post -> hourglass;
|
|
fork -> process;
|
|
hourglass -> refresh [label="every 10s"];
|
|
refresh -> detect;
|
|
detect -> refresh [label="not yet"];
|
|
detect -> autoswitch [label="tracks ready"];
|
|
process -> detect [label="DB updated", style=dashed];
|
|
}
|