From 3e89d2998588f8e35c524e523ba2ee853f0f6475 Mon Sep 17 00:00:00 2001 From: Maze Winther Date: Mon, 20 Apr 2026 11:31:17 +0200 Subject: refactor: restructure files to their domains, new preview overlay system, and dep graph --- .../editor/panels/timeline/timeline-playhead.tsx | 114 --------------------- 1 file changed, 114 deletions(-) delete mode 100644 apps/web/src/components/editor/panels/timeline/timeline-playhead.tsx (limited to 'apps/web/src/components/editor/panels/timeline/timeline-playhead.tsx') diff --git a/apps/web/src/components/editor/panels/timeline/timeline-playhead.tsx b/apps/web/src/components/editor/panels/timeline/timeline-playhead.tsx deleted file mode 100644 index d9218371..00000000 --- a/apps/web/src/components/editor/panels/timeline/timeline-playhead.tsx +++ /dev/null @@ -1,114 +0,0 @@ -"use client"; - -import { useRef } from "react"; -import { - getCenteredLineLeft, - TIMELINE_INDICATOR_LINE_WIDTH_PX, - timelineTimeToSnappedPixels, -} from "@/lib/timeline"; -import { useTimelinePlayhead } from "@/hooks/timeline/use-timeline-playhead"; -import { TICKS_PER_SECOND } from "@/lib/wasm"; -import { useEditor } from "@/hooks/use-editor"; -import { - TIMELINE_SCROLLBAR_SIZE_PX, -} from "./layout"; -import { TIMELINE_LAYERS } from "./layers"; - -interface TimelinePlayheadProps { - zoomLevel: number; - hasHorizontalScrollbar: boolean; - rulerRef: React.RefObject; - rulerScrollRef: React.RefObject; - tracksScrollRef: React.RefObject; - timelineRef: React.RefObject; - playheadRef?: React.RefObject; - isSnappingToPlayhead?: boolean; -} - -export function TimelinePlayhead({ - zoomLevel, - hasHorizontalScrollbar, - rulerRef, - rulerScrollRef, - tracksScrollRef, - timelineRef, - playheadRef: externalPlayheadRef, - isSnappingToPlayhead = false, -}: TimelinePlayheadProps) { - const editor = useEditor(); - const duration = editor.timeline.getTotalDuration(); - const internalPlayheadRef = useRef(null); - const playheadRef = externalPlayheadRef || internalPlayheadRef; - - const { handlePlayheadMouseDown } = useTimelinePlayhead({ - zoomLevel, - rulerRef, - rulerScrollRef, - tracksScrollRef, - playheadRef, - }); - - const timelineContainerHeight = - timelineRef.current?.clientHeight ?? - tracksScrollRef.current?.clientHeight ?? - 400; - const totalHeight = Math.max( - 0, - timelineContainerHeight - - (hasHorizontalScrollbar ? TIMELINE_SCROLLBAR_SIZE_PX - 5 : 0), - ); - - const currentTime = editor.playback.getCurrentTime(); - const centerPosition = timelineTimeToSnappedPixels({ - time: currentTime, - zoomLevel, - }); - const scrollLeft = tracksScrollRef.current?.scrollLeft ?? 0; - const leftPosition = - getCenteredLineLeft({ centerPixel: centerPosition }) - scrollLeft; - - const handlePlayheadKeyDown = ( - event: React.KeyboardEvent, - ) => { - if (event.key !== "ArrowLeft" && event.key !== "ArrowRight") return; - - event.preventDefault(); - const fps = editor.project.getActive().settings.fps; - const ticksPerFrame = Math.round(TICKS_PER_SECOND * fps.denominator / fps.numerator); - const direction = event.key === "ArrowRight" ? 1 : -1; - const now = editor.playback.getCurrentTime(); - const nextTime = Math.max(0, Math.min(duration, now + direction * ticksPerFrame)); - - editor.playback.seek({ time: nextTime }); - }; - - return ( -
-
- -
- ); -} -- cgit v1.3.1