From 6783a1cbc42e1a79e5aab25d739ab2302f75ac10 Mon Sep 17 00:00:00 2001 From: Smittix Date: Fri, 6 Feb 2026 17:06:22 +0000 Subject: [PATCH] Fix DMR synthesizer canvas sizing to use element's own rendered rect getBoundingClientRect on the canvas itself (sized via CSS width:100%) instead of parentElement with arbitrary offset, preventing zero-width canvas when flex layout timing varies. Co-Authored-By: Claude Opus 4.6 --- static/js/modes/dmr.js | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/static/js/modes/dmr.js b/static/js/modes/dmr.js index 6ff1dbd..a665470 100644 --- a/static/js/modes/dmr.js +++ b/static/js/modes/dmr.js @@ -225,9 +225,12 @@ function initDmrSynthesizer() { dmrSynthCanvas = document.getElementById('dmrSynthCanvas'); if (!dmrSynthCanvas) return; - const rect = dmrSynthCanvas.parentElement.getBoundingClientRect(); - dmrSynthCanvas.width = rect.width - 20; - dmrSynthCanvas.height = 70; + // Use the canvas element's own rendered size for the backing buffer + const rect = dmrSynthCanvas.getBoundingClientRect(); + const w = Math.round(rect.width) || 600; + const h = Math.round(rect.height) || 70; + dmrSynthCanvas.width = w; + dmrSynthCanvas.height = h; dmrSynthCtx = dmrSynthCanvas.getContext('2d'); @@ -427,10 +430,10 @@ function updateDmrSynthStatus() { function resizeDmrSynthesizer() { if (!dmrSynthCanvas) return; - const rect = dmrSynthCanvas.parentElement.getBoundingClientRect(); + const rect = dmrSynthCanvas.getBoundingClientRect(); if (rect.width > 0) { - dmrSynthCanvas.width = rect.width - 20; - dmrSynthCanvas.height = 70; + dmrSynthCanvas.width = Math.round(rect.width); + dmrSynthCanvas.height = Math.round(rect.height) || 70; } }