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

Move time ago to card info and add face area

Browse Source
This commit is contained in:
Nicolas Mowen 2025-05-14 14:14:24 -06:00
parent 6337246064
commit c2e28fbc69
1 changed files with 25 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -853,11 +853,18 @@ function FaceAttemptGroup({
}} }}
> >
<div className="flex flex-row justify-between"> <div className="flex flex-row justify-between">
<div className="select-none smart-capitalize"> <div className="flex flex-col gap-1">
Person <div className="select-none smart-capitalize">
{event?.sub_label Person
? `: ${event.sub_label} (${Math.round((event.data.sub_label_score || 0) * 100)}%)` {event?.sub_label
: ": " + t("details.unknown")} ? `: ${event.sub_label} (${Math.round((event.data.sub_label_score || 0) * 100)}%)`
: ": " + t("details.unknown")}
</div>
<TimeAgo
className="text-sm text-secondary-foreground"
time={group[0].timestamp * 1000}
dense
/>
</div> </div>
{event && ( {event && (
<Tooltip> <Tooltip>
@ -950,6 +957,14 @@ function FaceAttempt({
onClick(data, true); onClick(data, true);
}); });
const imageArea = useMemo(() => {
if (!imgRef.current) {
return undefined;
}
return imgRef.current.naturalWidth * imgRef.current.naturalHeight;
}, [imgRef]);
// api calls // api calls
const onTrainAttempt = useCallback( const onTrainAttempt = useCallback(
@ -1021,13 +1036,11 @@ function FaceAttempt({
onClick(data, e.metaKey || e.ctrlKey); onClick(data, e.metaKey || e.ctrlKey);
}} }}
/> />
<div className="absolute bottom-1 right-1 z-10 rounded-lg bg-black/50 px-2 py-1 text-xs text-white"> {imageArea != undefined && (
<TimeAgo <div className="absolute bottom-1 right-1 z-10 rounded-lg bg-black/50 px-2 py-1 text-xs text-white">
className="text-white" {imageArea}px
time={data.timestamp * 1000} </div>
dense )}
/>
</div>
</div> </div>
<div className="select-none p-2"> <div className="select-none p-2">
<div className="flex w-full flex-row items-center justify-between gap-2"> <div className="flex w-full flex-row items-center justify-between gap-2">