diff options
| author | Anwarul Islam <anwaarulislaam@gmail.com> | 2025-07-18 03:36:01 +0600 |
|---|---|---|
| committer | Anwarul Islam <anwaarulislaam@gmail.com> | 2025-07-18 16:43:50 +0600 |
| commit | 0e1311bfe027c0f5ebbe9a511368dc0fc67172dc (patch) | |
| tree | 950aa7e764a0deea3655b02c3ddd3961ad7f0324 /apps/web/src/components/editor/timeline.tsx | |
| parent | 0b12fdfa0a770013c24c354cc66a6705b05f3437 (diff) | |
| download | opencut-0e1311bfe027c0f5ebbe9a511368dc0fc67172dc.tar.gz | |
feat: ripple editing support sync with latest timeline changes
Diffstat (limited to 'apps/web/src/components/editor/timeline.tsx')
| -rw-r--r-- | apps/web/src/components/editor/timeline.tsx | 28 |
1 files changed, 27 insertions, 1 deletions
diff --git a/apps/web/src/components/editor/timeline.tsx b/apps/web/src/components/editor/timeline.tsx index bfb663c6..8eb00875 100644 --- a/apps/web/src/components/editor/timeline.tsx +++ b/apps/web/src/components/editor/timeline.tsx @@ -19,6 +19,7 @@ import { ZoomIn, ZoomOut, LockOpen, + Link, } from "lucide-react"; import { Tooltip, @@ -71,6 +72,7 @@ export function Timeline() { addTrack, addElementToTrack, removeElementFromTrack, + removeElementFromTrackWithRipple, getTotalDuration, selectedElements, clearSelectedElements, @@ -84,6 +86,8 @@ export function Timeline() { redo, snappingEnabled, toggleSnapping, + rippleEditingEnabled, + toggleRippleEditing, dragState, } = useTimelineStore(); const { mediaItems, addMediaItem } = useMediaStore(); @@ -496,7 +500,11 @@ export function Timeline() { return; } selectedElements.forEach(({ trackId, elementId }) => { - removeElementFromTrack(trackId, elementId); + if (rippleEditingEnabled) { + removeElementFromTrackWithRipple(trackId, elementId); + } else { + removeElementFromTrack(trackId, elementId); + } }); clearSelectedElements(); }; @@ -770,6 +778,24 @@ export function Timeline() { </TooltipTrigger> <TooltipContent>Auto snapping</TooltipContent> </Tooltip> + <Tooltip> + <TooltipTrigger asChild> + <Button + variant="text" + size="icon" + onClick={toggleRippleEditing} + > + <Link + className={`h-4 w-4 ${rippleEditingEnabled ? "text-primary" : ""}`} + /> + </Button> + </TooltipTrigger> + <TooltipContent> + {rippleEditingEnabled + ? "Disable Ripple Editing" + : "Enable Ripple Editing"} + </TooltipContent> + </Tooltip> </TooltipProvider> </div> </div> |