Cutlery/Kyoo
1
0
Fork 0
mirror of https://github.com/zoriya/Kyoo.git synced 2025-12-05 12:45:12 -05:00
Code Issues Packages Projects Releases Wiki Activity

Add external subtitles handling

Browse Source
This commit is contained in:
Zoe Roux 2025-07-20 14:54:29 +02:00
parent a6e8b40ca9
commit 40c25690e7
No known key found for this signature in database
3 changed files with 30 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
front/app.config.ts
View File

@ -67,6 +67,7 @@ export const expo: ExpoConfig = {
"react-native-video", "react-native-video",
{ {
enableNotificationControls: true, enableNotificationControls: true,
enableAndroidPictureInPicture: true,
}, },
], ],
], ],

1
front/src/models/video-info.ts
View File

@ -46,6 +46,7 @@ export const Subtitle = z.object({
title: z.string().nullable(), title: z.string().nullable(),
language: z.string().nullable(), language: z.string().nullable(),
codec: z.string(), codec: z.string(),
mimeCodec: z.string().nullable(),
extension: z.string(), extension: z.string(),
isDefault: z.boolean(), isDefault: z.boolean(),
isForced: z.boolean(), isForced: z.boolean(),

32
front/src/ui/player/index.tsx
View File

@ -1,6 +1,7 @@
import { Stack } from "expo-router"; import { Stack } from "expo-router";
import { useEffect, useRef } from "react";
import { StyleSheet, View } from "react-native"; import { StyleSheet, View } from "react-native";
import { useVideoPlayer, VideoView } from "react-native-video"; import { useVideoPlayer, VideoView, VideoViewRef } from "react-native-video";
import { entryDisplayNumber } from "~/components/entries"; import { entryDisplayNumber } from "~/components/entries";
import { FullVideo, VideoInfo } from "~/models"; import { FullVideo, VideoInfo } from "~/models";
import { Head } from "~/primitives"; import { Head } from "~/primitives";
@ -34,18 +35,34 @@ const mapMetadata = (item: FullVideo | undefined) => {
export const Player = () => { export const Player = () => {
const [slug] = useQueryState("slug", undefined!); const [slug] = useQueryState("slug", undefined!);
const { data, error } = useFetch(Player.query(slug));
const { data: info, error: infoError } = useFetch(Player.infoQuery(slug));
const metadata = mapMetadata(data);
const { apiUrl, authToken } = useToken(); const { apiUrl, authToken } = useToken();
const [playMode] = useLocalSetting<"direct" | "hls">("playMode", "direct"); const [playMode] = useLocalSetting<"direct" | "hls">("playMode", "direct");
const player = useVideoPlayer({ const player = useVideoPlayer(
{
uri: `${apiUrl}/api/videos/${slug}/${playMode === "direct" ? "direct" : "master.m3u8"}`, uri: `${apiUrl}/api/videos/${slug}/${playMode === "direct" ? "direct" : "master.m3u8"}`,
headers: { headers: {
Authorization: `Bearer ${authToken}`, Authorization: `Bearer ${authToken}`,
}, },
}); externalSubtitles: info?.subtitles
.filter((x) => x.link)
const { data, error } = useFetch(Player.query(slug)); .map((x) => ({
const { data: info, error: infoError } = useFetch(Player.infoQuery(slug)); uri: x.link!,
const metadata = mapMetadata(data); // TODO: translate this `Unknown`
label: x.title ?? "Unknown",
language: x.language ?? "und",
type: x.codec,
})),
},
(p) => {
p.playWhenInactive = true;
p.playInBackground = true;
p.play();
},
);
// const [playbackError, setPlaybackError] = useState<string | undefined>( // const [playbackError, setPlaybackError] = useState<string | undefined>(
// undefined, // undefined,
@ -92,6 +109,7 @@ export const Player = () => {
navigationBarHidden: true, navigationBarHidden: true,
statusBarHidden: true, statusBarHidden: true,
orientation: "landscape", orientation: "landscape",
contentStyle: { paddingLeft: 0, paddingRight: 0 },
}} }}
/> />
<VideoView <VideoView