blob: 3c2f0173d7fb19becfae744d920fdbf0e99b4ff5 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
|
"use client";
import { useEffect, useState } from "react";
import { Input } from "@nextui-org/react";
const SeriesVideoPlayer = ({ id: id }) => {
const [seasonNumber, setSeasonNumber] = useState("");
const [episodeNumber, setEpisodeNumber] = useState("");
const [videoFrame, setVideoFrame] = useState(<></>);
useEffect(() => {
setVideoFrame(VideoFrameGenerator(1, 1));
}, []);
const VideoFrameGenerator = (sea, epi) => {
return (
<iframe
src={`https://vidsrc.pro/embed/tv/${id}/${sea}/${epi}`}
allowFullScreen
referrerPolicy="origin"
height={720}
className="h-[240px] w-full rounded-md lg:h-[720px]"
></iframe>
);
};
function renderVideoFrame() {
if (seasonNumber === "" || episodeNumber === "") {
alert(
"Make sure that you have entered the episode number and the season number."
);
return;
}
setVideoFrame(VideoFrameGenerator(seasonNumber, episodeNumber));
}
return (
<div>
{videoFrame}
<div className="mt-2 flex w-full items-center gap-2 md:flex-nowrap">
<Input
type="number"
label="Season"
placeholder="Season Number"
isRequired
onChange={(event) => {
setSeasonNumber(event.target.value);
}}
onKeyDown={(event) => {
if (event.key === "Enter" || event.code === "Enter") {
renderVideoFrame();
}
}}
/>
<Input
type="number"
label="Episode"
placeholder="Episode Number"
isRequired
onChange={(event) => {
setEpisodeNumber(event.target.value);
}}
onKeyDown={(event) => {
if (event.key === "Enter" || event.code === "Enter") {
renderVideoFrame();
}
}}
/>
</div>
</div>
);
};
export default SeriesVideoPlayer;
|