administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-09 04:35:25 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Ensure mobile view video is consistent

Browse Source
This commit is contained in:
Nicolas Mowen 2024-03-14 15:14:43 -06:00
parent 238da337a4
commit 3689c2a4c3
1 changed files with 17 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
web/src/views/events/RecordingView.tsx
View File

@ -301,6 +301,7 @@ export function MobileRecordingView({
relevantPreviews,
allCameras,
}: MobileRecordingViewProps) {
const { data: config } = useSWR<FrigateConfig>("config");
const navigate = useNavigate();
const contentRef = useRef<HTMLDivElement | null>(null);
@ -310,6 +311,21 @@ export function MobileRecordingView({
const [playbackCamera, setPlaybackCamera] = useState(startCamera);
const [playbackStart, setPlaybackStart] = useState(startTime);
const grow = useMemo(() => {
if (!config) {
return "aspect-video";
}
const aspectRatio =
config.cameras[playbackCamera].detect.width /
config.cameras[playbackCamera].detect.height;
if (aspectRatio > 2) {
return "aspect-wide";
} else {
return "aspect-video";
}
}, [config, playbackCamera]);
// timeline time
const timeRange = useMemo(() => getChunkedTimeDay(startTime), [startTime]);
@ -453,6 +469,7 @@ export function MobileRecordingView({
<div>
<DynamicVideoPlayer
className={`w-full ${grow}`}
camera={playbackCamera}
timeRange={currentTimeRange}
cameraPreviews={relevantPreviews || []}