Creepso/NuvioStreaming
1
0
Fork 0
mirror of https://github.com/tapframe/NuvioStreaming.git synced 2026-01-11 20:10:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

episode poster fix

Browse source
This commit is contained in:
tapframe 2025-10-23 13:26:31 +05:30
parent 786e06b27f
commit 060b0b927b
1 changed files with 40 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
src/components/TabletStreamsLayout.tsx
View file

@ -177,9 +177,10 @@ const TabletStreamsLayout: React.FC<TabletStreamsLayoutProps> = ({
return undefined;
}, [episodeImage, bannerImage, metadata?.poster, backdropError]);
// Animate backdrop when it loads
// Animate backdrop when it loads, or animate content immediately if no backdrop
useEffect(() => {
if (backdropSource?.uri && backdropLoaded) {
// Animate backdrop first
backdropOpacity.value = withTiming(1, {
duration: 800,
easing: Easing.out(Easing.cubic)
@ -207,6 +208,25 @@ const TabletStreamsLayout: React.FC<TabletStreamsLayoutProps> = ({
duration: 600,
easing: Easing.out(Easing.cubic)
}));
} else if (!backdropSource?.uri) {
// No backdrop available, animate content panels immediately
leftPanelOpacity.value = withTiming(1, {
duration: 600,
easing: Easing.out(Easing.cubic)
});
leftPanelTranslateX.value = withTiming(0, {
duration: 600,
easing: Easing.out(Easing.cubic)
});
rightPanelOpacity.value = withDelay(200, withTiming(1, {
duration: 600,
easing: Easing.out(Easing.cubic)
}));
rightPanelTranslateX.value = withDelay(200, withTiming(0, {
duration: 600,
easing: Easing.out(Easing.cubic)
}));
}
}, [backdropSource?.uri, backdropLoaded]);
@ -368,15 +388,21 @@ const TabletStreamsLayout: React.FC<TabletStreamsLayoutProps> = ({
return (
<View style={styles.tabletLayout}>
{/* Full Screen Background with Entrance Animation */}
<Animated.View style={[styles.tabletFullScreenBackground, backdropAnimatedStyle]}>
<FastImage
source={backdropSource}
style={StyleSheet.absoluteFillObject}
resizeMode={FastImage.resizeMode.cover}
onLoad={handleBackdropLoad}
onError={handleBackdropError}
/>
</Animated.View>
{backdropSource?.uri ? (
<Animated.View style={[styles.tabletFullScreenBackground, backdropAnimatedStyle]}>
<FastImage
source={backdropSource}
style={StyleSheet.absoluteFillObject}
resizeMode={FastImage.resizeMode.cover}
onLoad={handleBackdropLoad}
onError={handleBackdropError}
/>
</Animated.View>
) : (
<View style={styles.tabletFullScreenBackground}>
<View style={styles.tabletNoBackdropBackground} />
</View>
)}
<LinearGradient
colors={['rgba(0,0,0,0.2)', 'rgba(0,0,0,0.4)', 'rgba(0,0,0,0.6)']}
locations={[0, 0.5, 1]}
@ -685,6 +711,10 @@ const createStyles = (colors: any) => StyleSheet.create({
tabletFullScreenBackground: {
...StyleSheet.absoluteFillObject,
},
tabletNoBackdropBackground: {
...StyleSheet.absoluteFillObject,
backgroundColor: colors.darkBackground,
},
tabletFullScreenGradient: {
...StyleSheet.absoluteFillObject,
},