mirror of
https://github.com/streamyfin/streamyfin.git
synced 2026-02-19 10:32:25 +00:00
Compare commits
4 Commits
renovate/r
...
sync-subti
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
ccdd7770c9 | ||
|
|
24cb679c0b | ||
|
|
af50b023ef | ||
|
|
9f9d949891 |
@@ -48,6 +48,7 @@ import { apiAtom, userAtom } from "@/providers/JellyfinProvider";
|
||||
import { OfflineModeProvider } from "@/providers/OfflineModeProvider";
|
||||
|
||||
import { useSettings } from "@/utils/atoms/settings";
|
||||
import { getPrimaryImageUrl } from "@/utils/jellyfin/image/getPrimaryImageUrl";
|
||||
import { getStreamUrl } from "@/utils/jellyfin/media/getStreamUrl";
|
||||
import {
|
||||
getMpvAudioId,
|
||||
@@ -133,7 +134,7 @@ export default function page() {
|
||||
const audioIndexFromUrl = audioIndexStr
|
||||
? Number.parseInt(audioIndexStr, 10)
|
||||
: undefined;
|
||||
const subtitleIndex = subtitleIndexStr
|
||||
const subtitleIndexFromUrl = subtitleIndexStr
|
||||
? Number.parseInt(subtitleIndexStr, 10)
|
||||
: -1;
|
||||
const bitrateValue = bitrateValueStr
|
||||
@@ -160,6 +161,24 @@ export default function page() {
|
||||
return undefined;
|
||||
}, [audioIndexFromUrl, offline, downloadedItem?.userData?.audioStreamIndex]);
|
||||
|
||||
// Resolve subtitle index: use URL param if provided, otherwise use stored index for offline playback
|
||||
const subtitleIndex = useMemo(() => {
|
||||
if (subtitleIndexFromUrl !== undefined) {
|
||||
return subtitleIndexFromUrl;
|
||||
}
|
||||
if (
|
||||
offline &&
|
||||
downloadedItem?.userData?.subtitleStreamIndex !== undefined
|
||||
) {
|
||||
return downloadedItem.userData.subtitleStreamIndex;
|
||||
}
|
||||
return -1;
|
||||
}, [
|
||||
subtitleIndexFromUrl,
|
||||
offline,
|
||||
downloadedItem?.userData?.subtitleStreamIndex,
|
||||
]);
|
||||
|
||||
// Get the playback speed for this item based on settings
|
||||
const { playbackSpeed: initialPlaybackSpeed } = usePlaybackSpeed(
|
||||
item,
|
||||
@@ -405,8 +424,8 @@ export default function page() {
|
||||
|
||||
return {
|
||||
ItemId: item.Id,
|
||||
AudioStreamIndex: audioIndex ? audioIndex : undefined,
|
||||
SubtitleStreamIndex: subtitleIndex ? subtitleIndex : undefined,
|
||||
AudioStreamIndex: audioIndex,
|
||||
SubtitleStreamIndex: subtitleIndex,
|
||||
MediaSourceId: mediaSourceId,
|
||||
PositionTicks: msToTicks(progress.get()),
|
||||
IsPaused: !isPlaying,
|
||||
@@ -504,6 +523,31 @@ export default function page() {
|
||||
return ticksToSeconds(getInitialPlaybackTicks());
|
||||
}, [getInitialPlaybackTicks]);
|
||||
|
||||
/** Prepare metadata for iOS native media controls (Control Center, Lock Screen) */
|
||||
const nowPlayingMetadata = useMemo(() => {
|
||||
if (!item || !api) return undefined;
|
||||
|
||||
const artworkUri = getPrimaryImageUrl({
|
||||
api,
|
||||
item,
|
||||
quality: 90,
|
||||
width: 500,
|
||||
});
|
||||
|
||||
return {
|
||||
title: item.Name || "",
|
||||
artist:
|
||||
item.Type === "Episode"
|
||||
? item.SeriesName || ""
|
||||
: item.AlbumArtist || "",
|
||||
albumTitle:
|
||||
item.Type === "Episode" && item.SeasonName
|
||||
? item.SeasonName
|
||||
: undefined,
|
||||
artworkUri: artworkUri || undefined,
|
||||
};
|
||||
}, [item, api]);
|
||||
|
||||
/** Build video source config for MPV */
|
||||
const videoSource = useMemo<MpvVideoSource | undefined>(() => {
|
||||
if (!stream?.url) return undefined;
|
||||
@@ -932,6 +976,7 @@ export default function page() {
|
||||
ref={videoRef}
|
||||
source={videoSource}
|
||||
style={{ width: "100%", height: "100%" }}
|
||||
nowPlayingMetadata={nowPlayingMetadata}
|
||||
onProgress={onProgress}
|
||||
onPlaybackStateChange={onPlaybackStateChanged}
|
||||
onLoad={() => setIsVideoLoaded(true)}
|
||||
|
||||
6
bun.lock
6
bun.lock
@@ -76,7 +76,7 @@
|
||||
"react-native-mmkv": "4.1.1",
|
||||
"react-native-nitro-modules": "0.33.1",
|
||||
"react-native-pager-view": "^6.9.1",
|
||||
"react-native-reanimated": "~4.2.0",
|
||||
"react-native-reanimated": "~4.1.1",
|
||||
"react-native-reanimated-carousel": "4.0.3",
|
||||
"react-native-safe-area-context": "~5.6.0",
|
||||
"react-native-screens": "~4.18.0",
|
||||
@@ -1682,7 +1682,7 @@
|
||||
|
||||
"react-native-pager-view": ["react-native-pager-view@6.9.1", "", { "peerDependencies": { "react": "*", "react-native": "*" } }, "sha512-uUT0MMMbNtoSbxe9pRvdJJKEi9snjuJ3fXlZhG8F2vVMOBJVt/AFtqMPUHu9yMflmqOr08PewKzj9EPl/Yj+Gw=="],
|
||||
|
||||
"react-native-reanimated": ["react-native-reanimated@4.2.1", "", { "dependencies": { "react-native-is-edge-to-edge": "1.2.1", "semver": "7.7.3" }, "peerDependencies": { "react": "*", "react-native": "*", "react-native-worklets": ">=0.7.0" } }, "sha512-/NcHnZMyOvsD/wYXug/YqSKw90P9edN0kEPL5lP4PFf1aQ4F1V7MKe/E0tvfkXKIajy3Qocp5EiEnlcrK/+BZg=="],
|
||||
"react-native-reanimated": ["react-native-reanimated@4.1.3", "", { "dependencies": { "react-native-is-edge-to-edge": "^1.2.1", "semver": "7.7.2" }, "peerDependencies": { "@babel/core": "^7.0.0-0", "react": "*", "react-native": "*", "react-native-worklets": ">=0.5.0" } }, "sha512-GP8wsi1u3nqvC1fMab/m8gfFwFyldawElCcUSBJQgfrXeLmsPPUOpDw44lbLeCpcwUuLa05WTVePdTEwCLTUZg=="],
|
||||
|
||||
"react-native-reanimated-carousel": ["react-native-reanimated-carousel@4.0.3", "", { "peerDependencies": { "react": ">=18.0.0", "react-native": ">=0.70.3", "react-native-gesture-handler": ">=2.9.0", "react-native-reanimated": ">=3.0.0" } }, "sha512-YZXlvZNghR5shFcI9hTA7h7bEhh97pfUSLZvLBAshpbkuYwJDKmQXejO/199T6hqGq0wCRwR0CWf2P4Vs6A4Fw=="],
|
||||
|
||||
@@ -2432,7 +2432,7 @@
|
||||
|
||||
"react-native/semver": ["semver@7.7.2", "", { "bin": { "semver": "bin/semver.js" } }, "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA=="],
|
||||
|
||||
"react-native-reanimated/semver": ["semver@7.7.3", "", { "bin": { "semver": "bin/semver.js" } }, "sha512-SdsKMrI9TdgjdweUSR9MweHA4EJ8YxHn8DFaDisvhVlUOe4BF1tLD7GAj0lIqWVl+dPb/rExr0Btby5loQm20Q=="],
|
||||
"react-native-reanimated/semver": ["semver@7.7.2", "", { "bin": { "semver": "bin/semver.js" } }, "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA=="],
|
||||
|
||||
"react-native-web/@react-native/normalize-colors": ["@react-native/normalize-colors@0.74.89", "", {}, "sha512-qoMMXddVKVhZ8PA1AbUCk83trpd6N+1nF2A6k1i6LsQObyS92fELuk8kU/lQs6M7BsMHwqyLCpQJ1uFgNvIQXg=="],
|
||||
|
||||
|
||||
@@ -25,6 +25,7 @@ import useDefaultPlaySettings from "@/hooks/useDefaultPlaySettings";
|
||||
import { useImageColorsReturn } from "@/hooks/useImageColorsReturn";
|
||||
import { useOrientation } from "@/hooks/useOrientation";
|
||||
import * as ScreenOrientation from "@/packages/expo-screen-orientation";
|
||||
import { useDownload } from "@/providers/DownloadProvider";
|
||||
import { apiAtom, userAtom } from "@/providers/JellyfinProvider";
|
||||
import { useOfflineMode } from "@/providers/OfflineModeProvider";
|
||||
import { useSettings } from "@/utils/atoms/settings";
|
||||
@@ -53,6 +54,9 @@ export const ItemContent: React.FC<ItemContentProps> = React.memo(
|
||||
({ item, itemWithSources }) => {
|
||||
const [api] = useAtom(apiAtom);
|
||||
const isOffline = useOfflineMode();
|
||||
const { getDownloadedItemById } = useDownload();
|
||||
const downloadedItem =
|
||||
isOffline && item.Id ? getDownloadedItemById(item.Id) : null;
|
||||
const { settings } = useSettings();
|
||||
const { orientation } = useOrientation();
|
||||
const navigation = useNavigation();
|
||||
@@ -91,17 +95,29 @@ export const ItemContent: React.FC<ItemContentProps> = React.memo(
|
||||
|
||||
// Needs to automatically change the selected to the default values for default indexes.
|
||||
useEffect(() => {
|
||||
// When offline, use the indices stored in userData (the last-used tracks for this file)
|
||||
// rather than the server's defaults, so MediaSourceButton reflects what will actually play.
|
||||
const offlineUserData = downloadedItem?.userData;
|
||||
|
||||
setSelectedOptions(() => ({
|
||||
bitrate: defaultBitrate,
|
||||
mediaSource: defaultMediaSource ?? undefined,
|
||||
subtitleIndex: defaultSubtitleIndex ?? -1,
|
||||
audioIndex: defaultAudioIndex,
|
||||
subtitleIndex:
|
||||
offlineUserData && !offlineUserData.isTranscoded
|
||||
? offlineUserData.subtitleStreamIndex
|
||||
: (defaultSubtitleIndex ?? -1),
|
||||
audioIndex:
|
||||
offlineUserData && !offlineUserData.isTranscoded
|
||||
? offlineUserData.audioStreamIndex
|
||||
: defaultAudioIndex,
|
||||
}));
|
||||
}, [
|
||||
defaultAudioIndex,
|
||||
defaultBitrate,
|
||||
defaultSubtitleIndex,
|
||||
defaultMediaSource,
|
||||
downloadedItem?.userData?.audioStreamIndex,
|
||||
downloadedItem?.userData?.subtitleStreamIndex,
|
||||
]);
|
||||
|
||||
useEffect(() => {
|
||||
@@ -232,14 +248,12 @@ export const ItemContent: React.FC<ItemContentProps> = React.memo(
|
||||
colors={itemColors}
|
||||
/>
|
||||
<View className='w-1' />
|
||||
{!isOffline && (
|
||||
<MediaSourceButton
|
||||
selectedOptions={selectedOptions}
|
||||
setSelectedOptions={setSelectedOptions}
|
||||
item={itemWithSources}
|
||||
colors={itemColors}
|
||||
/>
|
||||
)}
|
||||
<MediaSourceButton
|
||||
selectedOptions={selectedOptions}
|
||||
setSelectedOptions={setSelectedOptions}
|
||||
item={itemWithSources}
|
||||
colors={itemColors}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
{item.Type === "Episode" && (
|
||||
|
||||
@@ -7,6 +7,8 @@ import { useCallback, useEffect, useMemo, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { ActivityIndicator, TouchableOpacity, View } from "react-native";
|
||||
import type { ThemeColors } from "@/hooks/useImageColorsReturn";
|
||||
import { useDownload } from "@/providers/DownloadProvider";
|
||||
import { useOfflineMode } from "@/providers/OfflineModeProvider";
|
||||
import { BITRATES } from "./BitRateSheet";
|
||||
import type { SelectedOptions } from "./ItemContent";
|
||||
import { type OptionGroup, PlatformDropdown } from "./PlatformDropdown";
|
||||
@@ -28,6 +30,14 @@ export const MediaSourceButton: React.FC<Props> = ({
|
||||
}: Props) => {
|
||||
const { t } = useTranslation();
|
||||
const [open, setOpen] = useState(false);
|
||||
const isOffline = useOfflineMode();
|
||||
const { getDownloadedItemById } = useDownload();
|
||||
|
||||
// For transcoded downloads there's only one burned-in track — nothing to pick
|
||||
const isTranscodedDownload = useMemo(() => {
|
||||
if (!isOffline || !item?.Id) return false;
|
||||
return getDownloadedItemById(item.Id)?.userData?.isTranscoded === true;
|
||||
}, [isOffline, item?.Id, getDownloadedItemById]);
|
||||
|
||||
const effectiveColors = colors || {
|
||||
primary: "#7c3aed",
|
||||
@@ -72,34 +82,36 @@ export const MediaSourceButton: React.FC<Props> = ({
|
||||
const optionGroups: OptionGroup[] = useMemo(() => {
|
||||
const groups: OptionGroup[] = [];
|
||||
|
||||
// Bitrate group
|
||||
groups.push({
|
||||
title: t("item_card.quality"),
|
||||
options: BITRATES.map((bitrate) => ({
|
||||
type: "radio" as const,
|
||||
label: bitrate.key,
|
||||
value: bitrate,
|
||||
selected: bitrate.value === selectedOptions.bitrate?.value,
|
||||
onPress: () =>
|
||||
setSelectedOptions((prev) => prev && { ...prev, bitrate }),
|
||||
})),
|
||||
});
|
||||
|
||||
// Media Source group (only if multiple sources)
|
||||
if (item?.MediaSources && item.MediaSources.length > 1) {
|
||||
if (!isOffline) {
|
||||
// Bitrate group
|
||||
groups.push({
|
||||
title: t("item_card.video"),
|
||||
options: item.MediaSources.map((source) => ({
|
||||
title: t("item_card.quality"),
|
||||
options: BITRATES.map((bitrate) => ({
|
||||
type: "radio" as const,
|
||||
label: getMediaSourceDisplayName(source),
|
||||
value: source,
|
||||
selected: source.Id === selectedOptions.mediaSource?.Id,
|
||||
label: bitrate.key,
|
||||
value: bitrate,
|
||||
selected: bitrate.value === selectedOptions.bitrate?.value,
|
||||
onPress: () =>
|
||||
setSelectedOptions(
|
||||
(prev) => prev && { ...prev, mediaSource: source },
|
||||
),
|
||||
setSelectedOptions((prev) => prev && { ...prev, bitrate }),
|
||||
})),
|
||||
});
|
||||
|
||||
// Media Source group (only if multiple sources)
|
||||
if (item?.MediaSources && item.MediaSources.length > 1) {
|
||||
groups.push({
|
||||
title: t("item_card.video"),
|
||||
options: item.MediaSources.map((source) => ({
|
||||
type: "radio" as const,
|
||||
label: getMediaSourceDisplayName(source),
|
||||
value: source,
|
||||
selected: source.Id === selectedOptions.mediaSource?.Id,
|
||||
onPress: () =>
|
||||
setSelectedOptions(
|
||||
(prev) => prev && { ...prev, mediaSource: source },
|
||||
),
|
||||
})),
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Audio track group
|
||||
@@ -150,6 +162,7 @@ export const MediaSourceButton: React.FC<Props> = ({
|
||||
return groups;
|
||||
}, [
|
||||
item,
|
||||
isOffline,
|
||||
selectedOptions,
|
||||
audioStreams,
|
||||
subtitleStreams,
|
||||
@@ -178,6 +191,8 @@ export const MediaSourceButton: React.FC<Props> = ({
|
||||
</TouchableOpacity>
|
||||
);
|
||||
|
||||
if (isTranscodedDownload) return null;
|
||||
|
||||
return (
|
||||
<PlatformDropdown
|
||||
groups={optionGroups}
|
||||
|
||||
@@ -96,14 +96,23 @@ export const PlayButton: React.FC<Props> = ({
|
||||
|
||||
const queryParams = new URLSearchParams({
|
||||
itemId: item.Id!,
|
||||
audioIndex: selectedOptions.audioIndex?.toString() ?? "",
|
||||
subtitleIndex: selectedOptions.subtitleIndex?.toString() ?? "",
|
||||
mediaSourceId: selectedOptions.mediaSource?.Id ?? "",
|
||||
bitrateValue: selectedOptions.bitrate?.value?.toString() ?? "",
|
||||
playbackPosition: item.UserData?.PlaybackPositionTicks?.toString() ?? "0",
|
||||
offline: isOffline ? "true" : "false",
|
||||
});
|
||||
|
||||
if (selectedOptions.audioIndex !== undefined) {
|
||||
queryParams.set("audioIndex", selectedOptions.audioIndex.toString());
|
||||
}
|
||||
|
||||
if (selectedOptions.subtitleIndex !== undefined) {
|
||||
queryParams.set(
|
||||
"subtitleIndex",
|
||||
selectedOptions.subtitleIndex.toString(),
|
||||
);
|
||||
}
|
||||
|
||||
const queryString = queryParams.toString();
|
||||
|
||||
if (!client) {
|
||||
@@ -292,6 +301,29 @@ export const PlayButton: React.FC<Props> = ({
|
||||
t,
|
||||
]);
|
||||
|
||||
const buildOfflineQueryParams = useCallback(
|
||||
(downloadedItem: NonNullable<ReturnType<typeof getDownloadedItemById>>) => {
|
||||
const isTranscoded = downloadedItem.userData?.isTranscoded === true;
|
||||
const audioIdx = isTranscoded
|
||||
? downloadedItem.userData?.audioStreamIndex
|
||||
: selectedOptions.audioIndex;
|
||||
const subtitleIdx = isTranscoded
|
||||
? downloadedItem.userData?.subtitleStreamIndex
|
||||
: selectedOptions.subtitleIndex;
|
||||
const params = new URLSearchParams({
|
||||
itemId: item.Id!,
|
||||
offline: "true",
|
||||
playbackPosition:
|
||||
item.UserData?.PlaybackPositionTicks?.toString() ?? "0",
|
||||
});
|
||||
if (audioIdx !== undefined) params.set("audioIndex", audioIdx.toString());
|
||||
if (subtitleIdx !== undefined)
|
||||
params.set("subtitleIndex", subtitleIdx.toString());
|
||||
return params;
|
||||
},
|
||||
[item, selectedOptions],
|
||||
);
|
||||
|
||||
const onPress = useCallback(async () => {
|
||||
if (!item) return;
|
||||
|
||||
@@ -302,13 +334,7 @@ export const PlayButton: React.FC<Props> = ({
|
||||
|
||||
// If already in offline mode, play downloaded file directly
|
||||
if (isOffline && downloadedItem) {
|
||||
const queryParams = new URLSearchParams({
|
||||
itemId: item.Id!,
|
||||
offline: "true",
|
||||
playbackPosition:
|
||||
item.UserData?.PlaybackPositionTicks?.toString() ?? "0",
|
||||
});
|
||||
goToPlayer(queryParams.toString());
|
||||
goToPlayer(buildOfflineQueryParams(downloadedItem).toString());
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -331,13 +357,9 @@ export const PlayButton: React.FC<Props> = ({
|
||||
<Button
|
||||
onPress={() => {
|
||||
hideModal();
|
||||
const queryParams = new URLSearchParams({
|
||||
itemId: item.Id!,
|
||||
offline: "true",
|
||||
playbackPosition:
|
||||
item.UserData?.PlaybackPositionTicks?.toString() ?? "0",
|
||||
});
|
||||
goToPlayer(queryParams.toString());
|
||||
goToPlayer(
|
||||
buildOfflineQueryParams(downloadedItem).toString(),
|
||||
);
|
||||
}}
|
||||
color='purple'
|
||||
>
|
||||
@@ -374,13 +396,7 @@ export const PlayButton: React.FC<Props> = ({
|
||||
{
|
||||
text: t("player.downloaded_file_yes"),
|
||||
onPress: () => {
|
||||
const queryParams = new URLSearchParams({
|
||||
itemId: item.Id!,
|
||||
offline: "true",
|
||||
playbackPosition:
|
||||
item.UserData?.PlaybackPositionTicks?.toString() ?? "0",
|
||||
});
|
||||
goToPlayer(queryParams.toString());
|
||||
goToPlayer(buildOfflineQueryParams(downloadedItem).toString());
|
||||
},
|
||||
isPreferred: true,
|
||||
},
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import type { BaseItemDto } from "@jellyfin/sdk/lib/generated-client";
|
||||
import { useCallback } from "react";
|
||||
import useRouter from "@/hooks/useAppRouter";
|
||||
import { getDownloadedItemById } from "@/providers/Downloads/database";
|
||||
import { usePlaySettings } from "@/providers/PlaySettingsProvider";
|
||||
import { writeToLog } from "@/utils/log";
|
||||
|
||||
@@ -15,12 +16,27 @@ export const useDownloadedFileOpener = () => {
|
||||
console.error("Attempted to open a file without an ID.");
|
||||
return;
|
||||
}
|
||||
const downloadedItem = getDownloadedItemById(item.Id);
|
||||
const queryParams = new URLSearchParams({
|
||||
itemId: item.Id,
|
||||
offline: "true",
|
||||
playbackPosition:
|
||||
item.UserData?.PlaybackPositionTicks?.toString() ?? "0",
|
||||
});
|
||||
|
||||
if (downloadedItem?.userData?.audioStreamIndex !== undefined) {
|
||||
queryParams.set(
|
||||
"audioIndex",
|
||||
downloadedItem.userData.audioStreamIndex.toString(),
|
||||
);
|
||||
}
|
||||
if (downloadedItem?.userData?.subtitleStreamIndex !== undefined) {
|
||||
queryParams.set(
|
||||
"subtitleIndex",
|
||||
downloadedItem.userData.subtitleStreamIndex.toString(),
|
||||
);
|
||||
}
|
||||
|
||||
try {
|
||||
router.push(`/player/direct-player?${queryParams.toString()}`);
|
||||
} catch (error) {
|
||||
|
||||
@@ -186,6 +186,20 @@ export const usePlaybackManager = ({
|
||||
: playedPercentage,
|
||||
},
|
||||
},
|
||||
// Sync selected audio/subtitle tracks so next playback resumes with
|
||||
// the same tracks the user had active — but only for non-transcoded
|
||||
// downloads where the user can freely switch tracks.
|
||||
userData: localItem.userData.isTranscoded
|
||||
? localItem.userData
|
||||
: {
|
||||
...localItem.userData,
|
||||
audioStreamIndex:
|
||||
playbackProgressInfo.AudioStreamIndex ??
|
||||
localItem.userData.audioStreamIndex,
|
||||
subtitleStreamIndex:
|
||||
playbackProgressInfo.SubtitleStreamIndex ??
|
||||
localItem.userData.subtitleStreamIndex,
|
||||
},
|
||||
});
|
||||
// Force invalidate queries so they refetch from updated local database
|
||||
queryClient.invalidateQueries({ queryKey: ["item", itemId] });
|
||||
|
||||
@@ -43,6 +43,12 @@ class MpvPlayerModule : Module() {
|
||||
view.loadVideo(config)
|
||||
}
|
||||
|
||||
// Now Playing metadata for media controls (iOS-only, no-op on Android)
|
||||
// Android handles media session differently via MediaSessionCompat
|
||||
Prop("nowPlayingMetadata") { _: MpvPlayerView, _: Map<String, String>? ->
|
||||
// No-op on Android - media session integration would require MediaSessionCompat
|
||||
}
|
||||
|
||||
// Async function to play video
|
||||
AsyncFunction("play") { view: MpvPlayerView ->
|
||||
view.play()
|
||||
|
||||
@@ -10,6 +10,7 @@ protocol MPVLayerRendererDelegate: AnyObject {
|
||||
func renderer(_ renderer: MPVLayerRenderer, didChangeLoading isLoading: Bool)
|
||||
func renderer(_ renderer: MPVLayerRenderer, didBecomeReadyToSeek: Bool)
|
||||
func renderer(_ renderer: MPVLayerRenderer, didBecomeTracksReady: Bool)
|
||||
func renderer(_ renderer: MPVLayerRenderer, didSelectAudioOutput audioOutput: String)
|
||||
}
|
||||
|
||||
/// MPV player using vo_avfoundation for video output.
|
||||
@@ -347,7 +348,8 @@ final class MPVLayerRenderer {
|
||||
("pause", MPV_FORMAT_FLAG),
|
||||
("track-list/count", MPV_FORMAT_INT64),
|
||||
("paused-for-cache", MPV_FORMAT_FLAG),
|
||||
("demuxer-cache-duration", MPV_FORMAT_DOUBLE)
|
||||
("demuxer-cache-duration", MPV_FORMAT_DOUBLE),
|
||||
("current-ao", MPV_FORMAT_STRING)
|
||||
]
|
||||
for (name, format) in properties {
|
||||
mpv_observe_property(handle, 0, name, format)
|
||||
@@ -552,6 +554,15 @@ final class MPVLayerRenderer {
|
||||
self.delegate?.renderer(self, didBecomeTracksReady: true)
|
||||
}
|
||||
}
|
||||
case "current-ao":
|
||||
// Audio output is now active - notify delegate
|
||||
if let aoName = getStringProperty(handle: handle, name: name) {
|
||||
print("[MPV] 🔊 Audio output selected: \(aoName)")
|
||||
DispatchQueue.main.async { [weak self] in
|
||||
guard let self else { return }
|
||||
self.delegate?.renderer(self, didSelectAudioOutput: aoName)
|
||||
}
|
||||
}
|
||||
default:
|
||||
break
|
||||
}
|
||||
|
||||
188
modules/mpv-player/ios/MPVNowPlayingManager.swift
Normal file
188
modules/mpv-player/ios/MPVNowPlayingManager.swift
Normal file
@@ -0,0 +1,188 @@
|
||||
import Foundation
|
||||
import MediaPlayer
|
||||
import UIKit
|
||||
import AVFoundation
|
||||
|
||||
/// Simple manager for Now Playing info and remote commands.
|
||||
/// Stores all state internally and updates Now Playing when ready.
|
||||
class MPVNowPlayingManager {
|
||||
static let shared = MPVNowPlayingManager()
|
||||
|
||||
// State
|
||||
private var title: String?
|
||||
private var artist: String?
|
||||
private var albumTitle: String?
|
||||
private var cachedArtwork: MPMediaItemArtwork?
|
||||
private var duration: TimeInterval = 0
|
||||
private var position: TimeInterval = 0
|
||||
private var isPlaying: Bool = false
|
||||
private var isCommandsSetup = false
|
||||
|
||||
private var artworkTask: URLSessionDataTask?
|
||||
|
||||
private init() {}
|
||||
|
||||
// MARK: - Audio Session
|
||||
|
||||
func activateAudioSession() {
|
||||
do {
|
||||
let session = AVAudioSession.sharedInstance()
|
||||
try session.setCategory(.playback, mode: .moviePlayback)
|
||||
try session.setActive(true)
|
||||
print("[NowPlaying] Audio session activated")
|
||||
} catch {
|
||||
print("[NowPlaying] Audio session error: \(error)")
|
||||
}
|
||||
}
|
||||
|
||||
func deactivateAudioSession() {
|
||||
do {
|
||||
try AVAudioSession.sharedInstance().setActive(false, options: .notifyOthersOnDeactivation)
|
||||
print("[NowPlaying] Audio session deactivated")
|
||||
} catch {
|
||||
print("[NowPlaying] Deactivation error: \(error)")
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - Remote Commands
|
||||
|
||||
func setupRemoteCommands(
|
||||
playHandler: @escaping () -> Void,
|
||||
pauseHandler: @escaping () -> Void,
|
||||
toggleHandler: @escaping () -> Void,
|
||||
seekHandler: @escaping (TimeInterval) -> Void,
|
||||
skipForward: @escaping (TimeInterval) -> Void,
|
||||
skipBackward: @escaping (TimeInterval) -> Void
|
||||
) {
|
||||
guard !isCommandsSetup else { return }
|
||||
isCommandsSetup = true
|
||||
|
||||
DispatchQueue.main.async {
|
||||
UIApplication.shared.beginReceivingRemoteControlEvents()
|
||||
}
|
||||
|
||||
let cc = MPRemoteCommandCenter.shared()
|
||||
|
||||
cc.playCommand.isEnabled = true
|
||||
cc.playCommand.addTarget { _ in playHandler(); return .success }
|
||||
|
||||
cc.pauseCommand.isEnabled = true
|
||||
cc.pauseCommand.addTarget { _ in pauseHandler(); return .success }
|
||||
|
||||
cc.togglePlayPauseCommand.isEnabled = true
|
||||
cc.togglePlayPauseCommand.addTarget { _ in toggleHandler(); return .success }
|
||||
|
||||
cc.skipForwardCommand.isEnabled = true
|
||||
cc.skipForwardCommand.preferredIntervals = [15]
|
||||
cc.skipForwardCommand.addTarget { e in
|
||||
if let ev = e as? MPSkipIntervalCommandEvent { skipForward(ev.interval) }
|
||||
return .success
|
||||
}
|
||||
|
||||
cc.skipBackwardCommand.isEnabled = true
|
||||
cc.skipBackwardCommand.preferredIntervals = [15]
|
||||
cc.skipBackwardCommand.addTarget { e in
|
||||
if let ev = e as? MPSkipIntervalCommandEvent { skipBackward(ev.interval) }
|
||||
return .success
|
||||
}
|
||||
|
||||
cc.changePlaybackPositionCommand.isEnabled = true
|
||||
cc.changePlaybackPositionCommand.addTarget { e in
|
||||
if let ev = e as? MPChangePlaybackPositionCommandEvent { seekHandler(ev.positionTime) }
|
||||
return .success
|
||||
}
|
||||
|
||||
print("[NowPlaying] Remote commands ready")
|
||||
}
|
||||
|
||||
func cleanupRemoteCommands() {
|
||||
guard isCommandsSetup else { return }
|
||||
|
||||
let cc = MPRemoteCommandCenter.shared()
|
||||
cc.playCommand.removeTarget(nil)
|
||||
cc.pauseCommand.removeTarget(nil)
|
||||
cc.togglePlayPauseCommand.removeTarget(nil)
|
||||
cc.skipForwardCommand.removeTarget(nil)
|
||||
cc.skipBackwardCommand.removeTarget(nil)
|
||||
cc.changePlaybackPositionCommand.removeTarget(nil)
|
||||
|
||||
DispatchQueue.main.async {
|
||||
UIApplication.shared.endReceivingRemoteControlEvents()
|
||||
}
|
||||
|
||||
isCommandsSetup = false
|
||||
print("[NowPlaying] Remote commands cleaned up")
|
||||
}
|
||||
|
||||
// MARK: - State Updates (call these whenever data changes)
|
||||
|
||||
/// Set metadata (title, artist, artwork URL)
|
||||
func setMetadata(title: String?, artist: String?, albumTitle: String?, artworkUrl: String?) {
|
||||
self.title = title
|
||||
self.artist = artist
|
||||
self.albumTitle = albumTitle
|
||||
|
||||
print("[NowPlaying] Metadata: \(title ?? "nil")")
|
||||
|
||||
// Load artwork async
|
||||
artworkTask?.cancel()
|
||||
if let urlString = artworkUrl, let url = URL(string: urlString) {
|
||||
artworkTask = URLSession.shared.dataTask(with: url) { [weak self] data, _, _ in
|
||||
if let data = data, let image = UIImage(data: data) {
|
||||
self?.cachedArtwork = MPMediaItemArtwork(boundsSize: image.size) { _ in image }
|
||||
print("[NowPlaying] Artwork loaded")
|
||||
DispatchQueue.main.async { self?.refresh() }
|
||||
}
|
||||
}
|
||||
artworkTask?.resume()
|
||||
}
|
||||
|
||||
refresh()
|
||||
}
|
||||
|
||||
/// Update playback state (position, duration, playing)
|
||||
func updatePlayback(position: TimeInterval, duration: TimeInterval, isPlaying: Bool) {
|
||||
self.position = position
|
||||
self.duration = duration
|
||||
self.isPlaying = isPlaying
|
||||
refresh()
|
||||
}
|
||||
|
||||
/// Clear everything
|
||||
func clear() {
|
||||
artworkTask?.cancel()
|
||||
title = nil
|
||||
artist = nil
|
||||
albumTitle = nil
|
||||
cachedArtwork = nil
|
||||
duration = 0
|
||||
position = 0
|
||||
isPlaying = false
|
||||
MPNowPlayingInfoCenter.default().nowPlayingInfo = nil
|
||||
print("[NowPlaying] Cleared")
|
||||
}
|
||||
|
||||
// MARK: - Private
|
||||
|
||||
/// Refresh Now Playing info if we have enough data
|
||||
private func refresh() {
|
||||
guard duration > 0 else {
|
||||
print("[NowPlaying] refresh skipped - duration is 0")
|
||||
return
|
||||
}
|
||||
|
||||
var info: [String: Any] = [
|
||||
MPMediaItemPropertyPlaybackDuration: duration,
|
||||
MPNowPlayingInfoPropertyElapsedPlaybackTime: position,
|
||||
MPNowPlayingInfoPropertyPlaybackRate: isPlaying ? 1.0 : 0.0
|
||||
]
|
||||
|
||||
if let title { info[MPMediaItemPropertyTitle] = title }
|
||||
if let artist { info[MPMediaItemPropertyArtist] = artist }
|
||||
if let albumTitle { info[MPMediaItemPropertyAlbumTitle] = albumTitle }
|
||||
if let cachedArtwork { info[MPMediaItemPropertyArtwork] = cachedArtwork }
|
||||
|
||||
MPNowPlayingInfoCenter.default().nowPlayingInfo = info
|
||||
print("[NowPlaying] ✅ Set info: title=\(title ?? "nil"), dur=\(Int(duration))s, pos=\(Int(position))s, rate=\(isPlaying ? 1.0 : 0.0)")
|
||||
}
|
||||
}
|
||||
@@ -43,6 +43,21 @@ public class MpvPlayerModule: Module {
|
||||
view.loadVideo(config: config)
|
||||
}
|
||||
|
||||
// Now Playing metadata for iOS Control Center and Lock Screen
|
||||
Prop("nowPlayingMetadata") { (view: MpvPlayerView, metadata: [String: Any]?) in
|
||||
guard let metadata = metadata else { return }
|
||||
// Convert Any values to String, filtering out nil/null values
|
||||
var stringMetadata: [String: String] = [:]
|
||||
for (key, value) in metadata {
|
||||
if let stringValue = value as? String {
|
||||
stringMetadata[key] = stringValue
|
||||
}
|
||||
}
|
||||
if !stringMetadata.isEmpty {
|
||||
view.setNowPlayingMetadata(stringMetadata)
|
||||
}
|
||||
}
|
||||
|
||||
// Async function to play video
|
||||
AsyncFunction("play") { (view: MpvPlayerView) in
|
||||
view.play()
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import AVFoundation
|
||||
import CoreMedia
|
||||
import ExpoModulesCore
|
||||
import MediaPlayer
|
||||
import UIKit
|
||||
|
||||
/// Configuration for loading a video
|
||||
@@ -41,7 +42,6 @@ class MpvPlayerView: ExpoView {
|
||||
private var renderer: MPVLayerRenderer?
|
||||
private var videoContainer: UIView!
|
||||
private var pipController: PiPController?
|
||||
|
||||
let onLoad = EventDispatcher()
|
||||
let onPlaybackStateChange = EventDispatcher()
|
||||
let onProgress = EventDispatcher()
|
||||
@@ -53,11 +53,14 @@ class MpvPlayerView: ExpoView {
|
||||
private var cachedDuration: Double = 0
|
||||
private var intendedPlayState: Bool = false
|
||||
private var _isZoomedToFill: Bool = false
|
||||
|
||||
// Reference to now playing manager
|
||||
private let nowPlayingManager = MPVNowPlayingManager.shared
|
||||
|
||||
required init(appContext: AppContext? = nil) {
|
||||
super.init(appContext: appContext)
|
||||
setupNotifications()
|
||||
setupView()
|
||||
// Note: Decoder reset is handled automatically via KVO in MPVLayerRenderer
|
||||
}
|
||||
|
||||
private func setupView() {
|
||||
@@ -109,6 +112,77 @@ class MpvPlayerView: ExpoView {
|
||||
CATransaction.commit()
|
||||
}
|
||||
|
||||
// MARK: - Audio Session & Notifications
|
||||
|
||||
private func setupNotifications() {
|
||||
// Handle audio session interruptions (e.g., incoming calls, other apps playing audio)
|
||||
NotificationCenter.default.addObserver(
|
||||
self, selector: #selector(handleAudioSessionInterruption),
|
||||
name: AVAudioSession.interruptionNotification, object: nil)
|
||||
}
|
||||
|
||||
@objc func handleAudioSessionInterruption(_ notification: Notification) {
|
||||
guard let userInfo = notification.userInfo,
|
||||
let typeValue = userInfo[AVAudioSessionInterruptionTypeKey] as? UInt,
|
||||
let type = AVAudioSession.InterruptionType(rawValue: typeValue) else {
|
||||
return
|
||||
}
|
||||
|
||||
switch type {
|
||||
case .began:
|
||||
// Interruption began - pause the video
|
||||
print("[MPV] Audio session interrupted - pausing video")
|
||||
self.pause()
|
||||
|
||||
case .ended:
|
||||
// Interruption ended - check if we should resume
|
||||
if let optionsValue = userInfo[AVAudioSessionInterruptionOptionKey] as? UInt {
|
||||
let options = AVAudioSession.InterruptionOptions(rawValue: optionsValue)
|
||||
if options.contains(.shouldResume) {
|
||||
print("[MPV] Audio session interruption ended - can resume")
|
||||
// Don't auto-resume - let user manually resume playback
|
||||
} else {
|
||||
print("[MPV] Audio session interruption ended - should not resume")
|
||||
}
|
||||
}
|
||||
|
||||
@unknown default:
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
private func setupRemoteCommands() {
|
||||
nowPlayingManager.setupRemoteCommands(
|
||||
playHandler: { [weak self] in self?.play() },
|
||||
pauseHandler: { [weak self] in self?.pause() },
|
||||
toggleHandler: { [weak self] in
|
||||
guard let self else { return }
|
||||
if self.intendedPlayState { self.pause() } else { self.play() }
|
||||
},
|
||||
seekHandler: { [weak self] time in self?.seekTo(position: time) },
|
||||
skipForward: { [weak self] interval in self?.seekBy(offset: interval) },
|
||||
skipBackward: { [weak self] interval in self?.seekBy(offset: -interval) }
|
||||
)
|
||||
}
|
||||
|
||||
// MARK: - Now Playing Info
|
||||
|
||||
func setNowPlayingMetadata(_ metadata: [String: String]) {
|
||||
print("[MPV] setNowPlayingMetadata: \(metadata["title"] ?? "nil")")
|
||||
nowPlayingManager.setMetadata(
|
||||
title: metadata["title"],
|
||||
artist: metadata["artist"],
|
||||
albumTitle: metadata["albumTitle"],
|
||||
artworkUrl: metadata["artworkUri"]
|
||||
)
|
||||
}
|
||||
|
||||
private func clearNowPlayingInfo() {
|
||||
nowPlayingManager.cleanupRemoteCommands()
|
||||
nowPlayingManager.deactivateAudioSession()
|
||||
nowPlayingManager.clear()
|
||||
}
|
||||
|
||||
func loadVideo(config: VideoLoadConfig) {
|
||||
// Skip reload if same URL is already playing
|
||||
if currentURL == config.url {
|
||||
@@ -149,6 +223,7 @@ class MpvPlayerView: ExpoView {
|
||||
|
||||
func play() {
|
||||
intendedPlayState = true
|
||||
setupRemoteCommands()
|
||||
renderer?.play()
|
||||
pipController?.setPlaybackRate(1.0)
|
||||
pipController?.updatePlaybackState()
|
||||
@@ -162,10 +237,17 @@ class MpvPlayerView: ExpoView {
|
||||
}
|
||||
|
||||
func seekTo(position: Double) {
|
||||
// Update cached position and Now Playing immediately for smooth Control Center feedback
|
||||
cachedPosition = position
|
||||
syncNowPlaying(isPlaying: !isPaused())
|
||||
renderer?.seek(to: position)
|
||||
}
|
||||
|
||||
func seekBy(offset: Double) {
|
||||
// Update cached position and Now Playing immediately for smooth Control Center feedback
|
||||
let newPosition = max(0, min(cachedPosition + offset, cachedDuration))
|
||||
cachedPosition = newPosition
|
||||
syncNowPlaying(isPlaying: !isPaused())
|
||||
renderer?.seek(by: offset)
|
||||
}
|
||||
|
||||
@@ -292,23 +374,32 @@ class MpvPlayerView: ExpoView {
|
||||
pipController?.stopPictureInPicture()
|
||||
renderer?.stop()
|
||||
displayLayer.removeFromSuperlayer()
|
||||
clearNowPlayingInfo()
|
||||
NotificationCenter.default.removeObserver(self)
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - MPVLayerRendererDelegate
|
||||
|
||||
extension MpvPlayerView: MPVLayerRendererDelegate {
|
||||
|
||||
// MARK: - Single location for Now Playing updates
|
||||
private func syncNowPlaying(isPlaying: Bool) {
|
||||
print("[MPV] syncNowPlaying: pos=\(Int(cachedPosition))s, dur=\(Int(cachedDuration))s, playing=\(isPlaying)")
|
||||
nowPlayingManager.updatePlayback(position: cachedPosition, duration: cachedDuration, isPlaying: isPlaying)
|
||||
}
|
||||
|
||||
func renderer(_: MPVLayerRenderer, didUpdatePosition position: Double, duration: Double, cacheSeconds: Double) {
|
||||
cachedPosition = position
|
||||
cachedDuration = duration
|
||||
|
||||
DispatchQueue.main.async { [weak self] in
|
||||
guard let self else { return }
|
||||
// Update PiP current time for progress bar
|
||||
|
||||
if self.pipController?.isPictureInPictureActive == true {
|
||||
self.pipController?.setCurrentTimeFromSeconds(position, duration: duration)
|
||||
}
|
||||
|
||||
|
||||
self.onProgress([
|
||||
"position": position,
|
||||
"duration": duration,
|
||||
@@ -321,12 +412,10 @@ extension MpvPlayerView: MPVLayerRendererDelegate {
|
||||
func renderer(_: MPVLayerRenderer, didChangePause isPaused: Bool) {
|
||||
DispatchQueue.main.async { [weak self] in
|
||||
guard let self else { return }
|
||||
// Don't update intendedPlayState here - it's only set by user actions (play/pause)
|
||||
// This prevents PiP UI flicker during seeking
|
||||
|
||||
// Sync timebase rate with actual playback state
|
||||
print("[MPV] didChangePause: isPaused=\(isPaused), cachedDuration=\(self.cachedDuration)")
|
||||
self.pipController?.setPlaybackRate(isPaused ? 0.0 : 1.0)
|
||||
|
||||
self.syncNowPlaying(isPlaying: !isPaused)
|
||||
self.onPlaybackStateChange([
|
||||
"isPaused": isPaused,
|
||||
"isPlaying": !isPaused,
|
||||
@@ -358,6 +447,13 @@ extension MpvPlayerView: MPVLayerRendererDelegate {
|
||||
self.onTracksReady([:])
|
||||
}
|
||||
}
|
||||
|
||||
func renderer(_: MPVLayerRenderer, didSelectAudioOutput audioOutput: String) {
|
||||
// Audio output is now active - this is the right time to activate audio session and set Now Playing
|
||||
print("[MPV] Audio output ready (\(audioOutput)), activating audio session and syncing Now Playing")
|
||||
nowPlayingManager.activateAudioSession()
|
||||
syncNowPlaying(isPlaying: !isPaused())
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - PiPControllerDelegate
|
||||
|
||||
@@ -25,6 +25,13 @@ export type OnErrorEventPayload = {
|
||||
|
||||
export type OnTracksReadyEventPayload = Record<string, never>;
|
||||
|
||||
export type NowPlayingMetadata = {
|
||||
title?: string;
|
||||
artist?: string;
|
||||
albumTitle?: string;
|
||||
artworkUri?: string;
|
||||
};
|
||||
|
||||
export type MpvPlayerModuleEvents = {
|
||||
onChange: (params: ChangeEventPayload) => void;
|
||||
};
|
||||
@@ -48,6 +55,8 @@ export type VideoSource = {
|
||||
export type MpvPlayerViewProps = {
|
||||
source?: VideoSource;
|
||||
style?: StyleProp<ViewStyle>;
|
||||
/** Metadata for iOS Control Center and Lock Screen now playing info */
|
||||
nowPlayingMetadata?: NowPlayingMetadata;
|
||||
onLoad?: (event: { nativeEvent: OnLoadEventPayload }) => void;
|
||||
onPlaybackStateChange?: (event: {
|
||||
nativeEvent: OnPlaybackStateChangePayload;
|
||||
|
||||
@@ -96,7 +96,7 @@
|
||||
"react-native-mmkv": "4.1.1",
|
||||
"react-native-nitro-modules": "0.33.1",
|
||||
"react-native-pager-view": "^6.9.1",
|
||||
"react-native-reanimated": "~4.2.0",
|
||||
"react-native-reanimated": "~4.1.1",
|
||||
"react-native-reanimated-carousel": "4.0.3",
|
||||
"react-native-safe-area-context": "~5.6.0",
|
||||
"react-native-screens": "~4.18.0",
|
||||
|
||||
Reference in New Issue
Block a user