Mirrors/movie-web
2
0
Fork 0
mirror of https://github.com/movie-web/movie-web.git synced 2024-12-25 07:11:50 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix skeleton

Browse Source
This commit is contained in:
Jelle van Snik 2023-01-10 21:23:53 +01:00
parent d28e6e6735
commit 46e933dfb7
2 changed files with 20 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/views/MediaView.tsx
View File

@ -6,7 +6,6 @@ import { Icons } from "@/components/Icon";
import { Navigation } from "@/components/layout/Navigation"; import { Navigation } from "@/components/layout/Navigation";
import { Paper } from "@/components/layout/Paper"; import { Paper } from "@/components/layout/Paper";
import { LoadingSeasons, Seasons } from "@/components/layout/Seasons"; import { LoadingSeasons, Seasons } from "@/components/layout/Seasons";
import { SkeletonVideoPlayer } from "@/components/media/VideoPlayer";
import { DecoratedVideoPlayer } from "@/components/video/DecoratedVideoPlayer"; import { DecoratedVideoPlayer } from "@/components/video/DecoratedVideoPlayer";
import { ArrowLink } from "@/components/text/ArrowLink"; import { ArrowLink } from "@/components/text/ArrowLink";
import { DotList } from "@/components/text/DotList"; import { DotList } from "@/components/text/DotList";
@ -30,6 +29,7 @@ import {
import { getWatchedFromPortable, useWatchedContext } from "@/state/watched"; import { getWatchedFromPortable, useWatchedContext } from "@/state/watched";
import { SourceControl } from "@/components/video/controls/SourceControl"; import { SourceControl } from "@/components/video/controls/SourceControl";
import { ProgressListenerControl } from "@/components/video/controls/ProgressListenerControl"; import { ProgressListenerControl } from "@/components/video/controls/ProgressListenerControl";
import { Loading } from "@/components/layout/Loading";
import { NotFoundChecks } from "./notfound/NotFoundChecks"; import { NotFoundChecks } from "./notfound/NotFoundChecks";
interface StyledMediaViewProps { interface StyledMediaViewProps {
@ -37,6 +37,24 @@ interface StyledMediaViewProps {
stream: MWMediaStream; stream: MWMediaStream;
} }
export function SkeletonVideoPlayer(props: { error?: boolean }) {
return (
<div className="flex aspect-video w-full items-center justify-center bg-denim-200 lg:rounded-xl">
{props.error ? (
<div className="flex flex-col items-center">
<IconPatch icon={Icons.WARNING} className="text-red-400" />
<p className="mt-5 text-white">Couldn&apos;t get your stream</p>
</div>
) : (
<div className="flex flex-col items-center">
<Loading />
<p className="mt-3 text-white">Getting your stream...</p>
</div>
)}
</div>
);
}
function StyledMediaView(props: StyledMediaViewProps) { function StyledMediaView(props: StyledMediaViewProps) {
const reactHistory = useHistory(); const reactHistory = useHistory();
const watchedStore = useWatchedContext(); const watchedStore = useWatchedContext();

2
src/views/TestView.tsx
View File

@ -20,7 +20,7 @@ import { useCallback, useState } from "react";
// - browser: firefox, chrome, edge, safari desktop // - browser: firefox, chrome, edge, safari desktop
// - phones: android firefox, android chrome, iphone safari // - phones: android firefox, android chrome, iphone safari
// - devices: ipadOS // - devices: ipadOS
// - features: HLS, error handling // - features: HLS, error handling, preload interactions
export function TestView() { export function TestView() {
const [show, setShow] = useState(true); const [show, setShow] = useState(true);