administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-04-06 23:27:36 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

fix: motion dot outside zoom transform in LiveCameraView

Browse Source 
Same pattern as DraggableGridLayout: render the dot outside
TransformComponent so it doesn't scale with pinch/zoom.
LivePlayer gets showMotionDot={false} to avoid duplicate.

https://claude.ai/code/session_019B4dJXtcxvHn97ZaqHUB62
This commit is contained in:
Claude 2026-03-19 03:51:29 +00:00
parent f07636e7ec
commit 7ee24b7518
No known key found for this signature in database
1 changed files with 11 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
web/src/views/live/LiveCameraView.tsx
View File

@ -86,6 +86,7 @@ import {
MdPersonOff, MdPersonOff,
MdPersonSearch, MdPersonSearch,
MdPhotoCamera, MdPhotoCamera,
MdCircle,
} from "react-icons/md"; } from "react-icons/md";
import { Link, useNavigate } from "react-router-dom"; import { Link, useNavigate } from "react-router-dom";
import { TransformWrapper, TransformComponent } from "react-zoom-pan-pinch"; import { TransformWrapper, TransformComponent } from "react-zoom-pan-pinch";
@ -114,6 +115,7 @@ import { detectCameraAudioFeatures } from "@/utils/cameraUtil";
import PtzControlPanel from "@/components/overlay/PtzControlPanel"; import PtzControlPanel from "@/components/overlay/PtzControlPanel";
import ObjectSettingsView from "../settings/ObjectSettingsView"; import ObjectSettingsView from "../settings/ObjectSettingsView";
import { useSearchEffect } from "@/hooks/use-overlay-state"; import { useSearchEffect } from "@/hooks/use-overlay-state";
import { useCameraActivity } from "@/hooks/use-camera-activity";
import { import {
downloadSnapshot, downloadSnapshot,
fetchCameraSnapshot, fetchCameraSnapshot,
@ -190,6 +192,9 @@ export default function LiveCameraView({
const { payload: enabledState } = useEnabledState(camera.name); const { payload: enabledState } = useEnabledState(camera.name);
const cameraEnabled = enabledState === "ON"; const cameraEnabled = enabledState === "ON";
// motion dot
const { activeMotion, offline: cameraOffline } = useCameraActivity(camera);
// for audio transcriptions // for audio transcriptions
const { payload: audioTranscriptionState, send: sendTranscription } = const { payload: audioTranscriptionState, send: sendTranscription } =
@ -646,6 +651,7 @@ export default function LiveCameraView({
className={`${fullscreen ? "*:rounded-none" : ""}`} className={`${fullscreen ? "*:rounded-none" : ""}`}
windowVisible windowVisible
showStillWithoutActivity={false} showStillWithoutActivity={false}
showMotionDot={false}
alwaysShowCameraName={false} alwaysShowCameraName={false}
cameraConfig={camera} cameraConfig={camera}
playAudio={audio} playAudio={audio}
@ -663,6 +669,11 @@ export default function LiveCameraView({
/> />
</div> </div>
</TransformComponent> </TransformComponent>
{activeMotion && !cameraOffline && (
<div className="absolute right-4 top-4 z-40">
<MdCircle className="size-2 animate-pulse text-danger drop-shadow-md" />
</div>
)}
{camera?.audio?.enabled_in_config && {camera?.audio?.enabled_in_config &&
audioTranscriptionState == "ON" && audioTranscriptionState == "ON" &&
transcription != null && ( transcription != null && (