MIDI Journey is a single-page audio-visual instrument built with Svelte 5 runes, Vite, Tailwind 4, daisyUI 5, raw Web MIDI, and raw Web Audio. Hardware MIDI, the computer keyboard, the on-screen piano, the drum pads, browser automation, and phrase replay all converge on one event seam before sound, key state, particles, and the monitor react (src/lib/midi/manager.svelte.ts).

Live surfaces

SurfacePurposeAccess
https://midi.loca.zoneStatic application served directly from dist/Authelia one_factor
https://wiki.midi.loca.zoneThis maintainer SSOTAuthelia one_factor

The app has no application server, database, account model, or collaboration protocol. nginx serves static files; Authelia is the edge identity gate. Settings, MIDI-learn bindings, and the one recorded phrase live in browser storage.

What it is

  • A hardware-optional synthesizer and eight-voice synthesized drum playground.
  • A reactive stage: notes create velocity-scaled particles and key glow, drums animate pads, pitch bend moves the scene, and the analyser drives 24 spectrum bars (src/components/Stage.svelte:37-70,93-166).
  • A 16-voice, steal-oldest polysynth with dual oscillators, ADSR, filter, vibrato, pitch bend, delay, and reverb (src/lib/audio/synth.ts:37-68,115-176).
  • A one-slot, free-time phrase looper. Record starts a fresh slot, caps at 60 seconds or 2,000 events, persists under midi.phrase.v1, and replays through the same dispatch path as live input (src/lib/state/phrase.svelte.ts:4-8,182-236,352-361).
  • A small instrument whose one runtime dependency is @lucide/svelte; audio, MIDI parsing, persistence, and the headless smoke use platform or Node built-ins (package.json:6-27).

What it deliberately is not

  • Not a DAW: there is no timeline, multitrack editor, audio export, clip arrangement, mixer automation, or sample library.
  • Not multi-user: there are no shared sessions, identities inside the app, remote state, or backend API.
  • Not a tempo workstation: the shipped phrase slot is free-time. Quantized bars, overdubs, a metronome, and an arpeggiator remain explicit aspirations in roadmap.
  • Not a complete virtual MIDI controller: pitch bend, modulation or pressure, program change, and completing MIDI-learn still require MIDI input or the developer injector.

Those boundaries are product choices, not missing infrastructure. The dispatch funnel makes musical memory cheap; downloadable audio would pull the toy into an export workflow the audit explicitly rejected.

Play now without hardware

  1. Open the app, pass the Authelia gate, and press the large power control. The user gesture creates or resumes the AudioContext (src/App.svelte:27-35,154-171).
  2. Play chromatic notes with a w s e d f t g y h u j k o l p ;. Move by octaves with z and x.
  3. Trigger the eight drums with 1 through 8; hold Space for sustain.
  4. On touch or mouse, strike lower on a piano key or pad for greater velocity. The piano supports independent pointers and glissando.
  5. Drag the eight dials, use their keyboard controls, or choose waveform, drum channel, and mix values in sound settings.
  6. Use the top-bar Record phrase control, perform with typing or screen inputs, then stop and press Play phrase. Playback requires the powered audio engine; the Clear phrase control removes the slot (src/components/TopBar.svelte:109-163).

The full interaction guide is playing-without-hardware. Raw MIDI behavior and the factory CC map are in midi-reference.

Maintainer map

PageOwns
architectureDispatch invariant, module boundaries, event flow, audio buses and graph
midi-referenceParsed status bytes, channel convention, CC routing and MIDI-learn
playing-without-hardwareTyping map, on-screen velocity, multi-touch, glissando and mobile strip
private page (sign-in required)Green gates, headless smoke, browser automation API and harness traps
private page (sign-in required)Static deploy, provenance, nginx, Authelia, TLS and fixed ports
audit-findingsSeventeen repaired defects and five hypotheses disproved by evidence
roadmapExplicit aspirations, seams, audit estimates and reasons for deferral
plansOwner-requested checklist: pad muting, loop timeline, openDAW, plugins, rename, multi-window, games, toddler mode

Start with architecture before changing input, sound, replay, visuals, or monitoring. A second sound-producing path beside midi.dispatch is an architectural regression, even if it appears to work locally.