Mirrors/blakeblackshear.frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2024-11-21 19:07:46 +01:00
Code Issues Projects Releases Wiki Activity

fix birdseye fullscreen (#11625)

Browse Source
This commit is contained in:
Josh Hawkins 2024-05-29 14:18:51 -05:00 committed by GitHub
parent 9e8202874e
commit 37dd3fc25b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 13 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/components/player/JSMpegPlayer.tsx
View File

@ -49,7 +49,7 @@ export default function JSMpegPlayer({
selectedContainerRef.current?.clientHeight, selectedContainerRef.current?.clientHeight,
), ),
) )
: aspectRatio > fitAspect : aspectRatio >= fitAspect
? Math.floor(containerWidth / aspectRatio) ? Math.floor(containerWidth / aspectRatio)
: Math.floor(containerWidth / aspectRatio) / 1.5; : Math.floor(containerWidth / aspectRatio) / 1.5;
const finalHeight = stretch const finalHeight = stretch

24
web/src/views/live/LiveBirdseyeView.tsx
View File

@ -48,12 +48,22 @@ export default function LiveBirdseyeView() {
const containerAspectRatio = useMemo(() => { const containerAspectRatio = useMemo(() => {
if (!containerRef.current) { if (!containerRef.current) {
return windowAspectRatio; return windowAspectRatio ?? 0;
} }
return containerRef.current.clientWidth / containerRef.current.clientHeight; return containerRef.current.clientWidth / containerRef.current.clientHeight;
}, [windowAspectRatio, containerRef]); }, [windowAspectRatio, containerRef]);
const constrainedAspectRatio = useMemo<number>(() => {
if (isMobile || fullscreen) {
return cameraAspectRatio;
} else {
return containerAspectRatio < cameraAspectRatio
? containerAspectRatio
: cameraAspectRatio;
}
}, [cameraAspectRatio, containerAspectRatio, fullscreen]);
const growClassName = useMemo(() => { const growClassName = useMemo(() => {
if (isMobile) { if (isMobile) {
if (isPortrait) { if (isPortrait) {
@ -90,16 +100,6 @@ export default function LiveBirdseyeView() {
return "mse"; return "mse";
}, [config]); }, [config]);
const aspectRatio = useMemo<number>(() => {
if (isMobile || fullscreen) {
return cameraAspectRatio;
} else {
return containerAspectRatio < cameraAspectRatio
? containerAspectRatio
: cameraAspectRatio;
}
}, [cameraAspectRatio, containerAspectRatio, fullscreen]);
if (!config) { if (!config) {
return <ActivityIndicator />; return <ActivityIndicator />;
} }
@ -163,7 +163,7 @@ export default function LiveBirdseyeView() {
<div <div
className={growClassName} className={growClassName}
style={{ style={{
aspectRatio: aspectRatio, aspectRatio: constrainedAspectRatio,
}} }}
> >
<BirdseyeLivePlayer <BirdseyeLivePlayer