feat: move radiosonde status display to main pane stats strip

Move tracking state, balloon count, last update, and waveform from the
sidebar into a stats strip above the map, matching the APRS strip pattern.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Smittix
2026-03-02 16:58:16 +00:00
parent e89a0ef486
commit be70d2e43b
3 changed files with 131 additions and 5 deletions

View File

@@ -35,7 +35,7 @@
<div class="section">
<h3>Status</h3>
<div id="radiosondeWaveformContainer" style="margin-bottom: 8px;"></div>
<!-- waveform lives in the main-pane strip now -->
<div id="radiosondeStatusDisplay" class="info-text">
<p>Status: <span id="radiosondeStatusText" style="color: var(--accent-yellow);">Standby</span></p>
<p>Balloons: <span id="radiosondeBalloonCount">0</span></p>
@@ -115,7 +115,7 @@
function initRadiosondeWaveform() {
if (radiosondeWaveform) return;
if (typeof SignalWaveform === 'undefined') return;
const el = document.getElementById('radiosondeWaveformContainer');
const el = document.getElementById('radiosondeStripWaveform');
if (el) {
radiosondeWaveform = new SignalWaveform.Live(el, {
width: 200,
@@ -183,6 +183,10 @@
document.getElementById('stopRadiosondeBtn').style.display = 'block';
document.getElementById('radiosondeStatusText').textContent = 'Tracking';
document.getElementById('radiosondeStatusText').style.color = 'var(--accent-green)';
const stripDot = document.getElementById('radiosondeStripDot');
if (stripDot) stripDot.className = 'status-dot tracking';
const stripStatus = document.getElementById('radiosondeStripStatus');
if (stripStatus) stripStatus.textContent = 'TRACKING';
startRadiosondeSSE();
} else {
alert(data.message || 'Failed to start radiosonde tracking');
@@ -210,6 +214,14 @@
document.getElementById('radiosondeStatusText').textContent = 'Standby';
document.getElementById('radiosondeBalloonCount').textContent = '0';
document.getElementById('radiosondeLastUpdate').textContent = '\u2014';
const stripDot = document.getElementById('radiosondeStripDot');
if (stripDot) stripDot.className = 'status-dot';
const stripStatus = document.getElementById('radiosondeStripStatus');
if (stripStatus) stripStatus.textContent = 'STANDBY';
const stripBalloons = document.getElementById('radiosondeStripBalloons');
if (stripBalloons) stripBalloons.textContent = '0';
const stripUpdate = document.getElementById('radiosondeStripUpdate');
if (stripUpdate) stripUpdate.textContent = '--:--:--';
radiosondeBalloons = {};
// Clear map markers
if (typeof radiosondeMap !== 'undefined' && radiosondeMap) {
@@ -221,6 +233,10 @@
})
.catch(() => {
document.getElementById('radiosondeStatusText').textContent = 'Standby';
const stripDot = document.getElementById('radiosondeStripDot');
if (stripDot) stripDot.className = 'status-dot';
const stripStatus = document.getElementById('radiosondeStripStatus');
if (stripStatus) stripStatus.textContent = 'STANDBY';
});
}
@@ -234,10 +250,15 @@
if (data.type === 'balloon') {
if (radiosondeWaveform) radiosondeWaveform.ping();
radiosondeBalloons[data.id] = data;
document.getElementById('radiosondeBalloonCount').textContent = Object.keys(radiosondeBalloons).length;
const balloonCount = Object.keys(radiosondeBalloons).length;
document.getElementById('radiosondeBalloonCount').textContent = balloonCount;
const stripBalloons = document.getElementById('radiosondeStripBalloons');
if (stripBalloons) stripBalloons.textContent = balloonCount;
const now = new Date();
document.getElementById('radiosondeLastUpdate').textContent =
now.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit' });
const timeStr = now.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit' });
document.getElementById('radiosondeLastUpdate').textContent = timeStr;
const stripUpdate = document.getElementById('radiosondeStripUpdate');
if (stripUpdate) stripUpdate.textContent = timeStr;
updateRadiosondeMap(data);
updateRadiosondeCards();
}
@@ -477,6 +498,12 @@
document.getElementById('radiosondeStatusText').textContent = 'Tracking';
document.getElementById('radiosondeStatusText').style.color = 'var(--accent-green)';
document.getElementById('radiosondeBalloonCount').textContent = data.balloon_count || 0;
const stripDot = document.getElementById('radiosondeStripDot');
if (stripDot) stripDot.className = 'status-dot tracking';
const stripStatus = document.getElementById('radiosondeStripStatus');
if (stripStatus) stripStatus.textContent = 'TRACKING';
const stripBalloons = document.getElementById('radiosondeStripBalloons');
if (stripBalloons) stripBalloons.textContent = data.balloon_count || 0;
startRadiosondeSSE();
}
})