feat(cursor/zoom): add cursor tracking, smoothing, and zoom-follow #79
Conversation
Define pause points as the last sampled position before the next movement begins (not idle detection) Build cursor paths using centripetal Catmull–Rom splines (α = 0.5) to ensure the curve interpolates all pause points Bind each spline segment strictly to its original time range to prevent teleporting during playback Guarantee cursor position exactly matches pause points at their timestamps Enforce continuous cursor motion between points with linear time parameterization Fallback to linear interpolation when insufficient pause points are available
- Move time offset into CursorStyle (new fields: offsetMs, offsetX, offsetY) - Set defaults: offsetMs = 160ms, offsetX = 3px, offsetY = 5px - Apply offsetMs to playhead calculation and apply offsetX/offsetY to cursor drawing, trails and click effects in VideoPlayback - Load/store style offsets when reading cursor data - Add combined "Cursor Offset" UI (time + X/Y) under Style in SettingsPanel (above Path Smoothing), wired to onCursorStyleChange - Remove references to undefined cursorOffsetMs and clean up related state - Update types (`CursorStyle`, `DEFAULT_CURSOR_STYLE`)
… "center-on-cursor" zoom follow that uses the existing cursor smoothing output (supports `none`, `quadratic`, and `end2end`) so the camera center tracks the smoothed cursor path rather than raw event points.- Limit follow to active zoom regions only (strength > 0). The follow behavior now activates during region fade-in/fade-out and disables when the region is no longer active; any persistent anchor is cleared on exit.- Snap behavior: when follow is enabled or mode switches to `center`, the camera is snapped immediately to the smoothed cursor position and any anchor is cleared so the ticker can continue following the smoothed target.- Fix playhead time unit bug: remove incorrect extra *1000 when computing `playheadMs` from `currentTimeRef.current` so follow calculations use the correct ms values.- Keep smoothing parameters (quadratic strength, end2end params) in refs for consistent synchronous access from the PIXI ticker.- Add conservative error swallowing around optional follow logic and provide a runtime debug toggle (`__openscreen_debugZoomFollow`) to inspect follow data.
|
This implementation intentionally avoids using uiohook-napi for global mouse event monitoring. reduces native dependency surface and platform-specific risks |
|
it looks so cool! |
Thanks! You’re right — currently cursor rendering only works in preview. Export support hasn’t been implemented yet. If this direction looks good to you, I’m happy to add export support next 👍 |
2 participants
Pull Request
Description
This PR introduces cursor recording, styling, smoothing, and playback support for video recording and editing. It adds global mouse tracking during recording, persistent cursor data storage, rich cursor rendering , spline-based smoothing, configurable offsets, and dynamic zoom-follow behavior driven by the smoothed cursor track. The feature is fully integrated across recording, timeline, settings, and video playback.
Motivation
This PR solves these issues by enabling high-fidelity cursor capture and playback, improving visual clarity, temporal alignment, and overall video polish—especially for tutorial and demo recordings.
Type of Change:
New Feature
Related Issue(s):
N/A
Testing
Adjust:
Regression Checks
Summary of Key Changes (for reviewers)