diff --git a/web/src/components/player/HlsVideoPlayer.tsx b/web/src/components/player/HlsVideoPlayer.tsx
index 28925de37a..6124891375 100644
--- a/web/src/components/player/HlsVideoPlayer.tsx
+++ b/web/src/components/player/HlsVideoPlayer.tsx
@@ -285,6 +285,14 @@ export default function HlsVideoPlayer({
) {
setLoadedMetadata(false);
setUseHlsCompat(true);
+ } else {
+ toast.error(
+ // @ts-expect-error code does exist
+ `Failed to play recordings (error ${e.target.error.code}): ${e.target.error.message}`,
+ {
+ position: "top-center",
+ },
+ );
}
}}
/>
diff --git a/web/src/components/player/PreviewPlayer.tsx b/web/src/components/player/PreviewPlayer.tsx
index 01d21342cb..b036bd357f 100644
--- a/web/src/components/player/PreviewPlayer.tsx
+++ b/web/src/components/player/PreviewPlayer.tsx
@@ -82,7 +82,12 @@ export default function PreviewPlayer({
}
return (
-
+
No Preview Found
);
diff --git a/web/src/components/player/VideoControls.tsx b/web/src/components/player/VideoControls.tsx
index 2aeafd1035..f700747e5b 100644
--- a/web/src/components/player/VideoControls.tsx
+++ b/web/src/components/player/VideoControls.tsx
@@ -143,6 +143,11 @@ export default function VideoControls({
onSeek(10);
}
break;
+ case "f":
+ if (setFullscreen && down && !repeat) {
+ setFullscreen(!fullscreen);
+ }
+ break;
case "m":
if (setMuted && down && !repeat && video) {
setMuted(!muted);
@@ -157,10 +162,10 @@ export default function VideoControls({
},
// only update when preview only changes
// eslint-disable-next-line react-hooks/exhaustive-deps
- [video, isPlaying, onSeek],
+ [video, isPlaying, fullscreen, setFullscreen, onSeek],
);
useKeyboardListener(
- hotKeys ? ["ArrowLeft", "ArrowRight", "m", " "] : [],
+ hotKeys ? ["ArrowLeft", "ArrowRight", "f", "m", " "] : [],
onKeyboardShortcut,
);
diff --git a/web/src/pages/Live.tsx b/web/src/pages/Live.tsx
index bae56b6bb3..5449fef9b2 100644
--- a/web/src/pages/Live.tsx
+++ b/web/src/pages/Live.tsx
@@ -83,7 +83,7 @@ function Live() {
}
if (selectedCamera) {
- return
;
+ return
;
}
return (
diff --git a/web/src/views/live/LiveCameraView.tsx b/web/src/views/live/LiveCameraView.tsx
index cc27b72bff..3d3ea23c7e 100644
--- a/web/src/views/live/LiveCameraView.tsx
+++ b/web/src/views/live/LiveCameraView.tsx
@@ -20,7 +20,7 @@ import {
import { TooltipProvider } from "@/components/ui/tooltip";
import { useResizeObserver } from "@/hooks/resize-observer";
import useKeyboardListener from "@/hooks/use-keyboard-listener";
-import { CameraConfig } from "@/types/frigateConfig";
+import { CameraConfig, FrigateConfig } from "@/types/frigateConfig";
import { LiveStreamMetadata, VideoResolutionType } from "@/types/live";
import { CameraPtzInfo } from "@/types/ptz";
import { RecordingStartingPoint } from "@/types/record";
@@ -75,9 +75,13 @@ import { TransformWrapper, TransformComponent } from "react-zoom-pan-pinch";
import useSWR from "swr";
type LiveCameraViewProps = {
+ config?: FrigateConfig;
camera: CameraConfig;
};
-export default function LiveCameraView({ camera }: LiveCameraViewProps) {
+export default function LiveCameraView({
+ config,
+ camera,
+}: LiveCameraViewProps) {
const navigate = useNavigate();
const { isPortrait } = useMobileOrientation();
const mainRef = useRef
(null);
@@ -86,8 +90,17 @@ export default function LiveCameraView({ camera }: LiveCameraViewProps) {
// supported features
+ const isRestreamed = useMemo(
+ () =>
+ config &&
+ Object.keys(config.go2rtc.streams || {}).includes(
+ camera.live.stream_name,
+ ),
+ [camera, config],
+ );
+
const { data: cameraMetadata } = useSWR(
- `go2rtc/streams/${camera.live.stream_name}`,
+ isRestreamed ? `go2rtc/streams/${camera.live.stream_name}` : null,
{
revalidateOnFocus: false,
},