fix(playground): move engine switcher to synth drawer, fix output mode labels
- Engine switcher now lives in the Synth drawer (was incorrectly in NISPS params drawer) - Params drawer renamed to "NISPS" (it's for ML engine tuning, not synth engine selection) - Output mode button says "Synth" (generic) not "C15 Shaper-Feedback" (engine-specific) - Dock icon for params drawer now labelled "NISPS" with correct tooltip
This commit is contained in:
parent
d5a315904a
commit
78e9e64dee
2 changed files with 9 additions and 8 deletions
|
|
@ -158,11 +158,11 @@
|
|||
</svg>
|
||||
<span class="dock-label">Synth</span>
|
||||
</button>
|
||||
<button class="dock-icon" data-drawer="params" title="Engine parameters">
|
||||
<button class="dock-icon" data-drawer="params" title="NISPS ML parameters">
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||||
<circle cx="8" cy="8" r="3"/><path d="M8 1v2M8 13v2M1 8h2M13 8h2M3.05 3.05l1.41 1.41M11.54 11.54l1.41 1.41M3.05 12.95l1.41-1.41M11.54 4.46l1.41-1.41"/>
|
||||
</svg>
|
||||
<span class="dock-label">Engine</span>
|
||||
<span class="dock-label">NISPS</span>
|
||||
</button>
|
||||
<button class="dock-icon" data-drawer="eoc" title="Effects Chain" aria-label="Effects Chain">
|
||||
<svg viewBox="0 0 16 16" width="20" height="20" fill="currentColor">
|
||||
|
|
@ -227,7 +227,7 @@
|
|||
<span class="mode-label">Output</span>
|
||||
<div class="pill-toggle pill-toggle-sm" id="output-toggle-float">
|
||||
<button class="pill-opt active" data-mode="visual">Visual</button>
|
||||
<button class="pill-opt" data-mode="synth" id="synth-mode-btn">C15 Shaper-Feedback</button>
|
||||
<button class="pill-opt" data-mode="synth" id="synth-mode-btn">Synth</button>
|
||||
<button class="pill-opt" data-mode="midi-cc">MIDI CC</button>
|
||||
<button class="pill-opt" data-mode="audio-canvas">Audio Canvas</button>
|
||||
</div>
|
||||
|
|
@ -245,6 +245,7 @@
|
|||
<button class="drawer-close" data-drawer="synth">×</button>
|
||||
</div>
|
||||
<div class="drawer-body" id="synth-panel">
|
||||
<div id="synth-engine-switcher"></div>
|
||||
<div class="synth-row">
|
||||
<button class="action-btn accent" id="synth-start">Start Audio</button>
|
||||
<span class="synth-status" id="synth-status">Stopped</span>
|
||||
|
|
@ -317,10 +318,10 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Params drawer (NISPS engine tuning) -->
|
||||
<!-- Params drawer (NISPS ML engine tuning) -->
|
||||
<div class="drawer hidden" id="drawer-params" data-drawer="params">
|
||||
<div class="drawer-header">
|
||||
<span>Engine</span>
|
||||
<span>NISPS</span>
|
||||
<button class="drawer-close" data-drawer="params">×</button>
|
||||
</div>
|
||||
<div class="drawer-body">
|
||||
|
|
|
|||
|
|
@ -924,8 +924,8 @@ async function setActiveEngine(engine) {
|
|||
if (midiInput) midiInput.setEngine(engine);
|
||||
const btn = document.getElementById('synth-mode-btn');
|
||||
if (btn) btn.textContent = engine.displayName;
|
||||
const engineDockBtn = document.querySelector('[data-drawer="params"]');
|
||||
if (engineDockBtn) engineDockBtn.title = `Engine: ${engine.displayName}`;
|
||||
const synthDockBtn = document.querySelector('[data-drawer="synth"]');
|
||||
if (synthDockBtn) synthDockBtn.title = `Synth: ${engine.displayName}`;
|
||||
EngineSwitcher.setActive(engine.id);
|
||||
EngineSwitcher.setLoading(engine.id, false);
|
||||
await resizeMLP(totalOutputCount());
|
||||
|
|
@ -1097,7 +1097,7 @@ async function init() {
|
|||
description: '4-operator FM with continuous routing matrix. Algorithm emerges from exploration.',
|
||||
},
|
||||
];
|
||||
const engineSwitcherEl = document.getElementById('engine-params');
|
||||
const engineSwitcherEl = document.getElementById('synth-engine-switcher');
|
||||
if (engineSwitcherEl) {
|
||||
EngineSwitcher.init(engineSwitcherEl, ENGINES, async (engineId) => {
|
||||
if (engineId === activeEngine?.id) return;
|
||||
|
|
|
|||
Loading…
Reference in a new issue