fifty-shades-of-bully/src/pages/components/playVideo.jsx
NekoVari 4d22f2ca0b
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
make video can change position and js handle select character
2025-05-03 00:18:12 +07:00

30 lines
954 B
JavaScript

import '../../css/video.css';
function PlayVideo({ src = "hallway_MMM.mp4" ,side = "middle", onVideoReady }) {
const urlSource = `${import.meta.env.VITE_ASSETS_URL}/${src}`;
return (
<div className={`video-container ${side}`}>
<video
autoPlay
muted
controls="none"
playsInline
loop
pointerEvents="none"
onCanPlayThrough={(e) => {
e.target.play();
console.log("Video is ready and played");
if (onVideoReady) {
onVideoReady(); // Call the callback to notify that the video is ready
}
}}
>
<source src={urlSource} type="video/mp4" />
Your browser does not support the video tag.
</video>
</div>
);
}
export default PlayVideo;