[feat](trx-frontend-http): enhance header telemetry and responsive UX

Implement UI refinements for the HTTP frontend main and plugin views.\n\n- add dimmed header signal graph with live rendering and scale\n- make graph responsive, colorized by signal strength, and keep last 10s only\n- add APRS and WSPR text filtering, matching FT8 behavior\n- refine responsive layout for controls/map/header behavior\n- tune jog wheel/button sizing and mode selector height alignment\n\nCo-authored-by: OpenAI Codex <codex@openai.com>

Signed-off-by: Stanislaw Grams <stanislawgrams@gmail.com>

src/trx-client/trx-frontend/trx-frontend-http/assets/web/plugins/wspr.js

@@ -2,8 +2,10 @@
 const wsprStatus = document.getElementById("wspr-status");
 const wsprPeriodEl = document.getElementById("wspr-period");
 const wsprMessagesEl = document.getElementById("wspr-messages");
+const wsprFilterInput = document.getElementById("wspr-filter");
 const WSPR_MAX_MESSAGES = 200;
 const WSPR_PERIOD_SECONDS = 120;
+let wsprFilterText = "";
 
 function fmtWsprTime(tsMs) {
   if (!tsMs) return "--:--:--";
@@ -31,7 +33,9 @@ function renderWsprRow(msg) {
   const rfHz = Number.isFinite(msg.freq_hz) && Number.isFinite(baseHz) ? (baseHz + msg.freq_hz) : null;
   const freq = Number.isFinite(rfHz) ? rfHz.toFixed(0) : "--";
   const message = (msg.message || "").toString();
+  row.dataset.message = message.toUpperCase();
   row.innerHTML = `<span class="ft8-time">${fmtWsprTime(msg.ts_ms)}</span><span class="ft8-snr">${snr}</span><span class="ft8-dt">${dt}</span><span class="ft8-freq">${freq}</span><span class="ft8-msg">${escapeWsprHtml(message)}</span>`;
+  applyWsprFilterToRow(row);
   return row;
 }
 
@@ -50,6 +54,27 @@ function escapeWsprHtml(input) {
     .replaceAll("\"", "&quot;");
 }
 
+function applyWsprFilterToRow(row) {
+  if (!wsprFilterText) {
+    row.style.display = "";
+    return;
+  }
+  const message = row.dataset.message || "";
+  row.style.display = message.includes(wsprFilterText) ? "" : "none";
+}
+
+function applyWsprFilterToAll() {
+  const rows = wsprMessagesEl.querySelectorAll(".ft8-row");
+  rows.forEach((row) => applyWsprFilterToRow(row));
+}
+
+if (wsprFilterInput) {
+  wsprFilterInput.addEventListener("input", () => {
+    wsprFilterText = wsprFilterInput.value.trim().toUpperCase();
+    applyWsprFilterToAll();
+  });
+}
+
 document.getElementById("wspr-decode-toggle-btn").addEventListener("click", async () => {
   try { await postPath("/toggle_wspr_decode"); } catch (e) { console.error("WSPR toggle failed", e); }
 });