Mirrors/blakeblackshear.frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2024-12-19 19:06:16 +01:00
Code Issues Projects Releases Wiki Activity

Preview fixes (#13193)

Browse Source 
* Handle case where preview was saved late

* fix timing
This commit is contained in:
Nicolas Mowen 2024-08-19 10:45:55 -06:00
parent 8b2adb55ed
commit 65ceadda2b
2 changed files with 28 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
web/src/components/player/PreviewPlayer.tsx
View File

@ -16,6 +16,7 @@ import { isAndroid, isChrome, isMobile } from "react-device-detect";
import { TimeRange } from "@/types/timeline";
import { Skeleton } from "../ui/skeleton";
import { cn } from "@/lib/utils";
import { usePreviewForTimeRange } from "@/hooks/use-camera-previews";
type PreviewPlayerProps = {
className?: string;
@ -39,15 +40,11 @@ export default function PreviewPlayer({
onClick,
}: PreviewPlayerProps) {
const [currentHourFrame, setCurrentHourFrame] = useState<string>();
const currentPreview = useMemo(() => {
return cameraPreviews.find(
(preview) =>
preview.camera == camera &&
Math.round(preview.start) >= timeRange.after &&
Math.floor(preview.end) <= timeRange.before,
);
}, [cameraPreviews, camera, timeRange]);
const currentPreview = usePreviewForTimeRange(
cameraPreviews,
camera,
timeRange,
);
if (currentPreview) {
return (

24
web/src/hooks/use-camera-previews.ts
View File

@ -1,6 +1,6 @@
import { Preview } from "@/types/preview";
import { TimeRange } from "@/types/timeline";
import { useEffect, useState } from "react";
import { useEffect, useMemo, useState } from "react";
import useSWR from "swr";
type OptionalCameraPreviewProps = {
@ -8,7 +8,6 @@ type OptionalCameraPreviewProps = {
autoRefresh?: boolean;
fetchPreviews?: boolean;
};
export function useCameraPreviews(
initialTimeRange: TimeRange,
{
@ -32,3 +31,24 @@ export function useCameraPreviews(
return allPreviews;
}
// we need to add a buffer of 5 seconds to the end preview times
// this ensures that if preview generation is running slowly
// and the previews are generated 1-5 seconds late
// it is not falsely thrown out.
const PREVIEW_END_BUFFER = 5; // seconds
export function usePreviewForTimeRange(
allPreviews: Preview[],
camera: string,
timeRange: TimeRange,
) {
return useMemo(() => {
return allPreviews.find(
(preview) =>
preview.camera == camera &&
Math.ceil(preview.start) >= timeRange.after &&
Math.floor(preview.end) <= timeRange.before + PREVIEW_END_BUFFER,
);
}, [allPreviews, camera, timeRange]);
}