Matching the field of view - pretty please

This commit is contained in:
dirwin31
2026-08-27 18:12:25 -07:00
parent c02bb05113
commit 386a6f9216
3 changed files with 12 additions and 0 deletions
@@ -1277,6 +1277,11 @@
width: 100% !important;
}
.dashcam-player-overlay .dashcam-player .dashcam-video-shell.qcamera-framing video {
/* qcamera.ts is a full-frame, non-uniform scale; mirror it to prevent a crop/FOV jump. */
object-fit: fill;
}
.dashcam-player-overlay .dashcam-player .dashcam-video-shell video.active {
opacity: 1;
pointer-events: auto;
@@ -340,6 +340,7 @@ async function openOverlay(route) {
const [videoA, videoB] = overlay.querySelectorAll(".dashcam-video")
let activeVideo = videoA
let stagingVideo = videoB
const videoShell = overlay.querySelector(".dashcam-video-shell")
const playerState = overlay.querySelector(".dashcam-player-state")
const segmentBar = overlay.querySelector(".dashcam-segment-bar")
const segmentSelect = overlay.querySelector(".segment-select")
@@ -579,6 +580,9 @@ async function openOverlay(route) {
cancelUpgrade()
wantsPlayback = autoplay
showingPreview = preview === undefined ? supportsLowQuality(camera) : preview
// qcamera.ts scales the complete road frame to 526x330. Keep that same mapping
// after the full stream arrives so its slightly wider aspect ratio is not cropped.
videoShell.classList.toggle("qcamera-framing", showingPreview)
if (message) setPlayerMessage(message)
stagingVideo.pause()
@@ -97,6 +97,9 @@ def test_player_shell_keeps_both_quality_levels_at_one_fixed_size():
assert "height: 100% !important;" in source
assert "width: 100% !important;" in source
assert "object-fit: cover;" in source
assert ".dashcam-video-shell.qcamera-framing video" in source
assert "object-fit: fill;" in source
assert 'videoShell.classList.toggle("qcamera-framing", showingPreview)' in component
assert "deferNativeControlsUntilInteraction(stagingVideo)" in component
assert "stagingVideo.controls = true" not in component