MattTheTekie/secret
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #54 from Rohithk2003/master

Browse source 
Merged dev and main
This commit is contained in:
the-rarbg 2023-10-01 08:15:44 +05:30 • committed by GitHub
commit 71fc0c0903
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
29 changed files with 2221 additions and 1138 deletions
Download patch file Download diff file Expand all files Collapse all files

4
Common/CardExpanded.js
View file

@ -31,7 +31,7 @@ const CardExpanded = props => {
router.push(`/post-detail/${props.item?.pk}/${slug}/`)
}}
key={props.index}
className={` my-3 mt-6 inline-flex md:h-44 cursor-pointer flex-col justify-center overflow-hidden rounded-md py-2 ${
className={` my-3 mt-6 inline-flex cursor-pointer flex-col justify-center overflow-hidden rounded-md py-2 md:h-44 ${
theme === 'dark' ? 'bg-card ' : ' bg-app-shady-white'
} fab zoomcss grid_hover_effect hover:border-primary/50`}
style={{ width: '200px' }}>
@ -41,7 +41,7 @@ const CardExpanded = props => {
backgroundImage: `url("${
props.item[`t`]
? props.item[`t`]
: props.categoryId === 'XXX'
: props.categoryId === 'XXX'
? 'https://i.therarbg.com/xnp.jpg'
: 'https://i.therarbg.com/np.jpg'
}")`,

408
Common/TorrentList.js
View file

@ -1,215 +1,187 @@
import moment from 'moment';
import { useRouter } from 'next/router';
import moment from 'moment'
import {useRouter} from 'next/router'
import React from 'react'
import Modal from "react-modal";
import { formatBytes } from './CardExpanded';
import DataTable, { createTheme } from 'react-data-table-component';
const TorrentList = ({ setisTorrent, torrent_list, runtime }) => {
const router = useRouter()
const customStyles = {
content: {
top: '50%',
left: '50%',
right: 'auto',
bottom: 'auto',
marginRight: '-50%',
transform: 'translate(-50%, -50%)',
background: "#171e30",
maxHeight: "700px",
maxWidth: "1080px",
width: "100%",
borderColor: "#454851",
},
};
console.log("torrent_list", torrent_list)
const columns = [
{
name: 'Name',
selector: row => row.name,
sortable: true,
},
{
name: 'Action',
cell: (row, index) => {
let slug = row?.name.toLowerCase().trim().replace(/[^\w\s-]/g, '').replace(/[\s_-]+/g, '-').replace(/^-+|-+$/g, '');
return (
<a onClick={() => router.push(`/post-detail/${row?.eid}/${slug}/`)}>
Download
</a>
)
},
width: "10%",
style: {
color: "#296ac8",
cursor: "pointer",
}
},
{
name: 'Category',
selector: row => row.category_str,
width: "10%",
sortable: true,
},
{
name: 'Date',
selector: row => moment(row?.last_checked).format("DD-MM-YYYY"),
width: "10%",
sortable: true,
},
{
name: 'Runtime',
selector: row => moment.utc(runtime * 1000).format('HH:mm:ss'),
width: "11%",
sortable: true,
},
{
name: 'Size',
selector: row => formatBytes(row?.size),
sortable: true,
width: "10%",
sortFunction: (a, b) => {
return a.size - b.size;
},
},
{
name: 'S',
selector: row => row?.seeders,
sortable: true,
width: "7%",
style: {
color: "#00FF00",
}
},
{
name: 'L',
selector: row => row.leechers,
sortable: true,
width: "7%",
style: {
color: "#dd0c0e",
}
},
];
createTheme('dark', {
background: {
default: 'transparent',
},
});
const customCss = {
headCells: {
style: {
fontSize: "14px",
fontWeight: "700",
color: "#C2D8D3"
},
},
};
console.log("torrent_list", torrent_list)
createTheme('dark', {
background: {
default: 'transparent',
},
});
return (
<>
<Modal
isOpen={true}
style={customStyles}
onRequestClose={() => setisTorrent(false)}
> {
torrent_list.length > 0 ?
<DataTable
columns={columns}
data={torrent_list}
theme="dark"
sortable
customStyles={customCss}
/>
: <div className='nosimilar_torrent text-gray-700 '>
<h1>
Sorry Torrent Not Available Try after some days !!!
</h1>
</div>}
{/* {
import Modal from 'react-modal'
import {formatBytes} from './CardExpanded'
import DataTable, {createTheme} from 'react-data-table-component'
import {useTheme} from 'next-themes'
const TorrentList = ({setisTorrent, torrent_list, runtime}) => {
const theme = useTheme()
const router = useRouter()
const customStyles = {
content: {
top: '50%',
left: '50%',
right: 'auto',
bottom: 'auto',
marginRight: '-50%',
transform: 'translate(-50%, -50%)',
background: '#171e30',
maxHeight: '700px',
maxWidth: '1500px',
border: '0px',
width: '100%',
borderColor: '#454851',
},
}
const qualityRegex = /(4K|720p|1080p|2160p|720P|360P|360p|1080P)/i
const columns = [
{
name: 'Name',
selector: row => row.name,
sortable: true,
},
{
name: 'Action',
cell: (row, index) => {
let slug = row?.name
.toLowerCase()
.trim()
.replace(/[^\w\s-]/g, '')
.replace(/[\s_-]+/g, '-')
.replace(/^-+|-+$/g, '')
return (
<a onClick={() => router.push(`/post-detail/${row?.eid}/${slug}/`)}>
Download
</a>
)
},
width: '8%',
style: {
color: '#296ac8',
cursor: 'pointer',
},
},
{
name: 'Category',
selector: row => row.category_str,
width: '8%',
sortable: true,
},
{
name: 'Res',
selector: row =>
row.name.match(qualityRegex) ? row.name.match(qualityRegex)[0] : '',
width: '6%',
sortable: true,
sortFunction: (a, b) => {
function compareQuality(a, b) {
if (a && b) {
const regex = /(\d+)p/
const qualityA = parseInt(
a.name.match(qualityRegex)
? a.name.match(qualityRegex)[0]?.match(regex)
: ''
)
const qualityB = parseInt(
b.name.match(qualityRegex)
? b.name.match(qualityRegex)[0]?.match(regex)
: ''
)
return qualityA - qualityB
}
}
return compareQuality(a, b)
},
},
{
name: 'Date',
selector: row => moment(row?.last_checked).format('DD-MM-YYYY'),
width: '9%',
sortable: true,
},
{
name: 'Runtime',
selector: row => moment.utc(runtime * 1000).format('HH:mm:ss'),
width: '9%',
sortable: true,
},
{
name: 'Size',
selector: row => formatBytes(row?.size),
sortable: true,
width: '7%',
sortFunction: (a, b) => {
return a.size - b.size
},
},
{
name: 'S | L',
cell: (row, index) => {
let l = row?.leechers
let s = row?.seeders
return (
<span style={{color: "#00FF00"}}>
{l} | <span style={{color: "#FF0000"}}>{s}</span>
</span>
)
},
sortable: true,
sortFunction: (a, b) => {
return a?.leechers - b?.leechers
},
width: '8%',
style: {
color: '#00FF00',
},
},
]
createTheme('dark', {
background: {
default: 'transparent',
},
})
const customCss = {
headCells: {
style: {
fontSize: '14px',
fontWeight: '700',
color: theme === 'dark' ? '#C2D8D3' : '#000000',
},
},
}
console.log('torrent_list', torrent_list)
createTheme('dark', {
background: {
default: 'transparent',
},
})
return (
<>
<Modal
isOpen={true}
style={customStyles}
onRequestClose={() => setisTorrent(false)}>
{' '}
{torrent_list.length > 0 ? (
<DataTable
columns={columns}
data={torrent_list}
theme={theme}
sortable
customStyles={customCss}
/>
) : (
<div className='nosimilar_torrent text-gray-700 '>
<h1>Sorry Torrent Not Available Try after some days !!!</h1>
</div>
)}
{/* {
         torrent_list.length>0?
@ -313,17 +285,9 @@ const TorrentList = ({ setisTorrent, torrent_list, runtime }) => {
        </h1>
      </div> } */}
</Modal>
</>
)
</Modal>
</>
)
}
export default TorrentList
export default TorrentList

57
components/CardContinueWatching.js Normal file
View file

@ -0,0 +1,57 @@
import {useRouter} from 'next/router'
import CardImageCW from "./CardImageCW";
import CardInfoCW from "./CardInfoCW";
import {AiOutlineClose} from "react-icons/ai";
export default function CardContinueWatching({
id,
category,
year,
src,
clearHistoryFunction,
title,
}) {
const router = useRouter()
const handleClick = (e) => {
if (e.target.tagName !== "svg") {
if (e.ctrlKey) {
if (category === 'movie') {
window.open(`/movie/${id}`)
} else if (category === 'tv') {
window.open(`/tv/${id}`)
}
} else {
if (category === 'movie') {
router.push(`/movie/${id}`)
} else if (category === 'tv') {
router.push(`/tv/${id}`)
}
}
}
else{
e.preventDefault()
}
}
return (
<div className='relative w-full cursor-pointer test'>
<div className={"relative continue-card w-full transition duration-400 ease-in-out"} onClick={handleClick}>
<CardImageCW isTrending src={src}/>
<CardInfoCW
id={id}
category={category}
title={title}
year={year}
/>
</div>
<div onClick={() => {
clearHistoryFunction(id, category)
}}
data-id={"close-btn"}
className={"text-black grid place-items-center close-button w-6 h-6 opacity-20 bg-app-shady-white top-2 right-2 rounded-full absolute"}>
<AiOutlineClose/>
</div>
</div>
)
}

30
components/CardImageCW.js Normal file
View file

@ -0,0 +1,30 @@
import Image from 'next/image'
import {shimmer, toBase64} from '../utils'
export default function CardImageCW({src, alt}) {
return (
<div className='relative rounded-lg'>
<div
className={
'relative h-[140px] w-[240px] after:absolute after:top-0 after:right-0 after:bottom-0 after:left-0 after:bg-app-dark-blue after:opacity-50 after:content-[""] sm:h-[180px] sm:w-[420px]'
}>
<Image
className='rounded-lg'
src={src}
alt={alt}
layout='fill'
objectFit='cover'
placeholder='blur'
blurDataURL={`data:image/svg+xml;base64,${toBase64(
shimmer(240, 140)
)}`}
unoptimized
/>
</div>
{/* TODO: Add this back only after the bookmark feature is implemented */}
{/* <div className="group absolute top-2 right-2 flex h-8 w-8 cursor-pointer items-center justify-center rounded-full bg-app-dark-blue opacity-50 hover:bg-light-white hover:opacity-100">
<IconBookmarkEmpty className="group-hover:app-transition fill-transparent stroke-app-pure-white group-hover:stroke-black" />
</div> */}
</div>
)
}

8
components/CardInfo.js
View file

@ -52,7 +52,7 @@ export default function CardInfo({
)
}
function renderYear(year) {
export function renderYear(year) {
if (!year) {
return 'N/A'
} else {
@ -60,7 +60,7 @@ function renderYear(year) {
}
}
function renderCategoryIcon(category) {
export function renderCategoryIcon(category) {
if (category === 'movie') {
return <IconCategoryMovie className='pl-1 text-base dark:fill-white fill-black ' />
} else {
@ -68,7 +68,7 @@ function renderCategoryIcon(category) {
}
}
function renderCategoryText(category) {
export function renderCategoryText(category) {
if (category === 'movie') {
return 'Movie'
} else {
@ -76,7 +76,7 @@ function renderCategoryText(category) {
}
}
function renderRating(rating) {
export function renderRating(rating) {
if (rating === true) {
return '18+'
} else {

45
components/CardInfoCW.js Normal file
View file

@ -0,0 +1,45 @@
import {renderYear} from "../pages/movie/[id]";
import {renderCategoryIcon, renderCategoryText} from "./CardInfo";
export default function CardInfoCW({
category,
title,
rating,
year,
}) {
return (
<div
className={
'absolute left-4 bottom-4 z-40 h-fit w-full truncate text-ellipsis '
}
>
<div
className={
'mt-2 mb-1 flex text-[11px] font-light text-app-pure-white md:text-[15px]'
}
>
<p>{renderYear(year)}</p>
<div
className={
'flex items-center px-[8px] before:content-["•"]'
}
>
{renderCategoryIcon(category)}
<p className={ 'pl-[6px] pr-[6px]' }>
{renderCategoryText(category)}
</p>
</div>
{/*TODO: Add this back only after I find an appropriate way to get the rating info from TMDB api */}
{/*<p>{renderRating(rating)}</p> */}
</div>
<h2
className={
'md:heading-sm text-ellips w-[200px] truncate text-sm font-bold capitalize text-app-pure-white sm:w-[420px] md:h-6'
}
>
{title}
</h2>
</div>
)
}

20
components/CardNormal.js
View file

@ -5,12 +5,20 @@ import CardInfo from './CardInfo'
export default function CardNormal({ id, category, rating, src, title, year }) {
const router = useRouter()
const handleClick = () => {
if (category === 'movie') {
router.push(`/movie/${id}`)
} else if (category === 'tv') {
router.push(`/tv/${id}`)
}
const handleClick = (e) => {
if (e.ctrlKey) {
if (category === 'movie') {
window.open(`/movie/${id}`)
} else if (category === 'tv') {
window.open(`/tv/${id}`)
}
} else {
if (category === 'movie') {
router.push(`/movie/${id}`)
} else if (category === 'tv') {
router.push(`/tv/${id}`)
}
}
}
return (

64
components/CardTrending.js
View file

@ -1,36 +1,44 @@
import { useRouter } from 'next/router'
import {useRouter} from 'next/router'
import CardImage from './CardImage'
import CardInfo from './CardInfo'
export default function CardTrending({
id,
category,
rating,
src,
title,
year,
}) {
const router = useRouter()
id,
category,
rating,
src,
title,
year,
}) {
const router = useRouter()
const handleClick = () => {
if (category === 'movie') {
router.push(`/movie/${id}`)
} else if (category === 'tv') {
router.push(`/tv/${id}`)
const handleClick = (e) => {
if (e.ctrlKey) {
if (category === 'movie') {
window.open(`/movie/${id}`)
} else if (category === 'tv') {
window.open(`/tv/${id}`)
}
} else {
if (category === 'movie') {
router.push(`/movie/${id}`)
} else if (category === 'tv') {
router.push(`/tv/${id}`)
}
}
}
}
return (
<div className='relative w-full cursor-pointer' onClick={handleClick}>
<CardImage isTrending src={src} alt={title} />
<CardInfo
isTrending
id={id}
category={category}
rating={rating}
title={title}
year={year}
/>
</div>
)
return (
<a className='relative w-full top-[100%] cursor-pointer' target={"_blank"} onClick={handleClick}>
<CardImage isTrending src={src} alt={title}/>
<CardInfo
isTrending
id={id}
category={category}
rating={rating}
title={title}
year={year}
/>
</a>
)
}

92
components/Collection.js
View file

@ -1,56 +1,56 @@
import useSWR from 'swr'
import { fetcher, renderResults, sliceArray } from '../utils'
import {fetcher, renderResults, sliceArray} from '../utils'
import CardNormal from './CardNormal'
import Heading from './Heading'
import Loading from './Loading'
export default function Collection({
Component = CardNormal,
endpoint,
href,
isHomePage,
isTrending,
limit = 8,
media_type = 'movie',
title,
type = 'movie'
}) {
const { data, error } = useSWR(endpoint, fetcher)
Component = CardNormal,
endpoint,
href,
isHomePage,
isTrending,
limit = 8,
media_type = 'movie',
title,
type = 'movie'
}) {
const {data, error} = useSWR(endpoint, fetcher)
if (error) return <div>Error occurred</div>
return (
<div className={"relative"}>
{data ? (
<section
className={
isTrending
? 'mb-6 h-full w-full overflow-hidden md:mb-10 lg:overflow-visible '
: 'mb-6 md:mb-10'
}>
if (error) return <div>Error occurred</div>
<Heading
title={title}
href={href}
isHomePage={isHomePage}
isTrending={isTrending}
media_type={type}
/>
<section
className={
isTrending
? 'h-scroll relative flex gap-x-4 overflow-x-scroll sm:gap-x-10 2xs:mt-2'
: 'card-collection-wrapper'
}>
return (
<>
{data ? (
<section
className={
isTrending
? 'mb-6 h-full w-full overflow-hidden md:mb-10 lg:overflow-visible '
: 'mb-6 md:mb-10'
}>
<Heading
title={title}
href={href}
isHomePage={isHomePage}
isTrending={isTrending}
media_type={type}
/>
<section
className={
isTrending
? 'h-scroll relative flex gap-x-4 overflow-x-scroll sm:gap-x-10 2xs:mt-2'
: 'card-collection-wrapper'
}>
{renderResults(
sliceArray(data.results || [], limit),
Component,
media_type
{renderResults(
sliceArray(data.results || [], limit),
Component,
media_type
)}
</section>
</section>
) : (
<Loading/>
)}
</section>
</section>
) : (
<Loading />
)}
</>
)
</div>
)
}

137
components/CollectionContinueWatching.js Normal file
View file

@ -0,0 +1,137 @@
import {useEffect, useState} from "react";
import CardContinueWatching from "./CardContinueWatching";
import {TMDB_IMAGE_ENDPOINT} from "../utils";
import {useRouter} from "next/router";
import Heading from "./Heading";
import Loading from "./Loading";
export default function Collection({}) {
const [data, setData] = useState([]);
const router = useRouter();
const [dataLoaded, setDataLoaded] = useState(false)
const [dataEmpty, changeDataStatus] = useState(false)
const clear = () => {
setData([]);
changeDataStatus(true);
if (localStorage) {
localStorage.removeItem("userWatched");
}
}
const clear_movie = (id, category) => {
setDataLoaded(false)
if (localStorage) {
if (category === "tv") {
let data = JSON.parse(localStorage.getItem("userWatched")).tv;
let out = []
for (let i in data) {
if (data[i][0] !== id) {
out.push(data[i])
}
}
let new_data = {movies: JSON.parse(localStorage.getItem("userWatched")).movies, tv: out}
localStorage.setItem("userWatched", JSON.stringify(new_data));
} else {
let data = JSON.parse(localStorage.getItem("userWatched")).movies;
let out = []
for (let i in data) {
if (data[i] !== id) {
out.push(data[i])
}
}
let new_data = {tv: JSON.parse(localStorage.getItem("userWatched")).tv, movies: out}
localStorage.setItem("userWatched", JSON.stringify(new_data));
}
}
}
/*TODO : Currently fetching the data for tv and movie one by one based on the id stored in local storage. */
useEffect(() => {
const res = async () => {
if (localStorage.getItem("userWatched")) {
if (JSON.parse(localStorage.getItem("userWatched")).movies.length === 0 && JSON.parse(localStorage.getItem("userWatched")).tv.length === 0) {
changeDataStatus(true)
setDataLoaded(true)
} else {
const movieIds = JSON.parse(localStorage.getItem("userWatched")).movies
let watchedData = []
for (let i in movieIds) {
await fetch(`${router.asPath}api/movie/${movieIds[i]}`, {
credentials: "include"
}).then(response => response.json()).then(da => {
watchedData.push({
id: movieIds[i],
name: da.detail.original_title,
year: da.detail.release_date.split('-')[0],
poster_link: da.detail.backdrop_path ? `${TMDB_IMAGE_ENDPOINT}/${da.detail.backdrop_path}` : `${TMDB_IMAGE_ENDPOINT}/${da.detail.poster_path}`,
type: 'movie'
});
})
}
const tvIds = JSON.parse(localStorage.getItem("userWatched")) ? JSON.parse(localStorage.getItem("userWatched")).tv : ""
for (let i in tvIds) {
if (tvIds[i] !== [])
await fetch(`${router.asPath}api/tv/${tvIds[i][0]}`, {
credentials: "include"
}).then(response => response.json()).then(da => {
watchedData.push({
id: tvIds[i][0],
name: da.detail.name,
year: da.detail.first_air_date ? da.detail.first_air_date.split("-")[0] : "",
poster_link: da.detail.backdrop_path ? `${TMDB_IMAGE_ENDPOINT}/${da.detail.backdrop_path}` : `${TMDB_IMAGE_ENDPOINT}/${da.detail.poster_path}`,
type: 'tv'
});
})
}
setData(watchedData)
setDataLoaded(true)
changeDataStatus(false)
}
} else {
setDataLoaded(true)
changeDataStatus(true)
}
}
res();
}
,
[dataLoaded]
)
;
return (
<div className={"relative"}>
{dataLoaded ? (
!dataEmpty ?
<section
className={
'mb-6 md:mb-10'
}>
<Heading title={"Continue Watching"} clearHistoryFunction={clear} href={""} isHomePage
media_type={"all"}
iscontinue_watching={true}/>
<section
className={
' w-[100%] gap-5 overflow-x-scroll pb-2 '
}>
<ul className={"flex gap-10 flex-row"}>
{
data.map((data, index) => {
return (<li key={index}>
<CardContinueWatching category={data.type} id={data.id}
title={data.name}
clearHistoryFunction={clear_movie}
year={data.year}
src={data.poster_link}/>
</li>
)
})
}
</ul>
</section>
</section>
: ""
) : <Loading/>}
</div>
)
}

13
components/FilmHeading.js
View file

@ -1,10 +1,17 @@
export default function FilmHeading({ tagline, title }) {
export default function FilmHeading({ tagline, title ,from}) {
return (
<div className='mt-6 mb-2 text-center md:mt-0 md:mb-4 md:text-left'>
from === "movie"?
<div className='text-center mb-2 md:text-left'>
<h1 className='mb-1 text-3xl font-light md:mb-3 md:text-5xl'>{title}</h1>
<h2 className='text-xs font-light text-gray-600 dark:text-app-placeholder sm:text-sm md:text-lg'>
{tagline}
</h2>
</div>
</div> :
<div className='mt-6 mb-2 text-center md:mt-0 md:mb-4 md:text-left'>
<h1 className='mb-1 text-3xl font-light md:mb-3 md:text-5xl'>{title}</h1>
<h2 className='text-xs font-light text-gray-600 dark:text-app-placeholder sm:text-sm md:text-lg'>
{tagline}
</h2>
</div>
)
}

7
components/FilmResources.js
View file

@ -1,7 +1,5 @@
/* eslint-disable react-hooks/exhaustive-deps */
import { useRouter } from 'next/router'
import { useState } from 'react'
import { FaImdb, FaLink, FaPlay } from 'react-icons/fa'
import { FaPlay } from 'react-icons/fa'
import {BsDownload} from "react-icons/bs";
@ -17,8 +15,6 @@ const handlegetLink =()=>{
return (
<div className='mb-10 flex flex-wrap'>
{!props?.imdb ? null : (
<a
@ -35,7 +31,6 @@ const handlegetLink =()=>{
{!(props?.imdb||props?.tmdb) ? null : (
<a
onClick={()=>{
if(router?.pathname==="/tv/[id]"){
router.push(`/play/tv/?${props?.tmdb?(`tmdb=${props?.tmdb}`):(`id=${props?.imdb}`)}`)

67
components/Heading.js
View file

@ -1,34 +1,43 @@
import Link from 'next/link'
export default function Heading({
href,
isHomePage,
isTrending, // TODO: Do we need this here?
media_type,
title,
}) {
return (
<div className='mb-4 flex items-end justify-between sm:mb-6'>
{isHomePage ? (
<div className='flex items-end'>
<h2 className='section-title py-px sm:py-0 text-app-dark-blue dark:text-app-pure-white'>{title}</h2>
{media_type&& <p
className={
media_type === 'movie'
? 'ml-2 rounded-md border-2 py-px px-2 text-[8px] font-light border-app-dark-blue dark:border-app-pure-white uppercase tracking-wider text-app-dark-blue dark:text-app-pure-white sm:ml-4 sm:text-[10px]'
: 'ml-2 rounded-md border-2 border-app-dark-blue dark:border-app-pure-white dark:bg-app-dark-blue bg-light-white py-px px-2 text-[8px] font-light uppercase tracking-wider dark:text-app-pure-white text-app-dark-blue sm:ml-4 sm:text-[10px] '
}>
{ media_type}
</p>}
href,
isHomePage,
isTrending, // TODO: Do we need this here?
media_type,
clearHistoryFunction,
iscontinue_watching,
title,
}) {
return (
<div className='mb-4 flex items-end justify-between sm:mb-6'>
{isHomePage ? (
<div className='flex items-end'>
<h2 className='section-title py-px sm:py-0 text-app-dark-blue dark:text-app-pure-white'>{title}</h2>
{media_type && <p
className={
media_type === 'movie'
? 'ml-2 rounded-md border-2 py-px px-2 text-[8px] font-light border-app-dark-blue dark:border-app-pure-white uppercase tracking-wider text-app-dark-blue dark:text-app-pure-white sm:ml-4 sm:text-[10px]'
: 'ml-2 rounded-md border-2 border-app-dark-blue dark:border-app-pure-white dark:bg-app-dark-blue bg-light-white py-px px-2 text-[8px] font-light uppercase tracking-wider dark:text-app-pure-white text-app-dark-blue sm:ml-4 sm:text-[10px] '
}>
{media_type}
</p>}
</div>
) : (
<h2 className='section-title'>{title}</h2>
)}
{iscontinue_watching &&
<div onClick={clearHistoryFunction}
className='cursor-pointer text-xs font-medium uppercase tracking-wide text-app-greyish-blue hover:underline'>
Clear history
</div>
}
{href && <Link href={href} as={href} passHref>
<a className='cursor-pointer text-xs font-medium uppercase tracking-wide text-app-greyish-blue hover:underline'>
See more
</a>
</Link>}
</div>
) : (
<h2 className='section-title'>{title}</h2>
)}
{ href&& <Link href={href} as={href} passHref>
<a className='cursor-pointer text-xs font-medium uppercase tracking-wide text-app-greyish-blue hover:underline'>
See more
</a>
</Link>}
</div>
)
)
}

27
components/Navigation.js
View file

@ -1,7 +1,6 @@
import Link from 'next/link'
import { useRouter } from 'next/router'
import { useEffect, useState } from 'react'
import AppIcon from './icons/AppIcon'
import AppLogo from './icons/AppIcon'
import IconNavHome from './icons/IconNavHome'
import IconNavMovie from './icons/IconNavMovie'
@ -27,7 +26,7 @@ export default function Navigation() {
}
return (
<nav className=' bg-app-shady-white sticky top-0 z-50 flex items-center justify-between p-5 shadow-md shadow-black dark:bg-app-semi-dark-blue md:mx-6 md:mb-[33px] md:mt-6 md:rounded-[10px] lg:fixed lg:left-0 lg:my-12 lg:mr-0 lg:h-5/6 lg:flex-col lg:py-9'>
<nav className='bg-app-shady-white sticky top-0 z-50 flex items-center justify-between p-5 shadow-md shadow-black dark:bg-app-semi-dark-blue md:mx-6 md:mb-[33px] md:mt-6 md:rounded-[10px] lg:fixed lg:left-0 lg:my-12 lg:mr-0 lg:h-5/6 lg:flex-col lg:py-9'>
<div
onClick={() => setIsOpen(false)}
className={` overlay backdrop ${isOpen ? 'active' : ''}`}></div>
@ -60,7 +59,7 @@ export default function Navigation() {
height='24'
fill='currentColor'
className={
router.pathname == '/latest-top-10'
router.pathname === '/latest-top-10'
? 'active-link'
: 'icon-nav'
}
@ -85,7 +84,7 @@ export default function Navigation() {
height='24'
fill='currentColor'
className={
router.pathname == '/get-posts/[category]'
router.pathname === '/get-posts/[category]'
? 'active-link'
: 'icon-nav'
}
@ -106,7 +105,7 @@ export default function Navigation() {
height='24'
fill='currentColor'
className={
router.pathname == '/search'
router.pathname === '/search'
? 'active-link !text-gray-600'
: 'icon-nav'
}
@ -146,7 +145,7 @@ export default function Navigation() {
height='24'
fill='currentColor'
className={
router.pathname == '/upload' ? 'active-link' : 'icon-nav'
router.pathname === '/upload' ? 'active-link' : 'icon-nav'
}
viewBox='0 0 16 16'>
<path d='M8 2a5.53 5.53 0 0 0-3.594 1.342c-.766.66-1.321 1.52-1.464 2.383C1.266 6.095 0 7.555 0 9.318 0 11.366 1.708 13 3.781 13h8.906C14.502 13 16 11.57 16 9.773c0-1.636-1.242-2.969-2.834-3.194C12.923 3.999 10.69 2 8 2zm2.354 5.146a.5.5 0 0 1-.708.708L8.5 6.707V10.5a.5.5 0 0 1-1 0V6.707L6.354 7.854a.5.5 0 1 1-.708-.708l2-2a.5.5 0 0 1 .708 0l2 2z' />
@ -166,7 +165,7 @@ export default function Navigation() {
height='24'
fill='currentColor'
className={
router.pathname == '/faq' ? 'active-link' : 'icon-nav'
router.pathname === '/faq' ? 'active-link' : 'icon-nav'
}
viewBox='0 0 16 16'>
<path d='M2 5C.892 5 0 5.892 0 7v7c0 1.108.892 2 2 2h9c1.108 0 2-.892 2-2v-3.8L16 7h-3c0-1.108-.892-2-2-2zm4.438 2C7.75 6.926 8.926 7.936 9 9.25c0 1.121-.308 1.544-1.281 2.281a1.68 1.68 0 00-.281.25c-.04.05-.032.033-.032.031.006.423-.39.782-.812.782a.79.79 0 01-.781-.782c0-.401.179-.754.375-1a3.14 3.14 0 01.562-.562 3.85 3.85 0 00.563-.531c.074-.09.097-.24.093-.344v-.031a.785.785 0 00-.843-.75c-.451.025-.813.362-.851.758a.697.697 0 01-.718.648.816.816 0 01-.781-.594 1.725 1.725 0 01.01-.533c.005-.014.006-.03.012-.043.202-1.024 1.09-1.768 2.203-1.83zm.156 6.406a.82.82 0 01.812.813c0 .442-.37.781-.812.781a.768.768 0 01-.781-.781c0-.442.339-.813.78-.813zM2 1C.892 1 0 1.892 0 3v.568A3.918 3.918 0 012 3h9c1.376 0 2.55.763 3.268 1.848L16 3h-3c0-1.108-.892-2-2-2z' />
@ -190,7 +189,7 @@ export default function Navigation() {
height='24'
fill='hsl(223, 23%, 46%)'
className={
router.pathname == '/latest-top-10' ? 'active-link' : 'icon-nav'
router.pathname === '/latest-top-10' ? 'active-link' : 'icon-nav'
}
viewBox='0 0 50 50'>
<path d='M 0 7.5 L 0 12.5 L 50 12.5 L 50 7.5 Z M 0 22.5 L 0 27.5 L 50 27.5 L 50 22.5 Z M 0 37.5 L 0 42.5 L 50 42.5 L 50 37.5 Z'></path>
@ -225,7 +224,7 @@ export default function Navigation() {
height='24'
fill='currentColor'
className={
router.pathname == '/latest-top-10' ? 'active-link' : 'icon-nav'
router.pathname === '/latest-top-10' ? 'active-link' : 'icon-nav'
}
viewBox='0 0 16 16'>
<path d='M8 16c3.314 0 6-2 6-5.5 0-1.5-.5-4-2.5-6 .25 1.5-1.25 2-1.25 2C11 4 9 .5 6 0c.357 2 .5 4-2 6-1.25 1-2 2.729-2 4.5C2 14 4.686 16 8 16Zm0-1c-1.657 0-3-1-3-2.75 0-.75.25-2 1.25-3C6.125 10 7 10.5 7 10.5c-.375-1.25.5-3.25 2-3.5-.179 1-.25 2 1 3 .625.5 1 1.364 1 2.25C11 14 9.657 15 8 15Z' />
@ -243,7 +242,7 @@ export default function Navigation() {
height='24'
fill='currentColor'
className={
router.pathname == '/get-posts/[category]'
router.pathname === '/get-posts/[category]'
? 'active-link'
: 'icon-nav'
}
@ -260,7 +259,7 @@ export default function Navigation() {
height='24'
fill='currentColor'
className={
router.pathname == '/search' ? 'active-link' : 'icon-nav'
router.pathname === '/search' ? 'active-link' : 'icon-nav'
}
viewBox='0 0 16 16'>
<path d='M6.5 13a6.474 6.474 0 0 0 3.845-1.258h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.008 1.008 0 0 0-.115-.1A6.471 6.471 0 0 0 13 6.5 6.502 6.502 0 0 0 6.5 0a6.5 6.5 0 1 0 0 13Zm0-8.518c1.664-1.673 5.825 1.254 0 5.018-5.825-3.764-1.664-6.69 0-5.018Z' />
@ -284,7 +283,7 @@ export default function Navigation() {
height='24'
fill='currentColor'
className={
router.pathname == '/upload' ? 'active-link' : 'icon-nav'
router.pathname === '/upload' ? 'active-link' : 'icon-nav'
}
viewBox='0 0 16 16'>
<path d='M8 2a5.53 5.53 0 0 0-3.594 1.342c-.766.66-1.321 1.52-1.464 2.383C1.266 6.095 0 7.555 0 9.318 0 11.366 1.708 13 3.781 13h8.906C14.502 13 16 11.57 16 9.773c0-1.636-1.242-2.969-2.834-3.194C12.923 3.999 10.69 2 8 2zm2.354 5.146a.5.5 0 0 1-.708.708L8.5 6.707V10.5a.5.5 0 0 1-1 0V6.707L6.354 7.854a.5.5 0 1 1-.708-.708l2-2a.5.5 0 0 1 .708 0l2 2z' />
@ -298,7 +297,7 @@ export default function Navigation() {
width='24'
height='24'
fill='currentColor'
className={router.pathname == '/faq' ? 'active-link' : 'icon-nav'}
className={router.pathname === '/faq' ? 'active-link' : 'icon-nav'}
viewBox='0 0 16 16'>
<path d='M2 5C.892 5 0 5.892 0 7v7c0 1.108.892 2 2 2h9c1.108 0 2-.892 2-2v-3.8L16 7h-3c0-1.108-.892-2-2-2zm4.438 2C7.75 6.926 8.926 7.936 9 9.25c0 1.121-.308 1.544-1.281 2.281a1.68 1.68 0 00-.281.25c-.04.05-.032.033-.032.031.006.423-.39.782-.812.782a.79.79 0 01-.781-.782c0-.401.179-.754.375-1a3.14 3.14 0 01.562-.562 3.85 3.85 0 00.563-.531c.074-.09.097-.24.093-.344v-.031a.785.785 0 00-.843-.75c-.451.025-.813.362-.851.758a.697.697 0 01-.718.648.816.816 0 01-.781-.594 1.725 1.725 0 01.01-.533c.005-.014.006-.03.012-.043.202-1.024 1.09-1.768 2.203-1.83zm.156 6.406a.82.82 0 01.812.813c0 .442-.37.781-.812.781a.768.768 0 01-.781-.781c0-.442.339-.813.78-.813zM2 1C.892 1 0 1.892 0 3v.568A3.918 3.918 0 012 3h9c1.376 0 2.55.763 3.268 1.848L16 3h-3c0-1.108-.892-2-2-2z' />
</svg>
@ -344,7 +343,7 @@ export default function Navigation() {
width='24'
height='24'
fill='currentColor'
className={router.pathname == '/login' ? 'active-link' : 'icon-nav'}
className={router.pathname === '/login' ? 'active-link' : 'icon-nav'}
viewBox='0 0 16 16'>
<path
fillRule='evenodd'

432
package-lock.json generated
View file

@ -9,12 +9,13 @@
"version": "0.1.0",
"dependencies": {
"axios": "^1.5.0",
"bootstrap": "^5.3.2",
"moment": "^2.29.4",
"next": "12.1.0",
"next-themes": "^0.2.1",
"nprogress": "^0.2.0",
"react": "17.0.2",
"react-bootstrap": "^2.8.0",
"react-bootstrap": "^2.9.0",
"react-data-table-component": "^7.5.4",
"react-dom": "17.0.2",
"react-icons": "^4.3.1",
@ -24,6 +25,7 @@
"react-toastify": "^9.1.3",
"react-tooltip": "^5.21.3",
"react-youtube": "^10.1.0",
"reactstrap": "^9.2.0",
"recoil": "^0.6.1",
"scss": "^0.2.4",
"swr": "^1.2.2",
@ -33,10 +35,12 @@
"autoprefixer": "^10.4.3",
"eslint": "8.11.0",
"eslint-config-next": "12.1.0",
"eslint-config-prettier": "^9.0.0",
"postcss": "^8.4.11",
"prettier": "^2.6.1",
"prettier-plugin-tailwindcss": "^0.1.8",
"tailwindcss": "^3.0.23",
"video.js": "^8.5.2",
"webpack": "^5.88.2"
}
},
@ -2801,9 +2805,9 @@
"peer": true
},
"node_modules/@types/warning": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/@types/warning/-/warning-3.0.0.tgz",
"integrity": "sha512-t/Tvs5qR47OLOr+4E9ckN8AmP2Tf16gWq+/qA4iUGS/OOyHVO8wv2vjJuX8SNOUTJyWb+2t7wJm6cXILFnOROA=="
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/@types/warning/-/warning-3.0.1.tgz",
"integrity": "sha512-ywJmriP+nvjBKNBEMaNZgj2irZHoxcKeYcyMLbqhYKbDVn8yCIULy2Ol/tvIb37O3IBeZj3RU4tXqQTtGwoAMg=="
},
"node_modules/@typescript-eslint/parser": {
"version": "5.62.0",
@ -2906,6 +2910,98 @@
"url": "https://opencollective.com/typescript-eslint"
}
},
"node_modules/@videojs/http-streaming": {
"version": "3.5.3",
"resolved": "https://registry.npmjs.org/@videojs/http-streaming/-/http-streaming-3.5.3.tgz",
"integrity": "sha512-dty8lsZk9QPc0i4It79tjWsmPiaC3FpgARFM0vJGko4k3yKNZIYkAk8kjiDRfkAQH/HZ3rYi5dDTriFNzwSsIg==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"@videojs/vhs-utils": "4.0.0",
"aes-decrypter": "4.0.1",
"global": "^4.4.0",
"m3u8-parser": "^7.1.0",
"mpd-parser": "^1.1.1",
"mux.js": "7.0.0",
"video.js": "^7 || ^8"
},
"engines": {
"node": ">=8",
"npm": ">=5"
},
"peerDependencies": {
"video.js": "^7 || ^8"
}
},
"node_modules/@videojs/http-streaming/node_modules/m3u8-parser": {
"version": "7.1.0",
"resolved": "https://registry.npmjs.org/m3u8-parser/-/m3u8-parser-7.1.0.tgz",
"integrity": "sha512-7N+pk79EH4oLKPEYdgRXgAsKDyA/VCo0qCHlUwacttQA0WqsjZQYmNfywMvjlY9MpEBVZEt0jKFd73Kv15EBYQ==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"@videojs/vhs-utils": "^3.0.5",
"global": "^4.4.0"
}
},
"node_modules/@videojs/http-streaming/node_modules/m3u8-parser/node_modules/@videojs/vhs-utils": {
"version": "3.0.5",
"resolved": "https://registry.npmjs.org/@videojs/vhs-utils/-/vhs-utils-3.0.5.tgz",
"integrity": "sha512-PKVgdo8/GReqdx512F+ombhS+Bzogiofy1LgAj4tN8PfdBx3HSS7V5WfJotKTqtOWGwVfSWsrYN/t09/DSryrw==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"global": "^4.4.0",
"url-toolkit": "^2.2.1"
},
"engines": {
"node": ">=8",
"npm": ">=5"
}
},
"node_modules/@videojs/http-streaming/node_modules/mux.js": {
"version": "7.0.0",
"resolved": "https://registry.npmjs.org/mux.js/-/mux.js-7.0.0.tgz",
"integrity": "sha512-DeZmr+3NDrO02k4SREtl4VB5GyGPCz2fzMjDxBIlamkxffSTLge97rtNMoonnmFHTp96QggDucUtKv3fmyObrA==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.11.2",
"global": "^4.4.0"
},
"bin": {
"muxjs-transmux": "bin/transmux.js"
},
"engines": {
"node": ">=8",
"npm": ">=5"
}
},
"node_modules/@videojs/vhs-utils": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/@videojs/vhs-utils/-/vhs-utils-4.0.0.tgz",
"integrity": "sha512-xJp7Yd4jMLwje2vHCUmi8MOUU76nxiwII3z4Eg3Ucb+6rrkFVGosrXlMgGnaLjq724j3wzNElRZ71D/CKrTtxg==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"global": "^4.4.0",
"url-toolkit": "^2.2.1"
},
"engines": {
"node": ">=8",
"npm": ">=5"
}
},
"node_modules/@videojs/xhr": {
"version": "2.6.0",
"resolved": "https://registry.npmjs.org/@videojs/xhr/-/xhr-2.6.0.tgz",
"integrity": "sha512-7J361GiN1tXpm+gd0xz2QWr3xNWBE+rytvo8J3KuggFaLg+U37gZQ2BuPLcnkfGffy2e+ozY70RHC8jt7zjA6Q==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.5.5",
"global": "~4.4.0",
"is-function": "^1.0.1"
}
},
"node_modules/@webassemblyjs/ast": {
"version": "1.11.6",
"resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.6.tgz",
@ -3052,6 +3148,15 @@
"@xtuc/long": "4.2.2"
}
},
"node_modules/@xmldom/xmldom": {
"version": "0.8.10",
"resolved": "https://registry.npmjs.org/@xmldom/xmldom/-/xmldom-0.8.10.tgz",
"integrity": "sha512-2WALfTl4xo2SkGCYRt6rDTFfk9R1czmBvUQy12gK2KuRKIpWEhcbbzy8EZXtz/jkRqHX8bFEc6FC1HjX4TUWYw==",
"dev": true,
"engines": {
"node": ">=10.0.0"
}
},
"node_modules/@xtuc/ieee754": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
@ -3094,6 +3199,33 @@
"acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
}
},
"node_modules/aes-decrypter": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/aes-decrypter/-/aes-decrypter-4.0.1.tgz",
"integrity": "sha512-H1nh/P9VZXUf17AA5NQfJML88CFjVBDuGkp5zDHa7oEhYN9TTpNLJknRY1ie0iSKWlDf6JRnJKaZVDSQdPy6Cg==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"@videojs/vhs-utils": "^3.0.5",
"global": "^4.4.0",
"pkcs7": "^1.0.4"
}
},
"node_modules/aes-decrypter/node_modules/@videojs/vhs-utils": {
"version": "3.0.5",
"resolved": "https://registry.npmjs.org/@videojs/vhs-utils/-/vhs-utils-3.0.5.tgz",
"integrity": "sha512-PKVgdo8/GReqdx512F+ombhS+Bzogiofy1LgAj4tN8PfdBx3HSS7V5WfJotKTqtOWGwVfSWsrYN/t09/DSryrw==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"global": "^4.4.0",
"url-toolkit": "^2.2.1"
},
"engines": {
"node": ">=8",
"npm": ">=5"
}
},
"node_modules/ajv": {
"version": "6.12.6",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
@ -3486,6 +3618,24 @@
"node": ">=8"
}
},
"node_modules/bootstrap": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.2.tgz",
"integrity": "sha512-D32nmNWiQHo94BKHLmOrdjlL05q1c8oxbtBphQFb9Z5to6eGRDCm0QgeaZ4zFBHzfg2++rqa2JkqCcxDy0sH0g==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/twbs"
},
{
"type": "opencollective",
"url": "https://opencollective.com/bootstrap"
}
],
"peerDependencies": {
"@popperjs/core": "^2.11.8"
}
},
"node_modules/brace-expansion": {
"version": "1.1.11",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
@ -3918,6 +4068,12 @@
"csstype": "^3.0.2"
}
},
"node_modules/dom-walk": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/dom-walk/-/dom-walk-0.1.2.tgz",
"integrity": "sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w==",
"dev": true
},
"node_modules/electron-to-chromium": {
"version": "1.4.513",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.513.tgz",
@ -4169,6 +4325,18 @@
}
}
},
"node_modules/eslint-config-prettier": {
"version": "9.0.0",
"resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.0.0.tgz",
"integrity": "sha512-IcJsTkJae2S35pRsRAwoCE+925rJJStOdkKnLVgtE+tEpqU0EVVM7OqrwxqgptKdX29NUwC82I5pXsGFIgSevw==",
"dev": true,
"bin": {
"eslint-config-prettier": "bin/cli.js"
},
"peerDependencies": {
"eslint": ">=7.0.0"
}
},
"node_modules/eslint-import-resolver-node": {
"version": "0.3.9",
"resolved": "https://registry.npmjs.org/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.9.tgz",
@ -4860,6 +5028,16 @@
"integrity": "sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==",
"dev": true
},
"node_modules/global": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/global/-/global-4.4.0.tgz",
"integrity": "sha512-wv/LAoHdRE3BeTGz53FAamhGlPLhlssK45usmGFThIi4XqnBmjKQ16u+RNbP7WvigRZDxUsM0J3gcQ5yicaL0w==",
"dev": true,
"dependencies": {
"min-document": "^2.19.0",
"process": "^0.11.10"
}
},
"node_modules/globals": {
"version": "13.21.0",
"resolved": "https://registry.npmjs.org/globals/-/globals-13.21.0.tgz",
@ -5054,6 +5232,12 @@
"node": ">=0.8.19"
}
},
"node_modules/individual": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/individual/-/individual-2.0.0.tgz",
"integrity": "sha512-pWt8hBCqJsUWI/HtcfWod7+N9SgAqyPEaF7JQjwzjn5vGrpg6aQ5qeAFQ7dx//UH4J1O+7xqew+gCeeFt6xN/g==",
"dev": true
},
"node_modules/inflight": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
@ -5223,6 +5407,12 @@
"url": "https://github.com/sponsors/ljharb"
}
},
"node_modules/is-function": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/is-function/-/is-function-1.0.2.tgz",
"integrity": "sha512-lw7DUp0aWXYg+CBCN+JKkcE0Q2RayZnSvnZBlwgxHBQhqt5pZNVy4Ri7H9GmmXkdu7LUthszM+Tor1u/2iBcpQ==",
"dev": true
},
"node_modules/is-generator-function": {
"version": "1.0.10",
"resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.0.10.tgz",
@ -5552,6 +5742,12 @@
"node": ">=4.0"
}
},
"node_modules/keycode": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/keycode/-/keycode-2.2.0.tgz",
"integrity": "sha512-ps3I9jAdNtRpJrbBvQjpzyFbss/skHqzS+eu4RxKLaEAtFqkjZaB6TZMSivPbLxf4K7VI4SjR0P5mRCX5+Q25A==",
"dev": true
},
"node_modules/keyv": {
"version": "4.5.3",
"resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.3.tgz",
@ -5652,6 +5848,32 @@
"node": ">=10"
}
},
"node_modules/m3u8-parser": {
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/m3u8-parser/-/m3u8-parser-6.2.0.tgz",
"integrity": "sha512-qlC00JTxYOxawcqg+RB8jbyNwL3foY/nCY61kyWP+RCuJE9APLeqB/nSlTjb4Mg0yRmyERgjswpdQxMvkeoDrg==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"@videojs/vhs-utils": "^3.0.5",
"global": "^4.4.0"
}
},
"node_modules/m3u8-parser/node_modules/@videojs/vhs-utils": {
"version": "3.0.5",
"resolved": "https://registry.npmjs.org/@videojs/vhs-utils/-/vhs-utils-3.0.5.tgz",
"integrity": "sha512-PKVgdo8/GReqdx512F+ombhS+Bzogiofy1LgAj4tN8PfdBx3HSS7V5WfJotKTqtOWGwVfSWsrYN/t09/DSryrw==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"global": "^4.4.0",
"url-toolkit": "^2.2.1"
},
"engines": {
"node": ">=8",
"npm": ">=5"
}
},
"node_modules/make-dir": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
@ -5735,6 +5957,15 @@
"node": ">= 0.6"
}
},
"node_modules/min-document": {
"version": "2.19.0",
"resolved": "https://registry.npmjs.org/min-document/-/min-document-2.19.0.tgz",
"integrity": "sha512-9Wy1B3m3f66bPPmU5hdA4DR4PB2OfDU/+GS3yAB7IQozE3tqXaVv2zOjgla7MEGSRv95+ILmOuvhLkOK6wJtCQ==",
"dev": true,
"dependencies": {
"dom-walk": "^0.1.0"
}
},
"node_modules/minimatch": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
@ -5763,11 +5994,58 @@
"node": "*"
}
},
"node_modules/mpd-parser": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/mpd-parser/-/mpd-parser-1.2.2.tgz",
"integrity": "sha512-QCfB1koOoZw6E5La1cx+W/Yd0EZlRhHMqMr4TAJez0eRTuPDzPM5FWoiOqjyo37W+ISPLzmfJACSbJFEBjbL4Q==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"@videojs/vhs-utils": "^3.0.5",
"@xmldom/xmldom": "^0.8.3",
"global": "^4.4.0"
},
"bin": {
"mpd-to-m3u8-json": "bin/parse.js"
}
},
"node_modules/mpd-parser/node_modules/@videojs/vhs-utils": {
"version": "3.0.5",
"resolved": "https://registry.npmjs.org/@videojs/vhs-utils/-/vhs-utils-3.0.5.tgz",
"integrity": "sha512-PKVgdo8/GReqdx512F+ombhS+Bzogiofy1LgAj4tN8PfdBx3HSS7V5WfJotKTqtOWGwVfSWsrYN/t09/DSryrw==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"global": "^4.4.0",
"url-toolkit": "^2.2.1"
},
"engines": {
"node": ">=8",
"npm": ">=5"
}
},
"node_modules/ms": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
},
"node_modules/mux.js": {
"version": "6.3.0",
"resolved": "https://registry.npmjs.org/mux.js/-/mux.js-6.3.0.tgz",
"integrity": "sha512-/QTkbSAP2+w1nxV+qTcumSDN5PA98P0tjrADijIzQHe85oBK3Akhy9AHlH0ne/GombLMz1rLyvVsmrgRxoPDrQ==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.11.2",
"global": "^4.4.0"
},
"bin": {
"muxjs-transmux": "bin/transmux.js"
},
"engines": {
"node": ">=8",
"npm": ">=5"
}
},
"node_modules/mz": {
"version": "2.7.0",
"resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz",
@ -6164,6 +6442,18 @@
"node": ">= 6"
}
},
"node_modules/pkcs7": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/pkcs7/-/pkcs7-1.0.4.tgz",
"integrity": "sha512-afRERtHn54AlwaF2/+LFszyAANTCggGilmcmILUzEjvs3XgFZT+xE6+QWQcAGmu4xajy+Xtj7acLOPdx5/eXWQ==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.5.5"
},
"bin": {
"pkcs7": "bin/cli.js"
}
},
"node_modules/postcss": {
"version": "8.4.29",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.29.tgz",
@ -6338,6 +6628,15 @@
"prettier": ">=2.2.0"
}
},
"node_modules/process": {
"version": "0.11.10",
"resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
"integrity": "sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==",
"dev": true,
"engines": {
"node": ">= 0.6.0"
}
},
"node_modules/prop-types": {
"version": "15.8.1",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
@ -6416,14 +6715,14 @@
}
},
"node_modules/react-bootstrap": {
"version": "2.8.0",
"resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-2.8.0.tgz",
"integrity": "sha512-e/aNtxl0Z2ozrIaR82jr6Zz7ss9GSoaXpQaxmvtDUsTZIq/XalkduR/ZXP6vbQHz2T4syvjA+4FbtwELxxmpww==",
"version": "2.9.0",
"resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-2.9.0.tgz",
"integrity": "sha512-dGh6fGjqR9MBzPOp2KbXJznt1Zy6SWepXYUdxMT18Zu/wJ73HCU8JNZe9dfzjmVssZYsJH9N3HHE4wAtQvNz7g==",
"dependencies": {
"@babel/runtime": "^7.21.0",
"@babel/runtime": "^7.22.5",
"@restart/hooks": "^0.4.9",
"@restart/ui": "^1.6.3",
"@types/react-transition-group": "^4.4.5",
"@restart/ui": "^1.6.6",
"@types/react-transition-group": "^4.4.6",
"classnames": "^2.3.2",
"dom-helpers": "^5.2.1",
"invariant": "^2.2.4",
@ -6469,6 +6768,11 @@
"react": "17.0.2"
}
},
"node_modules/react-fast-compare": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.2.tgz",
"integrity": "sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ=="
},
"node_modules/react-icons": {
"version": "4.11.0",
"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.11.0.tgz",
@ -6505,6 +6809,20 @@
"react-dom": "^0.14.0 || ^15.0.0 || ^16 || ^17 || ^18"
}
},
"node_modules/react-popper": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.3.0.tgz",
"integrity": "sha512-e1hj8lL3uM+sgSR4Lxzn5h1GxBlpa4CQz0XLF8kx4MDrDRWY0Ena4c97PUeSX9i5W3UAfDP0z0FXCTQkoXUl3Q==",
"dependencies": {
"react-fast-compare": "^3.0.1",
"warning": "^4.0.2"
},
"peerDependencies": {
"@popperjs/core": "^2.0.0",
"react": "^16.8.0 || ^17 || ^18",
"react-dom": "^16.8.0 || ^17 || ^18"
}
},
"node_modules/react-rating": {
"version": "2.0.5",
"resolved": "https://registry.npmjs.org/react-rating/-/react-rating-2.0.5.tgz",
@ -6604,6 +6922,23 @@
"react": ">=0.14.1"
}
},
"node_modules/reactstrap": {
"version": "9.2.0",
"resolved": "https://registry.npmjs.org/reactstrap/-/reactstrap-9.2.0.tgz",
"integrity": "sha512-WWLTEG00qYav0E55PorWHReYTkz5IqkVmQNy0h6U81yqjSp9fOLFGV5pYSVeAUz+yRhU/RTE0oAWy22zr6sOIw==",
"dependencies": {
"@babel/runtime": "^7.12.5",
"@popperjs/core": "^2.6.0",
"classnames": "^2.2.3",
"prop-types": "^15.5.8",
"react-popper": "^2.2.4",
"react-transition-group": "^4.4.2"
},
"peerDependencies": {
"react": ">=16.8.0",
"react-dom": ">=16.8.0"
}
},
"node_modules/read-cache": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
@ -6835,6 +7170,15 @@
"queue-microtask": "^1.2.2"
}
},
"node_modules/rust-result": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/rust-result/-/rust-result-1.0.0.tgz",
"integrity": "sha512-6cJzSBU+J/RJCF063onnQf0cDUOHs9uZI1oroSGnHOph+CQTIJ5Pp2hK5kEQq1+7yE/EEWfulSNXAQ2jikPthA==",
"dev": true,
"dependencies": {
"individual": "^2.0.0"
}
},
"node_modules/safe-array-concat": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.0.1.tgz",
@ -6873,6 +7217,15 @@
}
]
},
"node_modules/safe-json-parse": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/safe-json-parse/-/safe-json-parse-4.0.0.tgz",
"integrity": "sha512-RjZPPHugjK0TOzFrLZ8inw44s9bKox99/0AZW9o/BEQVrJfhI+fIHMErnPyRa89/yRXUUr93q+tiN6zhoVV4wQ==",
"dev": true,
"dependencies": {
"rust-result": "^1.0.0"
}
},
"node_modules/safe-regex-test": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.0.tgz",
@ -7688,6 +8041,12 @@
"punycode": "^2.1.0"
}
},
"node_modules/url-toolkit": {
"version": "2.2.5",
"resolved": "https://registry.npmjs.org/url-toolkit/-/url-toolkit-2.2.5.tgz",
"integrity": "sha512-mtN6xk+Nac+oyJ/PrI7tzfmomRVNFIWKUbG8jdYFt52hxbiReFAXIjYskvu64/dvuW71IcB7lV8l0HvZMac6Jg==",
"dev": true
},
"node_modules/use-isomorphic-layout-effect": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/use-isomorphic-layout-effect/-/use-isomorphic-layout-effect-1.1.2.tgz",
@ -7732,6 +8091,59 @@
"integrity": "sha512-ocyWc3bAHBB/guyqJQVI5o4BZkPhznPYUG2ea80Gond/BgNWpap8TOmLSeeQG7bnh2KMISxskdADG59j7zruhw==",
"dev": true
},
"node_modules/video.js": {
"version": "8.5.2",
"resolved": "https://registry.npmjs.org/video.js/-/video.js-8.5.2.tgz",
"integrity": "sha512-6/uNXQV3xSaKLpaPf/bVvr7omd+82sKUp0RMBgIt4PxHIe28GtX+O+GcNfI2fuwBvcDRDqk5Ei5AG9bJJOpulA==",
"dev": true,
"dependencies": {
"@babel/runtime": "^7.12.5",
"@videojs/http-streaming": "3.5.3",
"@videojs/vhs-utils": "^4.0.0",
"@videojs/xhr": "2.6.0",
"aes-decrypter": "^4.0.1",
"global": "4.4.0",
"keycode": "2.2.0",
"m3u8-parser": "^6.0.0",
"mpd-parser": "^1.0.1",
"mux.js": "^6.2.0",
"safe-json-parse": "4.0.0",
"videojs-contrib-quality-levels": "4.0.0",
"videojs-font": "4.1.0",
"videojs-vtt.js": "0.15.5"
}
},
"node_modules/videojs-contrib-quality-levels": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/videojs-contrib-quality-levels/-/videojs-contrib-quality-levels-4.0.0.tgz",
"integrity": "sha512-u5rmd8BjLwANp7XwuQ0Q/me34bMe6zg9PQdHfTS7aXgiVRbNTb4djcmfG7aeSrkpZjg+XCLezFNenlJaCjBHKw==",
"dev": true,
"dependencies": {
"global": "^4.4.0"
},
"engines": {
"node": ">=14",
"npm": ">=6"
},
"peerDependencies": {
"video.js": "^8"
}
},
"node_modules/videojs-font": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/videojs-font/-/videojs-font-4.1.0.tgz",
"integrity": "sha512-X1LuPfLZPisPLrANIAKCknZbZu5obVM/ylfd1CN+SsCmPZQ3UMDPcvLTpPBJxcBuTpHQq2MO1QCFt7p8spnZ/w==",
"dev": true
},
"node_modules/videojs-vtt.js": {
"version": "0.15.5",
"resolved": "https://registry.npmjs.org/videojs-vtt.js/-/videojs-vtt.js-0.15.5.tgz",
"integrity": "sha512-yZbBxvA7QMYn15Lr/ZfhhLPrNpI/RmCSCqgIff57GC2gIrV5YfyzLfLyZMj0NnZSAz8syB4N0nHXpZg9MyrMOQ==",
"dev": true,
"dependencies": {
"global": "^4.3.1"
}
},
"node_modules/warning": {
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",

6
package.json
View file

@ -11,12 +11,13 @@
},
"dependencies": {
"axios": "^1.5.0",
"bootstrap": "^5.3.2",
"moment": "^2.29.4",
"next": "12.1.0",
"next-themes": "^0.2.1",
"nprogress": "^0.2.0",
"react": "17.0.2",
"react-bootstrap": "^2.8.0",
"react-bootstrap": "^2.9.0",
"react-data-table-component": "^7.5.4",
"react-dom": "17.0.2",
"react-icons": "^4.3.1",
@ -26,6 +27,7 @@
"react-toastify": "^9.1.3",
"react-tooltip": "^5.21.3",
"react-youtube": "^10.1.0",
"reactstrap": "^9.2.0",
"recoil": "^0.6.1",
"scss": "^0.2.4",
"swr": "^1.2.2",
@ -35,10 +37,12 @@
"autoprefixer": "^10.4.3",
"eslint": "8.11.0",
"eslint-config-next": "12.1.0",
"eslint-config-prettier": "^9.0.0",
"postcss": "^8.4.11",
"prettier": "^2.6.1",
"prettier-plugin-tailwindcss": "^0.1.8",
"tailwindcss": "^3.0.23",
"video.js": "^8.5.2",
"webpack": "^5.88.2"
}
}

20
pages/_document.js
View file

@ -4,20 +4,28 @@ export default function Document() {
return (
<Html>
<Head>
<link rel="shortcut icon" href="/logo.svg" type="image/x-icon" />
<link rel='shortcut icon' href='/logo.svg' type='image/x-icon' />
<link rel='preconnect' href='https://fonts.googleapis.com' />
<link
rel="stylesheet"
href="https://unicons.iconscout.com/release/v4.0.0/css/unicons.css"
href='https://vjs.zencdn.net/8.5.2/video-js.css'
rel='stylesheet'
/>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"></link>
<link
rel='stylesheet'
href='https://unicons.iconscout.com/release/v4.0.0/css/unicons.css'
/>
<link
rel='stylesheet'
href='https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=swap'
/>
<link
rel='stylesheet'
href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'></link>
<link rel='preconnect' href='https://fonts.gstatic.com' crossOrigin />
<link
href='https://fonts.googleapis.com/css2?family=Outfit:wght@300;500&display=swap'
rel='stylesheet'
/>
</Head>
<body>
<Main />

4
pages/api/movie/[id].js
View file

@ -7,10 +7,6 @@ export default async function handler(req, res) {
const response = await fetch(getMovieDetail(id))
const response2 = await fetch(getMovieCasts(id))
const data = await response.json()
const data2 = await response2.json()
const response3 = await fetch(getLinkByIMDB(data.imdb_id));

1
pages/api/tv/[id].js
View file

@ -8,6 +8,7 @@ export default async function handler(req, res) {
const response2 = await fetch(getTvCasts(id))
const data = await response.json()
const data2 = await response2.json()
res.status(200).json({
detail: data,
credits: data2,

8
pages/f.js Normal file
View file

@ -0,0 +1,8 @@
export default function Fdd(){
return(
<>
<div>helllo</div>
</>
)
}

486
pages/get-posts/[category].js
View file

@ -1,259 +1,261 @@
import { SearchSVG } from '../../SVG/search'
import React, { useEffect, useState } from 'react'
import {SearchSVG} from '../../SVG/search'
import React, {useEffect, useState} from 'react'
import { getSearchResult, moviesListApi } from '../../service/service'
import {getSearchResult, moviesListApi} from '../../service/service'
import ToastMsg from '../../Common/ToastMsg'
import { Loader } from '../../Common/Loader'
import { useRouter } from 'next/router'
import {Loader} from '../../Common/Loader'
import {useRouter} from 'next/router'
import CardExpanded from '../../Common/CardExpanded'
import { CompactList, ExpandedList } from '../../SVG/listing'
import {CompactList, ExpandedList} from '../../SVG/listing'
import CardCompact from '../../Common/CardCompact'
import Head from 'next/head'
import { useTheme } from 'next-themes'
import {useTheme} from 'next-themes'
const Latest = () => {
const router = useRouter()
const { category } = router.query
const categoryId = category ? category.split(':')[1] : null
const router = useRouter()
const {category} = router.query
const categoryId = category ? category.split(':')[1] : null
// { name: "TV-Show", cat: "TV", time: "10D", color: "#7a1fb8" },
// { name: "Games", cat: "Games", time: "10D", color: "#AD1F2F" },
// { name: "Music", cat: "Music", time: "10D", color: "#411eed" },
// { name: "Anime", cat: "Anime", time: "10D", color: "#001F1F" },
// { name: "Books", cat: "Books", time: "10D", color: "#fD1Df1" },
// { name: "XXX", cat: "XXX", time: "10D", color: "#Fc3799" },
// { name: "Other", cat: "Other", time: "10D", color: "#ff0000" }]
let data = [
{ name: 'Movie', cat: 'Movies', time: '10D', color: '#ee7633' },
{
name: 'TV-Show',
cat: 'TV',
time: '10D',
light_color: '#7affb8',
dark_color: '#7a1fb8',
},
{
name: 'Games',
cat: 'Games',
time: '10D',
light_color: '#ADFF2F',
dark_color: '#AD1F2F',
},
{
name: 'Music',
cat: 'Music',
time: '10D',
light_color: '#418eed',
dark_color: '#411eed',
},
{
name: 'Anime',
cat: 'Anime',
time: '10D',
light_color: '#00FFFF',
dark_color: '#001F1F',
},
{
name: 'Books',
cat: 'Books',
time: '10D',
light_color: '#CDCD00',
dark_color: '#fD1Df1',
},
{
name: 'XXX',
cat: 'XXX',
time: '10D',
light_color: '#FF00FF',
dark_color: '#Fc3799',
},
{
name: 'Other',
cat: 'Other',
time: '10D',
light_color: '#ebad32',
dark_color: '#ff0000',
},
]
const [movieList, setMovieList] = useState([])
const [ListType, setListType] = useState('expanded')
const [Filter, setFilter] = useState(false)
const [page, setPage] = useState(1)
const [loader, setLoader] = useState(false)
const [cat, setCat] = useState(categoryId)
const [search, setSearch] = useState(false)
const { theme, setTheme } = useTheme()
setTheme(theme)
useEffect(() => {
fetchMovieList(cat)
}, [page])
useEffect(() => {
fetchMovieListRefresh(category?.split(':')[1])
setCat(category?.split(':')[1])
}, [category])
// { name: "TV-Show", cat: "TV", time: "10D", color: "#7a1fb8" },
// { name: "Games", cat: "Games", time: "10D", color: "#AD1F2F" },
// { name: "Music", cat: "Music", time: "10D", color: "#411eed" },
// { name: "Anime", cat: "Anime", time: "10D", color: "#001F1F" },
// { name: "Books", cat: "Books", time: "10D", color: "#fD1Df1" },
// { name: "XXX", cat: "XXX", time: "10D", color: "#Fc3799" },
// { name: "Other", cat: "Other", time: "10D", color: "#ff0000" }]
let data = [
{name: 'Movie', cat: 'Movies', time: '10D', color: '#ee7633'},
{
name: 'TV-Show',
cat: 'TV',
time: '10D',
light_color: '#7affb8',
dark_color: '#7a1fb8',
},
{
name: 'Games',
cat: 'Games',
time: '10D',
light_color: '#ADFF2F',
dark_color: '#AD1F2F',
},
{
name: 'Music',
cat: 'Music',
time: '10D',
light_color: '#418eed',
dark_color: '#411eed',
},
{
name: 'Anime',
cat: 'Anime',
time: '10D',
light_color: '#00FFFF',
dark_color: '#001F1F',
},
{
name: 'Books',
cat: 'Books',
time: '10D',
light_color: '#CDCD00',
dark_color: '#fD1Df1',
},
{
name: 'XXX',
cat: 'XXX',
time: '10D',
light_color: '#FF00FF',
dark_color: '#Fc3799',
},
{
name: 'Other',
cat: 'Other',
time: '10D',
light_color: '#ebad32',
dark_color: '#ff0000',
},
]
const [movieList, setMovieList] = useState([])
const [ListType, setListType] = useState('expanded')
const [Filter, setFilter] = useState(false)
const [page, setPage] = useState(1)
const [loader, setLoader] = useState(false)
const [cat, setCat] = useState(categoryId)
const [search, setSearch] = useState(false)
const {theme, setTheme} = useTheme()
setTheme(theme)
useEffect(() => {
fetchMovieList(cat)
}, [page])
useEffect(() => {
fetchMovieListRefresh(category?.split(':')[1])
setCat(category?.split(':')[1])
}, [category])
const fetchMovieList = cat => {
let category = cat ? cat : 'Movies'
let latest = ''
setLoader(true)
moviesListApi(page, category, latest)
.then(res => {
console.log('page', res?.data?.results)
setLoader(false)
setMovieList([...movieList, ...res.data.results])
})
.catch(err => {
console.log('error', err)
ToastMsg('Some thing went wrong ', 'error')
setLoader(false)
})
}
const fetchMovieListRefresh = categoryId => {
let latest = ''
setLoader(true)
moviesListApi(page, categoryId, latest)
.then(res => {
console.log('page', res?.data?.results)
setLoader(false)
setMovieList(res.data.results)
})
.catch(err => {
console.log('error', err)
ToastMsg('Some thing went wrong ', 'error')
setLoader(false)
})
}
const searchResult = e => {
e.preventDefault()
setLoader(true)
getSearchResult(search)
.then(res => {
console.log('page', res?.data?.results)
setLoader(false)
setMovieList(res.data.results)
})
.catch(err => {
console.log('error', err)
ToastMsg('Some thing went wrong ', 'error')
setLoader(false)
})
}
const handleScroll = () => {
if (
window.innerHeight + window.scrollY >
document.body.scrollHeight - 150
) {
setTimeout(() => {
setPage(page + 1)
}, 100)
const fetchMovieList = cat => {
let category = cat ? cat : 'Movies'
let latest = ''
setLoader(true)
moviesListApi(page, category, latest)
.then(res => {
console.log('page', res?.data?.results)
setLoader(false)
setMovieList([...movieList, ...res.data.results])
})
.catch(err => {
console.log('error', err)
ToastMsg('Some thing went wrong ', 'error')
setLoader(false)
})
}
}
useEffect(() => {
window.addEventListener('scroll', handleScroll)
return () => {
window.removeEventListener('scroll', handleScroll)
const fetchMovieListRefresh = categoryId => {
let latest = ''
setLoader(true)
moviesListApi(page, categoryId, latest)
.then(res => {
console.log('page', res?.data?.results)
setLoader(false)
setMovieList(res.data.results)
})
.catch(err => {
console.log('error', err)
ToastMsg('Some thing went wrong ', 'error')
setLoader(false)
})
}
}, [page])
return (
<div className='font-montserrat text-center'>
<Head>
<title>{categoryId} | Yaps</title>
</Head>
{!movieList.length > 0 ? <Loader /> : null}
<div className='w-full justify-end'>
<form
onSubmit={e => {
searchResult(e)
}}
className='mx-auto my-3 flex w-10/12 items-center border-b-[1px] border-primary px-1 md:w-1/2'>
<input
className='placeholder:font-montserrat font-montserrat w-full bg-transparent py-4 text-lg font-light outline-none placeholder:text-black dark:placeholder:text-app-pure-white'
onChange={e => {
setSearch(e.target.value)
}}
placeholder='Start typing what you want ?'
/>
<div
className='cursor-pointer'
onClick={e => {
searchResult(e)
router.push(`/get-posts/keywords:${search}/`)
}}>
<SearchSVG />
</div>
</form>
<div className='mx-8 flex flex-wrap justify-center text-center'>
{data.map((item, index) => {
return (
<div
onClick={() => {
setCat(item?.cat)
setPage(1)
router.push(`/get-posts/category:${item?.cat}`)
}}
key={index}
className={`category-text bg-primary/15 mx-2 my-1 flex cursor-pointer rounded px-2 py-0.5 text-[15px] font-light lowercase hover:bg-[#008000] !hover:text-[${item.hover_color}] `}
style={{
color:
cat === item?.cat
? '#fff'
: theme === 'light'
? item?.dark_color
: item?.light_color,
background: cat === item?.cat ? '#008000' : '',
}}>
<label className='cursor-pointer'>{item?.name} </label>
</div>
)
})}
const searchResult = e => {
e.preventDefault()
if (!movieList) {
setLoader(true)
getSearchResult(search)
.then(res => {
console.log('page', res?.data?.results)
setLoader(false)
setMovieList(res.data.results)
})
.catch(err => {
console.log('error', err)
ToastMsg('Some thing went wrong ', 'error')
setLoader(false)
})
}
}
const handleScroll = () => {
if (
window.innerHeight + window.scrollY >
document.body.scrollHeight - 150
) {
setTimeout(() => {
setPage(page + 1)
}, 100)
}
}
useEffect(() => {
window.addEventListener('scroll', handleScroll)
return () => {
window.removeEventListener('scroll', handleScroll)
}
}, [page])
return (
<div className='font-montserrat text-center'>
<Head>
<title>Browse | Yaps</title>
</Head>
{!movieList.length > 0 ? <Loader/> : null}
<div className='w-full justify-end'>
<form
onSubmit={e => {
searchResult(e)
}}
className='mx-auto my-3 flex w-10/12 items-center border-b-[1px] border-primary px-1 md:w-1/2'>
<input
className='placeholder:font-montserrat font-montserrat w-full bg-transparent py-4 text-lg font-light outline-none placeholder:text-black dark:placeholder:text-app-pure-white'
onChange={e => {
setSearch(e.target.value)
}}
placeholder='Start typing what you want ?'
/>
<div
className='cursor-pointer'
onClick={e => {
searchResult(e)
router.push(`/get-posts/keywords:${search}/`)
}}>
<SearchSVG/>
</div>
</form>
<div className='mx-8 flex flex-wrap justify-center text-center'>
{data.map((item, index) => {
return (
<div
onClick={() => {
setCat(item?.cat)
setPage(1)
router.push(`/get-posts/category:${item?.cat}`)
}}
key={index}
className={`category-text bg-primary/15 mx-2 my-1 flex cursor-pointer rounded px-2 py-0.5 text-[15px] font-light lowercase hover:bg-[#008000] !hover:text-[${item.hover_color}] `}
style={{
color:
cat === item?.cat
? '#fff'
: theme === 'light'
? item?.dark_color
: item?.light_color,
background: cat === item?.cat ? '#008000' : '',
}}>
<label className='cursor-pointer'>{item?.name} </label>
</div>
)
})}
</div>
</div>
<div className='w-full'>
<div className='absolute right-0 flex justify-end md:right-[4%]'>
<div
className={`px-4 py-[0.35rem] ${
ListType === 'compact' ? 'bg-primary/30 text-primary' : ''
} cursor-pointer rounded-xl transition-all duration-200`}
onClick={() => {
setListType('compact')
}}>
<CompactList/>
</div>
<div
className={`px-4 py-[0.35rem] ${
ListType === 'expanded' ? 'bg-primary/30 text-primary' : ''
} cursor-pointer rounded-xl transition-all duration-200`}
onClick={() => {
setListType('expanded')
}}>
<ExpandedList/>
</div>
</div>
</div>
<br/> <br/>
<div className='relative mb-[3rem] flex w-auto overflow-hidden rounded-xl text-center'>
<div className={`flex w-full flex-wrap justify-evenly p-2 py-8 `}>
{movieList?.map((item, index) => {
if (ListType === 'compact') {
return (
<CardCompact key={index} item={item} categoryId={categoryId}/>
)
} else {
return (
<CardExpanded key={index} item={item} categoryId={categoryId}/>
)
}
})}
{movieList.length === 0 ? <h1>No Data Found </h1> : null}
</div>
</div>
</div>
</div>
<div className='w-full'>
<div className='absolute right-0 flex justify-end md:right-[4%]'>
<div
className={`px-4 py-[0.35rem] ${
ListType === 'compact' ? 'bg-primary/30 text-primary' : ''
} cursor-pointer rounded-xl transition-all duration-200`}
onClick={() => {
setListType('compact')
}}>
<CompactList />
</div>
<div
className={`px-4 py-[0.35rem] ${
ListType === 'expanded' ? 'bg-primary/30 text-primary' : ''
} cursor-pointer rounded-xl transition-all duration-200`}
onClick={() => {
setListType('expanded')
}}>
<ExpandedList />
</div>
</div>
</div>
<br /> <br />
<div className='relative mb-[3rem] flex w-auto overflow-hidden rounded-xl text-center'>
<div className={`flex w-full flex-wrap justify-evenly p-2 py-8 `}>
{movieList?.map((item, index) => {
if (ListType === 'compact') {
return (
<CardCompact key={index} item={item} categoryId={categoryId} />
)
} else {
return (
<CardExpanded key={index} item={item} categoryId={categoryId} />
)
}
})}
{movieList.length === 0 ? <h1>No Data Found </h1> : null}
</div>
</div>
</div>
)
)
}
export default Latest

5
pages/index.js
View file

@ -3,9 +3,9 @@ import CardTrending from '../components/CardTrending'
import Collection from '../components/Collection'
import SearchBar from '../components/SearchBar'
import {pathToSearchAll} from '../utils'
import CollectionContinueWatching from "../components/CollectionContinueWatching";
import {ThemeToggler} from "../components/ThemeToggler";
import {useTheme} from "next-themes";
export default function Home() {
const limitNormal = 6
const limitTrending = 10
@ -15,6 +15,9 @@ export default function Home() {
<title>Home | Yaps</title>
</Head>
<SearchBar searchPath={pathToSearchAll}/>
{/*Continue watching*/}
<CollectionContinueWatching
/>
{/* Collection of different groups of movies */}
<Collection
isHomePage

6
pages/movie/[id].js
View file

@ -47,7 +47,7 @@ const handleClose =()=>{
<>
<Head>
<title>{movie?.detail?.title} | </title>
<title>{movie?.detail?.title} | YAPS</title>
</Head>
<SearchBar
placeholder='Search for movies'
@ -129,7 +129,7 @@ export function renderRating(rating) {
}
}
function renderLength(runtime) {
export function renderLength(runtime) {
if (runtime !== 0 && runtime !== undefined) {
return runtime + ' min?.'
} else {
@ -145,7 +145,7 @@ export function renderLanguage(languages) {
}
}
function renderYear(year) {
export function renderYear(year) {
if (!year) {
return 'N/A'
} else {

123
pages/play/movies.js
View file

@ -1,20 +1,113 @@
import React from 'react'
import { useRouter } from 'next/router';
import React, {useEffect, useState} from 'react'
import {useRouter} from 'next/router';
import Head from 'next/head'
import useSWR from "swr";
import {BsFillLightbulbFill} from "react-icons/bs";
import {useTheme} from "next-themes";
const servers_ = [{
servername: "Vidsrc.to", link: "https://vidsrc.to/embed/movie/"
}, {
servername: "Vidsrc.me", link: "https://vidsrc.me/embed/movie?",
}, {
servername: "Moviesapi.club", link: "https://moviesapi.club/movie/"
}, {
servername: "Blackvid", link: "https://blackvid.space/embed?tmdb="
}]
const fetcher = (...args) => fetch(...args).then((res) => res.json())
const Movies = () => {
const router = useRouter()
const { id,tmdb} = router.query;
return (
<>
<Head>
<title>Play Movies | Yaps</title>
</Head>
<iframe src={`https://vidsrc.me/embed/movie?${tmdb?`tmdb=${tmdb}`:`imdb=${id}&color=fc4544`}`} frameBorder="0" style={{width: '100%' ,height: '92vh'}} allowfullscreen="allowfullscreen"></iframe>
</>
)
}
const {id, tmdb} = router.query;
const me = tmdb ? `tmdb=${tmdb}` : `imdb=${id}`
const {theme} = useTheme();
const to = tmdb ? `${tmdb}` : `${id}`
const [lightStatus, switchLight] = useState(false)
const [videoServer, setVideoServer] = useState('')
const {data} = useSWR(`/api/movie/${id}`, fetcher)
useEffect(() => {
if (localStorage.getItem("userWatched")) {
let data = JSON.parse(localStorage.getItem("userWatched"))
let moviePresent = false
for (let i in data.movies) {
if (id) if (data.movies[i] === id) {
moviePresent = true
} else {
if (data.movies === tmdb) {
moviePresent = true
}
}
}
if (id || tmdb) {
if (!moviePresent) {
if (id)
data.movies.push(id)
else data.movies.push(tmdb)
localStorage.setItem("userWatched", JSON.stringify(data))
}
}
} else {
if (id || tmdb)
localStorage.setItem("userWatched", JSON.stringify({
movies: [id ? id : tmdb], tv: []
}))
}
}, [id, tmdb]);
return (<>
<Head>
<title>Play Movies | Yaps</title>
</Head>
<div
className={` top-0 left-0 z-[997] bg-black transition duration-300 ease-in-out ${lightStatus ? 'opacity-1 fixed w-full h-screen ' : 'opacity-0 h-0 w-0'}`}>
</div>
<div className={"text-4xl"}>
{data ? data.imdb.imdb.name : ""}
</div>
<div
className={`w-full ${lightStatus ? '' : 'h-full'} z-[999] `}>
<div className={` w-full flex flex-col h-full`}>
<iframe src={videoServer ? videoServer : servers_[0].link + to}
className={`z-[998] ${lightStatus ? 'absolute left-0 lg:left-[20%] h-[80vh] lg:w-2/3 w-full ' : 'w-full h-[95vh]'}`}
allowFullScreen="allowfullscreen"></iframe>
<div
className={`${lightStatus ? 'w-1/2 absolute ' : 'w-full '} p-4 pl-0 bg-transparent gap-10 z-[999] flex flex-row justify-start top-[100%] lg:top-[90%] items-center `}>
<div onClick={() => switchLight(!lightStatus)}
className={"flex flex-row gap-1 items-center hover:text-orange-500 transition duration-300 ease-in-out hover:cursor-pointer"}>
<BsFillLightbulbFill/>
<span>Light</span>
</div>
</div>
<div className={`${lightStatus ? 'hidden' : 'flex'} w-full flex justify-start items-center h-36`}>
<div className={"rounded w-full h-full flex flex-row "}>
<div
className={`${theme === 'dark' ? 'bg-[#1e1e1e]' : 'bg-[#c5cc89]'} p-2 h-full flex justify-center items-center flex-col text-center w-1/3`}>
{`You are watching `}
<div className={" font-bold"}>{data ? data.imdb.imdb.name : ""}</div>
<div> If current server doesn't work please try other servers beside.</div>
</div>
<div
className={`${theme === 'dark' ? 'bg-[#171e31]' : 'bg-app-shady-white'} text-black w-2/3 h-full`}>
<div
className={"w-full flex flex-wrap flex-row gap-7 p-5 justify-start items-center h-10"}>
{servers_.map((server, index) => {
return (<div
onClick={() => {
if (server.servername === "Vidsrc.me") setVideoServer(server.link + me)
else if (server.servername === "Vidsrc.to") setVideoServer(server.link + to)
export default Movies
else setVideoServer(server.link + data?.imdb.imdb.tmdb_id);
}}
className={`${theme === 'dark' ? 'bg-app-dark-blue' : 'bg-[#c5cc89]'} dark:text-white hover:scale-110 hover:cursor-pointer transition duration-300 ease-in-out rounded p-3 w-max text-center h-8`}
key={index}>
{server.servername}
</div>)
})}
</div>
</div>
</div>
</div>
</div>
</div>
</>)
}
export default Movies;

284
pages/play/tv.js
View file

@ -1,18 +1,280 @@
import React from 'react'
import { useRouter } from 'next/router';
import React, {useEffect, useState} from 'react'
import {useRouter} from 'next/router';
import Head from 'next/head'
import {AiOutlineDown,AiOutlineRight} from "react-icons/ai";
import useSWR from "swr";
import {BsFillLightbulbFill} from "react-icons/bs";
const servers_ = [{
servername: "Vidsrc.to", link: "https://vidsrc.to/embed/movie/"
}, {
servername: "Vidsrc.me", link: "https://vidsrc.me/embed/movie?",
}, {
servername: "Moviesapi.club", link: "https://moviesapi.club/movie/"
}, {
servername: "Blackvid", link: "https://blackvid.space/embed?tmdb="
}]
const fetcher = (...args) => fetch(...args).then((res) => res.json())
const Tv = () => {
const router = useRouter()
const { id,tmdb} = router.query;
return (
<>
<Head>
<title>Play Tv | Yaps</title>
</Head>
<iframe src={`https://vidsrc.me/embed/tv?${tmdb?(`tmdb=${tmdb}`):(`imdb=${id}`)}&color=fc4544`} frameBorder="0" style={{width: '100%' ,height: '92vh'}} allowfullscreen="allowfullscreen"></iframe>
</>
)
const {id, tmdb} = router.query;
const {data} = useSWR(`/api/tv/${tmdb}`, fetcher)
const [tvDetails, setTvDetails] = useState({
episode: 1, season: 1
})
const [season, SetSeason] = useState([]);
const [episodes, setEpisodes] = useState({})
const [seasonDropDown, setSeasonDropDown] = useState(false)
const [episodeDropDown, setEpisodeDropDown] = useState(false)
const [videoServer, setVideoServer] = useState('')
const [lightStatus, switchLight] = useState(false)
useEffect(() => {
let temp = []
if (data)
if (data.detail.seasons[0].name.includes("Specials"))
for (let i = 1; i < data.detail.seasons.length; i++) {
temp.push(i);
}
else
for (let i = 1; i <= data.detail.seasons.length; i++) {
temp.push(i);
}
SetSeason(temp)
let episode = [];
let c = 1;
if (data) {
if (data.detail.seasons[0].name.includes("Specials")) {
for (let k = 0; k < temp.length; k++) {
for (let i = 1; i < data.detail.seasons[c].episode_count + 1; i++)
episode.push(i);
episodes[c] = episode
c++;
episode = []
}
} else {
c = 0;
for (let k = 0; k < temp.length; k++) {
for (let i = 1; i < data.detail.seasons[c].episode_count + 1; i++)
episode.push(i);
episodes[c + 1] = episode
c++;
episode = []
}
}
}
}, [seasonDropDown, episodeDropDown]);
useEffect(() => {
if (localStorage.getItem("userWatched")) {
let data = JSON.parse(localStorage.getItem("userWatched"))
let tvPresent = -1
if (id || tmdb) {
for (let i in data.tv) {
if (id) {
if (data.tv[i][0] === id) {
tvPresent = i
}
} else {
if (data.tv[i][0] === tmdb) {
tvPresent = i
}
}
}
}
if (id || tmdb)
if (tvPresent !== -1) {
setTvDetails({season: data.tv[i][1], episode: data.tv[i][2]})
} else {
if (id || tmdb) {
if (id)
data.tv.push([id, tvDetails.season, tvDetails.episode])
else data.tv.push([tmdb, tvDetails.season, tvDetails.episode])
localStorage.setItem("userWatched", JSON.stringify(data))
}
}
} else {
if (id || tmdb)
localStorage.setItem("userWatched", JSON.stringify({
movies: [], tv: [[id ? id : tmdb, tvDetails.season, tvDetails.episode]]
}))
}
}, [id, tmdb]);
useEffect(() => {
if (data !== undefined) {
if (localStorage.getItem('userWatched')) {
let dataa = JSON.parse(localStorage.getItem("userWatched"))
let tvPresent = -1
if (id || tmdb) {
for (let i in dataa.tv) {
if (id) {
if (dataa.tv[i][0] === id) {
tvPresent = i
}
} else {
if (dataa.tv[i][0] === tmdb) {
tvPresent = i
}
}
}
}
if (id || tmdb)
if (tvPresent !== -1) {
if (id) dataa.tv[tvPresent] = [id, tvDetails.season, tvDetails.episode]
else dataa.tv[tvPresent] = [tmdb, tvDetails.season, tvDetails.episode]
localStorage.setItem("userWatched", JSON.stringify(dataa))
} else {
if (id || tmdb) {
if (id)
dataa.tv.push([id, tvDetails.season, tvDetails.episode])
else dataa.tv.push([tmdb, tvDetails.season, tvDetails.episode])
localStorage.setItem("userWatched", JSON.stringify(dataa))
}
}
}
}
}, [tvDetails]);
useEffect(() => {
if (data !== undefined) {
let inputstrings = `${data?.detail.name}season`
let inputStringe = `${data?.detail.name}episode`
if (localStorage.getItem(inputstrings.replace(/\s+/g, "").toLowerCase())) {
localStorage.setItem(inputstrings.replace(/\s+/g, "").toLowerCase(), tvDetails.season)
}
if (localStorage.getItem(inputStringe.replace(/\s+/g, "").toLowerCase())) {
localStorage.setItem(inputStringe.replace(/\s+/g, "").toLowerCase(), tvDetails.episode)
}
if (videoServer.includes("vidsrc.me")) setVideoServer(`https://vidsrc.me/embed/tv?${tmdb ? `tmdb=${tmdb}` : `imdb=${id}`}&season=${tvDetails.season}&episode=${tvDetails.episode}`)
if (videoServer.includes("vidsrc.to")) setVideoServer(`https://vidsrc.to/embed/tv/${tmdb ? `${tmdb}` : `${id}`}/${tvDetails.season}/${tvDetails.episode}`)
else if (videoServer.includes("moviesapi.club")) setVideoServer(`https://moviesapi.club/tv/${tmdb}-${tvDetails.season}-${tvDetails.episode}`)
else if (videoServer.includes("blackvid.space")) setVideoServer(`https://blackvid.space/embed?tmdb=${tmdb}&season=${tvDetails.season}&episode=${tvDetails.episode}`);
}
}, [tvDetails]);
return (
<>
<Head>
<title>Play Tv | Yaps</title>
</Head>
<div
className={`w-full h-screen top-0 left-0 z-[997] bg-black transition duration-300 ease-in-out ${lightStatus ? 'opacity-1 fixed' : 'opacity-0 h-0 w-0'}`}>
</div>
<div
className={` w-full flex flex-col ${lightStatus ? '' : 'h-full'} z-[999] h-full`}>
<div
className={"w-full h-16 pb-2 text-3xl"}>{data?.detail.name} S{tvDetails.season} E{tvDetails.episode}</div>
<iframe
src={videoServer ? videoServer : `https://vidsrc.to/embed/tv/${tmdb ? tmdb : id}/${tvDetails.season}/${tvDetails.episode}`}
className={"z-50"}
style={{width: '100%', height: '92vh'}}
allowFullScreen="allowfullscreen"></iframe>
<div className={"w-full p-4 pl-0 bg-transparent flex gap-10 flex-row justify-start items-center"}>
<div onClick={() => switchLight(!lightStatus)}
className={"flex flex-row gap-1 items-center hover:text-orange-500 transition duration-300 ease-in-out hover:cursor-pointer"}>
<BsFillLightbulbFill/>
<span>Light</span>
</div>
<div className={"relative w-44 "}>
<div
className={"flex z-50 justify-center items-center bg-[#151515] text-white cursor-pointer outline-0 rounded flex-row gap-2"}
onClick={() => {
setSeasonDropDown(!seasonDropDown)
setEpisodeDropDown(false)
}}>
Season {tvDetails.season}<span
className={"pt-1 transition duration-300 ease-in-out"}>{seasonDropDown ? <AiOutlineDown/> :
<AiOutlineRight/>}</span>
</div>
<div
className={` flex-col z-40 bg-app-semi-dark-blue font-normal overflow-y-scroll h-44 text-white w-44 absolute justify-center transition duration-300 ease-in-out items-center ${seasonDropDown ? 'translate-y-0 opacity-1' : 'translate-y-[-150%] opacity-0'} `}>
<ul className={""}>
{season !== [] ? season.map((season, index) => {
return (
<li key={index} onClick={() => {
setTvDetails({season: season, episode: 1})
setSeasonDropDown(false)
}}
className={`relative dropdown-scroll hover:bg-amber-700 hover:cursor-pointer pl-2 flex items-center justify-evenly w-full h-12 ${tvDetails.season === season ? 'bg-amber-700' : ''}`}>
Season <span>{season}</span>
</li>
)
}) : (<li>No Seasons</li>)
}
</ul>
</div>
</div>
<div className={"relative w-44 "}>
<div
className={"flex z-50 rounded justify-center items-center bg-[#151515] text-white flex-row gap-2"}
onClick={() => {
setEpisodeDropDown(!episodeDropDown)
setSeasonDropDown(false)
}}>
Episode {tvDetails.episode}<span
className={"pt-1 transition duration-300 ease-in-out"}>{episodeDropDown ? <AiOutlineDown/> :
<AiOutlineRight/>}</span>
</div>
<div
className={` flex-col z-40 bg-app-semi-dark-blue font-normal overflow-y-scroll h-44 text-white w-44 absolute justify-center transition duration-300 ease-in-out items-center ${episodeDropDown ? 'translate-y-0 opacity-1' : 'translate-y-[-150%] opacity-0'} `}>
<ul className={""}>
{episodes[tvDetails.season] ? episodes[tvDetails.season].map((episode, index) => {
return (
<li key={index} onClick={() => {
setTvDetails(prev => {
return {...prev, episode: episode}
})
setEpisodeDropDown(false)
}}
className={`relative dropdown-scroll hover:bg-amber-700 hover:cursor-pointer pl-2 flex items-center justify-evenly w-full h-12 ${tvDetails.episode === episode ? 'bg-amber-700' : ''}`}>
Episode <span>{episode}</span>
</li>
)
}) : (<li>No Episode</li>)
}
</ul>
</div>
</div>
</div>
<div className={` ${lightStatus ? 'hidden' : 'flex'} w-full justify-start items-center h-36`}>
<div className={"rounded w-full h-full flex flex-row "}>
<div
className={"p-2 h-full bg-app-shady-white dark:bg-app-grey dark:text-black text-center w-1/3"}>
{`You are watching `}
<div className={" font-bold"}>{data ? data.detail.name : ""}</div>
<div> If current server doesn't work please try other servers beside.</div>
</div>
<div className={" bg-app-pure-white text-black w-2/3 h-full"}>
<div
className={"w-full flex flex-wrap flex-row gap-7 p-5 justify-start items-center h-10"}>
{servers_.map((server, index) => {
return (
<div
onClick={() => {
if (server.servername === "Vidsrc.me")
setVideoServer(`${server.link}${tmdb ? `tmdb=${tmdb}` : `imdb=${id}`}&season=${tvDetails.season}&episode=${tvDetails.episode}`)
else if (server.servername === "Vidsrc.to")
setVideoServer(`${server.link}${tmdb ? `${tmdb}` : `${id}`}/${tvDetails.season}/${tvDetails.episode}`)
else if (server.servername === "Moviesapi.club")
setVideoServer(`${server.link}${tmdb}-${tvDetails.season}-${tvDetails.episode}`)
else
setVideoServer(`${server.link}${tmdb}&season=${tvDetails.season}&episode=${tvDetails.episode}`);
}
}
className={`dark:bg-app-semi-dark-blue dark:text-white hover:scale-110 hover:cursor-pointer transition duration-300 ease-in-out rounded p-3 w-max text-center h-8 ${videoServer.includes(server.servername.toLowerCase()) ? 'bg-amber-700' : 'bg-app-shady-white'}`}
key={index}>
{server.servername}
</div>
)
})}
</div>
</div>
</div>
</div>
</div>
</>
)
}
export default Tv

10
pages/post-detail/[id]/[slug].js
View file

@ -143,6 +143,7 @@ const Details = () => {
ToastMsg('Failed to copy!', 'error')
}
}
console.log(data);
return (
<div>
@ -214,14 +215,7 @@ const Details = () => {
{data?.imdb && <button
className='my-3 w-full rounded border-primary bg-primary/10 bg-gradient-to-r from-[#420075] via-purple-500 to-[#FF0054] px-[2rem] py-2 text-[15px] text-gray-100 hover:text-app-dark-blue xl:w-[70%]'
onClick={() => {
if(data?.category_str==="Movies"){
router.push(`/play/movies/?id=${data?.imdb}`)
}
else{
router.push(`/play/tv/?id=${data?.imdb}`)
}
router.push(`/play/${data?.category_str.toLowerCase()}?id=${data?.imdb}&tmdb=${data?.imdb_data.tmdb_id}`)
}}>
Play Now
</button>

969
styles/globals.css
View file

File diff suppressed because it is too large Load diff

2
tailwind.config.js
View file

@ -16,7 +16,7 @@ module.exports = {
circles: "url('/assets/images/background-cicles.png')",
},
colors: {
'light-white': 'rgb(245,245,245,255)',
'light-white': '#f6f4e9',
'app-shady-white': '#e6e6e6',
background: '#0D0F0B',
'background-header': '#131313',

54
utils/index.js
View file

@ -1,24 +1,22 @@
import { v4 as uuidv4 } from 'uuid'
import {v4 as uuidv4} from 'uuid'
export const TMDB_ENDPOINT = "https://api.themoviedb.org/3"
export const TMDB_API_KEY = "d0e6107be30f2a3cb0a34ad2a90ceb6f"
export const TMDB_IMAGE_ENDPOINT = 'https://image.tmdb.org/t/p/original'
export const pathToSearchAll = '/search/'
export const pathToSearchMovie = '/search/movie/'
export const pathToSearchTV = '/search/tv/'
export const fetcher = url => fetch(url).then(res =>{
return res.json()
})
export const fetcher = url => fetch(url).then(res => {
return res.json()
})
export const shimmer = (w, h) => `
<svg width="${w}" height="${h}" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg width="${w}" height="${h}" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<linearGradient id="g">
<stop stop-color="#333" offset="20%" />
@ -33,30 +31,30 @@ export const shimmer = (w, h) => `
`
export const toBase64 = str =>
typeof window === 'undefined'
? Buffer.from(str).toString('base64')
: window.btoa(str)
typeof window === 'undefined'
? Buffer.from(str).toString('base64')
: window.btoa(str)
export const renderResults = (array, Component, media_type) => {
return array.map(item => (
<Component
key={item.id || uuidv4()}
id={item.id}
category={item.media_type || media_type}
rating={item.adult}
src={
item.backdrop_path
? `${TMDB_IMAGE_ENDPOINT}/${item.backdrop_path}`
: `${TMDB_IMAGE_ENDPOINT}/${item.poster_path}`
}
title={
item.title ? item.title : item.original_name || item.original_title
}
year={item.release_date || item.first_air_date}
/>
))
return array.map(item => (
<Component
key={item.id || uuidv4()}
id={item.id}
category={item.media_type || media_type}
rating={item.adult}
src={
item.backdrop_path
? `${TMDB_IMAGE_ENDPOINT}/${item.backdrop_path}`
: `${TMDB_IMAGE_ENDPOINT}/${item.poster_path}`
}
title={
item.title ? item.title : item.original_name || item.original_title
}
year={item.release_date || item.first_air_date}
/>
))
}
export const sliceArray = (arr, limit) => {
return arr.slice(0, limit)
return arr.slice(0, limit)
}