Skip to content
EchoWarriorEchoWarrior Wiki

Leitmotif Screenshots

These screenshots are generated from the current Leitmotif web shell using a small sample scene. They are meant to orient contributors before they open the code.

Editor Overview

Section titled “Editor Overview”
Leitmotif editor overview
The loaded scene shows chained sequences, selected beat state, the stage shell, trigger editor, timeline steps, and schema-driven inspector fields.

Action Picker

Section titled “Action Picker”
Leitmotif action picker opened from a timeline step
The timeline's add-beat picker offers a natural next beat first, then the broader verb list. Suggestions are deterministic today and route through `SceneDoc`.

Keyboard Overlay

Section titled “Keyboard Overlay”
Leitmotif keyboard shortcuts overlay
The `?` overlay is generated from the same binding table that handles the shortcuts, so the help surface and behavior stay in sync.

Compact View

Section titled “Compact View”
Leitmotif compact viewport editor screenshot
The compact viewport keeps the three-column model visible: sequence list, stage/timeline, and inspector.

How These Were Captured

Section titled “How These Were Captured”

The screenshots were captured from npm run dev at http://127.0.0.1:8780/ using the development-only window.__lmLoad(json) seam in src/main.ts.

That seam is intentionally dev-only. It lets contributors and screenshot automation load a scene into the browser without native file dialogs. Production builds compile it away through import.meta.env.DEV.