mirror of
https://github.com/blakeblackshear/frigate.git
synced 2026-06-25 13:51:52 +03:00
Handle back seeking going to previous clip
This commit is contained in:
parent
d036061e3f
commit
4b7bc4fe13
@ -47,6 +47,7 @@ type HlsVideoPlayerProps = {
|
|||||||
frigateControls?: boolean;
|
frigateControls?: boolean;
|
||||||
inpointOffset?: number;
|
inpointOffset?: number;
|
||||||
onClipEnded?: (currentTime: number) => void;
|
onClipEnded?: (currentTime: number) => void;
|
||||||
|
onClipPrevious?: (diff: number) => void;
|
||||||
onPlayerLoaded?: () => void;
|
onPlayerLoaded?: () => void;
|
||||||
onTimeUpdate?: (time: number) => void;
|
onTimeUpdate?: (time: number) => void;
|
||||||
onPlaying?: () => void;
|
onPlaying?: () => void;
|
||||||
@ -74,6 +75,7 @@ export default function HlsVideoPlayer({
|
|||||||
frigateControls = true,
|
frigateControls = true,
|
||||||
inpointOffset = 0,
|
inpointOffset = 0,
|
||||||
onClipEnded,
|
onClipEnded,
|
||||||
|
onClipPrevious,
|
||||||
onPlayerLoaded,
|
onPlayerLoaded,
|
||||||
onTimeUpdate,
|
onTimeUpdate,
|
||||||
onPlaying,
|
onPlaying,
|
||||||
@ -339,11 +341,17 @@ export default function HlsVideoPlayer({
|
|||||||
onSeek={(diff) => {
|
onSeek={(diff) => {
|
||||||
const currentTime = videoRef.current?.currentTime;
|
const currentTime = videoRef.current?.currentTime;
|
||||||
|
|
||||||
if (!videoRef.current || !currentTime) {
|
if (!videoRef.current || currentTime == undefined) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
videoRef.current.currentTime = Math.max(0, currentTime + diff);
|
const newTime = currentTime + diff;
|
||||||
|
|
||||||
|
if (newTime < 0 && onClipPrevious) {
|
||||||
|
onClipPrevious(diff);
|
||||||
|
} else {
|
||||||
|
videoRef.current.currentTime = Math.max(0, newTime);
|
||||||
|
}
|
||||||
}}
|
}}
|
||||||
onSetPlaybackRate={(rate) => {
|
onSetPlaybackRate={(rate) => {
|
||||||
setPlaybackRate(rate, true);
|
setPlaybackRate(rate, true);
|
||||||
|
|||||||
@ -49,6 +49,7 @@ type DynamicVideoPlayerProps = {
|
|||||||
onControllerReady: (controller: DynamicVideoController) => void;
|
onControllerReady: (controller: DynamicVideoController) => void;
|
||||||
onTimestampUpdate?: (timestamp: number) => void;
|
onTimestampUpdate?: (timestamp: number) => void;
|
||||||
onClipEnded?: () => void;
|
onClipEnded?: () => void;
|
||||||
|
onClipPrevious?: (diff: number) => void;
|
||||||
onSeekToTime?: (timestamp: number, play?: boolean) => void;
|
onSeekToTime?: (timestamp: number, play?: boolean) => void;
|
||||||
setFullResolution: React.Dispatch<React.SetStateAction<VideoResolutionType>>;
|
setFullResolution: React.Dispatch<React.SetStateAction<VideoResolutionType>>;
|
||||||
toggleFullscreen: () => void;
|
toggleFullscreen: () => void;
|
||||||
@ -68,6 +69,7 @@ export default function DynamicVideoPlayer({
|
|||||||
onControllerReady,
|
onControllerReady,
|
||||||
onTimestampUpdate,
|
onTimestampUpdate,
|
||||||
onClipEnded,
|
onClipEnded,
|
||||||
|
onClipPrevious,
|
||||||
onSeekToTime,
|
onSeekToTime,
|
||||||
setFullResolution,
|
setFullResolution,
|
||||||
toggleFullscreen,
|
toggleFullscreen,
|
||||||
@ -343,6 +345,7 @@ export default function DynamicVideoPlayer({
|
|||||||
onTimeUpdate={onTimeUpdate}
|
onTimeUpdate={onTimeUpdate}
|
||||||
onPlayerLoaded={onPlayerLoaded}
|
onPlayerLoaded={onPlayerLoaded}
|
||||||
onClipEnded={onValidateClipEnd}
|
onClipEnded={onValidateClipEnd}
|
||||||
|
onClipPrevious={onClipPrevious}
|
||||||
onSeekToTime={(timestamp, play) => {
|
onSeekToTime={(timestamp, play) => {
|
||||||
if (onSeekToTime) {
|
if (onSeekToTime) {
|
||||||
onSeekToTime(timestamp, play);
|
onSeekToTime(timestamp, play);
|
||||||
|
|||||||
@ -336,6 +336,16 @@ export function RecordingView({
|
|||||||
[currentTimeRange, updateSelectedSegment],
|
[currentTimeRange, updateSelectedSegment],
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const onClipPrevious = useCallback(
|
||||||
|
(diff: number) => {
|
||||||
|
manuallySetCurrentTime(
|
||||||
|
currentTime + diff,
|
||||||
|
mainControllerRef.current?.isPlaying() ?? false,
|
||||||
|
);
|
||||||
|
},
|
||||||
|
[currentTime, manuallySetCurrentTime],
|
||||||
|
);
|
||||||
|
|
||||||
const onShareReviewLink = useCallback(
|
const onShareReviewLink = useCallback(
|
||||||
(timestamp: number) => {
|
(timestamp: number) => {
|
||||||
const reviewUrl = createRecordingReviewUrl(location.pathname, {
|
const reviewUrl = createRecordingReviewUrl(location.pathname, {
|
||||||
@ -902,6 +912,7 @@ export function RecordingView({
|
|||||||
);
|
);
|
||||||
}}
|
}}
|
||||||
onClipEnded={onClipEnded}
|
onClipEnded={onClipEnded}
|
||||||
|
onClipPrevious={onClipPrevious}
|
||||||
onSeekToTime={manuallySetCurrentTime}
|
onSeekToTime={manuallySetCurrentTime}
|
||||||
onControllerReady={(controller) => {
|
onControllerReady={(controller) => {
|
||||||
mainControllerRef.current = controller;
|
mainControllerRef.current = controller;
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user