administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-03-18 06:08:22 +03:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Merge pull request #36 from ibs0d/codex/partially-revert-liveplayer.tsx-changes

Browse Source 
Revert LivePlayer transform wrapper regression in live view
This commit is contained in:
ibs0d 2026-03-09 13:57:29 +11:00 committed by GitHub
commit 1dcea2638a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 21 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
web/src/components/player/LivePlayer.tsx
View File

@ -51,11 +51,6 @@ type LivePlayerProps = {
setFullResolution?: React.Dispatch<React.SetStateAction<VideoResolutionType>>; setFullResolution?: React.Dispatch<React.SetStateAction<VideoResolutionType>>;
onError?: (error: LivePlayerError) => void; onError?: (error: LivePlayerError) => void;
onResetLiveMode?: () => void; onResetLiveMode?: () => void;
contentTransform?: {
scale: number;
positionX: number;
positionY: number;
};
}; };
export default function LivePlayer({ export default function LivePlayer({
@ -81,7 +76,6 @@ export default function LivePlayer({
setFullResolution, setFullResolution,
onError, onError,
onResetLiveMode, onResetLiveMode,
contentTransform,
}: LivePlayerProps) { }: LivePlayerProps) {
const { t } = useTranslation(["components/player"]); const { t } = useTranslation(["components/player"]);
@ -377,39 +371,27 @@ export default function LivePlayer({
lowerClassName="md:rounded-2xl" lowerClassName="md:rounded-2xl"
/> />
)} )}
<div {player}
className="absolute inset-0"
style={
contentTransform
? {
transform: `translate(${contentTransform.positionX}px, ${contentTransform.positionY}px) scale(${contentTransform.scale})`,
transformOrigin: "0 0",
}
: undefined
}
>
{player}
<div <div
className={cn( className={cn(
"absolute inset-0 w-full", "absolute inset-0 w-full",
showStillWithoutActivity && showStillWithoutActivity &&
!liveReady && !liveReady &&
!isReEnabling && !isReEnabling &&
cameraEnabled cameraEnabled
? "visible" ? "visible"
: "invisible", : "invisible",
)} )}
> >
<AutoUpdatingCameraImage <AutoUpdatingCameraImage
className="pointer-events-none size-full" className="pointer-events-none size-full"
cameraClasses="relative size-full flex justify-center" cameraClasses="relative size-full flex justify-center"
camera={cameraConfig.name} camera={cameraConfig.name}
showFps={false} showFps={false}
reloadInterval={stillReloadInterval} reloadInterval={stillReloadInterval}
periodicCache periodicCache
/> />
</div>
</div> </div>
{cameraEnabled && {cameraEnabled &&

5
web/src/views/live/DraggableGridLayout.tsx
View File

@ -435,7 +435,7 @@ export default function DraggableGridLayout({
const [audioStates, setAudioStates] = useState<AudioState>({}); const [audioStates, setAudioStates] = useState<AudioState>({});
const [volumeStates, setVolumeStates] = useState<VolumeState>({}); const [volumeStates, setVolumeStates] = useState<VolumeState>({});
const [statsStates, setStatsStates] = useState<StatsState>({}); const [statsStates, setStatsStates] = useState<StatsState>({});
const [cameraZoomStates, setCameraZoomStates] = useState< const [_cameraZoomStates, setCameraZoomStates] = useState<
Record<string, CameraZoomRuntimeTransform> Record<string, CameraZoomRuntimeTransform>
>({}); >({});
const cameraZoomViewportRefs = useRef<Record<string, HTMLDivElement | null>>( const cameraZoomViewportRefs = useRef<Record<string, HTMLDivElement | null>>(
@ -779,8 +779,6 @@ export default function DraggableGridLayout({
const useWebGL = const useWebGL =
currentGroupStreamingSettings?.[camera.name] currentGroupStreamingSettings?.[camera.name]
?.compatibilityMode || false; ?.compatibilityMode || false;
const zoomTransform =
cameraZoomStates[camera.name] ?? getDefaultZoomTransform();
return ( return (
<GridLiveContextMenu <GridLiveContextMenu
className="size-full" className="size-full"
@ -837,7 +835,6 @@ export default function DraggableGridLayout({
alwaysShowCameraName={displayCameraNames} alwaysShowCameraName={displayCameraNames}
useWebGL={useWebGL} useWebGL={useWebGL}
cameraRef={cameraRef} cameraRef={cameraRef}
contentTransform={zoomTransform}
className={cn( className={cn(
"draggable-live-grid-mse-cover size-full rounded-lg bg-black md:rounded-2xl", "draggable-live-grid-mse-cover size-full rounded-lg bg-black md:rounded-2xl",
camera.ui?.rotate && camera.ui?.rotate &&