summaryrefslogtreecommitdiff
path: root/apps/web
diff options
context:
space:
mode:
Diffstat (limited to 'apps/web')
-rw-r--r--apps/web/src/stores/timeline-store.ts53
1 files changed, 53 insertions, 0 deletions
diff --git a/apps/web/src/stores/timeline-store.ts b/apps/web/src/stores/timeline-store.ts
index 37b45b4a..b45f5507 100644
--- a/apps/web/src/stores/timeline-store.ts
+++ b/apps/web/src/stores/timeline-store.ts
@@ -42,6 +42,22 @@ interface TimelineStore {
// Manual method if you need to force recomputation
getSortedTracks: () => TimelineTrack[];
+ // Snapping settings
+ snappingEnabled: boolean;
+ gridSnappingEnabled: boolean;
+ elementSnappingEnabled: boolean;
+ playheadSnappingEnabled: boolean;
+ snapThreshold: number;
+ gridInterval: number;
+
+ // Snapping actions
+ toggleSnapping: () => void;
+ toggleGridSnapping: () => void;
+ toggleElementSnapping: () => void;
+ togglePlayheadSnapping: () => void;
+ setSnapThreshold: (threshold: number) => void;
+ setGridInterval: (interval: number) => void;
+
// Multi-selection
selectedElements: { trackId: string; elementId: string }[];
selectElement: (trackId: string, elementId: string, multi?: boolean) => void;
@@ -203,6 +219,14 @@ export const useTimelineStore = create<TimelineStore>((set, get) => {
redoStack: [],
selectedElements: [],
+ // Snapping settings defaults
+ snappingEnabled: true,
+ gridSnappingEnabled: true,
+ elementSnappingEnabled: true,
+ playheadSnappingEnabled: true,
+ snapThreshold: 10, // pixels
+ gridInterval: 1, // seconds
+
getSortedTracks: () => {
const { _tracks } = get();
const tracksWithMain = ensureMainTrack(_tracks);
@@ -949,5 +973,34 @@ export const useTimelineStore = create<TimelineStore>((set, get) => {
updateTracks(defaultTracks);
set({ history: [], redoStack: [], selectedElements: [] });
},
+
+ // Snapping actions
+ toggleSnapping: () => {
+ set((state) => ({ snappingEnabled: !state.snappingEnabled }));
+ },
+
+ toggleGridSnapping: () => {
+ set((state) => ({ gridSnappingEnabled: !state.gridSnappingEnabled }));
+ },
+
+ toggleElementSnapping: () => {
+ set((state) => ({
+ elementSnappingEnabled: !state.elementSnappingEnabled,
+ }));
+ },
+
+ togglePlayheadSnapping: () => {
+ set((state) => ({
+ playheadSnappingEnabled: !state.playheadSnappingEnabled,
+ }));
+ },
+
+ setSnapThreshold: (threshold) => {
+ set({ snapThreshold: threshold });
+ },
+
+ setGridInterval: (interval) => {
+ set({ gridInterval: interval });
+ },
};
});