mirror of
https://github.com/blakeblackshear/frigate.git
synced 2026-04-06 23:27:36 +03:00
fix: prevent video stretching in timeline scrubbing preview
- MsePlayer: change default object-fit fallback from fill to contain (grid layout keeps fill via --frigate-mse-object-fit:fill CSS variable) - PreviewPlayer: add object-contain class to video element - HlsVideoPlayer: add object-contain class to video element Recordings view and timeline preview now preserve aspect ratio, while live grid continues to stretch corridor cameras as before.
This commit is contained in:
parent
e947e1ede7
commit
90d9c444c8
@ -390,7 +390,7 @@ export default function HlsVideoPlayer({
|
|||||||
)}
|
)}
|
||||||
<video
|
<video
|
||||||
ref={videoRef}
|
ref={videoRef}
|
||||||
className={`size-full rounded-lg bg-black md:rounded-2xl ${loadedMetadata ? "" : "invisible"} cursor-pointer`}
|
className={`size-full object-contain rounded-lg bg-black md:rounded-2xl ${loadedMetadata ? "" : "invisible"} cursor-pointer`}
|
||||||
preload="auto"
|
preload="auto"
|
||||||
autoPlay
|
autoPlay
|
||||||
controls={!frigateControls}
|
controls={!frigateControls}
|
||||||
|
|||||||
@ -849,7 +849,7 @@ function MSEPlayer({
|
|||||||
className={className}
|
className={className}
|
||||||
style={{
|
style={{
|
||||||
objectFit:
|
objectFit:
|
||||||
"var(--frigate-mse-object-fit, fill)" as CSSProperties["objectFit"],
|
"var(--frigate-mse-object-fit, contain)" as CSSProperties["objectFit"],
|
||||||
transform:
|
transform:
|
||||||
"var(--frigate-mse-grid-rotation, none)" as CSSProperties["transform"],
|
"var(--frigate-mse-grid-rotation, none)" as CSSProperties["transform"],
|
||||||
transformOrigin:
|
transformOrigin:
|
||||||
|
|||||||
@ -303,7 +303,7 @@ function PreviewVideoPlayer({
|
|||||||
{isVisible && (
|
{isVisible && (
|
||||||
<video
|
<video
|
||||||
ref={previewRef}
|
ref={previewRef}
|
||||||
className={`absolute size-full ${currentHourFrame ? "invisible" : "visible"}`}
|
className={`absolute size-full object-contain ${currentHourFrame ? "invisible" : "visible"}`}
|
||||||
preload="auto"
|
preload="auto"
|
||||||
autoPlay
|
autoPlay
|
||||||
playsInline
|
playsInline
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user