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

Show audio icons

Browse Source
This commit is contained in:
Nicolas Mowen 2024-02-18 15:08:08 -07:00
parent 6ed3f53da5
commit 34dde65fc3
2 changed files with 60 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
web/src/components/player/PreviewThumbnailPlayer.tsx
View File

@ -140,14 +140,17 @@ export default function PreviewThumbnailPlayer({
/>
{!hover &&
(review.severity == "alert" || review.severity == "detection") && (
<div className="absolute top-1 right-1 flex gap-1">
<div className="absolute top-1 left-[6px] flex gap-1">
{review.data.objects.map((object) => {
return getIconForLabel(object);
return getIconForLabel(object, "w-3 h-3 text-white");
})}
{review.data.audio.map((audio) => {
return getIconForLabel(audio, "w-3 h-3 text-white");
})}
</div>
)}
{!hover && (
<div className="absolute left-1 right-1 bottom-1 flex justify-between">
<div className="absolute left-[6px] right-[6px] bottom-1 flex justify-between text-white">
<TimeAgo time={review.start_time * 1000} />
{config &&
formatUnixTimestampToDateTime(review.start_time, {

37
web/src/pages/Events.tsx
View File

@ -18,7 +18,7 @@ import { MdCircle } from "react-icons/md";
import useSWR from "swr";
import useSWRInfinite from "swr/infinite";
const API_LIMIT = 20;
const API_LIMIT = 100;
export default function Events() {
const { data: config } = useSWR<FrigateConfig>("config");
@ -37,7 +37,7 @@ export default function Events() {
if (index > 0) {
const lastDate = prevData[prevData.length - 1].start_time;
const pagedParams = reviewSearchParams
? { before: lastDate, limit: API_LIMIT, severity: severity }
? { before: lastDate, limit: API_LIMIT }
: {
...reviewSearchParams,
before: lastDate,
@ -47,7 +47,7 @@ export default function Events() {
}
const params = reviewSearchParams
? { limit: API_LIMIT, severity: severity }
? { limit: API_LIMIT }
: { ...reviewSearchParams, limit: API_LIMIT };
return ["review", params];
},
@ -62,6 +62,30 @@ export default function Events() {
isValidating,
} = useSWRInfinite<ReviewSegment[]>(getKey, reviewSegmentFetcher);
const reviewItems = useMemo(() => {
const alerts: ReviewSegment[] = [];
const detections: ReviewSegment[] = [];
const motion: ReviewSegment[] = [];
reviewPages?.forEach((page) => {
page.forEach((segment) => {
switch (segment.severity) {
case "alert":
alerts.push(segment);
break;
case "detection":
detections.push(segment);
break;
default:
motion.push(segment);
break;
}
});
});
return { alert: alerts, detection: detections, significant_motion: motion };
}, [reviewPages]);
const isDone = useMemo(
() => (reviewPages?.at(-1)?.length ?? 0) < API_LIMIT,
[reviewPages]
@ -185,10 +209,8 @@ export default function Events() {
</div>
<div className="flex flex-wrap gap-2 mt-2">
{reviewPages?.map((reviewSegments, pageIdx) => {
return reviewSegments.map((value, segIdx) => {
const lastRow =
pageIdx == size - 1 && segIdx == reviewSegments.length - 1;
{reviewItems[severity]?.map((value, segIdx) => {
const lastRow = segIdx == reviewItems[severity].length - 1;
const detectConfig = config.cameras[value.camera].detect;
const relevantPreview = Object.values(allPreviews || []).find(
(preview) =>
@ -216,7 +238,6 @@ export default function Events() {
{lastRow && !isDone && <ActivityIndicator />}
</div>
);
});
})}
</div>
</>