Replaces legacy Frame-based object positioning and shape management with
AnimationData curves throughout the codebase. This enables time-based
animation instead of discrete frame indices, providing smoother playback
and more flexible keyframe editing.
Key changes:
- Remove currentFrame getter and frame.keys lookups
- Replace setFrameNum() with setTime() for continuous time navigation
- Add Layer.addShape()/removeShape() with AnimationData integration
- Migrate actions (move, group, delete, z-order) to use animation curves
- Update keyboard shortcuts and drag operations to modify curves directly
- Leave "holes" in shapeIndex values for proper undo/redo support
Rendering now fully driven by AnimationData curves (exists, zOrder,
shapeIndex for shapes; x, y, rotation, scale for objects).
Phase 2 Implementation:
- Added TrackHierarchy class to build and manage hierarchical track structure
- Track display with expand/collapse triangles for layers and groups
- Hierarchical indentation for visual hierarchy
- Track selection syncs with stage selection (shapes, objects, layers)
- Vertical scrolling for track area when many tracks present
- Horizontal scrolling in ruler area for timeline navigation
Timeline Integration:
- Set TimelineV2 as default timeline on app load
- Timeline automatically updates when shapes added or grouped
- Trigger timeline redraw in renderLayers() for efficient batching
Selection System:
- Clicking tracks selects corresponding objects/shapes on stage
- Selected tracks highlighted in timeline
- Updates context.selection and context.shapeselection arrays
- Stores oldselection/oldshapeselection for undo support
- Calls updateUI() and updateMenu() to sync UI state
Visual Improvements:
- Use predefined colors from styles.js (no hardcoded colors)
- Alternating track background colors for readability
- Selection highlighting with predefined highlight color
- Type indicators for tracks: [L]ayer, [G]roup, [S]hape
Mouse Interactions:
- Click ruler area to move playhead
- Click track expand/collapse triangles to show/hide children
- Click track name to select object/shape
- Scroll wheel in ruler area for horizontal timeline scroll
- Scroll wheel in track area for vertical track list scroll
- Adjusts hit testing for vertical scroll offset
Skyler Lehmkuhl