administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-08 20:25:26 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Fix useEffect and try to load next clip for preview

Browse Source
This commit is contained in:
Nicolas Mowen 2024-02-26 07:14:14 -07:00
parent 0a15ef022b
commit 81f0c68b85
2 changed files with 29 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
web/src/components/player/DynamicVideoPlayer.tsx
View File

@ -199,8 +199,6 @@ export default function DynamicVideoPlayer({
return <ActivityIndicator />;
}
//console.log(`${config.detect.width / config.detect.height < 1.7 ? "16:9" : undefined}`)
return (
<div className={className}>
<div
@ -406,19 +404,32 @@ export class DynamicVideoController {
}
scrubToTimestamp(time: number) {
if (!this.preview) {
return;
}
if (time > this.preview.end) {
if (this.playerMode == "scrubbing") {
this.fireClipEndEvent();
this.playerMode = "playback";
this.setScrubbing(false);
this.timeToSeek = undefined;
this.seeking = false;
}
return;
}
if (this.playerMode != "scrubbing") {
this.playerMode = "scrubbing";
this.playerRef.current?.pause();
this.setScrubbing(true);
}
if (this.preview) {
if (this.seeking) {
this.timeToSeek = time;
} else {
this.previewRef.current?.currentTime(time - this.preview.start);
this.seeking = true;
}
if (this.seeking) {
this.timeToSeek = time;
} else {
this.previewRef.current?.currentTime(time - this.preview.start);
this.seeking = true;
}
}

13
web/src/views/events/DesktopRecordingView.tsx
View File

@ -20,9 +20,13 @@ export default function DesktopRecordingView({
relevantPreviews,
}: DesktopRecordingViewProps) {
const navigate = useNavigate();
const controllerRef = useRef<DynamicVideoController | undefined>(undefined);
const contentRef = useRef<HTMLDivElement | null>(null);
// controller state
const [playerReady, setPlayerReady] = useState(false);
const controllerRef = useRef<DynamicVideoController | undefined>(undefined);
// timeline time
const timeRange = useMemo(
@ -49,7 +53,7 @@ export default function DesktopRecordingView({
setSelectedRangeIdx(selectedRangeIdx + 1);
});
}
}, [controllerRef, selectedRangeIdx]);
}, [playerReady, selectedRangeIdx]);
// scrubbing and timeline state
@ -62,13 +66,13 @@ export default function DesktopRecordingView({
if (scrubbing) {
controllerRef.current?.scrubToTimestamp(currentTime);
}
}, [controllerRef, currentTime, scrubbing]);
}, [currentTime, scrubbing]);
useEffect(() => {
if (!scrubbing) {
controllerRef.current?.seekToTimestamp(currentTime, true);
}
}, [controllerRef, scrubbing]);
}, [scrubbing]);
return (
<div ref={contentRef} className="relative w-full h-full">
@ -87,6 +91,7 @@ export default function DesktopRecordingView({
cameraPreviews={relevantPreviews || []}
onControllerReady={(controller) => {
controllerRef.current = controller;
setPlayerReady(true);
controllerRef.current.onPlayerTimeUpdate((timestamp: number) => {
setCurrentTime(timestamp);
});