Favicons, github link, error reporting
BIN
public/android-chrome-192x192.png
Normal file
After Width: | Height: | Size: 6.8 KiB |
BIN
public/android-chrome-512x512.png
Normal file
After Width: | Height: | Size: 25 KiB |
BIN
public/apple-touch-icon.png
Normal file
After Width: | Height: | Size: 6.1 KiB |
9
public/browserconfig.xml
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<browserconfig>
|
||||||
|
<msapplication>
|
||||||
|
<tile>
|
||||||
|
<square150x150logo src="/mstile-150x150.png"/>
|
||||||
|
<TileColor>#da532c</TileColor>
|
||||||
|
</tile>
|
||||||
|
</msapplication>
|
||||||
|
</browserconfig>
|
BIN
public/favicon-16x16.png
Normal file
After Width: | Height: | Size: 637 B |
BIN
public/favicon-32x32.png
Normal file
After Width: | Height: | Size: 935 B |
BIN
public/favicon.ico
Normal file
After Width: | Height: | Size: 15 KiB |
@ -4,13 +4,19 @@
|
|||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
<meta name="theme-color" content="#000000" />
|
|
||||||
<meta
|
<meta
|
||||||
name="description"
|
name="description"
|
||||||
content="because watching movies legally is boring"
|
content="because watching movies legally is boring"
|
||||||
/>
|
/>
|
||||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
|
||||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||||
|
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||||
|
<link rel="manifest" href="/site.webmanifest">
|
||||||
|
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#E880C5">
|
||||||
|
<meta name="msapplication-TileColor" content="#E880C5">
|
||||||
|
<meta name="theme-color" content="#E880C5">
|
||||||
|
|
||||||
<title>movie-web</title>
|
<title>movie-web</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
@ -20,6 +20,6 @@
|
|||||||
],
|
],
|
||||||
"start_url": ".",
|
"start_url": ".",
|
||||||
"display": "standalone",
|
"display": "standalone",
|
||||||
"theme_color": "#191c24",
|
"theme_color": "#E880C5",
|
||||||
"background_color": "#0c0e14"
|
"background_color": "#16171D"
|
||||||
}
|
}
|
||||||
|
BIN
public/mstile-150x150.png
Normal file
After Width: | Height: | Size: 3.1 KiB |
18
public/safari-pinned-tab.svg
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
|
||||||
|
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
||||||
|
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
|
||||||
|
width="528.000000pt" height="528.000000pt" viewBox="0 0 528.000000 528.000000"
|
||||||
|
preserveAspectRatio="xMidYMid meet">
|
||||||
|
<metadata>
|
||||||
|
Created by potrace 1.14, written by Peter Selinger 2001-2017
|
||||||
|
</metadata>
|
||||||
|
<g transform="translate(0.000000,528.000000) scale(0.100000,-0.100000)"
|
||||||
|
fill="#000000" stroke="none">
|
||||||
|
<path d="M430 5266 c-152 -33 -307 -156 -373 -297 -20 -42 -41 -105 -47 -140
|
||||||
|
-8 -45 -10 -697 -8 -2229 3 -2105 4 -2166 22 -2215 77 -200 206 -319 400 -369
|
||||||
|
53 -14 305 -16 2210 -16 2367 0 2211 -4 2346 62 136 66 261 231 289 383 8 42
|
||||||
|
11 686 11 2200 0 2355 4 2200 -62 2335 -65 135 -231 261 -378 289 -85 16
|
||||||
|
-4338 13 -4410 -3z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 840 B |
19
public/site.webmanifest
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
{
|
||||||
|
"name": "",
|
||||||
|
"short_name": "",
|
||||||
|
"icons": [
|
||||||
|
{
|
||||||
|
"src": "/android-chrome-192x192.png",
|
||||||
|
"sizes": "192x192",
|
||||||
|
"type": "image/png"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"src": "/android-chrome-512x512.png",
|
||||||
|
"sizes": "512x512",
|
||||||
|
"type": "image/png"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"theme_color": "#E880C5",
|
||||||
|
"background_color": "#16171D",
|
||||||
|
"display": "standalone"
|
||||||
|
}
|
@ -1,3 +1,10 @@
|
|||||||
.videoElement {
|
.videoElement {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
background-color: #111117;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.videoElementText {
|
||||||
|
color: white;
|
||||||
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
@ -5,8 +5,10 @@ import './VideoElement.css'
|
|||||||
// streamUrl: string
|
// streamUrl: string
|
||||||
export function VideoElement({ streamUrl }) {
|
export function VideoElement({ streamUrl }) {
|
||||||
const videoRef = React.useRef(null);
|
const videoRef = React.useRef(null);
|
||||||
|
const [error, setError] = React.useState(false);
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
|
setError(false)
|
||||||
if (!videoRef || !videoRef.current) return;
|
if (!videoRef || !videoRef.current) return;
|
||||||
|
|
||||||
const hls = new Hls();
|
const hls = new Hls();
|
||||||
@ -15,13 +17,17 @@ export function VideoElement({ streamUrl }) {
|
|||||||
videoRef.current.src = streamUrl;
|
videoRef.current.src = streamUrl;
|
||||||
return;
|
return;
|
||||||
} else if (!Hls.isSupported()) {
|
} else if (!Hls.isSupported()) {
|
||||||
return; // TODO show error
|
setError(true)
|
||||||
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
hls.attachMedia(videoRef.current);
|
hls.attachMedia(videoRef.current);
|
||||||
hls.loadSource(streamUrl);
|
hls.loadSource(streamUrl);
|
||||||
}, [videoRef, streamUrl])
|
}, [videoRef, streamUrl])
|
||||||
|
|
||||||
|
if (error)
|
||||||
|
return (<p className="videoElementText">Your browser is not supported</p>)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<video className="videoElement" ref={videoRef} controls autoPlay />
|
<video className="videoElement" ref={videoRef} controls autoPlay />
|
||||||
)
|
)
|
||||||
|
@ -15,3 +15,28 @@
|
|||||||
.cardView > div:first-child {
|
.cardView > div:first-child {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.topRightCredits {
|
||||||
|
position: fixed;
|
||||||
|
right: 1rem;
|
||||||
|
top: 1rem;
|
||||||
|
margin-top: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topRightCredits a, .topRightCredits a:visited {
|
||||||
|
color: #E880C5;
|
||||||
|
text-decoration: none;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.topRightCredits a:hover, .topRightCredits a:active {
|
||||||
|
color: #f19fd6;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topRightCredits a .arrow {
|
||||||
|
transform: translateY(.1rem);
|
||||||
|
}
|
||||||
|
|
||||||
|
.topRightCredits a:hover .arrow {
|
||||||
|
transform: translateY(.1rem) translateX(.2rem);
|
||||||
|
}
|
||||||
|
@ -3,6 +3,7 @@ import { InputBox } from '../components/InputBox'
|
|||||||
import { Title } from '../components/Title'
|
import { Title } from '../components/Title'
|
||||||
import { Card } from '../components/Card'
|
import { Card } from '../components/Card'
|
||||||
import { MovieRow } from '../components/MovieRow'
|
import { MovieRow } from '../components/MovieRow'
|
||||||
|
import { Arrow } from '../components/Arrow'
|
||||||
import { Progress } from '../components/Progress'
|
import { Progress } from '../components/Progress'
|
||||||
import { findMovie, getStreamUrl } from '../lib/lookMovie'
|
import { findMovie, getStreamUrl } from '../lib/lookMovie'
|
||||||
import { useMovie } from '../hooks/useMovie';
|
import { useMovie } from '../hooks/useMovie';
|
||||||
@ -91,6 +92,9 @@ export function SearchView() {
|
|||||||
}}/>
|
}}/>
|
||||||
))}
|
))}
|
||||||
</Card>
|
</Card>
|
||||||
|
<div className="topRightCredits">
|
||||||
|
<a href="https://github.com/JamesHawkinss/movie-web" target="_blank" rel="noreferrer">Check it out on GitHub <Arrow/></a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|