From a9f735d984f3b3b7ca3021c20ceccbe571529412 Mon Sep 17 00:00:00 2001 From: Jan Date: Mon, 13 Apr 2026 20:56:56 +0200 Subject: [PATCH] refactor: merge flow into live overview layout --- internal/control/ui.html | 112 +++++++++++++++++---------------------- 1 file changed, 49 insertions(+), 63 deletions(-) diff --git a/internal/control/ui.html b/internal/control/ui.html index 8658dec..1ddde2b 100644 --- a/internal/control/ui.html +++ b/internal/control/ui.html @@ -62,6 +62,11 @@ button,input,select{font:inherit}button{user-select:none} .flow-master-state.idle{color:var(--text-dim)} .flow-master-sub{margin-top:8px;font-size:12px;color:var(--text-dim)} .flow-topbar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px} +.flow-inline-top{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;flex-wrap:wrap;padding:2px 2px 0} +.flow-inline-source,.flow-inline-alert{display:flex;gap:8px;align-items:baseline;min-width:0} +.flow-inline-label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim)} +.flow-inline-value{font-size:13px;font-weight:700;color:var(--text)} +.flow-inline-alert .flow-inline-value{color:var(--text-dim)} .flow-summary{padding:12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface2)} .flow-summary-label{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin-bottom:6px} .flow-summary-value{font-size:16px;font-weight:700} @@ -122,6 +127,11 @@ button,input,select{font:inherit}button{user-select:none} /* Cards */ .card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)} .hero{padding:16px} +.tab-panel[data-tab-panel="live"] .tab-columns.two{grid-template-columns:1fr} +.tab-panel[data-tab-panel="live"] .stack{width:100%} +.tab-panel[data-tab-panel="live"] .stack>.card{width:100%} +.tab-panel[data-tab-panel="live"] .flow-board{margin-top:0} +.tab-panel[data-tab-panel="live"] .sidebar-card{height:fit-content} /* TX Bar */ .tx-bar{position:relative;z-index:1;display:grid;grid-template-columns:minmax(180px,250px) 1fr auto;gap:14px;align-items:center} .freq-display-label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim)} @@ -327,8 +337,7 @@ input.input-error{border-color:var(--red);box-shadow:0 0 0 3px rgba(176,48,48,.1
No active issues.
- - + @@ -336,35 +345,8 @@ input.input-error{border-color:var(--red);box-shadow:0 0 0 3px rgba(176,48,48,.1
- -
-
-
-
-
On-Air Master Status
-
--
-
Waiting for runtime telemetry.
-
-
-
Applied Frequency
--
-
Target Frequency
--
-
Program Source
--
-
Active Alert
--
-
-
-
-
-
Queue Health
--
-
Ingest Runtime
--
-
Runtime Age
--
-
Last Update
--
-
-
-
-
-
- -
+ +
@@ -384,39 +366,45 @@ input.input-error{border-color:var(--red);box-shadow:0 0 0 3px rgba(176,48,48,.1
IDLE
+
--
Waiting for runtime telemetry
-
-
Chunks
--
-
Samples
--
-
Underruns
--
-
Uptime
--
-
Rate
--
-
-
Audio Buffer
--
-
Stream Health
--
-
TX Activity
--
+
Audio Buffer
--
+
Stream Health
--
+
TX Activity
--
-
-
-
Audio RMS
-
L
--
-
R
--
-
-
-
Audio Peak
-
L
--
-
R
--
-
-
-
MPX Peak
-
MPX
--
-
+
+
+
+
Program Source--
+
Active Alert--
+
+
+
+
Queue Health
--
+
Ingest Runtime
--
+
Runtime Age
--
+
Last Update
--
+
+
+
+
+
Audio RMS
+
L
--
+
R
--
+
+
+
Audio Peak
+
L
--
+
R
--
+
+
+
MPX Peak
+
MPX
--
-
@@ -447,6 +435,8 @@ input.input-error{border-color:var(--red);box-shadow:0 0 0 3px rgba(176,48,48,.1
+
+
@@ -1219,17 +1209,13 @@ function _render(){ setText('freq-desired',isFinite(desired)?`Desired ${desired.toFixed(1)} MHz`:'Desired --'); $('freq-note')?.classList.toggle('mismatch',isFinite(applied)&&isFinite(desired)&&!nearEq(applied,desired,.001)); - // ── Overview: quick stats - setText('t-chunks',fmt(eng.chunksProduced));setText('t-samples',fmt(eng.totalSamples)); - setText('t-uptime',fmtTime(eng.uptimeSeconds)); - setText('t-rate',drv.effectiveSampleRateHz?(drv.effectiveSampleRateHz/1000).toFixed(0)+'k':'--'); - const ur=eng.underruns??drv.underruns;const urEl=$('t-underruns');if(urEl){urEl.textContent=ur==null?'--':String(ur);urEl.className='value'+(ur>0?' err':ur===0?' good':'');} + setText('t-uptime',eng.uptimeSeconds?`Uptime ${fmtTime(eng.uptimeSeconds)}`:''); // ── Overview: TX state const txSt=normState(eng.state); $('tx-state').textContent=S.txBusy?'WORKING':txSt.toUpperCase(); $('tx-state').className='tx-state '+(S.txBusy?'working':txSt); - setText('tx-hint',eng.lastError?`Last error: ${eng.lastError}`:S.txBusy?'Command in progress':'Runtime polled every 1s'); + setText('tx-hint',eng.lastError?`Last error: ${eng.lastError}`:S.txBusy?'Command in progress':''); const canStopStates=['running','arming','prebuffering','degraded','muted','faulted','stopping']; const startDis=S.txBusy||txSt==='running'; const stopDis=S.txBusy||!canStopStates.includes(txSt);