mirror of
https://github.com/blakeblackshear/frigate.git
synced 2026-04-05 22:57:40 +03:00
Add ui.rotate support to LiveCameraView single-camera view
- Invert cameraAspectRatio when camera.ui?.rotate is true so the container dimensions match the rotated video (width↔height swap) - Pass CSS variables --frigate-mse-grid-rotated and --frigate-mse-grid-rotation to LivePlayer, enabling the existing MsePlayer rotation/swap logic for single-camera view - Fullscreen orientation lock works automatically: an inverted ratio < 1 causes portrait lock for a normally-landscape camera https://claude.ai/code/session_01CDLHQPGpf8w44jpsG8g8nM
This commit is contained in:
parent
28b5b17b58
commit
ea9ca2f8d1
@ -360,11 +360,13 @@ export default function LiveCameraView({
|
||||
}, [windowAspectRatio, containerRef]);
|
||||
|
||||
const cameraAspectRatio = useMemo(() => {
|
||||
let ratio;
|
||||
if (fullResolution.width && fullResolution.height) {
|
||||
return fullResolution.width / fullResolution.height;
|
||||
ratio = fullResolution.width / fullResolution.height;
|
||||
} else {
|
||||
return camera.detect.width / camera.detect.height;
|
||||
ratio = camera.detect.width / camera.detect.height;
|
||||
}
|
||||
return camera.ui?.rotate ? 1 / ratio : ratio;
|
||||
}, [camera, fullResolution]);
|
||||
|
||||
const constrainedAspectRatio = useMemo<number>(() => {
|
||||
@ -648,7 +650,11 @@ export default function LiveCameraView({
|
||||
>
|
||||
<LivePlayer
|
||||
key={camera.name}
|
||||
className={`${fullscreen ? "*:rounded-none" : ""}`}
|
||||
className={cn(
|
||||
fullscreen ? "*:rounded-none" : "",
|
||||
camera.ui?.rotate &&
|
||||
"[--frigate-mse-grid-rotated:1] [--frigate-mse-grid-rotation:rotate(90deg)]",
|
||||
)}
|
||||
windowVisible
|
||||
showStillWithoutActivity={false}
|
||||
showMotionDot={false}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user