When video is playing, save position intermittently (#1013)
This commit is contained in:
commit
1510c8cf74
2 changed files with 30 additions and 0 deletions
|
@ -27,9 +27,11 @@ import { getAllIds } from 'util/buildHomepage';
|
|||
import type { HomepageCat } from 'util/buildHomepage';
|
||||
import debounce from 'util/debounce';
|
||||
import { formatLbryUrlForWeb, generateListSearchUrlParams } from 'util/url';
|
||||
import useInterval from 'effects/use-interval';
|
||||
|
||||
// const PLAY_TIMEOUT_ERROR = 'play_timeout_error';
|
||||
// const PLAY_TIMEOUT_LIMIT = 2000;
|
||||
const PLAY_POSITION_SAVE_INTERVAL_MS = 15000;
|
||||
|
||||
type Props = {
|
||||
position: number,
|
||||
|
@ -137,6 +139,7 @@ function VideoViewer(props: Props) {
|
|||
const [videoNode, setVideoNode] = useState();
|
||||
const [localAutoplayNext, setLocalAutoplayNext] = useState(autoplayNext);
|
||||
const isFirstRender = React.useRef(true);
|
||||
const playerRef = React.useRef(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (isFirstRender.current) {
|
||||
|
@ -146,6 +149,12 @@ function VideoViewer(props: Props) {
|
|||
toggleAutoplayNext();
|
||||
}, [localAutoplayNext]);
|
||||
|
||||
useInterval(() => {
|
||||
if (playerRef.current && isPlaying) {
|
||||
handlePosition(playerRef.current);
|
||||
}
|
||||
}, PLAY_POSITION_SAVE_INTERVAL_MS);
|
||||
|
||||
const updateVolumeState = React.useCallback(
|
||||
debounce((volume, muted) => {
|
||||
changeVolume(volume);
|
||||
|
@ -420,6 +429,8 @@ function VideoViewer(props: Props) {
|
|||
if (position) {
|
||||
player.currentTime(position);
|
||||
}
|
||||
|
||||
playerRef.current = player;
|
||||
}, playerReadyDependencyList); // eslint-disable-line
|
||||
|
||||
return (
|
||||
|
|
19
ui/effects/use-interval.js
Normal file
19
ui/effects/use-interval.js
Normal file
|
@ -0,0 +1,19 @@
|
|||
import { useRef, useEffect } from 'react';
|
||||
|
||||
export default function useInterval(callback, delay) {
|
||||
const savedCallback = useRef();
|
||||
|
||||
useEffect(() => {
|
||||
savedCallback.current = callback;
|
||||
}, [callback]);
|
||||
|
||||
useEffect(() => {
|
||||
const tick = () => {
|
||||
savedCallback.current();
|
||||
};
|
||||
if (delay !== null) {
|
||||
const id = setInterval(tick, delay);
|
||||
return () => clearInterval(id);
|
||||
}
|
||||
}, [delay]);
|
||||
}
|
Loading…
Reference in a new issue