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

More timezone fixes

Browse Source
This commit is contained in:
Nicolas Mowen 2024-11-04 06:32:53 -07:00
parent 59d240aa69
commit 26764501c8
2 changed files with 28 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
web/src/components/timeline/segment-metadata.tsx
View File

@ -42,22 +42,22 @@ export function MinimapBounds({
className="pointer-events-none absolute inset-0 -bottom-7 z-20 flex w-full select-none scroll-mt-8 items-center justify-center text-center text-[10px] font-medium text-primary"
ref={firstMinimapSegmentRef}
>
{new Date(alignedMinimapStartTime * 1000).toLocaleTimeString([], {
hour12: config?.ui.time_format != "24hour",
hour: "2-digit",
minute: "2-digit",
...(!dense && { month: "short", day: "2-digit" }),
{formatUnixTimestampToDateTime(alignedMinimapStartTime, {
timezone: config?.ui.timezone,
strftime_fmt: !dense
? `%b %d ${config?.ui.time_format == "24hour" ? "%H:%M" : "%I:%M %p"}`
: `${config?.ui.time_format == "24hour" ? "%H:%M" : "%I:%M %p"}`,
})}
</div>
)}
{isLastSegmentInMinimap && (
<div className="pointer-events-none absolute inset-0 -top-3 z-20 flex w-full select-none items-center justify-center text-center text-[10px] font-medium text-primary">
{new Date(alignedMinimapEndTime * 1000).toLocaleTimeString([], {
hour12: config?.ui.time_format != "24hour",
hour: "2-digit",
minute: "2-digit",
...(!dense && { month: "short", day: "2-digit" }),
{formatUnixTimestampToDateTime(alignedMinimapEndTime, {
timezone: config?.ui.timezone,
strftime_fmt: !dense
? `%b %d ${config?.ui.time_format == "24hour" ? "%H:%M" : "%I:%M %p"}`
: `${config?.ui.time_format == "24hour" ? "%H:%M" : "%I:%M %p"}`,
})}
</div>
)}
@ -106,8 +106,7 @@ export function Timestamp({
return formatUnixTimestampToDateTime(timestamp.getTime() / 1000, {
timezone: config?.ui.timezone,
strftime_fmt:
config?.ui.time_format == "24hour" ? "%d %b %H:%M" : "%I:%M %p",
strftime_fmt: config?.ui.time_format == "24hour" ? "%H:%M" : "%I:%M %p",
});
}, [config, timestamp, timestampSpread]);

28
web/src/hooks/use-draggable-element.ts
View File

@ -10,6 +10,7 @@ import scrollIntoView from "scroll-into-view-if-needed";
import { useTimelineUtils } from "./use-timeline-utils";
import { FrigateConfig } from "@/types/frigateConfig";
import useSWR from "swr";
import { formatUnixTimestampToDateTime } from "@/utils/dateUtil";
type DraggableElementProps = {
contentRef: React.RefObject<HTMLElement>;
@ -168,6 +169,19 @@ function useDraggableElement({
[segmentDuration, timelineStartAligned, segmentHeight],
);
const getFormattedTimestamp = useCallback(
(segmentStartTime: number) => {
return formatUnixTimestampToDateTime(segmentStartTime, {
timezone: config?.ui.timezone,
strftime_fmt:
config?.ui.time_format == "24hour"
? `%H:%M${segmentDuration < 60 && !dense ? ":%S" : ""}`
: `%I:%M${segmentDuration < 60 && !dense ? ":%S" : ""} %p`,
});
},
[config, dense, segmentDuration],
);
const updateDraggableElementPosition = useCallback(
(
newElementPosition: number,
@ -184,14 +198,8 @@ function useDraggableElement({
}
if (draggableElementTimeRef.current) {
draggableElementTimeRef.current.textContent = new Date(
segmentStartTime * 1000,
).toLocaleTimeString([], {
hour12: config?.ui.time_format != "24hour",
hour: "2-digit",
minute: "2-digit",
...(segmentDuration < 60 && !dense && { second: "2-digit" }),
});
draggableElementTimeRef.current.textContent =
getFormattedTimestamp(segmentStartTime);
if (scrollTimeline && !userInteracting) {
scrollIntoView(thumb, {
block: "center",
@ -208,13 +216,11 @@ function useDraggableElement({
}
},
[
segmentDuration,
draggableElementTimeRef,
draggableElementRef,
setDraggableElementTime,
setDraggableElementPosition,
dense,
config,
getFormattedTimestamp,
userInteracting,
],
);