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

Add button to link to recordings from camera live view

Browse Source
This commit is contained in:
Nicolas Mowen 2024-04-02 11:50:57 -06:00
parent d1082ec305
commit 16ddd376e3
2 changed files with 41 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/pages/Events.tsx
View File

@ -329,6 +329,7 @@ export default function Events() {
return <ActivityIndicator />; return <ActivityIndicator />;
} }
if (recording) {
if (selectedReviewData) { if (selectedReviewData) {
return ( return (
<RecordingView <RecordingView
@ -343,6 +344,7 @@ export default function Events() {
updateFilter={onUpdateFilter} updateFilter={onUpdateFilter}
/> />
); );
}
} else { } else {
return ( return (
<EventView <EventView

28
web/src/views/live/LiveCameraView.tsx
View File

@ -22,6 +22,7 @@ import { useResizeObserver } from "@/hooks/resize-observer";
import useKeyboardListener from "@/hooks/use-keyboard-listener"; import useKeyboardListener from "@/hooks/use-keyboard-listener";
import { CameraConfig } from "@/types/frigateConfig"; import { CameraConfig } from "@/types/frigateConfig";
import { CameraPtzInfo } from "@/types/ptz"; import { CameraPtzInfo } from "@/types/ptz";
import { RecordingStartingPoint } from "@/types/record";
import React, { import React, {
useCallback, useCallback,
useEffect, useEffect,
@ -50,7 +51,7 @@ import {
} from "react-icons/fa"; } from "react-icons/fa";
import { GiSpeaker, GiSpeakerOff } from "react-icons/gi"; import { GiSpeaker, GiSpeakerOff } from "react-icons/gi";
import { HiViewfinderCircle } from "react-icons/hi2"; import { HiViewfinderCircle } from "react-icons/hi2";
import { IoMdArrowBack } from "react-icons/io"; import { IoMdArrowBack, IoMdArrowDown } from "react-icons/io";
import { import {
LuEar, LuEar,
LuEarOff, LuEarOff,
@ -219,11 +220,11 @@ export default function LiveCameraView({ camera }: LiveCameraViewProps) {
> >
{!fullscreen ? ( {!fullscreen ? (
<Button <Button
className={`rounded-lg ${isMobile ? "ml-2" : "ml-0"}`} className={`flex items-center gap-2.5 rounded-lg ${isMobile ? "ml-2" : "ml-0"}`}
size={isMobile ? "icon" : "sm"} size={isMobile ? "icon" : "sm"}
onClick={() => navigate(-1)} onClick={() => navigate(-1)}
> >
<IoMdArrowBack className="size-5 lg:mr-[10px]" /> <IoMdArrowBack className="size-5" />
{isDesktop && "Back"} {isDesktop && "Back"}
</Button> </Button>
) : ( ) : (
@ -333,6 +334,27 @@ export default function LiveCameraView({ camera }: LiveCameraViewProps) {
/> />
)} )}
</TransformComponent> </TransformComponent>
<div className="flex justify-center items-center">
<Button
className="flex items-center gap-2.5 rounded-lg"
size="sm"
onClick={() => {
navigate("events", {
state: {
severity: "alert",
recording: {
camera: camera.name,
startTime: Date.now() / 1000 - 30,
severity: "alert",
} as RecordingStartingPoint,
},
});
}}
>
<IoMdArrowDown />
{isDesktop && "Recordings"}
</Button>
</div>
</div> </div>
</TransformWrapper> </TransformWrapper>
); );