chris/frigate
1
0
Fork 0
forked from Github/frigate
Code Pull Requests Packages Activity

Redesign Recordings View (#10690)

Browse Source 
* Use full width top bar

* Make each item in review filter group optional

* Remove export creation from export page

* Consolidate packages and fix opening recording from event

* Use common type for time range

* Move timeline to separate component

* Add events list view to recordings view

* Fix loading of images

* Fix incorrect labels

* use overlay state for selected timeline type

* Fix up for mobile view for now

* replace overlay state

* fix comparison

* remove unused
This commit is contained in:
Nicolas Mowen
2024-03-26 15:03:58 -06:00
committed by GitHub
parent 1cd374d3ad
commit 1377d33e25
16 changed files with 378 additions and 363 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
web/src/components/player/dynamic/DynamicVideoPlayer.tsx
View File

@@ -8,7 +8,7 @@ import { Preview } from "@/types/preview";
import PreviewPlayer, { PreviewController } from "../PreviewPlayer";
import { DynamicVideoController } from "./DynamicVideoController";
import HlsVideoPlayer from "../HlsVideoPlayer";
import { Timeline } from "@/types/timeline";
import { TimeRange, Timeline } from "@/types/timeline";
/**
* Dynamically switches between video playback and scrubbing preview player.
@@ -16,7 +16,7 @@ import { Timeline } from "@/types/timeline";
type DynamicVideoPlayerProps = {
className?: string;
camera: string;
timeRange: { start: number; end: number };
timeRange: TimeRange;
cameraPreviews: Preview[];
startTimestamp?: number;
isScrubbing: boolean;
@@ -100,7 +100,7 @@ export default function DynamicVideoPlayer({
const [isLoading, setIsLoading] = useState(false);
const [source, setSource] = useState(
`${apiHost}vod/${camera}/start/${timeRange.start}/end/${timeRange.end}/master.m3u8`,
`${apiHost}vod/${camera}/start/${timeRange.after}/end/${timeRange.before}/master.m3u8`,
);
// start at correct time
@@ -134,8 +134,8 @@ export default function DynamicVideoPlayer({
const recordingParams = useMemo(() => {
return {
before: timeRange.end,
after: timeRange.start,
before: timeRange.before,
after: timeRange.after,
};
}, [timeRange]);
const { data: recordings } = useSWR<Recording[]>(
@@ -153,7 +153,7 @@ export default function DynamicVideoPlayer({
}
setSource(
`${apiHost}vod/${camera}/start/${timeRange.start}/end/${timeRange.end}/master.m3u8`,
`${apiHost}vod/${camera}/start/${timeRange.after}/end/${timeRange.before}/master.m3u8`,
);
setIsLoading(true);