mirror of
https://github.com/blakeblackshear/frigate.git
synced 2026-04-12 18:17:36 +03:00
pass detail stream as prop to avoid context error
This commit is contained in:
parent
29aa61db02
commit
0c8491f7d3
@ -20,7 +20,7 @@ import { cn } from "@/lib/utils";
|
|||||||
import { ASPECT_VERTICAL_LAYOUT, RecordingPlayerError } from "@/types/record";
|
import { ASPECT_VERTICAL_LAYOUT, RecordingPlayerError } from "@/types/record";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
import ObjectTrackOverlay from "@/components/overlay/ObjectTrackOverlay";
|
import ObjectTrackOverlay from "@/components/overlay/ObjectTrackOverlay";
|
||||||
import { useDetailStream } from "@/context/detail-stream-context";
|
import { DetailStreamContextType } from "@/context/detail-stream-context";
|
||||||
|
|
||||||
// Android native hls does not seek correctly
|
// Android native hls does not seek correctly
|
||||||
const USE_NATIVE_HLS = !isAndroid;
|
const USE_NATIVE_HLS = !isAndroid;
|
||||||
@ -54,6 +54,7 @@ type HlsVideoPlayerProps = {
|
|||||||
onUploadFrame?: (playTime: number) => Promise<AxiosResponse> | undefined;
|
onUploadFrame?: (playTime: number) => Promise<AxiosResponse> | undefined;
|
||||||
toggleFullscreen?: () => void;
|
toggleFullscreen?: () => void;
|
||||||
onError?: (error: RecordingPlayerError) => void;
|
onError?: (error: RecordingPlayerError) => void;
|
||||||
|
detail?: Partial<DetailStreamContextType>;
|
||||||
};
|
};
|
||||||
export default function HlsVideoPlayer({
|
export default function HlsVideoPlayer({
|
||||||
videoRef,
|
videoRef,
|
||||||
@ -74,16 +75,17 @@ export default function HlsVideoPlayer({
|
|||||||
onUploadFrame,
|
onUploadFrame,
|
||||||
toggleFullscreen,
|
toggleFullscreen,
|
||||||
onError,
|
onError,
|
||||||
|
detail,
|
||||||
}: HlsVideoPlayerProps) {
|
}: HlsVideoPlayerProps) {
|
||||||
const { t } = useTranslation("components/player");
|
const { t } = useTranslation("components/player");
|
||||||
const { data: config } = useSWR<FrigateConfig>("config");
|
const { data: config } = useSWR<FrigateConfig>("config");
|
||||||
const {
|
|
||||||
selectedObjectId,
|
// for detail stream context in History
|
||||||
selectedObjectTimeline,
|
const selectedObjectId = detail?.selectedObjectId;
|
||||||
currentTime,
|
const selectedObjectTimeline = detail?.selectedObjectTimeline;
|
||||||
camera,
|
const currentTime = detail?.currentTime;
|
||||||
isDetailMode,
|
const camera = detail?.camera;
|
||||||
} = useDetailStream();
|
const isDetailMode = detail?.isDetailMode ?? false;
|
||||||
|
|
||||||
// playback
|
// playback
|
||||||
|
|
||||||
|
|||||||
@ -7,6 +7,7 @@ import { Preview } from "@/types/preview";
|
|||||||
import PreviewPlayer, { PreviewController } from "../PreviewPlayer";
|
import PreviewPlayer, { PreviewController } from "../PreviewPlayer";
|
||||||
import { DynamicVideoController } from "./DynamicVideoController";
|
import { DynamicVideoController } from "./DynamicVideoController";
|
||||||
import HlsVideoPlayer, { HlsSource } from "../HlsVideoPlayer";
|
import HlsVideoPlayer, { HlsSource } from "../HlsVideoPlayer";
|
||||||
|
import { useDetailStream } from "@/context/detail-stream-context";
|
||||||
import { TimeRange } from "@/types/timeline";
|
import { TimeRange } from "@/types/timeline";
|
||||||
import ActivityIndicator from "@/components/indicators/activity-indicator";
|
import ActivityIndicator from "@/components/indicators/activity-indicator";
|
||||||
import { VideoResolutionType } from "@/types/live";
|
import { VideoResolutionType } from "@/types/live";
|
||||||
@ -59,6 +60,9 @@ export default function DynamicVideoPlayer({
|
|||||||
const apiHost = useApiHost();
|
const apiHost = useApiHost();
|
||||||
const { data: config } = useSWR<FrigateConfig>("config");
|
const { data: config } = useSWR<FrigateConfig>("config");
|
||||||
|
|
||||||
|
// for detail stream context in History
|
||||||
|
const detail = useDetailStream();
|
||||||
|
|
||||||
// controlling playback
|
// controlling playback
|
||||||
|
|
||||||
const playerRef = useRef<HTMLVideoElement | null>(null);
|
const playerRef = useRef<HTMLVideoElement | null>(null);
|
||||||
@ -291,6 +295,7 @@ export default function DynamicVideoPlayer({
|
|||||||
setIsBuffering(true);
|
setIsBuffering(true);
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
|
detail={detail}
|
||||||
/>
|
/>
|
||||||
<PreviewPlayer
|
<PreviewPlayer
|
||||||
className={cn(
|
className={cn(
|
||||||
|
|||||||
@ -3,7 +3,7 @@ import { FrigateConfig } from "@/types/frigateConfig";
|
|||||||
import useSWR from "swr";
|
import useSWR from "swr";
|
||||||
import { ObjectLifecycleSequence } from "@/types/timeline";
|
import { ObjectLifecycleSequence } from "@/types/timeline";
|
||||||
|
|
||||||
interface DetailStreamContextType {
|
export interface DetailStreamContextType {
|
||||||
selectedObjectId: string | undefined;
|
selectedObjectId: string | undefined;
|
||||||
selectedObjectTimeline?: ObjectLifecycleSequence[];
|
selectedObjectTimeline?: ObjectLifecycleSequence[];
|
||||||
currentTime: number;
|
currentTime: number;
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user