Qortal/q-tube
3
0
Fork 1
mirror of https://github.com/Qortal/q-tube.git synced 2025-02-11 17:55:51 +00:00
Code Issues Projects Releases Wiki Activity

Fixed bug that causes VideoPlayer.tsx to start playing in a state that requires 2 pause commands for the video to actually pause.

Browse Source
This commit is contained in:
Qortal Dev 2024-09-10 21:15:24 -06:00
parent 24d62194bc
commit f26d71c0eb
1 changed files with 15 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
src/components/common/VideoPlayer/VideoPlayer.tsx
View File

@ -191,7 +191,7 @@ export const VideoPlayer = React.forwardRef<refType, VideoPlayerProps>(
if (autoPlay && identifier) {
setStartPlay(true);
setPlaying(true);
togglePlay(undefined, true);
togglePlay(true);
}
}, [autoPlay, startPlay, identifier]);
@ -216,7 +216,7 @@ export const VideoPlayer = React.forwardRef<refType, VideoPlayerProps>(
const toggleRef = useRef<any>(null);
const { downloadVideo } = useContext(MyContext);
const togglePlay = async (event?: any, isPlay?: boolean) => {
const togglePlay = async (isPlay?: boolean) => {
if (!videoRef.current) return;
setStartPlay(true);
@ -230,16 +230,12 @@ export const VideoPlayer = React.forwardRef<refType, VideoPlayerProps>(
});
getSrc();
}
if (playing && !isPlay) {
videoRef.current.pause();
} else {
await videoRef.current.play();
}
if (isPlay) {
setPlaying(true);
} else {
setPlaying(!playing);
}
if (isPlay) setPlaying(true);
else setPlaying(prevState => !prevState);
if (playing && !isPlay) videoRef.current.pause();
else await videoRef.current.play();
};
const onVolumeChange = (_: any, value: number | number[]) => {
@ -475,20 +471,15 @@ export const VideoPlayer = React.forwardRef<refType, VideoPlayerProps>(
videoRef.current.src = src;
videoRef.current.load();
videoRef.current.currentTime = currentTime;
if (playing) {
await videoRef.current.play();
}
if (playing) await videoRef.current.play();
setPlaying(true);
};
const refetchInInterval = () => {
try {
const interval = setInterval(() => {
if (status?.current === "DOWNLOADED") {
refetch();
}
if (status?.current === "READY") {
clearInterval(interval);
}
if (status?.current === "DOWNLOADED") refetch();
if (status?.current === "READY") clearInterval(interval);
}, 7500);
} catch (error) {
console.log(error);
@ -830,7 +821,7 @@ export const VideoPlayer = React.forwardRef<refType, VideoPlayerProps>(
poster={!startPlay ? poster : ""}
onTimeUpdate={updateProgress}
autoPlay={autoplay}
onClick={togglePlay}
onClick={() => togglePlay()}
onEnded={handleEnded}
// onLoadedMetadata={handleLoadedMetadata}
onCanPlay={handleCanPlay}
@ -861,7 +852,7 @@ export const VideoPlayer = React.forwardRef<refType, VideoPlayerProps>(
sx={{
color: "rgba(255, 255, 255, 0.7)",
}}
onClick={togglePlay}
onClick={() => togglePlay()}
>
{playing ? <Pause /> : <PlayArrow />}
</IconButton>
@ -935,7 +926,7 @@ export const VideoPlayer = React.forwardRef<refType, VideoPlayerProps>(
sx={{
color: "rgba(255, 255, 255, 0.7)",
}}
onClick={togglePlay}
onClick={() => togglePlay()}
>
{playing ? <Pause /> : <PlayArrow />}
</IconButton>