diff --git a/components/tracks/Track.tsx b/components/tracks/Track.tsx index 77011d6..5d56bea 100644 --- a/components/tracks/Track.tsx +++ b/components/tracks/Track.tsx @@ -341,16 +341,17 @@ export function Track({ } // 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; + // If duration is 0 or invalid, use full width (first track scenario) + const trackDurationRatio = duration > 0 ? buffer.duration / duration : 1; + const trackWidth = Math.min(width * trackDurationRatio, width); + const samplesPerPixel = trackWidth > 0 ? buffer.length / trackWidth : 0; // Draw waveform ctx.fillStyle = track.color; ctx.strokeStyle = track.color; ctx.lineWidth = 1; - for (let x = 0; x < trackWidth; x++) { + for (let x = 0; x < Math.floor(trackWidth); x++) { const startSample = Math.floor(x * samplesPerPixel); const endSample = Math.floor((x + 1) * samplesPerPixel);