mirror of
https://github.com/tapframe/NuvioStreaming.git
synced 2026-01-11 20:10:25 +00:00
Error modal simplified for videoplayers
This commit is contained in:
parent
0d6d69e0a8
commit
967b90b98e
3 changed files with 149 additions and 1 deletions
|
|
@ -35,6 +35,7 @@ import SpeedModal from './modals/SpeedModal';
|
|||
import { SourcesModal } from './modals/SourcesModal';
|
||||
import { EpisodesModal } from './modals/EpisodesModal';
|
||||
import { EpisodeStreamsModal } from './modals/EpisodeStreamsModal';
|
||||
import { ErrorModal } from './modals/ErrorModal';
|
||||
|
||||
// Android-specific components
|
||||
import { VideoSurface } from './android/components/VideoSurface';
|
||||
|
|
@ -543,6 +544,15 @@ const AndroidVideoPlayer: React.FC = () => {
|
|||
}}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
<ErrorModal
|
||||
showErrorModal={modals.showErrorModal}
|
||||
setShowErrorModal={modals.setShowErrorModal}
|
||||
errorDetails={modals.errorDetails}
|
||||
onDismiss={handleClose}
|
||||
/>
|
||||
|
||||
<EpisodeStreamsModal
|
||||
visible={modals.showEpisodeStreamsModal}
|
||||
onClose={() => modals.setShowEpisodeStreamsModal(false)}
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@ import SubtitleModals from './modals/SubtitleModals';
|
|||
import SourcesModal from './modals/SourcesModal';
|
||||
import EpisodesModal from './modals/EpisodesModal';
|
||||
import { EpisodeStreamsModal } from './modals/EpisodeStreamsModal';
|
||||
import { ErrorModal } from './modals/ErrorModal';
|
||||
import CustomSubtitles from './subtitles/CustomSubtitles';
|
||||
import { SpeedActivatedOverlay, PauseOverlay, GestureControls } from './components';
|
||||
|
||||
|
|
@ -325,7 +326,25 @@ const KSPlayerCore: React.FC = () => {
|
|||
};
|
||||
|
||||
const handleError = (error: any) => {
|
||||
modals.setErrorDetails(typeof error === 'string' ? error : error?.message || 'Unknown Error');
|
||||
let msg = 'Unknown Error';
|
||||
try {
|
||||
if (typeof error === 'string') {
|
||||
msg = error;
|
||||
} else if (error?.error?.localizedDescription) {
|
||||
msg = error.error.localizedDescription;
|
||||
} else if (error?.error?.message) {
|
||||
msg = error.error.message;
|
||||
} else if (error?.message) {
|
||||
msg = error.message;
|
||||
} else if (error?.error) {
|
||||
msg = typeof error.error === 'string' ? error.error : JSON.stringify(error.error);
|
||||
} else {
|
||||
msg = JSON.stringify(error);
|
||||
}
|
||||
} catch (e) {
|
||||
msg = 'Error parsing error details';
|
||||
}
|
||||
modals.setErrorDetails(msg);
|
||||
modals.setShowErrorModal(true);
|
||||
};
|
||||
|
||||
|
|
@ -605,6 +624,13 @@ const KSPlayerCore: React.FC = () => {
|
|||
selectAudioTrack={tracks.selectAudioTrack}
|
||||
/>
|
||||
|
||||
<ErrorModal
|
||||
showErrorModal={modals.showErrorModal}
|
||||
setShowErrorModal={modals.setShowErrorModal}
|
||||
errorDetails={modals.errorDetails}
|
||||
onDismiss={handleClose}
|
||||
/>
|
||||
|
||||
<SpeedModal
|
||||
showSpeedModal={modals.showSpeedModal}
|
||||
setShowSpeedModal={modals.setShowSpeedModal}
|
||||
|
|
|
|||
112
src/components/player/modals/ErrorModal.tsx
Normal file
112
src/components/player/modals/ErrorModal.tsx
Normal file
|
|
@ -0,0 +1,112 @@
|
|||
import React from 'react';
|
||||
import { View, Text, TouchableOpacity, StyleSheet, useWindowDimensions } from 'react-native';
|
||||
import { MaterialIcons } from '@expo/vector-icons';
|
||||
import Animated, {
|
||||
FadeIn,
|
||||
FadeOut,
|
||||
ZoomIn,
|
||||
ZoomOut,
|
||||
} from 'react-native-reanimated';
|
||||
|
||||
interface ErrorModalProps {
|
||||
showErrorModal: boolean;
|
||||
setShowErrorModal: (show: boolean) => void;
|
||||
errorDetails: string;
|
||||
onDismiss?: () => void;
|
||||
}
|
||||
|
||||
export const ErrorModal: React.FC<ErrorModalProps> = ({
|
||||
showErrorModal,
|
||||
setShowErrorModal,
|
||||
errorDetails,
|
||||
onDismiss,
|
||||
}) => {
|
||||
const { width } = useWindowDimensions();
|
||||
const MODAL_WIDTH = Math.min(width * 0.8, 400);
|
||||
|
||||
const handleClose = () => {
|
||||
setShowErrorModal(false);
|
||||
if (onDismiss) {
|
||||
onDismiss();
|
||||
}
|
||||
};
|
||||
|
||||
if (!showErrorModal) return null;
|
||||
|
||||
return (
|
||||
<View style={[StyleSheet.absoluteFill, { zIndex: 99999, justifyContent: 'center', alignItems: 'center' }]}>
|
||||
<TouchableOpacity style={StyleSheet.absoluteFill} activeOpacity={1} onPress={handleClose}>
|
||||
<Animated.View entering={FadeIn.duration(200)} exiting={FadeOut.duration(150)} style={{ flex: 1, backgroundColor: 'rgba(0,0,0,0.7)' }} />
|
||||
</TouchableOpacity>
|
||||
|
||||
<Animated.View
|
||||
entering={FadeIn.duration(300)}
|
||||
exiting={FadeOut.duration(200)}
|
||||
style={{
|
||||
width: MODAL_WIDTH,
|
||||
backgroundColor: '#1a1a1a',
|
||||
borderRadius: 20,
|
||||
padding: 24,
|
||||
alignItems: 'center',
|
||||
borderWidth: 1,
|
||||
borderColor: 'rgba(255,255,255,0.1)',
|
||||
}}
|
||||
>
|
||||
<View style={{
|
||||
width: 56,
|
||||
height: 56,
|
||||
borderRadius: 28,
|
||||
backgroundColor: 'rgba(239, 68, 68, 0.1)',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
marginBottom: 16
|
||||
}}>
|
||||
<MaterialIcons name="error-outline" size={32} color="#EF4444" />
|
||||
</View>
|
||||
|
||||
<Text style={{
|
||||
color: 'white',
|
||||
fontSize: 20,
|
||||
fontWeight: '700',
|
||||
marginBottom: 8,
|
||||
textAlign: 'center'
|
||||
}}>
|
||||
Playback Error
|
||||
</Text>
|
||||
|
||||
<Text style={{
|
||||
color: 'rgba(255,255,255,0.7)',
|
||||
fontSize: 15,
|
||||
textAlign: 'center',
|
||||
marginBottom: 24,
|
||||
lineHeight: 22
|
||||
}}>
|
||||
{errorDetails || 'An unknown error occurred during playback.'}
|
||||
</Text>
|
||||
|
||||
<TouchableOpacity
|
||||
style={{
|
||||
backgroundColor: 'white',
|
||||
paddingVertical: 12,
|
||||
paddingHorizontal: 32,
|
||||
borderRadius: 12,
|
||||
width: '100%',
|
||||
alignItems: 'center'
|
||||
}}
|
||||
onPress={handleClose}
|
||||
activeOpacity={0.9}
|
||||
>
|
||||
<Text style={{
|
||||
color: 'black',
|
||||
fontSize: 16,
|
||||
fontWeight: '700'
|
||||
}}>
|
||||
Dismiss
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
</Animated.View>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
export default ErrorModal;
|
||||
Loading…
Reference in a new issue