You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

80 lines
2.1 KiB

import React, { useEffect, useRef, useState } from "react";
import JoLPlayer from "jol-player";
function Video({ fileIds, posterId, autoPlay }) {
const videoRef = useRef(null);
const [flag, setFlag] = useState(false);
// useEffect(() => {
// window.addEventListener("scroll", () => {
// if (window.scrollY > 500) {
// if (!localStorage.getItem("joiRect")) {
// const jolRect = document
// .getElementById("video-joi")
// .getBoundingClientRect();
// localStorage.setItem("joiRect", JSON.stringify(jolRect));
// }
// }
// });
// }, []);
// const videoMethod = (status) => {
// if (status === "play") {
// videoRef.current.play();
// setFlag(() => true);
// }
// };
// useEffect(() => {
// console.log(`videoRef.current`, videoRef.current);
// }, [videoRef.current]);
// useEffect(() => {
// if (window.scrollY > 3 * window.innerHeight) {
// if (autoPlay && !flag) {
// videoMethod("play");
// }
// }
// }, [autoPlay]);
return (
<div
style={{
direction: "ltr",
textAlign: "left",
marginBottom: 10,
zIndex: 10,
}}
id="video-joi"
>
<JoLPlayer
ref={videoRef}
option={{
videoSrc: `https://dnvn.ir/api/v1/file/${fileIds}`,
width: "100%",
height: window.innerWidth > 1024 ? window.innerHeight - 200 : window.innerHeight / 3.6,
theme: "#4dd35b",
language: "en",
isShowMultiple: window.innerWidth > 700,
hideMouseTime: 10000,
isShowPicture: true,
isShowFullScreen: false,
isShowSet: false,
isShowScreenshot: window.innerWidth > 700,
// isShowSet : false,
isShowPauseButton: false,
poster: `https://dnvn.ir/api/v1/file/${posterId}`,
quality: [
{
name: "SD",
url: `https://dnvn.ir/api/v1/file/${fileIds}`,
},
],
isShowWebFullScreen: false,
// auto : true
}}
/>
</div>
);
}
export default Video;