lee/Recordly
1
0
Fork 0
mirror of https://github.com/webadderallorg/Recordly.git synced 2026-09-27 00:05:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(zoom): tag zoom regions as auto or manual in VideoEditor

Browse Source 
handleZoomSuggested creates regions with mode: 'auto',
handleZoomAdded creates regions with mode: 'manual'.
Wire zoomSmoothness state and mode change handler.
This commit is contained in:
webadderall
2026-04-08 22:00:00 +10:00
parent 5b07af5083
commit aeac1099ef
1 changed files with 24 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/video-editor/VideoEditor.tsx
+24 -3
View File
@@ -105,6 +105,8 @@ import {
DEFAULT_PLAYBACK_SPEED,
DEFAULT_WEBCAM_OVERLAY,
DEFAULT_ZOOM_DEPTH,
DEFAULT_AUTO_ZOOM_DEPTH,
type ZoomMode,
DEFAULT_ZOOM_IN_DURATION_MS,
DEFAULT_ZOOM_IN_EASING,
DEFAULT_ZOOM_IN_OVERLAP_MS,
@@ -1646,7 +1648,6 @@ export default function VideoEditor() {
cursorStyle,
cursorSize,
cursorSmoothing,
zoomSmoothness,
cursorMotionBlur,
cursorClickBounce,
cursorClickBounceDuration,
@@ -2233,6 +2234,7 @@ export default function VideoEditor() {
endMs: Math.round(span.end),
depth: DEFAULT_ZOOM_DEPTH,
focus: { cx: 0.5, cy: 0.5 },
mode: "manual",
};
setZoomRegions((prev) => [...prev, newRegion]);
setSelectedZoomId(id);
@@ -2246,8 +2248,9 @@ export default function VideoEditor() {
id,
startMs: Math.round(span.start),
endMs: Math.round(span.end),
depth: DEFAULT_ZOOM_DEPTH,
focus: clampFocusToDepth(focus, DEFAULT_ZOOM_DEPTH),
depth: DEFAULT_AUTO_ZOOM_DEPTH,
focus: clampFocusToDepth(focus, DEFAULT_AUTO_ZOOM_DEPTH),
mode: "auto",
};
setZoomRegions((prev) => [...prev, newRegion]);
setSelectedZoomId(id);
@@ -2327,6 +2330,20 @@ export default function VideoEditor() {
[selectedZoomId],
);
const handleZoomModeChange = useCallback(
(mode: ZoomMode) => {
if (!selectedZoomId) return;
setZoomRegions((prev) =>
prev.map((region) =>
region.id === selectedZoomId
? { ...region, mode }
: region,
),
);
},
[selectedZoomId],
);
const handleZoomDelete = useCallback(
(id: string) => {
setZoomRegions((prev) => prev.filter((region) => region.id !== id));
@@ -4339,6 +4356,10 @@ export default function VideoEditor() {
}
onZoomDepthChange={(depth) => selectedZoomId && handleZoomDepthChange(depth)}
selectedZoomId={selectedZoomId}
selectedZoomMode={
selectedZoomId ? (zoomRegions.find((z) => z.id === selectedZoomId)?.mode ?? 'auto') : null
}
onZoomModeChange={(mode) => selectedZoomId && handleZoomModeChange(mode)}
onZoomDelete={handleZoomDelete}
selectedTrimId={selectedTrimId}
onTrimDelete={handleTrimDelete}