I have a strange bug with Video.Js When I am skipping video with my skip controls I do get such strange bug:
My skip forward looks like this:
playerRef.current?.currentTime(playerRef.current?.currentTime() + 10);
REst of my code for player init is based on Video.js docs
const videoRef = useRef<HTMLVideoElement | null>(null);
const playerRef = useRef<VideoJsPlayer | null>(null);
const [pause, setPause] = useState(playerRef.current?.paused() ?? true);
useEffect(() => {
// make sure Video.js player is only initialized once
if (!playerRef.current) {
const videoElement = videoRef.current;
if (!videoElement) return;
const player = (playerRef.current = videojs(videoElement, options, () => {
/* video.js pause play control */
player.on('pause', function () {
setPause(true);
playerPause && playerPause(true);
});
player.on('play', function () {
setPause(false);
playerPause && playerPause(false);
playerLive && player.liveTracker.seekToLiveEdge();
});
player.on('ended', function () {
setPause(true);
playerPause && playerPause(true);
});
}));
} else {
}
}, [options]);
// Dispose the Video.js player when the functional component unmounts
useEffect(() => {
return () => {
if (playerRef.current) {
playerRef.current.dispose();
playerRef.current = null;
}
};
}, []);
I was trying to check how much is remainig and than if it is lower than 10s, skip only remaing time, but still this did not helpe