Fix VU canvas black blocks and colored glow-bleed lines

This commit is contained in:
ComputerTech 2026-03-05 17:25:40 +00:00
parent b5ea9e8d01
commit 49062cf6de
2 changed files with 19 additions and 2 deletions

View File

@ -322,8 +322,14 @@ function animateVUMeters() {
const anyPlaying = decks.A.playing || decks.B.playing;
const isListener = window.location.port === '5001' || window.location.search.includes('listen=true');
// Skip rendering if nothing is happening to save battery
if (!anyPlaying && !isListener) return;
// When nothing is playing, clear canvases to transparent so they don't show as dark blocks
if (!anyPlaying && !isListener) {
['A', 'B'].forEach(id => {
const canvas = document.getElementById('viz-' + id);
if (canvas) canvas.getContext('2d').clearRect(0, 0, canvas.width, canvas.height);
});
return;
}
['A', 'B'].forEach(id => {
const canvas = document.getElementById('viz-' + id);

View File

@ -222,6 +222,7 @@ header h1 {
/* Adjust based on header height */
min-height: 0;
overflow: hidden;
background: var(--bg-dark); /* Prevent deck box-shadows bleeding into padding gaps */
}
/* LIBRARY SECTION */
@ -546,6 +547,16 @@ canvas {
border: 1px solid #333;
}
/* VU meter canvases — transparent when idle so they don't show as black blocks */
#viz-A,
#viz-B {
background: transparent !important;
border: none !important;
border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
margin: 2px 0 6px 0 !important;
}
@keyframes pulse {