administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-10 21:25:24 +03:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Cleanup live activity indicators for cameras

Browse Source
This commit is contained in:
Nicolas Mowen 2024-04-10 06:36:46 -06:00
parent 503dfba719
commit 27edd7df6e
2 changed files with 3 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -7,10 +7,8 @@ import MSEPlayer from "./MsePlayer";
import JSMpegPlayer from "./JSMpegPlayer";
import { MdCircle } from "react-icons/md";
import { useCameraActivity } from "@/hooks/use-camera-activity";
import { useRecordingsState } from "@/api/ws";
import { LivePlayerMode } from "@/types/live";
import useCameraLiveMode from "@/hooks/use-camera-live-mode";
import CameraActivityIndicator from "../indicators/CameraActivityIndicator";
type LivePlayerProps = {
cameraRef?: (ref: HTMLDivElement | null) => void;
@ -41,8 +39,7 @@ export default function LivePlayer({
}: LivePlayerProps) {
// camera activity
const { activeMotion, activeAudio, activeTracking } =
useCameraActivity(cameraConfig);
const { activeMotion, activeTracking } = useCameraActivity(cameraConfig);
const cameraActive = useMemo(
() =>
@ -72,8 +69,6 @@ export default function LivePlayer({
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [cameraActive, liveReady]);
const { payload: recording } = useRecordingsState(cameraConfig.name);
// camera still state
const stillReloadInterval = useMemo(() => {
@ -171,15 +166,8 @@ export default function LivePlayer({
/>
</div>
<div className="absolute right-2 bottom-2 w-[40px]">
{(activeMotion ||
(cameraConfig.audio.enabled_in_config && activeAudio)) && (
<CameraActivityIndicator />
)}
</div>
<div className="absolute right-2 top-2 size-4">
{recording == "ON" && (
{activeMotion && (
<MdCircle className="size-2 drop-shadow-md shadow-danger text-danger animate-pulse" />
)}
</div>

11
web/src/hooks/use-camera-activity.ts
View File

@ -1,8 +1,4 @@
import {
useAudioActivity,
useFrigateEvents,
useMotionActivity,
} from "@/api/ws";
import { useFrigateEvents, useMotionActivity } from "@/api/ws";
import { CameraConfig } from "@/types/frigateConfig";
import { MotionData, ReviewSegment } from "@/types/review";
import { useEffect, useMemo, useState } from "react";
@ -11,7 +7,6 @@ import { useTimelineUtils } from "./use-timeline-utils";
type useCameraActivityReturn = {
activeTracking: boolean;
activeMotion: boolean;
activeAudio: boolean;
};
export function useCameraActivity(
@ -25,7 +20,6 @@ export function useCameraActivity(
const { payload: detectingMotion } = useMotionActivity(camera.name);
const { payload: event } = useFrigateEvents();
const { payload: audioRms } = useAudioActivity(camera.name);
useEffect(() => {
if (!event) {
@ -63,9 +57,6 @@ export function useCameraActivity(
return {
activeTracking: hasActiveObjects,
activeMotion: detectingMotion == "ON",
activeAudio: camera.audio.enabled_in_config
? audioRms >= camera.audio.min_volume
: false,
};
}