From 9497598754c5a810974c6040e78c295ff0a4ed6f Mon Sep 17 00:00:00 2001 From: real-zephex Date: Wed, 29 May 2024 01:00:42 +0530 Subject: =?UTF-8?q?=E2=9C=A8=20feat(series):=20rewrite=20series=20page=20a?= =?UTF-8?q?nd=20drop=20manga=20support?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/web-series/components/HomePageModules.jsx | 56 --------- src/app/web-series/components/descriptionTabs.jsx | 129 +++++++++++++++++++++ src/app/web-series/components/search.jsx | 57 +++++++++ src/app/web-series/components/searchBar.jsx | 49 -------- src/app/web-series/components/searchResults.jsx | 35 ------ .../components/seriesSearchFormatter.jsx | 49 ++++++++ src/app/web-series/components/videoPlayer.jsx | 100 +++++++++------- 7 files changed, 290 insertions(+), 185 deletions(-) delete mode 100644 src/app/web-series/components/HomePageModules.jsx create mode 100644 src/app/web-series/components/descriptionTabs.jsx create mode 100644 src/app/web-series/components/search.jsx delete mode 100644 src/app/web-series/components/searchBar.jsx delete mode 100644 src/app/web-series/components/searchResults.jsx create mode 100644 src/app/web-series/components/seriesSearchFormatter.jsx (limited to 'src/app/web-series/components') diff --git a/src/app/web-series/components/HomePageModules.jsx b/src/app/web-series/components/HomePageModules.jsx deleted file mode 100644 index 91d90bf..0000000 --- a/src/app/web-series/components/HomePageModules.jsx +++ /dev/null @@ -1,56 +0,0 @@ -import { POPULAR_SHOWS, TRENDING_SHOWS, TOP_SHOWS } from "./data-fetch"; -import styles from "../styles/pages.module.css"; -import Image from "next/image"; -import Link from "next/link"; -import PreFecthSeriesInfo from "./cacher"; - -const HomepageUtils = async (type) => { - const fetchFunctions = { - popular: POPULAR_SHOWS, - trending: TRENDING_SHOWS, - top: TOP_SHOWS, - }; - - const fetchData = fetchFunctions[type]; - - if (fetchData) { - return await fetchData(); - } else { - return; - } -}; - -const Pages = async ({ type: type }) => { - const data = await HomepageUtils(type); - PreFecthSeriesInfo(data); - return ( -
-

{type} series

-
- {data && - data.results.length > 0 && - data.results.map((item, index) => ( - -
- Series Poster -

{item.name || "Not sure"}

-
- - ))} -
-
- ); -}; - -export default Pages; diff --git a/src/app/web-series/components/descriptionTabs.jsx b/src/app/web-series/components/descriptionTabs.jsx new file mode 100644 index 0000000..ec6a78b --- /dev/null +++ b/src/app/web-series/components/descriptionTabs.jsx @@ -0,0 +1,129 @@ +"use client"; + +import { + Tabs, + Tab, + Card, + CardBody, + Link, + Image, + Chip, +} from "@nextui-org/react"; +import { FiThumbsUp } from "react-icons/fi"; +import { TiStarFullOutline } from "react-icons/ti"; + +import { lexend, atkinson } from "../../../../config/fonts"; + +export default function SeriesDescriptionTabs({ data: data }) { + return ( +
+ + + + + {data.overview || "No description found"} + + + + + + +

+ Tagline:{" "} + {data.tagline || "not sure"} +

+

+ Homepage:{" "} + + + {data.homepage || "not sure"} + + +

+

+ + Episodes: + {" "} + + {data.number_of_episodes || "not sure"} + +

+

+ + Seasons: + {" "} + + {data.number_of_seasons || "not sure"} + +

+

+ Status:{" "} + {data.status || "not sure"} +

+

+ Released on:{" "} + {data.first_air_date || "not sure"} +

+

+ + + + + {data.vote_count || "not sure"} + + + + + + {data.vote_average || "not sure"} + +

+ + + + + + + {data.seasons && + data.seasons.map((item, index) => ( + + + +

+ {item.name} +

+ + {item.air_date + ? item.air_date + : "TBD "} + + + + ))} + + + + +
+ ); +} diff --git a/src/app/web-series/components/search.jsx b/src/app/web-series/components/search.jsx new file mode 100644 index 0000000..ecf392c --- /dev/null +++ b/src/app/web-series/components/search.jsx @@ -0,0 +1,57 @@ +"use client"; + +import { useState } from "react"; +import { Input, Progress } from "@nextui-org/react"; + +import { SEARCH_TV } from "./data-fetch"; +import SeriesSearchFormatter from "./seriesSearchFormatter"; +import PreFecthSeriesInfo from "./cacher"; +// import { SearchMovie } from "./requestsHandler"; +// import MovieSearchFormatter from "./searchFormatter"; + +const SeriesSearchBar = () => { + const [seriesTitle, setSeriesTitle] = useState(""); + const [loading, setLoading] = useState(<>); + const [seriesResults, setSeriesResults] = useState(<>); + + async function handleInputChange() { + setLoading( + + ); + const data = await SEARCH_TV(seriesTitle); + PreFecthSeriesInfo(data); + setLoading(<>); + setSeriesResults(await SeriesSearchFormatter(data)); + } + + return ( +
+
+ { + if (event.target.value.trim() !== "") { + setSeriesTitle(event.target.value); + } + }} + onKeyDown={async (event) => { + if (event.key === "Enter" || event.code === "Enter") { + await handleInputChange(); + } + }} + /> + {loading} +
+
{seriesResults}
+
+ ); +}; + +export default SeriesSearchBar; diff --git a/src/app/web-series/components/searchBar.jsx b/src/app/web-series/components/searchBar.jsx deleted file mode 100644 index 42531bc..0000000 --- a/src/app/web-series/components/searchBar.jsx +++ /dev/null @@ -1,49 +0,0 @@ -"use client"; -import styles from "../styles/search.module.css"; -import { FaSearch } from "react-icons/fa"; -import { useState } from "react"; - -import { SEARCH_TV } from "./data-fetch"; -import SearchResults from "./searchResults"; - -const SearchBar = () => { - const [title, setTitle] = useState(""); - const [result, setResults] = useState(null); - const [loading, setloading] = useState(false); - - const fetch_results = async (title) => { - setloading(true); - setResults(await SearchResults(await SEARCH_TV(title))); - setloading(false); - }; - - return ( -
-
- - setTitle(event.target.value)} - onKeyDown={async (e) => { - if ((e.key === "Enter" || e.code === 13) && title) { - await fetch_results(e.target.value); - } - }} - > -
- - {loading && ( -

- Please wait while we crunch up all the data -

- )} -
{result}
-
- ); -}; - -export default SearchBar; diff --git a/src/app/web-series/components/searchResults.jsx b/src/app/web-series/components/searchResults.jsx deleted file mode 100644 index d1564e0..0000000 --- a/src/app/web-series/components/searchResults.jsx +++ /dev/null @@ -1,35 +0,0 @@ -"use server"; - -import Link from "next/link"; -import Image from "next/image"; -import styles from "../styles/search.module.css"; -import PreFecthSeriesInfo from "./cacher"; - -const SearchResults = async (data) => { - PreFecthSeriesInfo(data); - return ( -
- {data && - data.results.map((item, index) => ( - -
- Searched Series Poster -

{item.name}

-
- - ))} -
- ); -}; - -export default SearchResults; diff --git a/src/app/web-series/components/seriesSearchFormatter.jsx b/src/app/web-series/components/seriesSearchFormatter.jsx new file mode 100644 index 0000000..408e7c0 --- /dev/null +++ b/src/app/web-series/components/seriesSearchFormatter.jsx @@ -0,0 +1,49 @@ +import { Card, CardHeader, CardBody } from "@nextui-org/react"; +import Link from "next/link"; +import Image from "next/image"; + +import styles from "../../page.module.css"; + +const SeriesSearchFormatter = async (data) => { + return ( +
+ {data && + data.results.map((item, index) => { + if (item.poster_path) { + return ( + + + + Searched Movie Poster + + +

+ {item.name} +

+ + + + ); + } + })} +
+ ); +}; + +export default SeriesSearchFormatter; diff --git a/src/app/web-series/components/videoPlayer.jsx b/src/app/web-series/components/videoPlayer.jsx index cc8feb3..50a703d 100644 --- a/src/app/web-series/components/videoPlayer.jsx +++ b/src/app/web-series/components/videoPlayer.jsx @@ -1,66 +1,76 @@ "use client"; -import { useState } from "react"; -import styles from "../styles/videoPlayer.module.css"; +import { useEffect, useState } from "react"; -const SeriesPlayer = ({ id: id }) => { - const [iframe, iframeContent] = useState(null); - const [episode, setEpisode] = useState(""); - const [season, setSeason] = useState(""); +import { Input } from "@nextui-org/react"; - async function VideoPlayerInitialize() { - if (!episode || !season) { - alert("Please provide the required episode and season number."); +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 ( + + ); + }; + + function renderVideoFrame() { + if (seasonNumber === "" || episodeNumber === "") { + alert( + "Make sure that you have entered the episode number and the season number." + ); return; } - iframeContent(await iframeGenerator(id, season, episode)); - document.getElementById("video-player").style.display = "none"; + + setVideoFrame(VideoFrameGenerator(seasonNumber, episodeNumber)); } return ( -
-
- + {videoFrame} +
+ { - if (Number(e.target.value) > 0) { - setSeason(e.target.value); + isRequired + onChange={(event) => { + setSeasonNumber(event.target.value); + }} + onKeyDown={(event) => { + if (event.key === "Enter" || event.code === "Enter") { + renderVideoFrame(); } }} - > - + { - if (Number(e.target.value) > 0) { - setEpisode(e.target.value); + isRequired + onChange={(event) => { + setEpisodeNumber(event.target.value); + }} + onKeyDown={(event) => { + if (event.key === "Enter" || event.code === "Enter") { + renderVideoFrame(); } }} - > - - -
- -
- {iframe} -

- Please use adblockers to prevent ads and redirects. We have - no control over the amount of ads or the type of ads which - you might encounter. -

+ />
-
+ ); }; -const iframeGenerator = async (id, seasonNumber, episodeNumber) => { - const url = `https://vidsrc.pro/embed/tv/${id}/${seasonNumber}/${episodeNumber}`; - return ; -}; - -export default SeriesPlayer; +export default SeriesVideoPlayer; -- cgit v1.2.3