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

add clarifying message and docs link around motion masks

Browse Source
This commit is contained in:
Josh Hawkins 2024-05-20 12:23:12 -05:00
parent 6e39d55dd3
commit 637cca078c
1 changed files with 18 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
web/src/components/settings/MotionMaskEditPane.tsx
View File

@ -20,6 +20,8 @@ import axios from "axios";
import { toast } from "sonner"; import { toast } from "sonner";
import { Toaster } from "../ui/sonner"; import { Toaster } from "../ui/sonner";
import ActivityIndicator from "../indicators/activity-indicator"; import ActivityIndicator from "../indicators/activity-indicator";
import { Link } from "react-router-dom";
import { LuExternalLink } from "react-icons/lu";
type MotionMaskEditPaneProps = { type MotionMaskEditPaneProps = {
polygons?: Polygon[]; polygons?: Polygon[];
@ -187,12 +189,25 @@ export default function MotionMaskEditPane({
<Heading as="h3" className="my-2"> <Heading as="h3" className="my-2">
{polygon.name.length ? "Edit" : "New"} Motion Mask {polygon.name.length ? "Edit" : "New"} Motion Mask
</Heading> </Heading>
<div className="my-2 text-sm text-muted-foreground"> <div className="my-3 space-y-3 text-sm text-muted-foreground">
<p> <p>
Motion masks are used to prevent unwanted types of motion from Motion masks are used to prevent unwanted types of motion from
triggering detection. Over masking will make it more difficult for triggering detection (example: tree branches, camera timestamps).
objects to be tracked. Motion masks should be used <em>very sparingly</em>, over-masking will
make it more difficult for objects to be tracked.
</p> </p>
<div className="flex items-center text-primary">
<Link
to="https://docs.frigate.video/configuration/masks/"
target="_blank"
rel="noopener noreferrer"
className="inline"
>
Read the documentation{" "}
<LuExternalLink className="ml-2 inline-flex size-3" />
</Link>
</div>
</div> </div>
<Separator className="my-3 bg-secondary" /> <Separator className="my-3 bg-secondary" />
{polygons && activePolygonIndex !== undefined && ( {polygons && activePolygonIndex !== undefined && (