mirror of
https://github.com/blakeblackshear/frigate.git
synced 2026-03-10 02:29:19 +03:00
Add fullscreen controls to tracking details videos (#22252)
This commit is contained in:
parent
c3c27d036f
commit
5e7d426768
@ -1,6 +1,7 @@
|
|||||||
import useSWR from "swr";
|
import useSWR from "swr";
|
||||||
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
||||||
import { useResizeObserver } from "@/hooks/resize-observer";
|
import { useResizeObserver } from "@/hooks/resize-observer";
|
||||||
|
import { useFullscreen } from "@/hooks/use-fullscreen";
|
||||||
import { Event } from "@/types/event";
|
import { Event } from "@/types/event";
|
||||||
import ActivityIndicator from "@/components/indicators/activity-indicator";
|
import ActivityIndicator from "@/components/indicators/activity-indicator";
|
||||||
import { TrackingDetailsSequence } from "@/types/timeline";
|
import { TrackingDetailsSequence } from "@/types/timeline";
|
||||||
@ -243,6 +244,8 @@ export function TrackingDetails({
|
|||||||
}, [manualOverride, currentTime, annotationOffset]);
|
}, [manualOverride, currentTime, annotationOffset]);
|
||||||
|
|
||||||
const containerRef = useRef<HTMLDivElement | null>(null);
|
const containerRef = useRef<HTMLDivElement | null>(null);
|
||||||
|
const { fullscreen, toggleFullscreen, supportsFullScreen } =
|
||||||
|
useFullscreen(containerRef);
|
||||||
const timelineContainerRef = useRef<HTMLDivElement | null>(null);
|
const timelineContainerRef = useRef<HTMLDivElement | null>(null);
|
||||||
const rowRefs = useRef<(HTMLDivElement | null)[]>([]);
|
const rowRefs = useRef<(HTMLDivElement | null)[]>([]);
|
||||||
const [_selectedZone, setSelectedZone] = useState("");
|
const [_selectedZone, setSelectedZone] = useState("");
|
||||||
@ -559,14 +562,15 @@ export function TrackingDetails({
|
|||||||
visible={true}
|
visible={true}
|
||||||
currentSource={videoSource}
|
currentSource={videoSource}
|
||||||
hotKeys={false}
|
hotKeys={false}
|
||||||
supportsFullscreen={false}
|
supportsFullscreen={supportsFullScreen}
|
||||||
fullscreen={false}
|
fullscreen={fullscreen}
|
||||||
frigateControls={true}
|
frigateControls={true}
|
||||||
onTimeUpdate={handleTimeUpdate}
|
onTimeUpdate={handleTimeUpdate}
|
||||||
onSeekToTime={handleSeekToTime}
|
onSeekToTime={handleSeekToTime}
|
||||||
onUploadFrame={onUploadFrameToPlus}
|
onUploadFrame={onUploadFrameToPlus}
|
||||||
onPlaying={() => setIsVideoLoading(false)}
|
onPlaying={() => setIsVideoLoading(false)}
|
||||||
setFullResolution={setFullResolution}
|
setFullResolution={setFullResolution}
|
||||||
|
toggleFullscreen={toggleFullscreen}
|
||||||
isDetailMode={true}
|
isDetailMode={true}
|
||||||
camera={event.camera}
|
camera={event.camera}
|
||||||
currentTimeOverride={currentTime}
|
currentTimeOverride={currentTime}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user