feat: (iOS) Switch Video Players

components/settings/OtherSettings.tsx

@@ -1,5 +1,5 @@
 import { Platform } from "react-native";
-import { ScreenOrientationEnum, useSettings } from "@/utils/atoms/settings";
+import {ScreenOrientationEnum, useSettings, VideoPlayer} from "@/utils/atoms/settings";
 import { BitrateSelector, BITRATES } from "@/components/BitrateSelector";
 import {
   BACKGROUND_FETCH_TASK,
@@ -22,6 +22,7 @@ import { ListItem } from "../list/ListItem";
 import { useTranslation } from "react-i18next";
 import DisabledSetting from "@/components/settings/DisabledSetting";
 import Dropdown from "@/components/common/Dropdown";
+import {isNumber} from "lodash";
 
 export const OtherSettings: React.FC = () => {
   const router = useRouter();
@@ -142,6 +143,36 @@ export const OtherSettings: React.FC = () => {
           />
         </ListItem>
 
+        {(Platform.OS === "ios" || Platform.isTVOS)&& (
+          <ListItem
+            title={t("home.settings.other.video_player")}
+            disabled={pluginSettings?.defaultPlayer?.locked}
+          >
+            <Dropdown
+              data={Object.values(VideoPlayer).filter(isNumber)}
+              disabled={pluginSettings?.defaultPlayer?.locked}
+              keyExtractor={String}
+              titleExtractor={(item) => t(`home.settings.other.video_players.${VideoPlayer[item]}`)}
+              title={
+                <TouchableOpacity className="flex flex-row items-center justify-between py-3 pl-3">
+                  <Text className="mr-1 text-[#8E8D91]">
+                    {t(`home.settings.other.video_players.${VideoPlayer[settings.defaultPlayer]}`)}
+                  </Text>
+                  <Ionicons
+                    name="chevron-expand-sharp"
+                    size={18}
+                    color="#5A5960"
+                  />
+                </TouchableOpacity>
+              }
+              label={t("home.settings.other.orientation")}
+              onSelected={(defaultPlayer) =>
+                updateSettings({ defaultPlayer })
+              }
+            />
+          </ListItem>
+        )}
+
         <ListItem
           title={t("home.settings.other.show_custom_menu_links")}
           disabled={pluginSettings?.showCustomMenuLinks?.locked}

components/video-player/controls/Controls.tsx

@@ -1,65 +1,40 @@
-import { Text } from "@/components/common/Text";
-import { Loader } from "@/components/Loader";
-import { useAdjacentItems } from "@/hooks/useAdjacentEpisodes";
-import { useCreditSkipper } from "@/hooks/useCreditSkipper";
-import { useHaptic } from "@/hooks/useHaptic";
-import { useIntroSkipper } from "@/hooks/useIntroSkipper";
-import { useTrickplay } from "@/hooks/useTrickplay";
-import {
-  TrackInfo,
-  VlcPlayerViewRef,
-} from "@/modules/vlc-player/src/VlcPlayer.types";
-import { apiAtom } from "@/providers/JellyfinProvider";
-import { useSettings } from "@/utils/atoms/settings";
-import {
-  getDefaultPlaySettings,
-  previousIndexes,
-} from "@/utils/jellyfin/getDefaultPlaySettings";
-import { getItemById } from "@/utils/jellyfin/user-library/getItemById";
-import { writeToLog } from "@/utils/log";
-import {
-  formatTimeString,
-  msToTicks,
-  secondsToMs,
-  ticksToMs,
-  ticksToSeconds,
-} from "@/utils/time";
-import { Ionicons, MaterialIcons } from "@expo/vector-icons";
-import {
-  BaseItemDto,
-  MediaSourceInfo,
-} from "@jellyfin/sdk/lib/generated-client";
-import { Image } from "expo-image";
-import { useLocalSearchParams, useRouter } from "expo-router";
+import {Text} from "@/components/common/Text";
+import {Loader} from "@/components/Loader";
+import {useAdjacentItems} from "@/hooks/useAdjacentEpisodes";
+import {useCreditSkipper} from "@/hooks/useCreditSkipper";
+import {useHaptic} from "@/hooks/useHaptic";
+import {useIntroSkipper} from "@/hooks/useIntroSkipper";
+import {useTrickplay} from "@/hooks/useTrickplay";
+import {TrackInfo, VlcPlayerViewRef,} from "@/modules/VlcPlayer.types";
+import {apiAtom} from "@/providers/JellyfinProvider";
+import {useSettings, VideoPlayer} from "@/utils/atoms/settings";
+import {getDefaultPlaySettings,} from "@/utils/jellyfin/getDefaultPlaySettings";
+import {getItemById} from "@/utils/jellyfin/user-library/getItemById";
+import {writeToLog} from "@/utils/log";
+import {formatTimeString, msToTicks, secondsToMs, ticksToMs, ticksToSeconds,} from "@/utils/time";
+import {Ionicons, MaterialIcons} from "@expo/vector-icons";
+import {BaseItemDto, MediaSourceInfo,} from "@jellyfin/sdk/lib/generated-client";
+import {Image} from "expo-image";
+import {useLocalSearchParams, useRouter} from "expo-router";
 import * as ScreenOrientation from "@/packages/expo-screen-orientation";
-import { useAtom } from "jotai";
-import { debounce } from "lodash";
-import React, { useCallback, useEffect, useRef, useState } from "react";
-import {
-  Platform,
-  TouchableOpacity,
-  useWindowDimensions,
-  View,
-} from "react-native";
-import { Slider } from "react-native-awesome-slider";
-import {
-  runOnJS,
-  SharedValue,
-  useAnimatedReaction,
-  useSharedValue,
-} from "react-native-reanimated";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { VideoRef } from "react-native-video";
+import {useAtom} from "jotai";
+import {debounce} from "lodash";
+import React, {useCallback, useEffect, useRef, useState} from "react";
+import {Platform, TouchableOpacity, useWindowDimensions, View,} from "react-native";
+import {Slider} from "react-native-awesome-slider";
+import {runOnJS, SharedValue, useAnimatedReaction, useSharedValue,} from "react-native-reanimated";
+import {useSafeAreaInsets} from "react-native-safe-area-context";
+import {VideoRef} from "react-native-video";
 import AudioSlider from "./AudioSlider";
 import BrightnessSlider from "./BrightnessSlider";
-import { ControlProvider } from "./contexts/ControlContext";
-import { VideoProvider } from "./contexts/VideoContext";
+import {ControlProvider} from "./contexts/ControlContext";
+import {VideoProvider} from "./contexts/VideoContext";
 import DropdownView from "./dropdown/DropdownView";
-import { EpisodeList } from "./EpisodeList";
+import {EpisodeList} from "./EpisodeList";
 import NextEpisodeCountDownButton from "./NextEpisodeCountDownButton";
 import SkipButton from "./SkipButton";
-import { useControlsTimeout } from "./useControlsTimeout";
-import { VideoTouchOverlay } from "./VideoTouchOverlay";
+import {useControlsTimeout} from "./useControlsTimeout";
+import {VideoTouchOverlay} from "./VideoTouchOverlay";
 
 interface Props {
   item: BaseItemDto;
@@ -494,7 +469,7 @@ export const Controls: React.FC<Props> = ({
             )}
 
             <View className="flex flex-row items-center space-x-2 ">
-              {!Platform.isTV && (
+              {!Platform.isTV && settings.defaultPlayer == VideoPlayer.VLC_4 && (
                 <TouchableOpacity
                   onPress={startPictureInPicture}
                   className="aspect-square flex flex-col rounded-xl items-center justify-center p-2"

components/video-player/controls/contexts/ControlContext.tsx

@@ -1,4 +1,3 @@
-import { TrackInfo } from "@/modules/vlc-player";
 import {
   BaseItemDto,
   MediaSourceInfo,

components/video-player/controls/contexts/VideoContext.tsx

@@ -1,4 +1,4 @@
-import { TrackInfo } from "@/modules/vlc-player";
+import { TrackInfo } from "@/modules/VlcPlayer.types";
 import React, { createContext, useContext, useState, ReactNode, useEffect, useMemo } from "react";
 import { useControlContext } from "./ControlContext";
 import { Track } from "../types";

components/vlc/VideoDebugInfo.tsx

@@ -1,7 +1,7 @@
 import {
   TrackInfo,
   VlcPlayerViewRef,
-} from "@/modules/vlc-player/src/VlcPlayer.types";
+} from "@/modules/VlcPlayer.types";
 import React, { useEffect, useState } from "react";
 import { TouchableOpacity, View, ViewProps } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";