mirror of
https://github.com/movie-web/movie-web.git
synced 2024-12-24 18:41:48 +01:00
fix source selector with ids and fixed navigation issue with episode selector
Co-authored-by: Jip Frijlink <JipFr@users.noreply.github.com>
This commit is contained in:
parent
4a35287975
commit
209fe4369c
@ -32,7 +32,7 @@ function VideoPlayerBaseWithState(props: VideoPlayerBaseProps) {
|
||||
|
||||
// TODO move error boundary to only decorated, <VideoPlayer /> shouldn't have styling
|
||||
return (
|
||||
<VideoErrorBoundary onGoBack={props.onGoBack} media={media?.meta}>
|
||||
<VideoErrorBoundary onGoBack={props.onGoBack} media={media?.meta.meta}>
|
||||
<div
|
||||
ref={ref}
|
||||
className={[
|
||||
|
@ -11,5 +11,5 @@ export function HeaderAction(props: Props) {
|
||||
const descriptor = useVideoPlayerDescriptor();
|
||||
const meta = useMeta(descriptor);
|
||||
|
||||
return <VideoPlayerHeader media={meta?.meta} {...props} />;
|
||||
return <VideoPlayerHeader media={meta?.meta.meta} {...props} />;
|
||||
}
|
||||
|
@ -9,7 +9,7 @@ export function PageTitleAction() {
|
||||
|
||||
if (!meta) return null;
|
||||
|
||||
const title = isSeries ? `${meta.title} - ${humanizedEpisodeId}` : meta.title;
|
||||
const title = isSeries ? `${meta.meta.title} - ${humanizedEpisodeId}` : meta.meta.title;
|
||||
|
||||
return (
|
||||
<Helmet>
|
||||
|
@ -19,7 +19,7 @@ export function SeriesSelectionAction(props: Props) {
|
||||
const videoInterface = useInterface(descriptor);
|
||||
const controls = useControls(descriptor);
|
||||
|
||||
if (meta?.meta.type !== MWMediaType.SERIES) return null;
|
||||
if (meta?.meta.meta.type !== MWMediaType.SERIES) return null;
|
||||
|
||||
return (
|
||||
<div className={props.className}>
|
||||
|
@ -1,6 +1,7 @@
|
||||
import { useVideoPlayerDescriptor } from "@/video/state/hooks";
|
||||
import { useMeta } from "@/video/state/logic/meta";
|
||||
import { useEffect, useRef } from "react";
|
||||
import { useHistory } from "react-router-dom";
|
||||
|
||||
interface SeriesControllerProps {
|
||||
onSelect?: (state: { episodeId?: string; seasonId?: string }) => void;
|
||||
@ -9,6 +10,7 @@ interface SeriesControllerProps {
|
||||
export function SeriesController(props: SeriesControllerProps) {
|
||||
const descriptor = useVideoPlayerDescriptor();
|
||||
const meta = useMeta(descriptor);
|
||||
const history = useHistory();
|
||||
|
||||
const lastState = useRef<{
|
||||
episodeId?: string;
|
||||
@ -34,7 +36,7 @@ export function SeriesController(props: SeriesControllerProps) {
|
||||
lastState.current = currentState;
|
||||
props.onSelect?.(currentState);
|
||||
}
|
||||
}, [meta, props]);
|
||||
}, [meta, props, history]);
|
||||
|
||||
return null;
|
||||
}
|
||||
|
@ -20,7 +20,7 @@ export function useCurrentSeriesEpisodeInfo(descriptor: string) {
|
||||
}, [currentSeasonInfo, meta]);
|
||||
|
||||
const isSeries = Boolean(
|
||||
meta?.meta?.type === MWMediaType.SERIES && meta?.episode
|
||||
meta?.meta.meta.type === MWMediaType.SERIES && meta?.episode
|
||||
);
|
||||
|
||||
if (!isSeries) return { isSeries: false };
|
||||
|
@ -31,7 +31,7 @@ export function VideoPlayerError(props: VideoPlayerErrorProps) {
|
||||
</p>
|
||||
</div>
|
||||
<div className="pointer-events-auto absolute inset-x-0 top-0 flex flex-col py-6 px-8 pb-2">
|
||||
<VideoPlayerHeader media={meta?.meta} onClick={props.onGoBack} />
|
||||
<VideoPlayerHeader media={meta?.meta.meta} onClick={props.onGoBack} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
@ -57,7 +57,11 @@ export function EpisodeSelectionPopout() {
|
||||
|
||||
const setCurrent = useCallback(
|
||||
(seasonId: string, episodeId: string) => {
|
||||
controls.closePopout();
|
||||
// race condition, jank solution but it works.
|
||||
setTimeout(() => {
|
||||
controls.setCurrentEpisode(seasonId, episodeId);
|
||||
}, 100)
|
||||
},
|
||||
[controls]
|
||||
);
|
||||
|
@ -21,7 +21,7 @@ export function SourceSelectionPopout() {
|
||||
const meta = useMeta(descriptor);
|
||||
const providers = useMemo(
|
||||
() =>
|
||||
meta ? getProviders().filter((v) => v.type.includes(meta.meta.type)) : [],
|
||||
meta ? getProviders().filter((v) => v.type.includes(meta.meta.meta.type)) : [],
|
||||
[meta]
|
||||
);
|
||||
|
||||
@ -39,13 +39,9 @@ export function SourceSelectionPopout() {
|
||||
if (!theProvider) throw new Error("Invalid provider");
|
||||
if (!meta) throw new Error("need meta");
|
||||
return runProvider(theProvider, {
|
||||
media: {
|
||||
imdbId: "", // TODO get actual ids
|
||||
tmdbId: "",
|
||||
meta: meta.meta,
|
||||
},
|
||||
media: meta.meta,
|
||||
progress: () => { },
|
||||
type: meta.meta.type,
|
||||
type: meta.meta.meta.type,
|
||||
episode: meta.episode?.episodeId as any,
|
||||
season: meta.episode?.seasonId as any,
|
||||
});
|
||||
|
@ -3,12 +3,13 @@ import {
|
||||
MWStreamQuality,
|
||||
MWStreamType,
|
||||
} from "@/backend/helpers/streams";
|
||||
import { DetailedMeta } from "@/backend/metadata/getmeta";
|
||||
import { MWMediaMeta } from "@/backend/metadata/types";
|
||||
import Hls from "hls.js";
|
||||
import { VideoPlayerStateProvider } from "./providers/providerTypes";
|
||||
|
||||
export type VideoPlayerMeta = {
|
||||
meta: MWMediaMeta;
|
||||
meta: DetailedMeta;
|
||||
captions: MWCaption[];
|
||||
episode?: {
|
||||
episodeId: string;
|
||||
|
@ -37,7 +37,7 @@ function MediaViewLoading(props: { onGoBack(): void }) {
|
||||
</div>
|
||||
<div className="flex flex-col items-center">
|
||||
<Loading className="mb-4" />
|
||||
<p className="mb-8 text-denim-700">{t("videoPlaye.findingBestVideo")}</p>
|
||||
<p className="mb-8 text-denim-700">{t("videoPlayer.findingBestVideo")}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
@ -114,7 +114,7 @@ export function MediaViewPlayer(props: MediaViewPlayerProps) {
|
||||
}, [props.stream]);
|
||||
|
||||
const metaProps: VideoPlayerMeta = {
|
||||
meta: props.meta.meta,
|
||||
meta: props.meta,
|
||||
captions: [],
|
||||
};
|
||||
let metaSeasonData: MWSeasonWithEpisodeMeta | undefined;
|
||||
@ -254,7 +254,6 @@ export function MediaView() {
|
||||
stream={stream}
|
||||
selected={selected}
|
||||
onChangeStream={(sId, eId) => {
|
||||
// TODO changing episode breaks useGoBack
|
||||
history.replace(
|
||||
`/media/${encodeURIComponent(params.media)}/${encodeURIComponent(
|
||||
sId
|
||||
|
Loading…
Reference in New Issue
Block a user