diff options
Diffstat (limited to 'src/screens/upload/EditMedia.tsx')
-rw-r--r-- | src/screens/upload/EditMedia.tsx | 52 |
1 files changed, 37 insertions, 15 deletions
diff --git a/src/screens/upload/EditMedia.tsx b/src/screens/upload/EditMedia.tsx index 10f5f2fb..338634b8 100644 --- a/src/screens/upload/EditMedia.tsx +++ b/src/screens/upload/EditMedia.tsx @@ -2,14 +2,24 @@ import ReactNativeZoomableView from '@dudigital/react-native-zoomable-view/src/R import {RouteProp} from '@react-navigation/core'; import {StackNavigationProp} from '@react-navigation/stack'; import React, {useEffect, useRef, useState} from 'react'; -import {Image, StyleSheet, Text, TouchableOpacity, View} from 'react-native'; +import { + Alert, + Image, + StyleSheet, + Text, + TouchableOpacity, + View, +} from 'react-native'; import ImageZoom, {IOnMove} from 'react-native-image-pan-zoom'; import PhotoManipulator from 'react-native-photo-manipulator'; +import {useSelector} from 'react-redux'; import TrimIcon from '../../assets/icons/trim.svg'; import CloseIcon from '../../assets/ionicons/close-outline.svg'; import {SaveButton, TrimmerPlayer} from '../../components'; import {TaggLoadingIndicator, TaggSquareButton} from '../../components/common'; +import {ERROR_MOMENT_UPLOAD_IN_PROGRESS} from '../../constants/strings'; import {MainStackParams} from '../../routes'; +import {RootState} from '../../store/rootReducer'; import { cropVideo, HeaderHeight, @@ -36,6 +46,9 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => { selectedCategory, media: {isVideo}, } = route.params; + const {momentUploadProgressBar} = useSelector( + (state: RootState) => state.user, + ); const [aspectRatio, setAspectRatio] = useState<number>(1); // width and height of video, if video const [origDimensions, setOrigDimensions] = useState<number[]>([0, 0]); @@ -43,6 +56,7 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => { const vidRef = useRef<View>(null); const [cropLoading, setCropLoading] = useState<boolean>(false); const [hideTrimmer, setHideTrimmer] = useState<boolean>(true); + const [videoDuration, setVideoDuration] = useState<number | undefined>(); // Stores the coordinates of the cropped image const [x0, setX0] = useState<number>(); @@ -142,7 +156,7 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => { mediaUri, (croppedURL: string) => { setCropLoading(false); - // Pass the trimmed/cropped video + // Pass the cropped video callback(croppedURL); }, videoCrop, @@ -251,6 +265,24 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => { ); }; + const handleNext = () => { + if (momentUploadProgressBar) { + Alert.alert(ERROR_MOMENT_UPLOAD_IN_PROGRESS); + } else { + processVideo((uri) => + navigation.navigate('CaptionScreen', { + screenType, + media: { + uri, + isVideo, + videoDuration, + }, + selectedCategory, + }), + ); + } + }; + return ( <View style={styles.container}> {cropLoading && <TaggLoadingIndicator fullscreen />} @@ -338,7 +370,8 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => { height: SCREEN_WIDTH / aspectRatio, }, ]} - handleLoad={(width: number, height: number) => { + handleLoad={(width: number, height: number, duration: number) => { + setVideoDuration(duration); setOrigDimensions([width, height]); setAspectRatio(width / height); }} @@ -385,18 +418,7 @@ export const EditMedia: React.FC<EditMediaProps> = ({route, navigation}) => { /> <TaggSquareButton style={styles.button} - onPress={() => - processVideo((uri) => - navigation.navigate('CaptionScreen', { - screenType, - media: { - uri: uri, - isVideo: isVideo, - }, - selectedCategory, - }), - ) - } + onPress={handleNext} title={'Next'} buttonStyle={'large'} buttonColor={'blue'} |