From efa59a79dfabfe11d25df624421915d49dc652eb Mon Sep 17 00:00:00 2001 From: skal Date: Sun, 15 Feb 2026 15:23:21 +0100 Subject: fix(timeline-editor): capture all wheel events at container level - Add timelineContainer reference and capture wheel events with { capture: true } - Remove redundant wheel handlers from individual sequence/effect elements - Prevents child elements from interfering with zoom/scroll functionality Co-Authored-By: Claude Sonnet 4.5 --- tools/timeline_editor/timeline-viewport.js | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) (limited to 'tools/timeline_editor/timeline-viewport.js') diff --git a/tools/timeline_editor/timeline-viewport.js b/tools/timeline_editor/timeline-viewport.js index 196368e..c0e3cf5 100644 --- a/tools/timeline_editor/timeline-viewport.js +++ b/tools/timeline_editor/timeline-viewport.js @@ -22,17 +22,15 @@ export class ViewportController { // Scroll sync this.dom.timelineContent.addEventListener('scroll', () => this.handleScroll()); - // Wheel handling + // Wheel handling - capture at container level to override all child elements const wheelHandler = e => this.handleWheel(e); - this.dom.timelineContent.addEventListener('wheel', wheelHandler, { passive: false }); - this.dom.waveformContainer.addEventListener('wheel', wheelHandler, { passive: false }); + this.dom.timelineContainer.addEventListener('wheel', wheelHandler, { passive: false, capture: true }); - // Prevent wheel bubbling from UI containers + // Prevent wheel bubbling from UI containers outside timeline document.querySelector('header').addEventListener('wheel', e => e.stopPropagation()); this.dom.propertiesPanel.addEventListener('wheel', e => e.stopPropagation()); document.querySelector('.zoom-controls').addEventListener('wheel', e => e.stopPropagation()); document.querySelector('.stats').addEventListener('wheel', e => e.stopPropagation()); - document.getElementById('timeMarkers').addEventListener('wheel', e => e.stopPropagation()); // Waveform hover tracking this.dom.waveformContainer.addEventListener('mouseenter', () => this.showWaveformCursor()); -- cgit v1.2.3