Finished show support

src/components/InputBox.css

@@ -56,7 +56,7 @@
     background-color: #36363e;
     color: white;
     height: auto;
-    width: 5%;
+    width: 10%;
     box-sizing: border-box;
 }
 
@@ -130,7 +130,8 @@
     .inputOptionBox {
         margin-top: .5rem;
         width: 50%;
-        align-items:stretch;
+        /* align-items:stretch; */
+        align-self: center;
         padding: .7rem 1.5rem;
     }
 }

src/components/InputBox.js

@@ -34,7 +34,7 @@ export function InputBox({ onSubmit, placeholder }) {
                 type='text'
                 className='inputOptionBox'
                 id='inputOptionBoxSeason'
-                placeholder='season'
+                placeholder='Season'
                 value={season}
                 onChange={(e) => setSeason(e.target.value)}
                 hidden={showContentType}
@@ -44,7 +44,7 @@ export function InputBox({ onSubmit, placeholder }) {
                 type='text'
                 className='inputOptionBox'
                 id='inputOptionBoxEpisode'
-                placeholder='episode'
+                placeholder='Episode'
                 value={episode}
                 onChange={(e) => setEpisode(e.target.value)}
                 hidden={showContentType}

src/components/MovieRow.js

@@ -12,6 +12,7 @@ export function MovieRow(props) {
                 <span className="year">({props.year})</span>
             </div>
             <div className="watch">
+                <span className='attribute' hidden={props.type === 'show' ? false : true }>{props.season}x{props.episode}</span>
                 <p>Watch {props.type}</p>
                 <Arrow/>
             </div>

src/components/Title.css

@@ -1,7 +1,7 @@
 .title {
     font-size: 2rem;
     color: white;
-    max-width: 20rem;
+    /* max-width: 20rem; */
     margin: 0;
     padding: 0;
     margin-bottom: 3.5rem;

src/lib/lookMovie.js

@@ -79,6 +79,10 @@ async function getStreamUrl(slug, type, season, episode) {
 		}
 	}
 
+    if (id === '') {
+        return { url: '' }
+    }
+
     const videoUrl = await getVideoUrl({
         slug: slug,
         id: id,

src/views/Movie.js

@@ -11,7 +11,7 @@ export function MovieView(props) {
         <div className="cardView">
             <Card fullWidth>
                 <Title accent="Return to home" accentLink="search">
-                    { streamData.title }
+                    {streamData.title} {streamData.type === "show" ? `(${streamData.season}x${streamData.episode})` : '' }
                 </Title>
                 <VideoElement streamUrl={streamUrl}/>
             </Card>

src/views/Search.js

@@ -32,11 +32,18 @@ export function SearchView() {
             setProgress(2);
             setText(`Getting stream for "${title}"`)
             const { url } = await getStreamUrl(slug, type, season, episode);
+
+            if (url === '') {
+                return fail(`Not found: ${title} (${season}x${episode})`)
+            }
+
             setProgress(maxSteps);
             setStreamUrl(url);
             setStreamData({
                 title,
                 type,
+                season,
+                episode
             })
             setText(`Streaming...`)
             navigate("movie")
@@ -57,6 +64,11 @@ export function SearchView() {
             if (options.length === 0) {
                 return fail(`Could not find that ${contentType}`)
             } else if (options.length > 1) {
+                options.forEach((o) => {
+                    o.season = season;
+                    o.episode = episode;
+                });
+
                 setProgress(2);
                 setText(`Choose your ${contentType}`);
                 setOptions(options);
@@ -86,9 +98,9 @@ export function SearchView() {
                     Whoops, there are a few movies like that
                 </Title>
                 {options?.map((v, i) => (
-                    <MovieRow key={i} title={v.title} type={v.type} year={v.year} onClick={() => {
+                    <MovieRow key={i} title={v.title} type={v.type} year={v.year} season={v.season} episode={v.episode} onClick={() => {
                         setShowingOptions(false)
-                        getStream(v.title, v.slug, v.type)
+                        getStream(v.title, v.slug, v.type, v.season, v.episode)
                     }}/>
                 ))}
             </Card>