3
0
mirror of https://github.com/Qortal/q-tube.git synced 2025-02-11 17:55:51 +00:00

Fixed bug causing video to play after Saving to Disk.

Fixed lint errors in FileElement.tsx
This commit is contained in:
Qortal Dev 2024-10-18 13:12:34 -06:00
parent db490ec6b1
commit 78a6bcfdde
5 changed files with 50 additions and 8 deletions

42
package-lock.json generated
View File

@ -13,6 +13,7 @@
"@mui/icons-material": "^5.11.11",
"@mui/lab": "^5.0.0-alpha.163",
"@mui/material": "^5.11.13",
"@preact/signals-react": "^2.2.0",
"@reduxjs/toolkit": "^1.9.3",
"compressorjs": "^1.2.1",
"dompurify": "^3.0.6",
@ -1463,6 +1464,33 @@
"url": "https://opencollective.com/popperjs"
}
},
"node_modules/@preact/signals-core": {
"version": "1.8.0",
"resolved": "https://registry.npmjs.org/@preact/signals-core/-/signals-core-1.8.0.tgz",
"integrity": "sha512-OBvUsRZqNmjzCZXWLxkZfhcgT+Fk8DDcT/8vD6a1xhDemodyy87UJRJfASMuSD8FaAIeGgGm85ydXhm7lr4fyA==",
"license": "MIT",
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/preact"
}
},
"node_modules/@preact/signals-react": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/@preact/signals-react/-/signals-react-2.2.0.tgz",
"integrity": "sha512-EPYlhXqqcOUxz2gTQGt4rtK6X7Jr04517DcJVZ4I5a7Gxy39haK24uFeVWtiU/tnEReRFcxpQN6poYra1jf68A==",
"license": "MIT",
"dependencies": {
"@preact/signals-core": "^1.7.0",
"use-sync-external-store": "^1.2.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/preact"
},
"peerDependencies": {
"react": "^16.14.0 || 17.x || 18.x"
}
},
"node_modules/@reduxjs/toolkit": {
"version": "1.9.5",
"resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.5.tgz",
@ -5528,6 +5556,20 @@
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
"integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A=="
},
"@preact/signals-core": {
"version": "1.8.0",
"resolved": "https://registry.npmjs.org/@preact/signals-core/-/signals-core-1.8.0.tgz",
"integrity": "sha512-OBvUsRZqNmjzCZXWLxkZfhcgT+Fk8DDcT/8vD6a1xhDemodyy87UJRJfASMuSD8FaAIeGgGm85ydXhm7lr4fyA=="
},
"@preact/signals-react": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/@preact/signals-react/-/signals-react-2.2.0.tgz",
"integrity": "sha512-EPYlhXqqcOUxz2gTQGt4rtK6X7Jr04517DcJVZ4I5a7Gxy39haK24uFeVWtiU/tnEReRFcxpQN6poYra1jf68A==",
"requires": {
"@preact/signals-core": "^1.7.0",
"use-sync-external-store": "^1.2.0"
}
},
"@reduxjs/toolkit": {
"version": "1.9.5",
"resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.5.tgz",

View File

@ -15,6 +15,7 @@
"@mui/icons-material": "^5.11.11",
"@mui/lab": "^5.0.0-alpha.163",
"@mui/material": "^5.11.13",
"@preact/signals-react": "^2.2.0",
"@reduxjs/toolkit": "^1.9.3",
"compressorjs": "^1.2.1",
"dompurify": "^3.0.6",

View File

@ -2,7 +2,6 @@ import { Box, CircularProgress, Typography } from "@mui/material";
import { setVideoPlaying } from "../../../../state/features/globalSlice.ts";
import { useDispatch } from "react-redux";
import { PlayArrow } from "@mui/icons-material";
import { playing } from "../VideoPlayer-State.ts";
export interface LoadingVideoProps {
isLoading: boolean;
@ -103,7 +102,7 @@ export const LoadingVideo = ({
onClick={() => {
if (from === "create") return;
dispatch(setVideoPlaying(null));
playing.value = true; // makes autoplay after video loaded work properly
togglePlay();
}}
sx={{

View File

@ -147,8 +147,8 @@ export const useVideoControlsState = (
};
const togglePlay = async () => {
// console.log("in toggleplay playing is: ", playing.value);
if (!videoRef.current) return;
if (!src || resourceStatus?.status !== "READY") {
const el = document.getElementById("videoWrapper");
if (el) {
@ -159,11 +159,12 @@ export const useVideoControlsState = (
});
getSrc();
}
startPlay.value = true;
const pause = playing.value;
playing.value = !playing.value;
if (playing.value) videoRef.current.pause();
if (pause) videoRef.current.pause();
else await videoRef.current.play();
};
@ -178,7 +179,6 @@ export const useVideoControlsState = (
useEffect(() => {
if (autoPlay && identifier) {
console.log("autoplay useEffect");
togglePlay();
}
}, [autoPlay, identifier]);

View File

@ -76,7 +76,7 @@ export const VideoControls = ({
}}
onClick={() => togglePlay()}
>
{!playing.value ? <Pause /> : <PlayArrow />}
{playing.value ? <Pause /> : <PlayArrow />}
</IconButton>
<IconButton
sx={{
@ -150,7 +150,7 @@ export const VideoControls = ({
}}
onClick={() => togglePlay()}
>
{!playing.value ? <Pause /> : <PlayArrow />}
{playing.value ? <Pause /> : <PlayArrow />}
</IconButton>
<IconButton
sx={{