xstefen/OpenCut
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

hotfix-improved-selection-standards

Browse Source
This commit is contained in:
aashishparuvada
2025-06-23 21:16:21 +05:30
parent 630250c23b
commit f44f0acf70
2 changed files with 6 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
apps/web/src/components/editor/timeline.tsx
View File

@ -33,7 +33,7 @@ export function Timeline() {
// Timeline shows all tracks (video, audio, effects) and their clips. // Timeline shows all tracks (video, audio, effects) and their clips.
// You can drag media here to add it to your project. // You can drag media here to add it to your project.
// Clips can be trimmed, deleted, and moved. // Clips can be trimmed, deleted, and moved.
const { tracks, addTrack, addClipToTrack, removeTrack, toggleTrackMute, removeClipFromTrack, moveClipToTrack, getTotalDuration, selectedClips, selectClip, deselectClip, clearSelectedClips } = const { tracks, addTrack, addClipToTrack, removeTrack, toggleTrackMute, removeClipFromTrack, moveClipToTrack, getTotalDuration, selectedClips, selectClip, deselectClip, clearSelectedClips, setSelectedClips } =
useTimelineStore(); useTimelineStore();
const { mediaItems, addMediaItem } = useMediaStore(); const { mediaItems, addMediaItem } = useMediaStore();
const { currentTime, duration, seek, setDuration, isPlaying, play, pause, toggle } = usePlaybackStore(); const { currentTime, duration, seek, setDuration, isPlaying, play, pause, toggle } = usePlaybackStore();
@ -156,20 +156,18 @@ export function Timeline() {
}); });
if (newSelection.length > 0) { if (newSelection.length > 0) {
if (marquee.additive) { if (marquee.additive) {
// Add to current selection
const current = new Set(selectedClips.map((c) => c.trackId + ":" + c.clipId)); const current = new Set(selectedClips.map((c) => c.trackId + ":" + c.clipId));
newSelection = [ newSelection = [
...selectedClips, ...selectedClips,
...newSelection.filter((c) => !current.has(c.trackId + ":" + c.clipId)), ...newSelection.filter((c) => !current.has(c.trackId + ":" + c.clipId)),
]; ];
} }
clearSelectedClips(); setSelectedClips(newSelection);
newSelection.forEach((c) => selectClip(c.trackId, c.clipId, true));
} else if (!marquee.additive) { } else if (!marquee.additive) {
clearSelectedClips(); clearSelectedClips();
} }
setMarquee(null); setMarquee(null);
}, [marquee, tracks, zoomLevel, selectedClips, selectClip, clearSelectedClips]); }, [marquee, tracks, zoomLevel, selectedClips, selectClip, clearSelectedClips, setSelectedClips]);
const handleDragEnter = (e: React.DragEvent) => { const handleDragEnter = (e: React.DragEvent) => {
// When something is dragged over the timeline, show overlay // When something is dragged over the timeline, show overlay
@ -1398,8 +1396,6 @@ function TimelineTrackContent({
e.stopPropagation(); e.stopPropagation();
if (e.metaKey || e.ctrlKey || e.shiftKey) { if (e.metaKey || e.ctrlKey || e.shiftKey) {
selectClip(track.id, clip.id, true); selectClip(track.id, clip.id, true);
} else if (isSelected) {
deselectClip(track.id, clip.id);
} else { } else {
selectClip(track.id, clip.id, false); selectClip(track.id, clip.id, false);
} }

3
apps/web/src/stores/timeline-store.ts
View File

@ -26,6 +26,7 @@ interface TimelineStore {
selectClip: (trackId: string, clipId: string, multi?: boolean) => void; selectClip: (trackId: string, clipId: string, multi?: boolean) => void;
deselectClip: (trackId: string, clipId: string) => void; deselectClip: (trackId: string, clipId: string) => void;
clearSelectedClips: () => void; clearSelectedClips: () => void;
setSelectedClips: (clips: { trackId: string; clipId: string }[]) => void;
// Actions // Actions
addTrack: (type: "video" | "audio" | "effects") => string; addTrack: (type: "video" | "audio" | "effects") => string;
@ -82,6 +83,8 @@ export const useTimelineStore = create<TimelineStore>((set, get) => ({
set({ selectedClips: [] }); set({ selectedClips: [] });
}, },
setSelectedClips: (clips) => set({ selectedClips: clips }),
addTrack: (type) => { addTrack: (type) => {
const newTrack: TimelineTrack = { const newTrack: TimelineTrack = {
id: crypto.randomUUID(), id: crypto.randomUUID(),