diff --git a/.gitignore b/.gitignore index 24d66f8..3deed24 100644 --- a/.gitignore +++ b/.gitignore @@ -19,3 +19,6 @@ # typescript /apps/web/next-env.d.ts /apps/web/yarn.lock + +# asdf version management +.tool-versions diff --git a/apps/web/src/app/editor/editor.css b/apps/web/src/app/editor/editor.css new file mode 100644 index 0000000..f482c6d --- /dev/null +++ b/apps/web/src/app/editor/editor.css @@ -0,0 +1,4 @@ +/* Prevent scroll jumping on Mac devices when using the editor */ +body { + overflow: hidden; +} \ No newline at end of file diff --git a/apps/web/src/app/editor/page.tsx b/apps/web/src/app/editor/page.tsx index 64186a3..2efb59c 100644 --- a/apps/web/src/app/editor/page.tsx +++ b/apps/web/src/app/editor/page.tsx @@ -1,6 +1,7 @@ "use client"; import { useEffect } from "react"; +import "./editor.css"; import { ResizablePanelGroup, ResizablePanel, diff --git a/apps/web/src/components/editor/timeline.tsx b/apps/web/src/components/editor/timeline.tsx index 9af7a20..db810d3 100644 --- a/apps/web/src/components/editor/timeline.tsx +++ b/apps/web/src/components/editor/timeline.tsx @@ -290,11 +290,21 @@ export function Timeline() { } }; - // Deselect all clips when clicking empty timeline area + const handleSeekToPosition = (e: React.MouseEvent) => { + const rect = e.currentTarget.getBoundingClientRect(); + const clickX = e.clientX - rect.left; + const clickedTime = clickX / (50 * zoomLevel); + const clampedTime = Math.max(0, Math.min(duration, clickedTime)); + + seek(clampedTime); + }; + const handleTimelineAreaClick = (e: React.MouseEvent) => { - // Only clear selection if the click target is the timeline background (not a child/clip) if (e.target === e.currentTarget) { clearSelectedClips(); + + // Calculate the clicked time position and seek to it + handleSeekToPosition(e); } }; @@ -487,10 +497,14 @@ export function Timeline() {
{ + // Calculate the clicked time position and seek to it + handleSeekToPosition(e); + }} > {/* Time markers */} {(() => {