mirror of
https://github.com/tapframe/NuvioStreaming.git
synced 2026-01-11 20:10:25 +00:00
Add runtime display to SeriesContent and StreamsScreen; update TMDBEpisode interface to include runtime property
This commit is contained in:
parent
698d975500
commit
76796a50d6
3 changed files with 57 additions and 0 deletions
|
|
@ -171,6 +171,16 @@ export const SeriesContent: React.FC<SeriesContentProps> = ({
|
|||
});
|
||||
};
|
||||
|
||||
const formatRuntime = (runtime: number) => {
|
||||
if (!runtime) return null;
|
||||
const hours = Math.floor(runtime / 60);
|
||||
const minutes = runtime % 60;
|
||||
if (hours > 0) {
|
||||
return `${hours}h ${minutes}m`;
|
||||
}
|
||||
return `${minutes}m`;
|
||||
};
|
||||
|
||||
// Get episode progress
|
||||
const episodeId = episode.stremioId || `${metadata?.id}:${episode.season_number}:${episode.episode_number}`;
|
||||
const progress = episodeProgress[episodeId];
|
||||
|
|
@ -230,6 +240,14 @@ export const SeriesContent: React.FC<SeriesContentProps> = ({
|
|||
</Text>
|
||||
</View>
|
||||
)}
|
||||
{episode.runtime && (
|
||||
<View style={styles.runtimeContainer}>
|
||||
<MaterialIcons name="schedule" size={14} color={colors.textMuted} />
|
||||
<Text style={styles.runtimeText}>
|
||||
{formatRuntime(episode.runtime)}
|
||||
</Text>
|
||||
</View>
|
||||
)}
|
||||
{episode.air_date && (
|
||||
<Text style={styles.airDateText}>
|
||||
{formatDate(episode.air_date)}
|
||||
|
|
@ -519,4 +537,18 @@ const styles = StyleSheet.create({
|
|||
borderWidth: 1,
|
||||
borderColor: 'rgba(255,255,255,0.3)',
|
||||
},
|
||||
runtimeContainer: {
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
backgroundColor: 'rgba(0,0,0,0.7)',
|
||||
paddingHorizontal: 6,
|
||||
paddingVertical: 3,
|
||||
borderRadius: 4,
|
||||
},
|
||||
runtimeText: {
|
||||
color: colors.textMuted,
|
||||
fontSize: 13,
|
||||
fontWeight: '600',
|
||||
marginLeft: 4,
|
||||
},
|
||||
});
|
||||
|
|
@ -1016,6 +1016,16 @@ export const StreamsScreen = () => {
|
|||
</Text>
|
||||
</View>
|
||||
)}
|
||||
{currentEpisode.runtime && (
|
||||
<View style={styles.streamsHeroRuntime}>
|
||||
<MaterialIcons name="schedule" size={16} color={colors.mediumEmphasis} />
|
||||
<Text style={styles.streamsHeroRuntimeText}>
|
||||
{currentEpisode.runtime >= 60
|
||||
? `${Math.floor(currentEpisode.runtime / 60)}h ${currentEpisode.runtime % 60}m`
|
||||
: `${currentEpisode.runtime}m`}
|
||||
</Text>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
|
@ -1469,6 +1479,20 @@ const styles = StyleSheet.create({
|
|||
textShadowRadius: 4,
|
||||
letterSpacing: -0.5,
|
||||
},
|
||||
streamsHeroRuntime: {
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
gap: 4,
|
||||
backgroundColor: 'rgba(0,0,0,0.5)',
|
||||
paddingHorizontal: 8,
|
||||
paddingVertical: 4,
|
||||
borderRadius: 6,
|
||||
},
|
||||
streamsHeroRuntimeText: {
|
||||
color: colors.mediumEmphasis,
|
||||
fontSize: 13,
|
||||
fontWeight: '600',
|
||||
},
|
||||
});
|
||||
|
||||
export default memo(StreamsScreen);
|
||||
|
|
@ -21,6 +21,7 @@ export interface TMDBEpisode {
|
|||
imdb_id?: string;
|
||||
imdb_rating?: number;
|
||||
season_poster_path?: string | null;
|
||||
runtime?: number;
|
||||
}
|
||||
|
||||
export interface TMDBSeason {
|
||||
|
|
|
|||
Loading…
Reference in a new issue