forked from Ninjalama/streamyfin_mirror
Compare commits
1 Commits
fix/video-
...
refactor/s
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
6c051f6f61 |
4
app.json
4
app.json
@@ -2,7 +2,7 @@
|
||||
"expo": {
|
||||
"name": "Streamyfin",
|
||||
"slug": "streamyfin",
|
||||
"version": "0.18.0",
|
||||
"version": "0.17.0",
|
||||
"orientation": "default",
|
||||
"icon": "./assets/images/icon.png",
|
||||
"scheme": "streamyfin",
|
||||
@@ -33,7 +33,7 @@
|
||||
},
|
||||
"android": {
|
||||
"jsEngine": "hermes",
|
||||
"versionCode": 46,
|
||||
"versionCode": 43,
|
||||
"adaptiveIcon": {
|
||||
"foregroundImage": "./assets/images/adaptive_icon.png"
|
||||
},
|
||||
|
||||
@@ -42,11 +42,17 @@ export default function IndexLayout() {
|
||||
}}
|
||||
/>
|
||||
<Stack.Screen
|
||||
name="settings"
|
||||
name="settings/index"
|
||||
options={{
|
||||
title: "Settings",
|
||||
}}
|
||||
/>
|
||||
<Stack.Screen
|
||||
name="settings/audio-language"
|
||||
options={{
|
||||
title: "Audio Language",
|
||||
}}
|
||||
/>
|
||||
{Object.entries(nestedTabPageScreenOptions).map(([name, options]) => (
|
||||
<Stack.Screen key={name} name={name} options={options} />
|
||||
))}
|
||||
|
||||
61
app/(auth)/(tabs)/(home)/settings/audio-language.tsx
Normal file
61
app/(auth)/(tabs)/(home)/settings/audio-language.tsx
Normal file
@@ -0,0 +1,61 @@
|
||||
import { ScrollView, View, ViewProps } from "react-native";
|
||||
import { Text } from "@/components/common/Text";
|
||||
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
||||
import { LANGUAGES } from "@/constants/Languages";
|
||||
import { ListItem } from "@/components/list/ListItem";
|
||||
import { ListSection } from "@/components/list/ListSection";
|
||||
import { TAB_HEIGHT } from "@/constants/Values";
|
||||
import { DefaultLanguageOption, useSettings } from "@/utils/atoms/settings";
|
||||
import { Ionicons } from "@expo/vector-icons";
|
||||
import { Colors } from "@/constants/Colors";
|
||||
|
||||
interface Props extends ViewProps {}
|
||||
|
||||
export default function page() {
|
||||
const insets = useSafeAreaInsets();
|
||||
const [settings, updateSettings] = useSettings();
|
||||
return (
|
||||
<ScrollView
|
||||
contentContainerStyle={{
|
||||
paddingLeft: insets.left,
|
||||
paddingRight: insets.right,
|
||||
paddingBottom: 16,
|
||||
}}
|
||||
style={{
|
||||
marginBottom: TAB_HEIGHT,
|
||||
}}
|
||||
>
|
||||
<View className="py-4 px-4">
|
||||
<ListSection title="LANGUAGES">
|
||||
{LANGUAGES.sort(sortByName).map((l) => (
|
||||
<ListItem
|
||||
key={l.value}
|
||||
title={l.label}
|
||||
onPress={() => {
|
||||
updateSettings({
|
||||
...settings,
|
||||
defaultAudioLanguage: l,
|
||||
});
|
||||
}}
|
||||
iconAfter={
|
||||
settings?.defaultAudioLanguage?.value === l.value ? (
|
||||
<Ionicons name="checkmark" size={24} color={Colors.primary} />
|
||||
) : null
|
||||
}
|
||||
/>
|
||||
))}
|
||||
</ListSection>
|
||||
</View>
|
||||
</ScrollView>
|
||||
);
|
||||
}
|
||||
|
||||
const sortByName = (a: DefaultLanguageOption, b: DefaultLanguageOption) => {
|
||||
if (a.label < b.label) {
|
||||
return -1;
|
||||
}
|
||||
if (a.label > b.label) {
|
||||
return 1;
|
||||
}
|
||||
return 0;
|
||||
};
|
||||
@@ -1,13 +1,18 @@
|
||||
import { Button } from "@/components/Button";
|
||||
import { Text } from "@/components/common/Text";
|
||||
import { ListItem } from "@/components/ListItem";
|
||||
import { ListInputItem } from "@/components/list/ListInputItem";
|
||||
import { ListItem } from "@/components/list/ListItem";
|
||||
import { ListSection } from "@/components/list/ListSection";
|
||||
import { SettingToggles } from "@/components/settings/SettingToggles";
|
||||
import { useDownload } from "@/providers/DownloadProvider";
|
||||
import { apiAtom, useJellyfin, userAtom } from "@/providers/JellyfinProvider";
|
||||
import { useSettings } from "@/utils/atoms/settings";
|
||||
import { clearLogs, readFromLog } from "@/utils/log";
|
||||
import { Ionicons } from "@expo/vector-icons";
|
||||
import { getQuickConnectApi } from "@jellyfin/sdk/lib/utils/api";
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import * as Haptics from "expo-haptics";
|
||||
import { useRouter } from "expo-router";
|
||||
import { useAtom } from "jotai";
|
||||
import { Alert, ScrollView, View } from "react-native";
|
||||
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
||||
@@ -16,6 +21,7 @@ import { toast } from "sonner-native";
|
||||
export default function settings() {
|
||||
const { logout } = useJellyfin();
|
||||
const { deleteAllFiles } = useDownload();
|
||||
const [settings, updateSettings] = useSettings();
|
||||
|
||||
const [api] = useAtom(apiAtom);
|
||||
const [user] = useAtom(userAtom);
|
||||
@@ -57,6 +63,8 @@ export default function settings() {
|
||||
);
|
||||
};
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
return (
|
||||
<ScrollView
|
||||
contentContainerStyle={{
|
||||
@@ -73,15 +81,46 @@ export default function settings() {
|
||||
>
|
||||
registerBackgroundFetchAsync
|
||||
</Button> */}
|
||||
<View>
|
||||
<Text className="font-bold text-lg mb-2">User Info</Text>
|
||||
<ListSection title="USER INFO">
|
||||
<ListItem title="User" text={user?.Name} />
|
||||
<ListItem title="Server" text={api?.basePath} />
|
||||
<ListItem title="Token" text={api?.accessToken} />
|
||||
</ListSection>
|
||||
|
||||
<View className="flex flex-col rounded-xl overflow-hidden border-neutral-800 divide-y-2 divide-solid divide-neutral-800 ">
|
||||
<ListItem title="User" subTitle={user?.Name} />
|
||||
<ListItem title="Server" subTitle={api?.basePath} />
|
||||
<ListItem title="Token" subTitle={api?.accessToken} />
|
||||
</View>
|
||||
</View>
|
||||
<ListSection title="MEDIA">
|
||||
<ListItem
|
||||
title="Audio language"
|
||||
iconAfter={
|
||||
<Ionicons name="chevron-forward" size={20} color="white" />
|
||||
}
|
||||
onPress={() => router.push("/settings/audio-language")}
|
||||
/>
|
||||
<ListItem
|
||||
title="Subtitle language"
|
||||
iconAfter={
|
||||
<Ionicons name="chevron-forward" size={20} color="white" />
|
||||
}
|
||||
onPress={() => router.push("/settings/subtitle-language")}
|
||||
/>
|
||||
<ListInputItem
|
||||
textInputProps={{
|
||||
placeholder: "30",
|
||||
clearButtonMode: "never",
|
||||
returnKeyType: "done",
|
||||
}}
|
||||
defaultValue={(settings?.forwardSkipTime || "").toString()}
|
||||
title={"Forward skip"}
|
||||
onChange={(val) => {
|
||||
// 1. validate positive number
|
||||
// 2. save settings
|
||||
if (val.length === 0) return;
|
||||
if (val.match(/^\d+$/)) {
|
||||
} else {
|
||||
toast.error("Invalid number");
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</ListSection>
|
||||
|
||||
<View>
|
||||
<Text className="font-bold text-lg mb-2">Quick connect</Text>
|
||||
61
app/(auth)/(tabs)/(home)/settings/subtitle-language.tsx
Normal file
61
app/(auth)/(tabs)/(home)/settings/subtitle-language.tsx
Normal file
@@ -0,0 +1,61 @@
|
||||
import { ScrollView, View, ViewProps } from "react-native";
|
||||
import { Text } from "@/components/common/Text";
|
||||
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
||||
import { LANGUAGES } from "@/constants/Languages";
|
||||
import { ListItem } from "@/components/list/ListItem";
|
||||
import { ListSection } from "@/components/list/ListSection";
|
||||
import { TAB_HEIGHT } from "@/constants/Values";
|
||||
import { DefaultLanguageOption, useSettings } from "@/utils/atoms/settings";
|
||||
import { Ionicons } from "@expo/vector-icons";
|
||||
import { Colors } from "@/constants/Colors";
|
||||
|
||||
interface Props extends ViewProps {}
|
||||
|
||||
export default function page() {
|
||||
const insets = useSafeAreaInsets();
|
||||
const [settings, updateSettings] = useSettings();
|
||||
return (
|
||||
<ScrollView
|
||||
contentContainerStyle={{
|
||||
paddingLeft: insets.left,
|
||||
paddingRight: insets.right,
|
||||
paddingBottom: 16,
|
||||
}}
|
||||
style={{
|
||||
marginBottom: TAB_HEIGHT,
|
||||
}}
|
||||
>
|
||||
<View className="py-4 px-4">
|
||||
<ListSection title="LANGUAGES">
|
||||
{LANGUAGES.sort(sortByName).map((l) => (
|
||||
<ListItem
|
||||
key={l.value}
|
||||
title={l.label}
|
||||
onPress={() => {
|
||||
updateSettings({
|
||||
...settings,
|
||||
defaultSubtitleLanguage: l,
|
||||
});
|
||||
}}
|
||||
iconAfter={
|
||||
settings?.defaultSubtitleLanguage?.value === l.value ? (
|
||||
<Ionicons name="checkmark" size={24} color={Colors.primary} />
|
||||
) : null
|
||||
}
|
||||
/>
|
||||
))}
|
||||
</ListSection>
|
||||
</View>
|
||||
</ScrollView>
|
||||
);
|
||||
}
|
||||
|
||||
const sortByName = (a: DefaultLanguageOption, b: DefaultLanguageOption) => {
|
||||
if (a.label < b.label) {
|
||||
return -1;
|
||||
}
|
||||
if (a.label > b.label) {
|
||||
return 1;
|
||||
}
|
||||
return 0;
|
||||
};
|
||||
@@ -32,6 +32,7 @@ import {
|
||||
tagsFilterAtom,
|
||||
yearFilterAtom,
|
||||
} from "@/utils/atoms/filters";
|
||||
import { orientationAtom } from "@/utils/atoms/orientation";
|
||||
import {
|
||||
BaseItemDto,
|
||||
BaseItemDtoQueryResult,
|
||||
@@ -43,7 +44,6 @@ import {
|
||||
} from "@jellyfin/sdk/lib/utils/api";
|
||||
import { FlashList } from "@shopify/flash-list";
|
||||
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
||||
import { useOrientation } from "@/hooks/useOrientation";
|
||||
|
||||
const MemoizedTouchableItemRouter = React.memo(TouchableItemRouter);
|
||||
|
||||
@@ -60,13 +60,12 @@ const Page = () => {
|
||||
const [selectedTags, setSelectedTags] = useAtom(tagsFilterAtom);
|
||||
const [sortBy, _setSortBy] = useAtom(sortByAtom);
|
||||
const [sortOrder, _setSortOrder] = useAtom(sortOrderAtom);
|
||||
const [orientation] = useAtom(orientationAtom);
|
||||
const [sortByPreference, setSortByPreference] = useAtom(sortByPreferenceAtom);
|
||||
const [sortOrderPreference, setOderByPreference] = useAtom(
|
||||
sortOrderPreferenceAtom
|
||||
);
|
||||
|
||||
const { orientation } = useOrientation();
|
||||
|
||||
useEffect(() => {
|
||||
const sop = getSortOrderPreference(libraryId, sortOrderPreference);
|
||||
if (sop) {
|
||||
@@ -107,12 +106,11 @@ const Page = () => {
|
||||
[libraryId, sortOrderPreference]
|
||||
);
|
||||
|
||||
const nrOfCols = useMemo(() => {
|
||||
if (screenWidth < 300) return 2;
|
||||
if (screenWidth < 500) return 3;
|
||||
if (screenWidth < 800) return 5;
|
||||
if (screenWidth < 1000) return 6;
|
||||
if (screenWidth < 1500) return 7;
|
||||
const getNumberOfColumns = useCallback(() => {
|
||||
if (orientation === ScreenOrientation.Orientation.PORTRAIT_UP) return 3;
|
||||
if (screenWidth < 600) return 5;
|
||||
if (screenWidth < 960) return 6;
|
||||
if (screenWidth < 1280) return 7;
|
||||
return 6;
|
||||
}, [screenWidth, orientation]);
|
||||
|
||||
@@ -221,7 +219,7 @@ const Page = () => {
|
||||
|
||||
const renderItem = useCallback(
|
||||
({ item, index }: { item: BaseItemDto; index: number }) => (
|
||||
<TouchableItemRouter
|
||||
<MemoizedTouchableItemRouter
|
||||
key={item.Id}
|
||||
style={{
|
||||
width: "100%",
|
||||
@@ -232,10 +230,10 @@ const Page = () => {
|
||||
<View
|
||||
style={{
|
||||
alignSelf:
|
||||
orientation === ScreenOrientation.OrientationLock.PORTRAIT_UP
|
||||
? index % nrOfCols === 0
|
||||
orientation === ScreenOrientation.Orientation.PORTRAIT_UP
|
||||
? index % 3 === 0
|
||||
? "flex-end"
|
||||
: (index + 1) % nrOfCols === 0
|
||||
: (index + 1) % 3 === 0
|
||||
? "flex-start"
|
||||
: "center"
|
||||
: "center",
|
||||
@@ -246,7 +244,7 @@ const Page = () => {
|
||||
<ItemPoster item={item} />
|
||||
<ItemCardText item={item} />
|
||||
</View>
|
||||
</TouchableItemRouter>
|
||||
</MemoizedTouchableItemRouter>
|
||||
),
|
||||
[orientation]
|
||||
);
|
||||
@@ -431,7 +429,6 @@ const Page = () => {
|
||||
|
||||
return (
|
||||
<FlashList
|
||||
key={orientation}
|
||||
ListEmptyComponent={
|
||||
<View className="flex flex-col items-center justify-center h-full">
|
||||
<Text className="font-bold text-xl text-neutral-500">No results</Text>
|
||||
@@ -440,10 +437,10 @@ const Page = () => {
|
||||
contentInsetAdjustmentBehavior="automatic"
|
||||
data={flatData}
|
||||
renderItem={renderItem}
|
||||
extraData={[orientation, nrOfCols]}
|
||||
extraData={orientation}
|
||||
keyExtractor={keyExtractor}
|
||||
estimatedItemSize={244}
|
||||
numColumns={nrOfCols}
|
||||
numColumns={getNumberOfColumns()}
|
||||
onEndReached={() => {
|
||||
if (hasNextPage) {
|
||||
fetchNextPage();
|
||||
|
||||
@@ -2,7 +2,6 @@ import { Controls } from "@/components/video-player/Controls";
|
||||
import { useAndroidNavigationBar } from "@/hooks/useAndroidNavigationBar";
|
||||
import { useOrientation } from "@/hooks/useOrientation";
|
||||
import { useOrientationSettings } from "@/hooks/useOrientationSettings";
|
||||
import useScreenDimensions from "@/hooks/useScreenDimensions";
|
||||
import { useWebSocket } from "@/hooks/useWebsockets";
|
||||
import { apiAtom } from "@/providers/JellyfinProvider";
|
||||
import {
|
||||
@@ -18,20 +17,16 @@ import { getPlaystateApi } from "@jellyfin/sdk/lib/utils/api";
|
||||
import * as Haptics from "expo-haptics";
|
||||
import { useFocusEffect } from "expo-router";
|
||||
import { useAtomValue } from "jotai";
|
||||
import React, {
|
||||
useCallback,
|
||||
useEffect,
|
||||
useMemo,
|
||||
useRef,
|
||||
useState,
|
||||
} from "react";
|
||||
import React, { useCallback, useMemo, useRef, useState } from "react";
|
||||
import { Dimensions, Pressable, StatusBar, View } from "react-native";
|
||||
import { useSharedValue } from "react-native-reanimated";
|
||||
import Video, {
|
||||
OnProgressData,
|
||||
SelectedTrackType,
|
||||
VideoRef,
|
||||
SelectedTrack,
|
||||
SelectedTrackType,
|
||||
} from "react-native-video";
|
||||
import { WithDefault } from "react-native/Libraries/Types/CodegenTypes";
|
||||
|
||||
export default function page() {
|
||||
const { playSettings, playUrl, playSessionId } = usePlaySettings();
|
||||
@@ -41,7 +36,8 @@ export default function page() {
|
||||
const poster = usePoster(playSettings, api);
|
||||
const videoSource = useVideoSource(playSettings, api, poster, playUrl);
|
||||
const firstTime = useRef(true);
|
||||
const screenDimensions = useScreenDimensions();
|
||||
|
||||
const screenDimensions = Dimensions.get("screen");
|
||||
|
||||
const [isPlaybackStopped, setIsPlaybackStopped] = useState(false);
|
||||
const [showControls, setShowControls] = useState(true);
|
||||
@@ -220,28 +216,18 @@ export default function page() {
|
||||
return (
|
||||
<View
|
||||
style={{
|
||||
flex: 1,
|
||||
flexDirection: "column",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
width: screenDimensions.width,
|
||||
height: screenDimensions.height,
|
||||
position: "relative",
|
||||
}}
|
||||
className="flex flex-col items-center justify-center"
|
||||
>
|
||||
<StatusBar hidden />
|
||||
<Pressable
|
||||
onPress={() => {
|
||||
setShowControls(!showControls);
|
||||
}}
|
||||
style={{
|
||||
position: "absolute",
|
||||
top: 0,
|
||||
left: 0,
|
||||
width: screenDimensions.width,
|
||||
height: screenDimensions.height,
|
||||
zIndex: 0,
|
||||
}}
|
||||
className="absolute z-0 h-full w-full"
|
||||
>
|
||||
<Video
|
||||
ref={videoRef}
|
||||
|
||||
@@ -26,7 +26,7 @@ import { useFocusEffect, useNavigation } from "expo-router";
|
||||
import * as ScreenOrientation from "expo-screen-orientation";
|
||||
import { useAtom } from "jotai";
|
||||
import React, { useCallback, useEffect, useMemo, useState } from "react";
|
||||
import { Alert, View } from "react-native";
|
||||
import { View } from "react-native";
|
||||
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
||||
import { Chromecast } from "./Chromecast";
|
||||
import { ItemHeader } from "./ItemHeader";
|
||||
@@ -59,11 +59,6 @@ export const ItemContent: React.FC<{ item: BaseItemDto }> = React.memo(
|
||||
audioIndex,
|
||||
subtitleIndex,
|
||||
});
|
||||
|
||||
if (!mediaSource) {
|
||||
Alert.alert("Error", "No media source found for this item.");
|
||||
navigation.goBack();
|
||||
}
|
||||
}, [item, settings])
|
||||
);
|
||||
|
||||
|
||||
@@ -1,35 +0,0 @@
|
||||
import { PropsWithChildren, ReactNode } from "react";
|
||||
import { View, ViewProps } from "react-native";
|
||||
import { Text } from "./common/Text";
|
||||
|
||||
interface Props extends ViewProps {
|
||||
title?: string | null | undefined;
|
||||
subTitle?: string | null | undefined;
|
||||
children?: ReactNode;
|
||||
iconAfter?: ReactNode;
|
||||
}
|
||||
|
||||
export const ListItem: React.FC<PropsWithChildren<Props>> = ({
|
||||
title,
|
||||
subTitle,
|
||||
iconAfter,
|
||||
children,
|
||||
...props
|
||||
}) => {
|
||||
return (
|
||||
<View
|
||||
className="flex flex-row items-center justify-between bg-neutral-900 p-4"
|
||||
{...props}
|
||||
>
|
||||
<View className="flex flex-col overflow-visible">
|
||||
<Text className="font-bold ">{title}</Text>
|
||||
{subTitle && (
|
||||
<Text uiTextView selectable className="text-xs">
|
||||
{subTitle}
|
||||
</Text>
|
||||
)}
|
||||
</View>
|
||||
{iconAfter}
|
||||
</View>
|
||||
);
|
||||
};
|
||||
22
components/_page_template.tsx
Normal file
22
components/_page_template.tsx
Normal file
@@ -0,0 +1,22 @@
|
||||
import { ScrollView, View, ViewProps } from "react-native";
|
||||
import { Text } from "@/components/common/Text";
|
||||
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
||||
import { TAB_HEIGHT } from "@/constants/Values";
|
||||
|
||||
interface Props extends ViewProps {}
|
||||
|
||||
export default function page() {
|
||||
const insets = useSafeAreaInsets();
|
||||
return (
|
||||
<ScrollView
|
||||
contentContainerStyle={{
|
||||
paddingLeft: insets.left,
|
||||
paddingRight: insets.right,
|
||||
paddingBottom: 16,
|
||||
}}
|
||||
style={{
|
||||
marginBottom: TAB_HEIGHT,
|
||||
}}
|
||||
></ScrollView>
|
||||
);
|
||||
}
|
||||
64
components/list/ListInputItem.tsx
Normal file
64
components/list/ListInputItem.tsx
Normal file
@@ -0,0 +1,64 @@
|
||||
import { PropsWithChildren, ReactNode, useEffect, useState } from "react";
|
||||
import {
|
||||
Pressable,
|
||||
TextInput,
|
||||
TextInputProps,
|
||||
TouchableOpacity,
|
||||
TouchableOpacityProps,
|
||||
View,
|
||||
ViewProps,
|
||||
} from "react-native";
|
||||
import { Text } from "../common/Text";
|
||||
|
||||
interface Props extends ViewProps {
|
||||
title?: string | null | undefined;
|
||||
text?: string | null | undefined;
|
||||
children?: ReactNode;
|
||||
iconAfter?: ReactNode;
|
||||
iconBefore?: ReactNode;
|
||||
textInputProps?: TextInputProps;
|
||||
defaultValue?: string;
|
||||
onChange: (text: string) => void;
|
||||
}
|
||||
|
||||
export const ListInputItem: React.FC<PropsWithChildren<Props>> = ({
|
||||
title,
|
||||
text,
|
||||
iconAfter,
|
||||
iconBefore,
|
||||
children,
|
||||
onChange,
|
||||
textInputProps,
|
||||
defaultValue,
|
||||
...props
|
||||
}) => {
|
||||
const [value, setValue] = useState<string>(defaultValue || "");
|
||||
|
||||
useEffect(() => {
|
||||
onChange(value);
|
||||
}, [value]);
|
||||
|
||||
return (
|
||||
<View
|
||||
className={`flex flex-row items-center justify-between px-4 h-12 bg-neutral-900`}
|
||||
{...props}
|
||||
>
|
||||
{iconBefore && <View className="mr-2">{iconBefore}</View>}
|
||||
<View>
|
||||
<Text className="">{title}</Text>
|
||||
</View>
|
||||
<View className="ml-auto">
|
||||
<TextInput
|
||||
inputMode="numeric"
|
||||
keyboardType="decimal-pad"
|
||||
style={{ color: "white" }}
|
||||
value={value}
|
||||
onChangeText={setValue}
|
||||
className=""
|
||||
{...textInputProps}
|
||||
/>
|
||||
</View>
|
||||
{iconAfter && <View className="ml-2">{iconAfter}</View>}
|
||||
</View>
|
||||
);
|
||||
};
|
||||
44
components/list/ListItem.tsx
Normal file
44
components/list/ListItem.tsx
Normal file
@@ -0,0 +1,44 @@
|
||||
import { PropsWithChildren, ReactNode, useState } from "react";
|
||||
import {
|
||||
Pressable,
|
||||
TouchableOpacity,
|
||||
TouchableOpacityProps,
|
||||
View,
|
||||
ViewProps,
|
||||
} from "react-native";
|
||||
import { Text } from "../common/Text";
|
||||
|
||||
interface Props extends TouchableOpacityProps {
|
||||
title?: string | null | undefined;
|
||||
text?: string | null | undefined;
|
||||
children?: ReactNode;
|
||||
iconAfter?: ReactNode;
|
||||
iconBefore?: ReactNode;
|
||||
}
|
||||
|
||||
export const ListItem: React.FC<PropsWithChildren<Props>> = ({
|
||||
title,
|
||||
text,
|
||||
iconAfter,
|
||||
iconBefore,
|
||||
children,
|
||||
...props
|
||||
}) => {
|
||||
return (
|
||||
<TouchableOpacity
|
||||
className={`flex flex-row items-center justify-between px-4 h-12 bg-neutral-900`}
|
||||
{...props}
|
||||
>
|
||||
{iconBefore && <View className="mr-2">{iconBefore}</View>}
|
||||
<View>
|
||||
<Text className="">{title}</Text>
|
||||
</View>
|
||||
<View className="ml-auto">
|
||||
<Text selectable className="">
|
||||
{text}
|
||||
</Text>
|
||||
</View>
|
||||
{iconAfter && <View className="ml-2">{iconAfter}</View>}
|
||||
</TouchableOpacity>
|
||||
);
|
||||
};
|
||||
24
components/list/ListSection.tsx
Normal file
24
components/list/ListSection.tsx
Normal file
@@ -0,0 +1,24 @@
|
||||
import { View, ViewProps } from "react-native";
|
||||
import { Text } from "@/components/common/Text";
|
||||
import { Children, PropsWithChildren } from "react";
|
||||
|
||||
interface Props extends ViewProps {
|
||||
title: string;
|
||||
}
|
||||
|
||||
export const ListSection: React.FC<PropsWithChildren<Props>> = ({
|
||||
children,
|
||||
title,
|
||||
...props
|
||||
}) => {
|
||||
return (
|
||||
<View {...props}>
|
||||
<Text className="ml-4 mb-1 text-xs text-neutral-500 uppercase">
|
||||
{title}
|
||||
</Text>
|
||||
<View className="flex flex-col rounded-xl overflow-hidden border-neutral-800 divide-y-2 divide-solid divide-neutral-800">
|
||||
{children}
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
@@ -10,6 +10,7 @@ import {
|
||||
registerBackgroundFetchAsync,
|
||||
unregisterBackgroundFetchAsync,
|
||||
} from "@/utils/background-tasks";
|
||||
import { getStatistics } from "@/utils/optimize-server";
|
||||
import { getItemsApi } from "@jellyfin/sdk/lib/utils/api";
|
||||
import { useQuery, useQueryClient } from "@tanstack/react-query";
|
||||
import * as BackgroundFetch from "expo-background-fetch";
|
||||
@@ -18,7 +19,6 @@ import * as TaskManager from "expo-task-manager";
|
||||
import { useAtom } from "jotai";
|
||||
import { useEffect, useState } from "react";
|
||||
import {
|
||||
ActivityIndicator,
|
||||
Linking,
|
||||
Switch,
|
||||
TouchableOpacity,
|
||||
@@ -32,8 +32,6 @@ import { Input } from "../common/Input";
|
||||
import { Text } from "../common/Text";
|
||||
import { Loader } from "../Loader";
|
||||
import { MediaToggles } from "./MediaToggles";
|
||||
import axios from "axios";
|
||||
import { getStatistics } from "@/utils/optimize-server";
|
||||
|
||||
interface Props extends ViewProps {}
|
||||
|
||||
|
||||
@@ -123,6 +123,17 @@ export const Controls: React.FC<Props> = ({
|
||||
|
||||
const wasPlayingRef = useRef(false);
|
||||
|
||||
const updateTimes = useCallback(
|
||||
(currentProgress: number, maxValue: number) => {
|
||||
const current = ticksToSeconds(currentProgress);
|
||||
const remaining = ticksToSeconds(maxValue - currentProgress);
|
||||
|
||||
setCurrentTime(current);
|
||||
setRemainingTime(remaining);
|
||||
},
|
||||
[]
|
||||
);
|
||||
|
||||
const { showSkipButton, skipIntro } = useIntroSkipper(
|
||||
item.Id,
|
||||
currentTime,
|
||||
@@ -169,23 +180,6 @@ export const Controls: React.FC<Props> = ({
|
||||
router.replace("/play-video");
|
||||
}, [nextItem, settings]);
|
||||
|
||||
const updateTimes = useCallback(
|
||||
(currentProgress: number, maxValue: number) => {
|
||||
const current = ticksToSeconds(currentProgress);
|
||||
const remaining = ticksToSeconds(maxValue - currentProgress);
|
||||
|
||||
setCurrentTime(current);
|
||||
setRemainingTime(remaining);
|
||||
|
||||
if (currentProgress === maxValue) {
|
||||
setShowControls(true);
|
||||
// Automatically play the next item if it exists
|
||||
goToNextItem();
|
||||
}
|
||||
},
|
||||
[goToNextItem]
|
||||
);
|
||||
|
||||
useAnimatedReaction(
|
||||
() => ({
|
||||
progress: progress.value,
|
||||
|
||||
4
eas.json
4
eas.json
@@ -22,13 +22,13 @@
|
||||
}
|
||||
},
|
||||
"production": {
|
||||
"channel": "0.18.0",
|
||||
"channel": "0.17.0",
|
||||
"android": {
|
||||
"image": "latest"
|
||||
}
|
||||
},
|
||||
"production-apk": {
|
||||
"channel": "0.18.0",
|
||||
"channel": "0.17.0",
|
||||
"android": {
|
||||
"buildType": "apk",
|
||||
"image": "latest"
|
||||
|
||||
@@ -1,27 +0,0 @@
|
||||
import { useState, useEffect } from "react";
|
||||
import { Dimensions, ScaledSize } from "react-native";
|
||||
|
||||
const useScreenDimensions = (): ScaledSize => {
|
||||
const [screenDimensions, setScreenDimensions] = useState(
|
||||
Dimensions.get("screen")
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
const updateDimensions = () => {
|
||||
setScreenDimensions(Dimensions.get("screen"));
|
||||
};
|
||||
|
||||
const dimensionsListener = Dimensions.addEventListener(
|
||||
"change",
|
||||
updateDimensions
|
||||
);
|
||||
|
||||
return () => {
|
||||
dimensionsListener.remove();
|
||||
};
|
||||
}, []);
|
||||
|
||||
return screenDimensions;
|
||||
};
|
||||
|
||||
export default useScreenDimensions;
|
||||
@@ -52,7 +52,7 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
|
||||
setJellyfin(
|
||||
() =>
|
||||
new Jellyfin({
|
||||
clientInfo: { name: "Streamyfin", version: "0.18.0" },
|
||||
clientInfo: { name: "Streamyfin", version: "0.17.0" },
|
||||
deviceInfo: { name: Platform.OS === "ios" ? "iOS" : "Android", id },
|
||||
})
|
||||
);
|
||||
@@ -86,7 +86,7 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
|
||||
return {
|
||||
authorization: `MediaBrowser Client="Streamyfin", Device=${
|
||||
Platform.OS === "android" ? "Android" : "iOS"
|
||||
}, DeviceId="${deviceId}", Version="0.18.0"`,
|
||||
}, DeviceId="${deviceId}", Version="0.17.0"`,
|
||||
};
|
||||
}, [deviceId]);
|
||||
|
||||
|
||||
@@ -9,7 +9,7 @@ import { Settings } from "../atoms/settings";
|
||||
interface PlaySettings {
|
||||
item: BaseItemDto;
|
||||
bitrate: (typeof BITRATES)[0];
|
||||
mediaSource?: MediaSourceInfo | null;
|
||||
mediaSource: MediaSourceInfo | undefined;
|
||||
audioIndex?: number | null;
|
||||
subtitleIndex?: number | null;
|
||||
}
|
||||
@@ -29,9 +29,10 @@ export function getDefaultPlaySettings(
|
||||
}
|
||||
|
||||
// 1. Get first media source
|
||||
|
||||
const mediaSource = item.MediaSources?.[0];
|
||||
|
||||
if (!mediaSource) throw new Error("No media source found");
|
||||
|
||||
// 2. Get default or preferred audio
|
||||
const defaultAudioIndex = mediaSource?.DefaultAudioStreamIndex;
|
||||
const preferedAudioIndex = mediaSource?.MediaStreams?.find(
|
||||
|
||||
Reference in New Issue
Block a user