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

Enhance video player components by adding zoom scale support and updating aspect ratio options. Introduce online subtitles section in SubtitleModals for improved subtitle management.

Browse source
This commit is contained in:
tapframe 2025-07-05 13:35:36 +05:30
parent 11fcacc9a7
commit 2487ef892c
4 changed files with 80 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/components/player/AndroidVideoPlayer.tsx
View file

@ -530,7 +530,7 @@ const AndroidVideoPlayer: React.FC = () => {
const cycleAspectRatio = () => {
// Android: cycle through native resize modes
const resizeModes: ResizeModeType[] = ['contain', 'cover', 'stretch', 'none'];
const resizeModes: ResizeModeType[] = ['contain', 'cover', 'fill', 'none'];
const currentIndex = resizeModes.indexOf(resizeMode);
const nextIndex = (currentIndex + 1) % resizeModes.length;
setResizeMode(resizeModes[nextIndex]);
@ -1091,6 +1091,7 @@ const AndroidVideoPlayer: React.FC = () => {
useCustomSubtitles={useCustomSubtitles}
currentSubtitle={currentSubtitle}
subtitleSize={subtitleSize}
zoomScale={zoomScale}
/>
<ResumeOverlay

1
src/components/player/VideoPlayer.tsx
View file

@ -1101,6 +1101,7 @@ const VideoPlayer: React.FC = () => {
useCustomSubtitles={useCustomSubtitles}
currentSubtitle={currentSubtitle}
subtitleSize={subtitleSize}
zoomScale={zoomScale}
/>
<ResumeOverlay

65
src/components/player/modals/SubtitleModals.tsx
View file

@ -694,6 +694,71 @@ export const SubtitleModals: React.FC<SubtitleModalsProps> = ({
</TouchableOpacity>
</View>
))}
{/* Online subtitles section */}
{isLoadingSubtitleList && (
<View style={{ alignItems: 'center', marginTop: 24 }}>
<ActivityIndicator size="large" color="#22C55E" />
</View>
)}
{availableSubtitles.length > 0 && (
<>
<View style={{ marginVertical: 24 }}>
<Text style={{
color: 'rgba(255, 255, 255, 0.7)',
fontSize: 14,
fontWeight: '600',
letterSpacing: 0.3,
textTransform: 'uppercase',
}}>
Online Subtitles
</Text>
</View>
{availableSubtitles.map((sub) => (
<View key={sub.id} style={{ marginBottom: 12, width: '100%' }}>
<TouchableOpacity
style={{
backgroundColor: 'rgba(34, 197, 94, 0.08)',
borderRadius: 20,
padding: 20,
borderWidth: 2,
borderColor: 'rgba(34, 197, 94, 0.4)',
width: '100%',
}}
onPress={() => {
loadWyzieSubtitle(sub);
handleLanguageClose();
}}
activeOpacity={0.85}
>
<View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between', width: '100%' }}>
<View style={{ flex: 1, marginRight: 16 }}>
<Text style={{
color: '#fff',
fontSize: 16,
fontWeight: '700',
letterSpacing: -0.2,
marginBottom: 4,
}}>
{sub.display}
</Text>
<View style={{ flexDirection: 'row', flexWrap: 'wrap', gap: 6, alignItems: 'center' }}>
<SubtitleBadge
text={formatLanguage(sub.language)}
color="#22C55E"
bgColor="rgba(34, 197, 94, 0.15)"
/>
</View>
</View>
<MaterialIcons name="cloud-download" size={24} color="#22C55E" />
</View>
</TouchableOpacity>
</View>
))}
</>
)}
</View>
</ScrollView>
</BlurView>

13
src/components/player/subtitles/CustomSubtitles.tsx
View file

@ -6,17 +6,28 @@ interface CustomSubtitlesProps {
useCustomSubtitles: boolean;
currentSubtitle: string;
subtitleSize: number;
zoomScale?: number; // current video zoom scale; defaults to 1
}
export const CustomSubtitles: React.FC<CustomSubtitlesProps> = ({
useCustomSubtitles,
currentSubtitle,
subtitleSize,
zoomScale = 1,
}) => {
if (!useCustomSubtitles || !currentSubtitle) return null;
const inverseScale = 1 / zoomScale;
return (
<View style={styles.customSubtitleContainer} pointerEvents="none">
<View
style={[
styles.customSubtitleContainer,
{
transform: [{ scale: inverseScale }],
},
]}
pointerEvents="none"
>
<View style={styles.customSubtitleWrapper}>
<Text style={[styles.customSubtitleText, { fontSize: subtitleSize }]}>
{currentSubtitle}