chris/frigate
1
0
Fork 0
forked from Github/frigate
Code Pull Requests Packages Activity

Live player fixes and improvements (#12202)

Browse Source 
* Live player fixes and improvements

* remove comment

* Simplify wording
This commit is contained in:
Josh Hawkins
2024-06-29 10:02:30 -05:00
committed by GitHub
parent 48a87b16b8
commit 53a2a865f1
9 changed files with 267 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
web/src/components/camera/CameraImage.tsx
View File

@@ -26,13 +26,12 @@ export default function CameraImage({
const { name } = config ? config.cameras[camera] : "";
const enabled = config ? config.cameras[camera].enabled : "True";
const [isPortraitImage, setIsPortraitImage] = useState(false);
const [{ width: containerWidth, height: containerHeight }] =
useResizeObserver(containerRef);
const requestHeight = useMemo(() => {
if (!config || containerHeight == 0) {
if (!config || containerHeight == 0 || !hasLoaded) {
return 360;
}
@@ -40,7 +39,14 @@ export default function CameraImage({
config.cameras[camera].detect.height,
Math.round(containerHeight * (isDesktop ? 1.1 : 1.25)),
);
}, [config, camera, containerHeight]);
}, [config, camera, containerHeight, hasLoaded]);
const isPortraitImage = useMemo(() => {
if (imgRef.current && containerWidth && containerHeight && hasLoaded) {
const { naturalHeight, naturalWidth } = imgRef.current;
return naturalWidth / naturalHeight < containerWidth / containerHeight;
}
}, [containerWidth, containerHeight, hasLoaded]);
useEffect(() => {
if (!config || !imgRef.current) {
@@ -61,13 +67,6 @@ export default function CameraImage({
onLoad={() => {
setHasLoaded(true);
if (imgRef.current) {
const { naturalHeight, naturalWidth } = imgRef.current;
setIsPortraitImage(
naturalWidth / naturalHeight < containerWidth / containerHeight,
);
}
if (onload) {
onload();
}