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

Merge branch 'fix-selected-outline' of github.com:blakeblackshear/frigate into fix-selected-outline

Browse Source
This commit is contained in:
Nicolas Mowen 2024-10-15 06:39:15 -06:00
commit c1fcfcab5b
2 changed files with 25 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
web/src/components/card/SearchThumbnailFooter.tsx
View File

@ -122,26 +122,30 @@ export default function SearchThumbnailFooter({
<LuMoreVertical className="size-5 cursor-pointer text-white" /> <LuMoreVertical className="size-5 cursor-pointer text-white" />
</DropdownMenuTrigger> </DropdownMenuTrigger>
<DropdownMenuContent> <DropdownMenuContent>
<DropdownMenuItem> {searchResult.has_clip && (
<a <DropdownMenuItem>
className="justify_start flex items-center" <a
href={`${baseUrl}api/events/${searchResult.id}/clip.mp4`} className="justify_start flex items-center"
download={`${searchResult.camera}_${searchResult.label}.mp4`} href={`${baseUrl}api/events/${searchResult.id}/clip.mp4`}
> download={`${searchResult.camera}_${searchResult.label}.mp4`}
<LuDownload className="mr-2 size-4" /> >
<span>Download video</span> <LuDownload className="mr-2 size-4" />
</a> <span>Download video</span>
</DropdownMenuItem> </a>
<DropdownMenuItem> </DropdownMenuItem>
<a )}
className="justify_start flex items-center" {searchResult.has_snapshot && (
href={`${baseUrl}api/events/${searchResult.id}/snapshot.jpg`} <DropdownMenuItem>
download={`${searchResult.camera}_${searchResult.label}.jpg`} <a
> className="justify_start flex items-center"
<LuCamera className="mr-2 size-4" /> href={`${baseUrl}api/events/${searchResult.id}/snapshot.jpg`}
<span>Download snapshot</span> download={`${searchResult.camera}_${searchResult.label}.jpg`}
</a> >
</DropdownMenuItem> <LuCamera className="mr-2 size-4" />
<span>Download snapshot</span>
</a>
</DropdownMenuItem>
)}
<DropdownMenuItem> <DropdownMenuItem>
<FaArrowsRotate className="mr-2 size-4" /> <FaArrowsRotate className="mr-2 size-4" />
<span>View object lifecycle</span> <span>View object lifecycle</span>

44
web/src/views/search/SearchView.tsx
View File

@ -1,7 +1,6 @@
import SearchThumbnail from "@/components/card/SearchThumbnail"; import SearchThumbnail from "@/components/card/SearchThumbnail";
import SearchFilterGroup from "@/components/filter/SearchFilterGroup"; import SearchFilterGroup from "@/components/filter/SearchFilterGroup";
import ActivityIndicator from "@/components/indicators/activity-indicator"; import ActivityIndicator from "@/components/indicators/activity-indicator";
import Chip from "@/components/indicators/Chip";
import SearchDetailDialog from "@/components/overlay/detail/SearchDetailDialog"; import SearchDetailDialog from "@/components/overlay/detail/SearchDetailDialog";
import { Toaster } from "@/components/ui/sonner"; import { Toaster } from "@/components/ui/sonner";
import { import {
@ -14,7 +13,7 @@ import { FrigateConfig } from "@/types/frigateConfig";
import { SearchFilter, SearchResult, SearchSource } from "@/types/search"; import { SearchFilter, SearchResult, SearchSource } from "@/types/search";
import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { isDesktop, isMobileOnly } from "react-device-detect"; import { isDesktop, isMobileOnly } from "react-device-detect";
import { LuColumns, LuImage, LuSearchX, LuText } from "react-icons/lu"; import { LuColumns, LuSearchX } from "react-icons/lu";
import useSWR from "swr"; import useSWR from "swr";
import ExploreView from "../explore/ExploreView"; import ExploreView from "../explore/ExploreView";
import useKeyboardListener, { import useKeyboardListener, {
@ -25,7 +24,6 @@ import InputWithTags from "@/components/input/InputWithTags";
import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area"; import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
import { isEqual } from "lodash"; import { isEqual } from "lodash";
import { formatDateToLocaleString } from "@/utils/dateUtil"; import { formatDateToLocaleString } from "@/utils/dateUtil";
import { TooltipPortal } from "@radix-ui/react-tooltip";
import { Slider } from "@/components/ui/slider"; import { Slider } from "@/components/ui/slider";
import { import {
Popover, Popover,
@ -192,21 +190,6 @@ export default function SearchView({
} }
}, [searchResults, searchDetail]); }, [searchResults, searchDetail]);
// confidence score
const zScoreToConfidence = (score: number) => {
// Normalizing is not needed for similarity searches
// Sigmoid function for normalized: 1 / (1 + e^x)
// Cosine for similarity
if (searchFilter) {
const notNormalized = searchFilter?.search_type?.includes("similarity");
const confidence = notNormalized ? 1 - score : 1 / (1 + Math.exp(score));
return Math.round(confidence * 100);
}
};
const hasExistingSearch = useMemo( const hasExistingSearch = useMemo(
() => searchResults != undefined || searchFilter != undefined, () => searchResults != undefined || searchFilter != undefined,
[searchResults, searchFilter], [searchResults, searchFilter],
@ -400,31 +383,6 @@ export default function SearchView({
searchResult={value} searchResult={value}
onClick={() => onSelectSearch(value, index)} onClick={() => onSelectSearch(value, index)}
/> />
{(searchTerm ||
searchFilter?.search_type?.includes("similarity")) && (
<div className={cn("absolute right-2 top-2 z-40")}>
<Tooltip>
<TooltipTrigger>
<Chip
className={`flex select-none items-center justify-between space-x-1 bg-gray-500 bg-gradient-to-br from-gray-400 to-gray-500 text-xs capitalize text-white`}
>
{value.search_source == "thumbnail" ? (
<LuImage className="mr-1 size-3" />
) : (
<LuText className="mr-1 size-3" />
)}
{zScoreToConfidence(value.search_distance)}%
</Chip>
</TooltipTrigger>
<TooltipPortal>
<TooltipContent>
Matched {value.search_source} at{" "}
{zScoreToConfidence(value.search_distance)}%
</TooltipContent>
</TooltipPortal>
</Tooltip>
</div>
)}
</div> </div>
<div <div
className={`review-item-ring pointer-events-none absolute inset-0 z-10 size-full rounded-lg outline outline-[3px] -outline-offset-[2.8px] ${selected ? `shadow-selected outline-selected` : "outline-transparent duration-500"}`} className={`review-item-ring pointer-events-none absolute inset-0 z-10 size-full rounded-lg outline outline-[3px] -outline-offset-[2.8px] ${selected ? `shadow-selected outline-selected` : "outline-transparent duration-500"}`}