lingdocs
/
pashto-grammar
mirror of https://github.com/lingdocs/pashto-grammar.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

video player offline message

This commit is contained in:
lingdocs 2022-07-20 14:54:45 -05:00
parent 7e6825b291
commit 47cfead1bc
1 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/VideoPlayer.tsx
View File

@ -1,6 +1,14 @@
import { useState } from "react";
import ReactPlayer from "react-player"; import ReactPlayer from "react-player";
function VideoPlayer(props: { url: string }) { function VideoPlayer(props: { url: string }) {
const [errored, setErrored] = useState(false);
if (errored) {
return <div className="my-4 text-center">
<div>Offline - Video Not Available</div>
<button className="btn btn-light mt-4 mb-4" onClick={() => setErrored(false)}>RETRY</button>
</div>;
}
return <div className="player-wrapper" style={{ position: "relative", paddingBottom: "56.25%", marginBottom: "2rem" }}> return <div className="player-wrapper" style={{ position: "relative", paddingBottom: "56.25%", marginBottom: "2rem" }}>
<ReactPlayer <ReactPlayer
url={props.url} url={props.url}
@ -12,8 +20,10 @@ function VideoPlayer(props: { url: string }) {
top: 0, top: 0,
left: 0, left: 0,
}} }}
onError={() => setErrored(true)}
/> />
</div>; </div>
} }
export default VideoPlayer; export default VideoPlayer;