Open to recordings with pre-buffer (#11143)

* Open to recordings with pre-buffer * Reduce buffer * Use variable for preview FPS
blakeblackshear · Apr 29, 2024 · c9246bd · c9246bd
1 parent 9117043
commit c9246bd
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 4 deletions.
diff --git a/web/src/components/player/PreviewThumbnailPlayer.tsx b/web/src/components/player/PreviewThumbnailPlayer.tsx
@@ -23,6 +23,7 @@ import useContextMenu from "@/hooks/use-contextmenu";
 import ActivityIndicator from "../indicators/activity-indicator";
 import { TimeRange } from "@/types/timeline";
 import { NoThumbSlider } from "../ui/slider";
+import { PREVIEW_FPS, PREVIEW_PADDING } from "@/types/preview";
 
 type PreviewPlayerProps = {
   review: ReviewSegment;
@@ -337,7 +338,6 @@ function PreviewContent({
   }
 }
 
-const PREVIEW_PADDING = 16;
 type VideoPreviewProps = {
   relevantPreview: Preview;
   startTime: number;
@@ -398,7 +398,7 @@ export function VideoPreview({
       setManualPlayback(true);
     } else {
       playerRef.current.currentTime = playerStartTime;
-      playerRef.current.playbackRate = 8;
+      playerRef.current.playbackRate = PREVIEW_FPS;
     }
 
     // we know that these deps are correct
@@ -470,7 +470,7 @@ export function VideoPreview({
         playerRef.current.currentTime = playerStartTime + counter;
         counter += 1;
       }
-    }, 125);
+    }, 1000 / PREVIEW_FPS);
     return () => clearInterval(intervalId);
 
     // we know that these deps are correct

diff --git a/web/src/types/preview.ts b/web/src/types/preview.ts
@@ -1,7 +1,12 @@
+import { REVIEW_PADDING } from "./review";
+
 export type Preview = {
   camera: string;
   src: string;
   type: string;
   start: number;
   end: number;
 };
+
+export const PREVIEW_FPS = 8;
+export const PREVIEW_PADDING = REVIEW_PADDING * PREVIEW_FPS;
diff --git a/web/src/types/review.ts b/web/src/types/review.ts
@@ -48,3 +48,5 @@ export type MotionData = {
   audio?: number;
   camera: string;
 };
+
+export const REVIEW_PADDING = 2;
diff --git a/web/src/views/events/EventView.tsx b/web/src/views/events/EventView.tsx
@@ -12,6 +12,7 @@ import { FrigateConfig } from "@/types/frigateConfig";
 import { Preview } from "@/types/preview";
 import {
   MotionData,
+  REVIEW_PADDING,
   ReviewFilter,
   ReviewSegment,
   ReviewSeverity,
@@ -175,7 +176,7 @@ export default function EventView({
       } else {
         onOpenRecording({
           camera: review.camera,
-          startTime: review.start_time,
+          startTime: review.start_time - REVIEW_PADDING,
           severity: review.severity,
         });