summaryrefslogtreecommitdiff
path: root/apps/web/src
diff options
context:
space:
mode:
authorryu <ryumacodes@gmail.com>2025-08-01 02:33:42 +0500
committerryu <ryumacodes@gmail.com>2025-08-01 02:33:42 +0500
commitf5d5a387d349c35688c958c591073fa15c4d2c38 (patch)
tree6710e79f8b3c57f7983f7af4fa7bc447e32a01f4 /apps/web/src
parente6e08057f510e70c956af0f0c08c6eef349edf3c (diff)
downloadopencut-f5d5a387d349c35688c958c591073fa15c4d2c38.tar.gz
feat: add timeline navigation return to start functionality
- Add Enter key shortcut for seeking to timeline start (00:00:00) - Add return to start button in timeline toolbar with skip-back icon - Both methods complement existing Home key shortcut - Update keyboard shortcuts help to display Enter key properly - Maintain consistent UI styling with existing playback controls Resolves #415
Diffstat (limited to 'apps/web/src')
-rw-r--r--apps/web/src/components/editor/timeline/index.tsx20
-rw-r--r--apps/web/src/hooks/use-keyboard-shortcuts-help.ts1
-rw-r--r--apps/web/src/stores/keybindings-store.ts1
3 files changed, 21 insertions, 1 deletions
diff --git a/apps/web/src/components/editor/timeline/index.tsx b/apps/web/src/components/editor/timeline/index.tsx
index 078f1258..cf5fd524 100644
--- a/apps/web/src/components/editor/timeline/index.tsx
+++ b/apps/web/src/components/editor/timeline/index.tsx
@@ -12,6 +12,7 @@ import {
SplitSquareHorizontal,
Pause,
Play,
+ SkipBack,
Video,
Music,
TypeIcon,
@@ -508,7 +509,7 @@ export function Timeline() {
onMouseEnter={() => setIsInTimeline(true)}
onMouseLeave={() => setIsInTimeline(false)}
>
- <TimelineToolbar zoomLevel={zoomLevel} setZoomLevel={setZoomLevel} />
+ <TimelineToolbar zoomLevel={zoomLevel} setZoomLevel={setZoomLevel} seek={seek} />
{/* Timeline Container */}
<div
@@ -806,9 +807,11 @@ function TrackIcon({ track }: { track: TimelineTrack }) {
function TimelineToolbar({
zoomLevel,
setZoomLevel,
+ seek,
}: {
zoomLevel: number;
setZoomLevel: (zoom: number) => void;
+ seek: (time: number) => void;
}) {
const {
tracks,
@@ -981,6 +984,21 @@ function TimelineToolbar({
{isPlaying ? "Pause (Space)" : "Play (Space)"}
</TooltipContent>
</Tooltip>
+ <Tooltip>
+ <TooltipTrigger asChild>
+ <Button
+ variant="text"
+ size="icon"
+ onClick={() => seek(0)}
+ className="mr-2"
+ >
+ <SkipBack className="h-4 w-4" />
+ </Button>
+ </TooltipTrigger>
+ <TooltipContent>
+ Return to Start (Home / Enter)
+ </TooltipContent>
+ </Tooltip>
<div className="w-px h-6 bg-border mx-1" />
{/* Time Display */}
<div
diff --git a/apps/web/src/hooks/use-keyboard-shortcuts-help.ts b/apps/web/src/hooks/use-keyboard-shortcuts-help.ts
index 2f1a4d4a..e2cde3b4 100644
--- a/apps/web/src/hooks/use-keyboard-shortcuts-help.ts
+++ b/apps/web/src/hooks/use-keyboard-shortcuts-help.ts
@@ -77,6 +77,7 @@ const formatKey = (key: string): string => {
.replace("down", "↓")
.replace("space", "Space")
.replace("home", "Home")
+ .replace("enter", "Enter")
.replace("end", "End")
.replace("delete", "Delete")
.replace("backspace", "Backspace")
diff --git a/apps/web/src/stores/keybindings-store.ts b/apps/web/src/stores/keybindings-store.ts
index 97cba23f..4c11cfde 100644
--- a/apps/web/src/stores/keybindings-store.ts
+++ b/apps/web/src/stores/keybindings-store.ts
@@ -17,6 +17,7 @@ export const defaultKeybindings: KeybindingConfig = {
"shift+left": "jump-backward",
"shift+right": "jump-forward",
home: "goto-start",
+ enter: "goto-start",
end: "goto-end",
s: "split-element",
n: "toggle-snapping",