refactor: Update playhead auto-scroll buffer and remove conflicting sync

This commit is contained in:
Karan Singh
2025-06-27 00:50:37 +05:30
parent 17ef810074
commit f3c45ee892

View File

@ -611,7 +611,7 @@ export function Timeline() {
rulerViewport.removeEventListener('scroll', handleRulerScroll); rulerViewport.removeEventListener('scroll', handleRulerScroll);
tracksViewport.removeEventListener('scroll', handleTracksScroll); tracksViewport.removeEventListener('scroll', handleTracksScroll);
}; };
}, [duration, zoomLevel]); }, []);
// --- Playhead auto-scroll effect --- // --- Playhead auto-scroll effect ---
useEffect(() => { useEffect(() => {
@ -622,21 +622,17 @@ export function Timeline() {
const viewportWidth = rulerViewport.clientWidth; const viewportWidth = rulerViewport.clientWidth;
const scrollMin = 0; const scrollMin = 0;
const scrollMax = rulerViewport.scrollWidth - viewportWidth; const scrollMax = rulerViewport.scrollWidth - viewportWidth;
// Center the playhead if it's not visible (60px buffer) // Center the playhead if it's not visible (100px buffer)
const desiredScroll = Math.max( const desiredScroll = Math.max(
scrollMin, scrollMin,
Math.min(scrollMax, playheadPx - viewportWidth / 2) Math.min(scrollMax, playheadPx - viewportWidth / 2)
); );
if ( if (
playheadPx < rulerViewport.scrollLeft + 60 || playheadPx < rulerViewport.scrollLeft + 100 ||
playheadPx > rulerViewport.scrollLeft + viewportWidth - 60 playheadPx > rulerViewport.scrollLeft + viewportWidth - 100
) { ) {
rulerViewport.scrollLeft = tracksViewport.scrollLeft = desiredScroll; rulerViewport.scrollLeft = tracksViewport.scrollLeft = desiredScroll;
} }
// Keep both scrolls in sync
if (rulerViewport.scrollLeft !== tracksViewport.scrollLeft) {
rulerViewport.scrollLeft = tracksViewport.scrollLeft = Math.max(rulerViewport.scrollLeft, tracksViewport.scrollLeft);
}
}, [playheadPosition, duration, zoomLevel]); }, [playheadPosition, duration, zoomLevel]);
return ( return (