mirror of
https://github.com/tapframe/NuvioStreaming.git
synced 2026-04-20 16:22:04 +00:00
orientation fix
This commit is contained in:
parent
2a4c076854
commit
f0271cd395
3 changed files with 50 additions and 18 deletions
|
|
@ -109,8 +109,18 @@ const ContinueWatchingSection = React.forwardRef<ContinueWatchingRef>((props, re
|
||||||
const longPressTimeoutRef = useRef<NodeJS.Timeout | null>(null);
|
const longPressTimeoutRef = useRef<NodeJS.Timeout | null>(null);
|
||||||
|
|
||||||
// Enhanced responsive sizing for tablets and TV screens
|
// Enhanced responsive sizing for tablets and TV screens
|
||||||
const deviceWidth = Dimensions.get('window').width;
|
const [dimensions, setDimensions] = useState(Dimensions.get('window'));
|
||||||
const deviceHeight = Dimensions.get('window').height;
|
const deviceWidth = dimensions.width;
|
||||||
|
const deviceHeight = dimensions.height;
|
||||||
|
|
||||||
|
// Listen for dimension changes (orientation changes)
|
||||||
|
useEffect(() => {
|
||||||
|
const subscription = Dimensions.addEventListener('change', ({ window }) => {
|
||||||
|
setDimensions(window);
|
||||||
|
});
|
||||||
|
|
||||||
|
return () => subscription?.remove();
|
||||||
|
}, []);
|
||||||
|
|
||||||
// Determine device type based on width
|
// Determine device type based on width
|
||||||
const getDeviceType = useCallback(() => {
|
const getDeviceType = useCallback(() => {
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
import React, { useEffect, useRef, useMemo } from 'react';
|
import React, { useEffect, useRef, useMemo, useState } from 'react';
|
||||||
import { NavigationContainer, DefaultTheme as NavigationDefaultTheme, DarkTheme as NavigationDarkTheme, Theme, NavigationProp } from '@react-navigation/native';
|
import { NavigationContainer, DefaultTheme as NavigationDefaultTheme, DarkTheme as NavigationDarkTheme, Theme, NavigationProp } from '@react-navigation/native';
|
||||||
import { createNativeStackNavigator, NativeStackNavigationOptions, NativeStackNavigationProp } from '@react-navigation/native-stack';
|
import { createNativeStackNavigator, NativeStackNavigationOptions, NativeStackNavigationProp } from '@react-navigation/native-stack';
|
||||||
import { createBottomTabNavigator, BottomTabNavigationProp } from '@react-navigation/bottom-tabs';
|
import { createBottomTabNavigator, BottomTabNavigationProp } from '@react-navigation/bottom-tabs';
|
||||||
|
|
@ -428,11 +428,21 @@ const TabIcon = React.memo(({ focused, color, iconName, iconLibrary = 'material'
|
||||||
|
|
||||||
// Update the TabScreenWrapper component with fixed layout dimensions
|
// Update the TabScreenWrapper component with fixed layout dimensions
|
||||||
const TabScreenWrapper: React.FC<{children: React.ReactNode}> = ({ children }) => {
|
const TabScreenWrapper: React.FC<{children: React.ReactNode}> = ({ children }) => {
|
||||||
|
const [dimensions, setDimensions] = useState(Dimensions.get('window'));
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const subscription = Dimensions.addEventListener('change', ({ window }) => {
|
||||||
|
setDimensions(window);
|
||||||
|
});
|
||||||
|
|
||||||
|
return () => subscription?.remove();
|
||||||
|
}, []);
|
||||||
|
|
||||||
const isTablet = useMemo(() => {
|
const isTablet = useMemo(() => {
|
||||||
const { width, height } = Dimensions.get('window');
|
const { width, height } = dimensions;
|
||||||
const smallestDimension = Math.min(width, height);
|
const smallestDimension = Math.min(width, height);
|
||||||
return (Platform.OS === 'ios' ? (Platform as any).isPad === true : smallestDimension >= 768);
|
return (Platform.OS === 'ios' ? (Platform as any).isPad === true : smallestDimension >= 768);
|
||||||
}, []);
|
}, [dimensions]);
|
||||||
const insets = useSafeAreaInsets();
|
const insets = useSafeAreaInsets();
|
||||||
// Force consistent status bar settings
|
// Force consistent status bar settings
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
@ -498,6 +508,15 @@ const MainTabs = () => {
|
||||||
const { useSettings: useSettingsHook } = require('../hooks/useSettings');
|
const { useSettings: useSettingsHook } = require('../hooks/useSettings');
|
||||||
const { settings: appSettings } = useSettingsHook();
|
const { settings: appSettings } = useSettingsHook();
|
||||||
const [hasUpdateBadge, setHasUpdateBadge] = React.useState(false);
|
const [hasUpdateBadge, setHasUpdateBadge] = React.useState(false);
|
||||||
|
const [dimensions, setDimensions] = useState(Dimensions.get('window'));
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const subscription = Dimensions.addEventListener('change', ({ window }) => {
|
||||||
|
setDimensions(window);
|
||||||
|
});
|
||||||
|
|
||||||
|
return () => subscription?.remove();
|
||||||
|
}, []);
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
if (Platform.OS !== 'android') return;
|
if (Platform.OS !== 'android') return;
|
||||||
let mounted = true;
|
let mounted = true;
|
||||||
|
|
@ -531,10 +550,10 @@ const MainTabs = () => {
|
||||||
}, []);
|
}, []);
|
||||||
const { isHomeLoading } = useLoading();
|
const { isHomeLoading } = useLoading();
|
||||||
const isTablet = useMemo(() => {
|
const isTablet = useMemo(() => {
|
||||||
const { width, height } = Dimensions.get('window');
|
const { width, height } = dimensions;
|
||||||
const smallestDimension = Math.min(width, height);
|
const smallestDimension = Math.min(width, height);
|
||||||
return (Platform.OS === 'ios' ? (Platform as any).isPad === true : smallestDimension >= 768);
|
return (Platform.OS === 'ios' ? (Platform as any).isPad === true : smallestDimension >= 768);
|
||||||
}, []);
|
}, [dimensions]);
|
||||||
const insets = useSafeAreaInsets();
|
const insets = useSafeAreaInsets();
|
||||||
const isIosTablet = Platform.OS === 'ios' && isTablet;
|
const isIosTablet = Platform.OS === 'ios' && isTablet;
|
||||||
const [hidden, setHidden] = React.useState(HeaderVisibility.isHidden());
|
const [hidden, setHidden] = React.useState(HeaderVisibility.isHidden());
|
||||||
|
|
|
||||||
|
|
@ -708,10 +708,18 @@ export const StreamsScreen = () => {
|
||||||
const nextLoading = { ...prevLoading };
|
const nextLoading = { ...prevLoading };
|
||||||
let changed = false;
|
let changed = false;
|
||||||
expectedProviders.forEach(providerId => {
|
expectedProviders.forEach(providerId => {
|
||||||
const hasStreams = currentStreamsData[providerId] &&
|
const providerExists = currentStreamsData[providerId];
|
||||||
|
const hasStreams = providerExists &&
|
||||||
currentStreamsData[providerId].streams &&
|
currentStreamsData[providerId].streams &&
|
||||||
currentStreamsData[providerId].streams.length > 0;
|
currentStreamsData[providerId].streams.length > 0;
|
||||||
const value = (loadingStreams || loadingEpisodeStreams) && !hasStreams;
|
|
||||||
|
// Stop loading if:
|
||||||
|
// 1. Provider exists (completed) and has streams, OR
|
||||||
|
// 2. Provider exists (completed) but has 0 streams, OR
|
||||||
|
// 3. Overall loading is false
|
||||||
|
const shouldStopLoading = providerExists || !(loadingStreams || loadingEpisodeStreams);
|
||||||
|
const value = !shouldStopLoading;
|
||||||
|
|
||||||
if (nextLoading[providerId] !== value) {
|
if (nextLoading[providerId] !== value) {
|
||||||
nextLoading[providerId] = value;
|
nextLoading[providerId] = value;
|
||||||
changed = true;
|
changed = true;
|
||||||
|
|
@ -1489,13 +1497,7 @@ export const StreamsScreen = () => {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
// For addons, show them even if they have no streams (they might be loading)
|
// Only show providers (addons or plugins) if they have actual streams
|
||||||
const isInstalledAddon = installedAddons.some(addon => addon.id === key);
|
|
||||||
if (isInstalledAddon) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
// For plugins, only show if they have actual streams
|
|
||||||
return providerData.streams.length > 0;
|
return providerData.streams.length > 0;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -1938,7 +1940,8 @@ export const StreamsScreen = () => {
|
||||||
const streams = metadata?.videos && metadata.videos.length > 1 && selectedEpisode ? episodeStreams : groupedStreams;
|
const streams = metadata?.videos && metadata.videos.length > 1 && selectedEpisode ? episodeStreams : groupedStreams;
|
||||||
|
|
||||||
// Determine extended loading phases
|
// Determine extended loading phases
|
||||||
const streamsEmpty = Object.keys(streams).length === 0;
|
const streamsEmpty = Object.keys(streams).length === 0 ||
|
||||||
|
Object.values(streams).every(provider => !provider.streams || provider.streams.length === 0);
|
||||||
const loadElapsed = streamsLoadStart ? Date.now() - streamsLoadStart : 0;
|
const loadElapsed = streamsLoadStart ? Date.now() - streamsLoadStart : 0;
|
||||||
const showInitialLoading = streamsEmpty && (streamsLoadStart === null || loadElapsed < 10000);
|
const showInitialLoading = streamsEmpty && (streamsLoadStart === null || loadElapsed < 10000);
|
||||||
const showStillFetching = streamsEmpty && loadElapsed >= 10000;
|
const showStillFetching = streamsEmpty && loadElapsed >= 10000;
|
||||||
|
|
@ -2117,7 +2120,7 @@ export const StreamsScreen = () => {
|
||||||
type === 'movie' && styles.streamsMainContentMovie
|
type === 'movie' && styles.streamsMainContentMovie
|
||||||
]}>
|
]}>
|
||||||
<View style={[styles.filterContainer]}>
|
<View style={[styles.filterContainer]}>
|
||||||
{Object.keys(streams).length > 0 && (
|
{!streamsEmpty && (
|
||||||
<ProviderFilter
|
<ProviderFilter
|
||||||
selectedProvider={selectedProvider}
|
selectedProvider={selectedProvider}
|
||||||
providers={filterItems}
|
providers={filterItems}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue