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

feat(web): allow CameraImage to stretch

Browse Source
This commit is contained in:
Paul Armstrong
2021-02-13 07:24:53 -08:00
committed by Blake Blackshear
parent 52a29ed00a
commit 7314572d97
3 changed files with 19 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
web/src/components/CameraImage.jsx
View File

@@ -4,7 +4,7 @@ import { useApiHost, useConfig } from '../api';
import { useCallback, useEffect, useMemo, useRef, useState } from 'preact/hooks';
import { useResizeObserver } from '../hooks';
export default function CameraImage({ camera, onload, searchParams = '' }) {
export default function CameraImage({ camera, onload, searchParams = '', stretch = false }) {
const { data: config } = useConfig();
const apiHost = useApiHost();
const [hasLoaded, setHasLoaded] = useState(false);
@@ -15,11 +15,10 @@ export default function CameraImage({ camera, onload, searchParams = '' }) {
const { name, width, height } = config.cameras[camera];
const aspectRatio = width / height;
const scaledHeight = useMemo(() => Math.min(Math.ceil(availableWidth / aspectRatio), height), [
availableWidth,
aspectRatio,
height,
]);
const scaledHeight = useMemo(() => {
const scaledHeight = Math.floor(availableWidth / aspectRatio);
return stretch ? scaledHeight : Math.min(scaledHeight, height);
}, [availableWidth, aspectRatio, height, stretch]);
const scaledWidth = useMemo(() => Math.ceil(scaledHeight * aspectRatio), [scaledHeight, aspectRatio]);
const img = useMemo(() => new Image(), []);