Browse Source

feat(ui): Enable timeline scroll on speed graph

Adds a 'wheel' event listener to the speed graph container, binding it to the existing `handleTimelineWheel` function.

This change enhances user experience by allowing timeline scrubbing via the mouse scroll wheel when the cursor is over the speed graph. It creates consistent behavior across all major visualization components (radar canvas, timeline, and speed graph), improving the application's usability.

The logic is centralized within `initSyncUIHandlers` in `sync.js` to keep all synchronization-related event bindings in one place.
refactor/sync-centralize
RUSHIL AMBARISH KADU 6 months ago
parent
commit
29875de89f
  1. 5
      steps/src/sync.js

5
steps/src/sync.js

@ -13,6 +13,7 @@ import {
egoSpeedDisplay, egoSpeedDisplay,
canSpeedDisplay, canSpeedDisplay,
autoOffsetIndicator, autoOffsetIndicator,
speedGraphContainer
} from "./dom.js"; } from "./dom.js";
import { VIDEO_FPS } from "./constants.js"; import { VIDEO_FPS } from "./constants.js";
import { findRadarFrameIndexForTime, precomputeRadarVideoSync } from "./utils.js"; import { findRadarFrameIndexForTime, precomputeRadarVideoSync } from "./utils.js";
@ -410,4 +411,8 @@ export function initSyncUIHandlers() {
videoPlayer.addEventListener("wheel", handleVideoPanelWheel, { videoPlayer.addEventListener("wheel", handleVideoPanelWheel, {
passive: false, passive: false,
}); });
// Use the speed graph container for radar frame seeking
speedGraphContainer.addEventListener("wheel", handleTimelineWheel, {
passive: false,
});
} }
Loading…
Cancel
Save