From d040d7e04622d89e9110f699e87f3bc1d7bc385d Mon Sep 17 00:00:00 2001 From: skal Date: Sun, 15 Feb 2026 12:43:30 +0100 Subject: fix(timeline-editor): improve mouse-wheel handling and prevent UI interference - Extract wheel handler to support both timeline and waveform scrolling - Add wheel event support to waveform container for horizontal scroll/zoom - Block wheel event propagation from header, properties panel, zoom controls, and stats Co-Authored-By: Claude Sonnet 4.5 --- tools/timeline_editor/index.html | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/tools/timeline_editor/index.html b/tools/timeline_editor/index.html index 363c5cb..775330f 100644 --- a/tools/timeline_editor/index.html +++ b/tools/timeline_editor/index.html @@ -1038,7 +1038,7 @@ updateIndicatorPosition(timeToBeats(state.playbackOffset), false); }); - dom.timelineContent.addEventListener('wheel', e => { + const handleWheel = e => { e.preventDefault(); if (e.ctrlKey || e.metaKey) { const rect = dom.timelineContent.getBoundingClientRect(), mouseX = e.clientX - rect.left; @@ -1074,7 +1074,16 @@ const targetScrollTop = state.sequences[targetSeqIndex]?._yPosition || 0; const currentScrollTop = dom.timelineContent.scrollTop, scrollDiff = targetScrollTop - currentScrollTop; if (Math.abs(scrollDiff) > 5) dom.timelineContent.scrollTop += scrollDiff * VERTICAL_SCROLL_SPEED; - }, { passive: false }); + }; + + dom.timelineContent.addEventListener('wheel', handleWheel, { passive: false }); + dom.waveformContainer.addEventListener('wheel', handleWheel, { passive: false }); + + // Prevent wheel events from bubbling up from UI containers + document.querySelector('header').addEventListener('wheel', e => e.stopPropagation()); + dom.propertiesPanel.addEventListener('wheel', e => e.stopPropagation()); + document.querySelector('.zoom-controls').addEventListener('wheel', e => e.stopPropagation()); + document.querySelector('.stats').addEventListener('wheel', e => e.stopPropagation()); window.addEventListener('resize', renderTimeline); renderTimeline(); loadFromURLParams(); -- cgit v1.2.3