From a3dd129facbd00d2b2243bbe99189b9706f17b4e Mon Sep 17 00:00:00 2001 From: Nicolas Mowen Date: Sun, 28 Apr 2024 18:38:27 -0600 Subject: [PATCH 1/3] Open to recordings with pre-buffer --- web/src/components/player/PreviewThumbnailPlayer.tsx | 2 +- web/src/types/preview.ts | 3 +++ web/src/views/events/EventView.tsx | 4 ++-- 3 files changed, 6 insertions(+), 3 deletions(-) diff --git a/web/src/components/player/PreviewThumbnailPlayer.tsx b/web/src/components/player/PreviewThumbnailPlayer.tsx index 0767933b2f..4eb9c9e961 100644 --- 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_PADDING } from "@/types/preview"; type PreviewPlayerProps = { review: ReviewSegment; @@ -337,7 +338,6 @@ function PreviewContent({ } } -const PREVIEW_PADDING = 16; type VideoPreviewProps = { relevantPreview: Preview; startTime: number; diff --git a/web/src/types/preview.ts b/web/src/types/preview.ts index e9bd12185c..390d644cfc 100644 --- a/web/src/types/preview.ts +++ b/web/src/types/preview.ts @@ -5,3 +5,6 @@ export type Preview = { start: number; end: number; }; + +export const PREVIEW_PADDING = 16; + diff --git a/web/src/views/events/EventView.tsx b/web/src/views/events/EventView.tsx index be6e2d8fe4..708f461b0c 100644 --- a/web/src/views/events/EventView.tsx +++ b/web/src/views/events/EventView.tsx @@ -9,7 +9,7 @@ import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group"; import { useTimelineUtils } from "@/hooks/use-timeline-utils"; import { useScrollLockout } from "@/hooks/use-mouse-listener"; import { FrigateConfig } from "@/types/frigateConfig"; -import { Preview } from "@/types/preview"; +import { PREVIEW_PADDING, Preview } from "@/types/preview"; import { MotionData, ReviewFilter, @@ -175,7 +175,7 @@ export default function EventView({ } else { onOpenRecording({ camera: review.camera, - startTime: review.start_time, + startTime: review.start_time - PREVIEW_PADDING, severity: review.severity, }); From 75eeb906a7543730eb0e6fbe614d4531fa0e56f5 Mon Sep 17 00:00:00 2001 From: Nicolas Mowen Date: Mon, 29 Apr 2024 10:07:25 -0600 Subject: [PATCH 2/3] Reduce buffer --- web/src/types/preview.ts | 5 +++-- web/src/types/review.ts | 2 ++ web/src/views/events/EventView.tsx | 5 +++-- 3 files changed, 8 insertions(+), 4 deletions(-) diff --git a/web/src/types/preview.ts b/web/src/types/preview.ts index 390d644cfc..a050705b18 100644 --- a/web/src/types/preview.ts +++ b/web/src/types/preview.ts @@ -1,3 +1,5 @@ +import { REVIEW_PADDING } from "./review"; + export type Preview = { camera: string; src: string; @@ -6,5 +8,4 @@ export type Preview = { end: number; }; -export const PREVIEW_PADDING = 16; - +export const PREVIEW_PADDING = REVIEW_PADDING * 2; diff --git a/web/src/types/review.ts b/web/src/types/review.ts index b8e5254d90..bbefaf5d3d 100644 --- 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 index 708f461b0c..caeaef5b42 100644 --- a/web/src/views/events/EventView.tsx +++ b/web/src/views/events/EventView.tsx @@ -9,9 +9,10 @@ import { ToggleGroup, ToggleGroupItem } from "@/components/ui/toggle-group"; import { useTimelineUtils } from "@/hooks/use-timeline-utils"; import { useScrollLockout } from "@/hooks/use-mouse-listener"; import { FrigateConfig } from "@/types/frigateConfig"; -import { PREVIEW_PADDING, Preview } from "@/types/preview"; +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 - PREVIEW_PADDING, + startTime: review.start_time - REVIEW_PADDING, severity: review.severity, }); From d366bdc268429d71b2ae0a949b82fac7b229b10b Mon Sep 17 00:00:00 2001 From: Nicolas Mowen Date: Mon, 29 Apr 2024 10:11:09 -0600 Subject: [PATCH 3/3] Use variable for preview FPS --- web/src/components/player/PreviewThumbnailPlayer.tsx | 6 +++--- web/src/types/preview.ts | 3 ++- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/web/src/components/player/PreviewThumbnailPlayer.tsx b/web/src/components/player/PreviewThumbnailPlayer.tsx index 4eb9c9e961..c36a2e1290 100644 --- a/web/src/components/player/PreviewThumbnailPlayer.tsx +++ b/web/src/components/player/PreviewThumbnailPlayer.tsx @@ -23,7 +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_PADDING } from "@/types/preview"; +import { PREVIEW_FPS, PREVIEW_PADDING } from "@/types/preview"; type PreviewPlayerProps = { review: ReviewSegment; @@ -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 index a050705b18..a9f958f7f0 100644 --- a/web/src/types/preview.ts +++ b/web/src/types/preview.ts @@ -8,4 +8,5 @@ export type Preview = { end: number; }; -export const PREVIEW_PADDING = REVIEW_PADDING * 2; +export const PREVIEW_FPS = 8; +export const PREVIEW_PADDING = REVIEW_PADDING * PREVIEW_FPS;