Fix HLS jumping to end

This commit is contained in:
Nicolas Mowen 2025-11-20 14:21:01 -07:00
parent 213a1fbd00
commit 130c6ab7ff
3 changed files with 17 additions and 21 deletions

View File

@ -135,6 +135,23 @@ export default function HlsVideoPlayer({
if (!useHlsCompat) { if (!useHlsCompat) {
videoRef.current.src = currentSource.playlist; videoRef.current.src = currentSource.playlist;
videoRef.current.load(); videoRef.current.load();
// For native HLS, we need to seek after metadata loads since startPosition isn't supported
if (currentSource.startPosition !== undefined) {
videoRef.current.addEventListener(
"loadedmetadata",
() => {
if (videoRef.current && currentSource.startPosition !== undefined) {
// Clamp startPosition to video duration to prevent seeking beyond the end
const clampedPosition = Math.min(
currentSource.startPosition,
videoRef.current.duration || Infinity,
);
videoRef.current.currentTime = clampedPosition;
}
},
{ once: true },
);
}
return; return;
} }

View File

@ -113,8 +113,6 @@ export class DynamicVideoController {
} else { } else {
this.playerController.pause(); this.playerController.pause();
} }
} else {
// no op
} }
} }

View File

@ -111,7 +111,6 @@ export default function DynamicVideoPlayer({
const [loadingTimeout, setLoadingTimeout] = useState<NodeJS.Timeout>(); const [loadingTimeout, setLoadingTimeout] = useState<NodeJS.Timeout>();
const [source, setSource] = useState<HlsSource>({ const [source, setSource] = useState<HlsSource>({
playlist: `${apiHost}vod/${camera}/start/${timeRange.after}/end/${timeRange.before}/master.m3u8`, playlist: `${apiHost}vod/${camera}/start/${timeRange.after}/end/${timeRange.before}/master.m3u8`,
startPosition: startTimestamp ? timeRange.after - startTimestamp : 0,
}); });
// start at correct time // start at correct time
@ -196,26 +195,8 @@ export default function DynamicVideoPlayer({
playerRef.current.autoplay = !isScrubbing; playerRef.current.autoplay = !isScrubbing;
} }
let startPosition = undefined;
if (startTimestamp) {
const inpointOffset = calculateInpointOffset(
recordingParams.after,
(recordings || [])[0],
);
const idealStartPosition = Math.max(
0,
startTimestamp - timeRange.after - inpointOffset,
);
if (idealStartPosition >= recordings[0].start_time - timeRange.after) {
startPosition = idealStartPosition;
}
}
setSource({ setSource({
playlist: `${apiHost}vod/${camera}/start/${recordingParams.after}/end/${recordingParams.before}/master.m3u8`, playlist: `${apiHost}vod/${camera}/start/${recordingParams.after}/end/${recordingParams.before}/master.m3u8`,
startPosition,
}); });
setLoadingTimeout(setTimeout(() => setIsLoading(true), 1000)); setLoadingTimeout(setTimeout(() => setIsLoading(true), 1000));