sjg/trx-rs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[style](trx-frontend-http): move bandplan strip from bottom to top of spectrum

Browse Source 
Repositions the bandplan rendering above the waterfall instead of below
the spectrum waveform. Updates both the WebGL draw position (y=0) and
the CSS overlay positioning (top:0) for the label layer.

https://claude.ai/code/session_01Bt6iUi6Pc1v7yvLffEjweJ
Signed-off-by: Claude <noreply@anthropic.com>
This commit is contained in:
Claude
2026-03-30 06:05:19 +00:00
committed by Stan Grams
parent 67f0d451b9
commit 71bf8d9456
2 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js
+4 -4
View File
@@ -10189,16 +10189,16 @@ function drawSpectrum(data) {
spectrumGl.drawPoints(spectrumTmpMarkerPoints, Math.max(2, dpr * 1.6), cssColorToRgba(pal.waveformPeak)); spectrumGl.drawPoints(spectrumTmpMarkerPoints, Math.max(2, dpr * 1.6), cssColorToRgba(pal.waveformPeak));
} }
// ── Bandplan WebGL strip (bottom of spectrum, above waterfall) ── // ── Bandplan WebGL strip (top of spectrum, above waterfall) ──
if (bandplanRegion !== "off" && bandplanData) { if (bandplanRegion !== "off" && bandplanData) {
const bpSegs = bandplanVisibleSegments(bandplanRegion, range.visLoHz, range.visHiHz); const bpSegs = bandplanVisibleSegments(bandplanRegion, range.visLoHz, range.visHiHz);
if (bpSegs.length > 0) { if (bpSegs.length > 0) {
const bpH = Math.round(BANDPLAN_STRIP_CSS_HEIGHT * dpr); const bpH = Math.round(BANDPLAN_STRIP_CSS_HEIGHT * dpr);
const bpY = H - bpH; const bpY = 0;
// Dark backdrop so segments are readable over the spectrum fill. // Dark backdrop so segments are readable over the spectrum fill.
spectrumGl.fillRect(0, bpY, W, bpH, [0.07, 0.09, 0.15, 0.82]); spectrumGl.fillRect(0, bpY, W, bpH, [0.07, 0.09, 0.15, 0.82]);
// Thin separator line at top of bandplan strip. // Thin separator line at bottom of bandplan strip.
spectrumGl.drawSegments([0, bpY, W, bpY], spectrumGl.drawSegments([0, bpY + bpH, W, bpY + bpH],
[1, 1, 1, 0.08], Math.max(1, dpr * 0.5)); [1, 1, 1, 0.08], Math.max(1, dpr * 0.5));
const bpVerts = []; const bpVerts = [];
for (const seg of bpSegs) { for (const seg of bpSegs) {
src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
+2 -2
View File
@@ -3303,10 +3303,10 @@ button:focus-visible, input:focus-visible, select:focus-visible {
/* ── WebGL overlay mode ── When the spectrum canvas is visible the coloured /* ── WebGL overlay mode ── When the spectrum canvas is visible the coloured
segments are rendered via WebGL. The DOM strip repositions itself as a segments are rendered via WebGL. The DOM strip repositions itself as a
transparent label overlay at the bottom of the spectrum canvas. */ transparent label overlay at the top of the spectrum canvas. */
#spectrum-bandplan-strip.bp-webgl { #spectrum-bandplan-strip.bp-webgl {
position: absolute; position: absolute;
top: calc(var(--spectrum-plot-height) - 18px); top: 0;
left: 0; left: 0;
right: 0; right: 0;
background: transparent; background: transparent;