feat(video): base of video refactoring
This commit is contained in:
@@ -1,63 +0,0 @@
|
||||
import { useMemo, useCallback } from 'react';
|
||||
import { DetectionCounts } from '@/types';
|
||||
|
||||
export const useCumulativeCounts = (frames: any[]) => {
|
||||
const result = useMemo(() => {
|
||||
const map = new Map<number, DetectionCounts>();
|
||||
let lastCounts = {} as DetectionCounts;
|
||||
let indices: number[] = [];
|
||||
|
||||
if (frames && Array.isArray(frames)) {
|
||||
const sortedFrames = [...frames].sort(
|
||||
(a, b) => (a.frame_id || 0) - (b.frame_id || 0),
|
||||
);
|
||||
sortedFrames.forEach((frameData) => {
|
||||
const frameId = frameData.frame_id;
|
||||
indices.push(frameId);
|
||||
const detections = (frameData as any).detections;
|
||||
if (detections && detections.length > 0) {
|
||||
const frameCounts = detections[0].count || {};
|
||||
|
||||
// Dynamically compute cumulative max for all keys present in counts
|
||||
const nextCounts = { ...lastCounts };
|
||||
Object.keys(frameCounts).forEach((key) => {
|
||||
const currentVal = (nextCounts as any)[key] || 0;
|
||||
const newVal = (frameCounts as any)[key] || 0;
|
||||
(nextCounts as any)[key] = Math.max(currentVal, newVal);
|
||||
});
|
||||
lastCounts = nextCounts;
|
||||
}
|
||||
map.set(frameId, { ...lastCounts });
|
||||
});
|
||||
}
|
||||
return { map, indices };
|
||||
}, [frames]);
|
||||
|
||||
const getStickyCounts = useCallback(
|
||||
(frameNumber: number) => {
|
||||
const { map, indices } = result;
|
||||
if (indices.length === 0) return {} as DetectionCounts;
|
||||
|
||||
let targetFrameId = -1;
|
||||
let low = 0,
|
||||
high = indices.length - 1;
|
||||
|
||||
while (low <= high) {
|
||||
let mid = Math.floor((low + high) / 2);
|
||||
if (indices[mid] <= frameNumber) {
|
||||
targetFrameId = indices[mid];
|
||||
low = mid + 1;
|
||||
} else {
|
||||
high = mid - 1;
|
||||
}
|
||||
}
|
||||
|
||||
return targetFrameId !== -1
|
||||
? map.get(targetFrameId) || ({} as DetectionCounts)
|
||||
: ({} as DetectionCounts);
|
||||
},
|
||||
[result],
|
||||
);
|
||||
|
||||
return { getStickyCounts, sortedFrameIndices: result.indices };
|
||||
};
|
||||
@@ -1,112 +0,0 @@
|
||||
import { useMemo } from 'react';
|
||||
import { DetectionData } from '@/types';
|
||||
import {
|
||||
getEnabledDetectionTypes,
|
||||
DETECTION_TYPES,
|
||||
} from '@/constants/detectionModeConfig';
|
||||
|
||||
export const useFrameDetectionMap = (
|
||||
data: DetectionData,
|
||||
detectionType: string,
|
||||
) => {
|
||||
const frameDetectionMap = useMemo(() => {
|
||||
const map = new Map<number, any[]>();
|
||||
const detectionMode = data.detection_mode || detectionType;
|
||||
const enabledTypes = getEnabledDetectionTypes(detectionMode);
|
||||
const enabledKeys = new Set(enabledTypes.map((t) => t.id));
|
||||
|
||||
if (data.frames && Array.isArray(data.frames)) {
|
||||
data.frames.forEach((frameData) => {
|
||||
const frameId = frameData.frame_id;
|
||||
const flatDetections = (frameData as any).detections;
|
||||
|
||||
if (flatDetections && Array.isArray(flatDetections)) {
|
||||
const filteredDetections = flatDetections
|
||||
.filter((d: any) => {
|
||||
const type = (d.type || '').toLowerCase();
|
||||
return enabledKeys.has(type);
|
||||
})
|
||||
.map((d: any) => ({
|
||||
...d,
|
||||
_detType: (d.type || '').toLowerCase(),
|
||||
// Map old ID fields and new ID fields dynamically for backward compatibility
|
||||
[`${(d.type || '').toLowerCase()}_id`]: d.detection_id,
|
||||
}));
|
||||
|
||||
if (filteredDetections.length > 0) {
|
||||
map.set(frameId, filteredDetections);
|
||||
}
|
||||
} else {
|
||||
// Legacy format: separate arrays (potholes, signboards, etc.)
|
||||
let detections: any[] = [];
|
||||
|
||||
enabledTypes.forEach((type) => {
|
||||
// Try common plural naming conventions for legacy support
|
||||
const possibleKeys = [
|
||||
`${type.id}s`,
|
||||
type.id.endsWith('y')
|
||||
? `${type.id.slice(0, -1)}ies`
|
||||
: `${type.id}s`,
|
||||
type.listKey.replace('_list', 's'),
|
||||
type.listKey,
|
||||
];
|
||||
|
||||
for (const listKey of possibleKeys) {
|
||||
if ((frameData as any)[listKey]) {
|
||||
detections = [
|
||||
...detections,
|
||||
...(frameData as any)[listKey].map((item: any) => ({
|
||||
...item,
|
||||
_detType: type.id,
|
||||
type: type.id,
|
||||
[`${type.id.toLowerCase()}_id`]:
|
||||
(item as any).detection_id ??
|
||||
(item as any)[`${type.id.toLowerCase()}_id`] ??
|
||||
item.id,
|
||||
})),
|
||||
];
|
||||
break;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (detections.length > 0) map.set(frameId, detections);
|
||||
}
|
||||
});
|
||||
}
|
||||
return map;
|
||||
}, [data, detectionType]);
|
||||
|
||||
const sortedDetectionIndices = useMemo(() => {
|
||||
return Array.from(frameDetectionMap.keys()).sort((a, b) => a - b);
|
||||
}, [frameDetectionMap]);
|
||||
|
||||
const getNearestDetections = (
|
||||
frame: number,
|
||||
sortedIndices: number[],
|
||||
maxSkip = 3,
|
||||
) => {
|
||||
const exact = frameDetectionMap.get(frame);
|
||||
if (exact) return exact;
|
||||
|
||||
let low = 0,
|
||||
high = sortedIndices.length - 1,
|
||||
targetIndex = -1;
|
||||
|
||||
while (low <= high) {
|
||||
const mid = Math.floor((low + high) / 2);
|
||||
if (sortedIndices[mid] <= frame) {
|
||||
targetIndex = sortedIndices[mid];
|
||||
low = mid + 1;
|
||||
} else {
|
||||
high = mid - 1;
|
||||
}
|
||||
}
|
||||
|
||||
return targetIndex !== -1 && frame - targetIndex <= maxSkip
|
||||
? frameDetectionMap.get(targetIndex)
|
||||
: undefined;
|
||||
};
|
||||
|
||||
return { frameDetectionMap, getNearestDetections, sortedDetectionIndices };
|
||||
};
|
||||
@@ -1,42 +0,0 @@
|
||||
import { useMemo } from 'react';
|
||||
import { DetectionData } from '@/types';
|
||||
import { DETECTION_TYPES } from '@/constants/detectionModeConfig';
|
||||
|
||||
export const useGpsMap = (data: DetectionData) => {
|
||||
const gpsMap = useMemo(() => {
|
||||
const map = new Map<number, { lat: number; lng: number }>();
|
||||
|
||||
const addItemsToMap = (list?: any[]) => {
|
||||
if (!list || !Array.isArray(list)) return;
|
||||
list.forEach((item) => {
|
||||
const id =
|
||||
(item as any).pothole_id ??
|
||||
(item as any).signboard_id ??
|
||||
(item as any).detection_id;
|
||||
if (
|
||||
item.lat !== undefined &&
|
||||
item.lng !== undefined &&
|
||||
id !== undefined
|
||||
) {
|
||||
map.set(id, { lat: item.lat, lng: item.lng });
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// Dynamically add items from all configured detection lists
|
||||
Object.values(DETECTION_TYPES).forEach((type) => {
|
||||
if (type.listKey) {
|
||||
addItemsToMap((data as any)[type.listKey]);
|
||||
}
|
||||
});
|
||||
|
||||
// Backward compatibility for generic signboard_list
|
||||
if ((data as any).signboard_list) {
|
||||
addItemsToMap((data as any).signboard_list);
|
||||
}
|
||||
|
||||
return map;
|
||||
}, [data]);
|
||||
|
||||
return gpsMap;
|
||||
};
|
||||
@@ -1,34 +0,0 @@
|
||||
import { useEffect, useRef } from 'react';
|
||||
|
||||
export const useVideoDetectionLoop = (
|
||||
videoRef: React.RefObject<HTMLVideoElement | null>,
|
||||
fps: number,
|
||||
onFrameUpdate: (frame: number) => void,
|
||||
) => {
|
||||
const lastProcessedFrame = useRef(-1);
|
||||
const animId = useRef<number>(-1);
|
||||
|
||||
useEffect(() => {
|
||||
const update = () => {
|
||||
const video = videoRef.current;
|
||||
if (video && !video.paused) {
|
||||
const frame = Math.round(video.currentTime * fps);
|
||||
if (frame !== lastProcessedFrame.current) {
|
||||
lastProcessedFrame.current = frame;
|
||||
onFrameUpdate(frame);
|
||||
}
|
||||
}
|
||||
animId.current = requestAnimationFrame(update);
|
||||
};
|
||||
|
||||
animId.current = requestAnimationFrame(update);
|
||||
|
||||
return () => {
|
||||
if (animId.current !== -1) {
|
||||
cancelAnimationFrame(animId.current);
|
||||
}
|
||||
};
|
||||
}, [fps, onFrameUpdate, videoRef]);
|
||||
|
||||
return { lastProcessedFrame };
|
||||
};
|
||||
Reference in New Issue
Block a user