administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-10 05:05:26 +03:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

always use camera aspect ratio for mobile

Browse Source
This commit is contained in:
Josh Hawkins 2024-03-05 13:36:35 -06:00
parent 7561abc025
commit 1dd526eb0b
1 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
web/src/views/live/LiveCameraView.tsx
View File

@ -105,12 +105,12 @@ export default function LiveCameraView({ camera }: LiveCameraViewProps) {
if (isMobile) { if (isMobile) {
if (isPortrait) { if (isPortrait) {
return "absolute left-0 right-0"; return "absolute left-2 right-2 top-[50%] -translate-y-[50%]";
} else { } else {
if (aspect > 16 / 9) { if (aspect > 16 / 9) {
return "absolute left-0 top-[50%] -translate-y-[50%]"; return "absolute left-0 top-[50%] -translate-y-[50%]";
} else { } else {
return "absolute top-0 bottom-0 left-[50%] -translate-x-[50%]"; return "absolute top-2 bottom-2 left-[50%] -translate-x-[50%]";
} }
} }
} }
@ -124,7 +124,7 @@ export default function LiveCameraView({ camera }: LiveCameraViewProps) {
} else if (aspect > 2) { } else if (aspect > 2) {
return "absolute left-0 right-0 top-[50%] -translate-y-[50%]"; return "absolute left-0 right-0 top-[50%] -translate-y-[50%]";
} else { } else {
return "absolute top-0 bottom-0 left-[50%] -translate-x-[50%]"; return "absolute top-2 bottom-2 left-[50%] -translate-x-[50%]";
} }
}, [camera, fullscreen, isPortrait]); }, [camera, fullscreen, isPortrait]);
@ -136,13 +136,15 @@ export default function LiveCameraView({ camera }: LiveCameraViewProps) {
return camera.detect.width / camera.detect.height; return camera.detect.width / camera.detect.height;
}, [camera]); }, [camera]);
const aspectRatio = useMemo<number>( const aspectRatio = useMemo<number>(() => {
() => if (isMobile) {
windowAspectRatio < cameraAspectRatio return cameraAspectRatio;
} else {
return windowAspectRatio < cameraAspectRatio
? windowAspectRatio - 0.05 ? windowAspectRatio - 0.05
: cameraAspectRatio - 0.03, : cameraAspectRatio - 0.03;
[cameraAspectRatio, windowAspectRatio], }
); }, [cameraAspectRatio, windowAspectRatio]);
return ( return (
<div <div