From dd8d46795a2840e34856201655193e5426aa4f20 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sebastian=20Kr=C3=BCger?= Date: Thu, 20 Nov 2025 11:17:28 +0100 Subject: [PATCH] fix: waveform rendering to respect track duration vs project duration MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Calculate trackWidth based on track duration ratio to project duration - Shorter tracks now render proportionally instead of stretching - Longer tracks automatically update project duration - All existing tracks re-render correctly when duration changes 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- components/tracks/Track.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/components/tracks/Track.tsx b/components/tracks/Track.tsx index 4075b13..77011d6 100644 --- a/components/tracks/Track.tsx +++ b/components/tracks/Track.tsx @@ -339,14 +339,18 @@ export function Track({ } else { totalWidth = width; } - const samplesPerPixel = buffer.length / totalWidth; + + // Calculate how much of the canvas width this track's duration occupies + const trackDurationRatio = buffer.duration / duration; + const trackWidth = width * trackDurationRatio; + const samplesPerPixel = buffer.length / trackWidth; // Draw waveform ctx.fillStyle = track.color; ctx.strokeStyle = track.color; ctx.lineWidth = 1; - for (let x = 0; x < width; x++) { + for (let x = 0; x < trackWidth; x++) { const startSample = Math.floor(x * samplesPerPixel); const endSample = Math.floor((x + 1) * samplesPerPixel);