Tablet-friendly faders, JAM tab, XY presets, and Focus-view favorites

[dorneanu]

Summary

Tablet/phone-friendly touch controls, plus a new JAM tab for pinning your own pads/faders (SP-404 params, raw MIDI to a second device, or captured bus scenes), an XY presets panel, and a handful of smaller UX improvements — all built and tested against real Roland reference material (SP-404 MK2 manual, MC-101 MIDI implementation chart), not guesswork.

What's new

Bigger, tablet/phone-friendly faders

• Full-width filled-bar faders (relative drag, fine-tune pull-out) instead of thin floating pills — much easier to grab on a touchscreen.
• Optional horizontal fader layout (Setup) for wide/landscape tablets, where a sideways drag has more travel to work with.
• Light/dark theme toggle.

JAM tab — your own pinned controls

• Three kinds of control: an SP-404 bus param (stays put regardless of which effect is loaded on that bus), raw MIDI (any channel/CC/Note/PC to any connected output — e.g. a second synth), or a captured bus scene (a whole bus's state, momentarily recalled on hold and always reverting to whatever was playing before, including the effect itself).
• Edit mode: drag to reorder, swipe left to delete, or multi-select to batch-set a MIDI channel / delete several at once.
• PRESETS: factory templates built from real MIDI implementation charts — ships with an MC-101 4-track × Sound/Filter/Mod/FX template (device's own knob order), and raw CC controls are now two-way: turning the actual hardware knob updates the app, from any connected MIDI input.
• Rotary knob style (Setup) as an alternative to bars: balance-pot style, pointer straight up at the center value, tilts right/left toward 127/0.
• CLEAR / batch-delete / swipe-delete all use instant-action + timed undo instead of a confirm dialog (some iOS Web MIDI wrapper browsers silently stub confirm()/prompt() to do nothing).

Focus view additions

• SAVE button captures the bus you're looking at as a JAM bus-scene in one tap.
• Scene sidebar: any bus scenes for the active bus appear as small buttons next to the faders, no trip to the JAM tab needed.
• Favorite-effect chips right under the header — one-tap effect switching for starred effects, skipping the picker entirely. Always lands with EFX off (loading an effect is for tweaking, not punching it in live).

XY presets

• Templates: curated axis pairs for specific effects (Isolator LOW×HIGH, Super Filter CUTOFF×RESONANCE, Tape Echo TIME×FEEDBACK, Phaser RATE×DEPTH, Wah MANUAL×PEAK, Resonator BRIGHT×FEEDBACK), built from real parameter names — picking one only offers buses that actually carry that effect, switches to it if needed, and assigns both axes.
• Your combos: save your own current X/Y assignment (including cross-bus pairs set up manually) under an editable name, recall or delete it later.

Effect picker

• RECENT and FAVORITES sections now get their own jump-bar shortcuts, matching the category shortcuts they always sat above without one.

Export/Import

• Now covers Snapshots + JAM (including bus scenes) + XY combos in one JSON blob, so a full setup can move between devices (e.g. edited on a laptop browser, brought to a phone).

Testing

Every feature above was exercised end-to-end via browser automation against a live preview (not just written and assumed correct): drag interactions with real pointer events, edit/select mode gestures, undo windows, cross-theme and cross-orientation rendering, and a full view-by-view console-error sweep after each change. Screenshots in this description are taken from those runs.

No SysEx is used; the app still never sends anything on load (stored state is display-only until the first gesture).

[dorneanu]

I saw your tool here: https://www.reddit.com/r/sp404mk2/comments/1v6am5e/i_built_a_free_opensource_web_midi_controller_for/

Feel free to share your thoughts. I admit the MC101 presets might be to specific; we could still add more presets for other vendors as well.