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

switched to date-fns functions for formatting

Browse Source
This commit is contained in:
banthungprong 2022-10-21 07:04:09 +02:00
parent 107b0ad9b2
commit df64146d05
1 changed files with 13 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
web/src/routes/Events.jsx
View File

@ -22,6 +22,11 @@ import CalendarIcon from '../icons/Calendar';
import Calendar from '../components/Calendar'; import Calendar from '../components/Calendar';
import Button from '../components/Button'; import Button from '../components/Button';
import Dialog from '../components/Dialog'; import Dialog from '../components/Dialog';
import {
fromUnixTime,
intervalToDuration,
formatDuration,
} from 'date-fns';
const API_LIMIT = 25; const API_LIMIT = 25;
@ -37,19 +42,14 @@ const monthsAgo = (num) => {
return new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime() / 1000; return new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime() / 1000;
}; };
const clipLength = (num) => { const clipLength = (start_time, end_time) => {
let totalSeconds = num; const start = fromUnixTime(start_time);
let hours = Math.floor(totalSeconds / 3600); const end = fromUnixTime(end_time);
totalSeconds %= 3600; let duration = 'In Progress';
let minutes = Math.floor(totalSeconds / 60); if (end_time) {
let seconds = (totalSeconds % 60).toFixed(0); duration = formatDuration(intervalToDuration({ start, end }));
let length=`${hours} Hours ${minutes} Minutes ${seconds} Seconds`
if (hours == 0 && minutes == 0) {
length=`${seconds} Seconds`
} else {
length=`${minutes} Minutes ${seconds} Seconds`
} }
return length; return duration;
} }
export default function Events({ path, ...props }) { export default function Events({ path, ...props }) {
@ -474,7 +474,7 @@ export default function Events({ path, ...props }) {
</div> </div>
<div className="text-sm"> <div className="text-sm">
{new Date(event.start_time * 1000).toLocaleDateString()}{' '} {new Date(event.start_time * 1000).toLocaleDateString()}{' '}
{new Date(event.start_time * 1000).toLocaleTimeString()} <span className="text-red-300">({clipLength(event.end_time - event.start_time)})</span> {new Date(event.start_time * 1000).toLocaleTimeString()} ({clipLength(event.end_time, event.start_time)})
</div> </div>
<div className="capitalize text-sm flex align-center mt-1"> <div className="capitalize text-sm flex align-center mt-1">
<Camera className="h-5 w-5 mr-2 inline" /> <Camera className="h-5 w-5 mr-2 inline" />