import React from 'react'; import { InputBox } from '../components/InputBox'; import { Title } from '../components/Title'; import { Card } from '../components/Card'; import { ErrorBanner } from '../components/ErrorBanner'; import { MovieRow } from '../components/MovieRow'; import { Arrow } from '../components/Arrow'; import { Progress } from '../components/Progress'; import { findContent, getStreamUrl, getEpisodes } from '../lib/index'; import { useMovie } from '../hooks/useMovie'; import { TypeSelector } from '../components/TypeSelector'; import './Search.css'; export function SearchView() { const { navigate, setStreamUrl, setStreamData } = useMovie(); const maxSteps = 4; const [options, setOptions] = React.useState([]); const [progress, setProgress] = React.useState(0); const [text, setText] = React.useState(""); const [failed, setFailed] = React.useState(false); const [showingOptions, setShowingOptions] = React.useState(false); const [offlineStatus, setOfflineStatus] = React.useState(false); const [type, setType] = React.useState("movie"); const fail = (str) => { setProgress(maxSteps); setText(str) setFailed(true) } async function getStream(title, slug, type, source) { setStreamUrl(""); try { setProgress(2); setText(`Getting stream for "${title}"`) let seasons = []; let episodes = []; if (type === "show") { const data = await getEpisodes(slug, source); seasons = data.seasons; episodes = data.episodes; } let realUrl = ''; if (type === "movie") { // getStreamUrl(slug, type, source, season, episode) const { url } = await getStreamUrl(slug, type, source); if (url === '') { return fail(`Not found: ${title}`) } realUrl = url; } setProgress(maxSteps); setStreamUrl(realUrl); setStreamData({ title, type, seasons, episodes, slug, source }) setText(`Streaming...`) navigate("movie") } catch (err) { console.error(err); fail("Failed to get stream") } } async function searchMovie(query, contentType) { setFailed(false); setText(`Searching for ${contentType} "${query}"`); setProgress(1) setShowingOptions(false) try { const { options } = await findContent(query, contentType); if (options.length === 0) { return fail(`Could not find that ${contentType}`) } else if (options.length > 1) { setProgress(2); setText(`Choose your ${contentType}`); setOptions(options); setShowingOptions(true); return; } const { title, slug, type, source } = options[0]; getStream(title, slug, type, source); } catch (err) { console.error(err); fail(`Failed to watch ${contentType}`) } } React.useEffect(() => { async function fetchHealth() { const HOME_URL = "https://movie-web-proxy.herokuapp.com" await fetch(HOME_URL).catch(() => { // Request failed; source likely offline setOfflineStatus(`Our content provider is currently offline, apologies.`) }) } fetchHealth() }, []) return (
{offlineStatus ? {offlineStatus} : ''} What do you wanna watch? setType(type)} choices={[ { label: "Movie", value: "movie" }, { label: "TV Show", value: "show" } ]} noWrap={true} selected={type} /> searchMovie(str, type)} /> 0} failed={failed} progress={progress} steps={maxSteps} text={text} /> Whoops, there are a few {type}s like that { Object.entries(options.reduce((a, v) => { if (!a[v.source]) a[v.source] = [] a[v.source].push(v) return a; }, {})).map(v => (

{v[0]}

{v[1].map((v, i) => ( { setShowingOptions(false) getStream(v.title, v.slug, v.type, v.source) }} /> ))}
)) }
Check it out on GitHub
) }