Merge pull request #83 from ibs0d/revert-82-claude/fix-preview-aspect-ratio-GZq8u

Revert "fix: preserve aspect ratio in preview players during timeline scrubbing"
This commit is contained in:
ibs0d 2026-03-21 12:58:41 +11:00 committed by GitHub
commit 08b1c43c16
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -281,7 +281,7 @@ function PreviewVideoPlayer({
<div <div
ref={visibilityRef} ref={visibilityRef}
className={cn( className={cn(
"relative flex w-full items-center justify-center overflow-hidden rounded-lg bg-black md:rounded-2xl", "relative flex w-full justify-center overflow-hidden rounded-lg bg-black md:rounded-2xl",
onClick && "cursor-pointer", onClick && "cursor-pointer",
className, className,
)} )}
@ -289,7 +289,7 @@ function PreviewVideoPlayer({
onClick={onClick} onClick={onClick}
> >
<img <img
className={`max-h-full max-w-full object-contain ${currentHourFrame ? "visible" : "invisible"}`} className={`absolute size-full object-contain ${currentHourFrame ? "visible" : "invisible"}`}
src={currentHourFrame} src={currentHourFrame}
onLoad={() => { onLoad={() => {
if (changeoverTimeout) { if (changeoverTimeout) {
@ -303,7 +303,7 @@ function PreviewVideoPlayer({
{isVisible && ( {isVisible && (
<video <video
ref={previewRef} ref={previewRef}
className={`max-h-full max-w-full object-contain ${currentHourFrame ? "invisible" : "visible"}`} className={`absolute size-full object-contain ${currentHourFrame ? "invisible" : "visible"}`}
preload="auto" preload="auto"
autoPlay autoPlay
playsInline playsInline
@ -348,7 +348,7 @@ function PreviewVideoPlayer({
{t("noPreviewFoundFor", { camera: cameraName })} {t("noPreviewFoundFor", { camera: cameraName })}
</div> </div>
)} )}
{firstLoad && <Skeleton className="aspect-video w-full" />} {firstLoad && <Skeleton className="absolute aspect-video size-full" />}
</div> </div>
); );
} }
@ -554,7 +554,7 @@ function PreviewFramesPlayer({
return ( return (
<div <div
className={cn( className={cn(
"relative flex w-full items-center justify-center", "relative flex w-full justify-center",
className, className,
onClick && "cursor-pointer", onClick && "cursor-pointer",
)} )}
@ -562,7 +562,7 @@ function PreviewFramesPlayer({
> >
<img <img
ref={imgRef} ref={imgRef}
className="max-h-full max-w-full rounded-lg object-contain md:rounded-2xl" className={`size-full rounded-lg bg-black object-contain md:rounded-2xl`}
loading="lazy" loading="lazy"
onLoad={onImageLoaded} onLoad={onImageLoaded}
/> />