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

use ReviewSegment type

Browse Source
This commit is contained in:
Josh Hawkins 2024-02-20 16:20:32 -06:00
parent df2076b6bf
commit 1aa788b759
6 changed files with 42 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/src/components/timeline/EventReviewTimeline.tsx
View File

@ -9,7 +9,7 @@ import {
} from "react"; } from "react";
import EventSegment from "./EventSegment"; import EventSegment from "./EventSegment";
import { useEventUtils } from "@/hooks/use-event-utils"; import { useEventUtils } from "@/hooks/use-event-utils";
import { Event } from "@/types/event"; import { ReviewSegment } from "@/types/review";
export type EventReviewTimelineProps = { export type EventReviewTimelineProps = {
segmentDuration: number; segmentDuration: number;
@ -21,7 +21,7 @@ export type EventReviewTimelineProps = {
showMinimap?: boolean; showMinimap?: boolean;
minimapStartTime?: number; minimapStartTime?: number;
minimapEndTime?: number; minimapEndTime?: number;
events: Event[]; events: ReviewSegment[];
severityType: string; severityType: string;
contentRef: RefObject<HTMLDivElement>; contentRef: RefObject<HTMLDivElement>;
}; };

4
web/src/components/timeline/EventSegment.tsx
View File

@ -1,10 +1,10 @@
import { useEventUtils } from "@/hooks/use-event-utils"; import { useEventUtils } from "@/hooks/use-event-utils";
import { useSegmentUtils } from "@/hooks/use-segment-utils"; import { useSegmentUtils } from "@/hooks/use-segment-utils";
import { Event } from "@/types/event"; import { ReviewSegment } from "@/types/review";
import { useMemo } from "react"; import { useMemo } from "react";
type EventSegmentProps = { type EventSegmentProps = {
events: Event[]; events: ReviewSegment[];
segmentTime: number; segmentTime: number;
segmentDuration: number; segmentDuration: number;
timestampSpread: number; timestampSpread: number;

4
web/src/hooks/use-event-utils.ts
View File

@ -1,7 +1,7 @@
import { useCallback } from 'react'; import { useCallback } from 'react';
import { Event } from '@/types/event'; import { ReviewSegment } from '@/types/review';
export const useEventUtils = (events: Event[], segmentDuration: number) => { export const useEventUtils = (events: ReviewSegment[], segmentDuration: number) => {
const isStartOfEvent = useCallback((time: number): boolean => { const isStartOfEvent = useCallback((time: number): boolean => {
return events.some((event) => { return events.some((event) => {
const segmentStart = getSegmentStart(event.start_time); const segmentStart = getSegmentStart(event.start_time);

19
web/src/hooks/use-segment-utils.ts
View File

@ -1,9 +1,9 @@
import { useCallback, useMemo } from 'react'; import { useCallback, useMemo } from 'react';
import { Event } from '@/types/event'; import { ReviewSegment } from '@/types/review';
export const useSegmentUtils = ( export const useSegmentUtils = (
segmentDuration: number, segmentDuration: number,
events: Event[], events: ReviewSegment[],
severityType: string, severityType: string,
) => { ) => {
const getSegmentStart = useCallback((time: number): number => { const getSegmentStart = useCallback((time: number): number => {
@ -20,7 +20,7 @@ export const useSegmentUtils = (
const mapSeverityToNumber = useCallback((severity: string): number => { const mapSeverityToNumber = useCallback((severity: string): number => {
switch (severity) { switch (severity) {
case "motion": case "significant_motion":
return 1; return 1;
case "detection": case "detection":
return 2; return 2;
@ -117,8 +117,17 @@ export const useSegmentUtils = (
roundBottom = !hasPrevOtherEvent; roundBottom = !hasPrevOtherEvent;
roundTop = !hasNextOtherEvent; roundTop = !hasNextOtherEvent;
} else { } else {
roundTop = !hasNextSeverityEvent && !hasNextOtherEvent; roundTop = !hasNextSeverityEvent || !hasNextOtherEvent;
roundBottom = !hasPrevSeverityEvent && !hasPrevOtherEvent; roundBottom = !hasPrevSeverityEvent || !hasPrevOtherEvent;
}
if (segmentTime == 1708459740) {
console.log("hasOverlappingSeverityEvent: " + hasOverlappingSeverityEvent)
console.log("hasPrevSeverityEvent: " + hasPrevSeverityEvent)
console.log("hasNextSeverityEvent: " + hasNextSeverityEvent)
console.log("hasOverlappingOtherEvent: " + hasOverlappingOtherEvent)
console.log("hasPrevOtherEvent: " + hasPrevOtherEvent)
console.log("hasNextOtherEvent: "+hasNextOtherEvent)
} }
return { return {

4
web/src/pages/UIPlayground.tsx
View File

@ -10,6 +10,7 @@ import ActivityIndicator from "@/components/ui/activity-indicator";
import { useApiHost } from "@/api"; import { useApiHost } from "@/api";
import TimelineScrubber from "@/components/playground/TimelineScrubber"; import TimelineScrubber from "@/components/playground/TimelineScrubber";
import EventReviewTimeline from "@/components/timeline/EventReviewTimeline"; import EventReviewTimeline from "@/components/timeline/EventReviewTimeline";
import { ReviewSegment } from "@/types/review";
// Color data // Color data
const colors = [ const colors = [
@ -72,7 +73,7 @@ function UIPlayground() {
const { data: config } = useSWR<FrigateConfig>("config"); const { data: config } = useSWR<FrigateConfig>("config");
const [timeline, setTimeline] = useState<string | undefined>(undefined); const [timeline, setTimeline] = useState<string | undefined>(undefined);
const contentRef = useRef<HTMLDivElement>(null); const contentRef = useRef<HTMLDivElement>(null);
const [mockEvents, setMockEvents] = useState<Event[]>([]); const [mockEvents, setMockEvents] = useState<ReviewSegment[]>([]);
const onSelect = useCallback(({ items }: { items: string[] }) => { const onSelect = useCallback(({ items }: { items: string[] }) => {
setTimeline(items[0]); setTimeline(items[0]);
@ -91,7 +92,6 @@ function UIPlayground() {
useMemo(() => { useMemo(() => {
const initialEvents = Array.from({ length: 50 }, generateRandomEvent); const initialEvents = Array.from({ length: 50 }, generateRandomEvent);
setMockEvents(initialEvents); setMockEvents(initialEvents);
console.log(initialEvents);
}, []); }, []);
return ( return (

20
web/src/types/review.ts Normal file
View File

@ -0,0 +1,20 @@
export interface ReviewSegment {
id: string;
camera: string;
severity: ReviewSeverity;
start_time: number;
end_time: number;
thumb_path: string;
has_been_reviewed: boolean;
data: ReviewData;
}
export type ReviewSeverity = "alert" | "detection" | "significant_motion";
type ReviewData = {
audio: string[];
detections: string[];
objects: string[];
significant_motion_areas: number[];
zones: string[];
};