diff --git a/gain_viz/templates/index.html b/gain_viz/templates/index.html index 7e40b26..73f3cc2 100644 --- a/gain_viz/templates/index.html +++ b/gain_viz/templates/index.html @@ -1,363 +1,954 @@ - - Spectrum Viewer + + + Gain-Viz β€” Spectrum Viewer + -
-
-

Spectrum Viewer

-

Real-time RF Spectrum Analysis

-
+
+
+

Gain-Viz

+

Interactive gain control and real-time RF visualization

+
- -
-

Gain Settings

-
-
-
- -
- - +
+
+ +
+

Stream Controls

+ +
+ + + +
+ +
+ ● Stopped
-
- -
- - -
-
-
- -
- - -
-
-
- -
- - -
-
-
-
- -
- -
- -
- -

Spectrogram Parameters

-
-
+ +
+

Gain Settings

+ +
+
+ +
+ +
+ +
+ +
+ + +
+ +
+ +
+ +
+ + +
+ +
+ +
+ +
+ + +
+ +
+ +
+ +
+
+ +
+ + +
+ +
+
+
+ + +
+

Spectrogram Parameters

+ +
+
+
-
-
+
+
- -
-
+ +
+
-
-
- +
+
+ -
+
+
- +
-
- -
- -
-
-
-
-

Spectrum Analysis

- Spectrum Analysis Plot +
+ +
+
+ +
+
+ + +
+
+
+

Spectrum Analysis

+
+ +
+
+ +
+ Spectrum Analysis plot +
+
+
-

Spectrum Viewer v1.0 β€’ Real-time RF Monitoring System

+ Gain-Viz β€’ Real-time RF monitoring
-
- +
- + // ---------------- Params Form ---------------- + const paramForm = document.getElementById('paramForm'); + paramForm.addEventListener('submit', function(e){ + e.preventDefault(); + const btn = document.getElementById('paramUpdateBtn'); + const formData = new FormData(paramForm); + btn.disabled = true; + fetch('/update_params', { method:'POST', body: formData }) + .then(r => r.json()) + .then(data => { + btn.disabled = false; + if (data && data.status === 'success') { + showStatus('paramStatusMessage', data.message || 'Parameters updated', 'success'); + } else { + showStatus('paramStatusMessage', data.message || 'Error updating parameters', 'error'); + } + }) + .catch(err => { + btn.disabled = false; + console.error(err); + showStatus('paramStatusMessage','Server error','error'); + }); + }); + + // ---------------- Plot refresh ---------------- + function refreshPlot(){ + if (!isStreaming || isPlotPaused) return; + // use cache-buster to avoid cached/partial file + plotImg.src = '/plot?_ts=' + Date.now(); + } + + // Start auto refresh only when streaming + function startAutoRefresh() { + refreshInterval = setInterval(refreshPlot, 500); + } + + // Manual refresh button + document.getElementById('refreshPlotBtn').addEventListener('click', function() { + refreshPlot(); + }); + + // Stream control buttons + document.getElementById('startBtn').addEventListener('click', startStream); + document.getElementById('stopBtn').addEventListener('click', stopStream); + document.getElementById('pauseBtn').addEventListener('click', pauseStream); + + // Check stream state every 2 seconds + setInterval(checkStreamState, 2000); + + // initial load + loadGains(); + checkStreamState(); + startAutoRefresh(); + })(); + - + \ No newline at end of file