[fix](trx-frontend): align spectrum RDS overlays vertically
Keep virtual-channel RDS overlays on a shared vertical axis. Co-authored-by: OpenAI Codex <codex@openai.com> Signed-off-by: Stan Grams <sjg@haxx.space>
This commit is contained in:
@@ -1352,13 +1352,12 @@ function renderRdsOverlays() {
|
|||||||
rdsPsOverlay.style.display = "none";
|
rdsPsOverlay.style.display = "none";
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
entries.forEach((entry, idx) => {
|
entries.forEach((entry) => {
|
||||||
const html = buildRdsOverlayHtml(entry.rds);
|
const html = buildRdsOverlayHtml(entry.rds);
|
||||||
if (!html) return;
|
if (!html) return;
|
||||||
const el = document.createElement("div");
|
const el = document.createElement("div");
|
||||||
el.className = "rds-ps-overlay-item";
|
el.className = "rds-ps-overlay-item";
|
||||||
el.dataset.freqHz = String(entry.freq_hz);
|
el.dataset.freqHz = String(entry.freq_hz);
|
||||||
el.dataset.stackIdx = String(idx);
|
|
||||||
el.innerHTML = html;
|
el.innerHTML = html;
|
||||||
el.addEventListener("click", (evt) => {
|
el.addEventListener("click", (evt) => {
|
||||||
evt.stopPropagation();
|
evt.stopPropagation();
|
||||||
@@ -1371,7 +1370,7 @@ function renderRdsOverlays() {
|
|||||||
if (el.dataset.defaultZ) el.style.zIndex = el.dataset.defaultZ;
|
if (el.dataset.defaultZ) el.style.zIndex = el.dataset.defaultZ;
|
||||||
});
|
});
|
||||||
rdsPsOverlay.appendChild(el);
|
rdsPsOverlay.appendChild(el);
|
||||||
rdsOverlayEntries.push({ ...entry, el, stackIdx: idx });
|
rdsOverlayEntries.push({ ...entry, el });
|
||||||
});
|
});
|
||||||
if (rdsOverlayEntries.length === 0) {
|
if (rdsOverlayEntries.length === 0) {
|
||||||
rdsPsOverlay.style.display = "none";
|
rdsPsOverlay.style.display = "none";
|
||||||
@@ -1389,9 +1388,6 @@ function positionRdsOverlays() {
|
|||||||
if (width <= 0) return;
|
if (width <= 0) return;
|
||||||
const range = spectrumVisibleRange(lastSpectrumData);
|
const range = spectrumVisibleRange(lastSpectrumData);
|
||||||
if (!Number.isFinite(range.visLoHz) || !Number.isFinite(range.visSpanHz) || range.visSpanHz <= 0) return;
|
if (!Number.isFinite(range.visLoHz) || !Number.isFinite(range.visSpanHz) || range.visSpanHz <= 0) return;
|
||||||
const count = rdsOverlayEntries.length;
|
|
||||||
const mid = (count - 1) / 2;
|
|
||||||
const stackStepPx = 26;
|
|
||||||
// Assign z-indices: sort by frequency ascending so higher-frequency layers
|
// Assign z-indices: sort by frequency ascending so higher-frequency layers
|
||||||
// sit on top of lower-frequency ones in the default (non-hover) state.
|
// sit on top of lower-frequency ones in the default (non-hover) state.
|
||||||
const sortedByFreq = [...rdsOverlayEntries].sort((a, b) => a.freq_hz - b.freq_hz);
|
const sortedByFreq = [...rdsOverlayEntries].sort((a, b) => a.freq_hz - b.freq_hz);
|
||||||
@@ -1406,9 +1402,8 @@ function positionRdsOverlays() {
|
|||||||
el.style.display = "";
|
el.style.display = "";
|
||||||
const rel = (entry.freq_hz - range.visLoHz) / range.visSpanHz;
|
const rel = (entry.freq_hz - range.visLoHz) / range.visSpanHz;
|
||||||
const clamped = Math.max(0.06, Math.min(0.94, rel));
|
const clamped = Math.max(0.06, Math.min(0.94, rel));
|
||||||
const offsetPx = Math.round((idx - mid) * stackStepPx);
|
|
||||||
el.style.left = `${clamped * width}px`;
|
el.style.left = `${clamped * width}px`;
|
||||||
el.style.top = `calc(50% + ${offsetPx}px)`;
|
el.style.top = "50%";
|
||||||
const z = String(freqZMap.get(entry.id) ?? (idx + 1));
|
const z = String(freqZMap.get(entry.id) ?? (idx + 1));
|
||||||
el.style.zIndex = z;
|
el.style.zIndex = z;
|
||||||
el.dataset.defaultZ = z;
|
el.dataset.defaultZ = z;
|
||||||
|
|||||||
Reference in New Issue
Block a user