add support for captions

This commit is contained in:
mrjvs 2022-03-13 17:46:56 +01:00
parent 8240fae8fa
commit eb306f3772
4 changed files with 14 additions and 2 deletions

View File

@ -1,11 +1,12 @@
import { IconPatch } from "components/buttons/IconPatch";
import { Icons } from "components/Icon";
import { Loading } from "components/layout/Loading";
import { MWMediaStream } from "providers";
import { MWMediaCaption, MWMediaStream } from "providers";
import { ReactElement, useEffect, useRef, useState } from "react";
export interface VideoPlayerProps {
source: MWMediaStream;
captions: MWMediaCaption[];
startAt?: number;
onProgress?: (event: ProgressEvent) => void;
}
@ -74,6 +75,9 @@ export function VideoPlayer(props: VideoPlayerProps) {
{!mustUseHls ? (
<source src={props.source.url} type="video/mp4" />
) : null}
{props.captions.map((v) => (
<track key={v.id} kind="captions" label={v.label} src={v.url} />
))}
</video>
</>
);

View File

@ -69,7 +69,8 @@ export const theFlixScraper: MWMediaProvider = {
}
const data = JSON.parse(prop.textContent);
return { url: data.props.pageProps.videoUrl, type: "mp4" };
return { url: data.props.pageProps.videoUrl, type: "mp4", captions: [] };
},
async getSeasonDataFromMedia(

View File

@ -13,9 +13,15 @@ export interface MWPortableMedia {
}
export type MWMediaStreamType = "m3u8" | "mp4";
export interface MWMediaCaption {
id: string;
url: string;
label: string;
}
export interface MWMediaStream {
url: string;
type: MWMediaStreamType;
captions: MWMediaCaption[];
}
export interface MWMediaMeta extends MWPortableMedia {

View File

@ -52,6 +52,7 @@ function StyledMediaView(props: StyledMediaViewProps) {
return (
<VideoPlayer
source={props.stream}
captions={props.stream.captions}
onProgress={(e) => updateProgress(e)}
startAt={startAtTime}
/>