fix(ook): fix output panel layout, persist frames, wire global status bar

- Fix double-scroll by switching ookOutputPanel to flex layout
- Keep decoded frames visible after stopping (persist for review)
- Wire global Clear/CSV/JSON status bar buttons to OOK functions
- Hide default output pane in OOK mode (uses own panel)
- Add command display showing the active rtl_433 command
- Add JSON export and auto-scroll support
- Fix 0x prefix stripping in OOK hex decoder
- Fix PWM encoding hint text

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
thatsatechnique
2026-03-04 11:51:39 -08:00
parent 0c3ccac21c
commit f771100a4c
5 changed files with 86 additions and 16 deletions

View File

@@ -3292,11 +3292,11 @@
</div>
<!-- OOK Decoder Output Panel -->
<div id="ookOutputPanel" style="display: none; margin-bottom: 12px;">
<div style="background: #0a0a0a; border: 1px solid #1a2e1a; border-radius: 6px; padding: 8px 10px;">
<!-- Toolbar row 1: bit order + actions -->
<div id="ookOutputPanel" style="display: none; flex-direction: column; flex: 1; min-height: 0; overflow: hidden; padding: 10px;">
<div style="background: #0a0a0a; border: 1px solid #1a2e1a; border-radius: 6px; padding: 8px 10px; display: flex; flex-direction: column; height: 100%; min-height: 0;">
<!-- Toolbar row 1: bit order -->
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; font-size: 10px; color: #555; text-transform: uppercase; letter-spacing: 1px;">
<span>Decoded Frames</span>
<span>Decoded Frames <span id="ookStatusBarFrames" style="color: var(--text-dim);">0 frames</span></span>
<div style="display: flex; gap: 6px; align-items: center;">
<span style="color: var(--text-dim); font-size: 10px;">Bit order:</span>
<button class="btn btn-sm btn-ghost" id="ookBitMSB"
@@ -3308,8 +3308,6 @@
title="Auto-detect best bit order from printable character count">
Suggest <span id="ookSuggestLabel" style="font-size:9px; margin-left:2px;"></span>
</button>
<button class="btn btn-sm btn-ghost" onclick="OokMode.clearOutput()">Clear</button>
<button class="btn btn-sm btn-ghost" onclick="OokMode.exportLog()">CSV</button>
</div>
</div>
<!-- Toolbar row 2: pattern filter -->
@@ -3319,10 +3317,7 @@
oninput="OokMode.filterFrames(this.value)"
style="width: 100%; background: #111; border: 1px solid #222; border-radius: 3px; color: var(--text-dim); font-family: var(--font-mono); font-size: 10px; padding: 3px 6px; box-sizing: border-box;">
</div>
<div id="ookOutput" style="max-height: 400px; overflow-y: auto; font-family: var(--font-mono); font-size: 10px; color: var(--text-dim);"></div>
</div>
<div style="margin-top: 4px; font-size: 10px; color: #555; text-align: right;">
<span id="ookStatusBarFrames">0 frames</span>
<div id="ookOutput" style="flex: 1; min-height: 0; overflow-y: auto; font-family: var(--font-mono); font-size: 10px; color: var(--text-dim);"></div>
</div>
</div>
@@ -4591,7 +4586,7 @@
// Hide output console for modes with their own visualizations
const outputEl = document.getElementById('output');
const statusBar = document.querySelector('.status-bar');
if (outputEl) outputEl.style.display = (mode === 'satellite' || mode === 'sstv' || mode === 'weathersat' || mode === 'sstv_general' || mode === 'wefax' || mode === 'aprs' || mode === 'wifi' || mode === 'bluetooth' || mode === 'tscm' || mode === 'spystations' || mode === 'meshtastic' || mode === 'websdr' || mode === 'subghz' || mode === 'spaceweather' || mode === 'bt_locate' || mode === 'waterfall' || mode === 'morse' || mode === 'meteor' || mode === 'system') ? 'none' : 'block';
if (outputEl) outputEl.style.display = (mode === 'satellite' || mode === 'sstv' || mode === 'weathersat' || mode === 'sstv_general' || mode === 'wefax' || mode === 'aprs' || mode === 'wifi' || mode === 'bluetooth' || mode === 'tscm' || mode === 'spystations' || mode === 'meshtastic' || mode === 'websdr' || mode === 'subghz' || mode === 'spaceweather' || mode === 'bt_locate' || mode === 'waterfall' || mode === 'morse' || mode === 'meteor' || mode === 'system' || mode === 'ook') ? 'none' : 'block';
if (statusBar) statusBar.style.display = (mode === 'satellite' || mode === 'websdr' || mode === 'subghz' || mode === 'spaceweather' || mode === 'waterfall' || mode === 'morse' || mode === 'meteor' || mode === 'system') ? 'none' : 'flex';
// Restore sidebar when leaving Meshtastic mode (user may have collapsed it)
@@ -5691,6 +5686,7 @@
let allMessages = [];
function exportCSV() {
if (currentMode === 'ook') { OokMode.exportLog(); return; }
if (allMessages.length === 0) {
alert('No messages to export');
return;
@@ -5712,6 +5708,7 @@
}
function exportJSON() {
if (currentMode === 'ook') { OokMode.exportJSON(); return; }
if (allMessages.length === 0) {
alert('No messages to export');
return;
@@ -6897,6 +6894,7 @@
}
function clearMessages() {
if (currentMode === 'ook') { OokMode.clearOutput(); return; }
document.getElementById('output').innerHTML = `
<div class="placeholder" style="color: #888; text-align: center; padding: 50px;">
Messages cleared. ${isRunning || isSensorRunning ? 'Waiting for new messages...' : 'Start decoding to receive messages.'}