From 2f3244dfa11cc23b804930ad448222bbff4f022a Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Wed, 30 Jun 2021 13:55:28 -0400 Subject: Squashed commit of the following: commit 66c974161b59f1e3570e2a4a42334fabc16c2129 Merge: 53bdc94c d4b21051 Author: Ivan Chen Date: Tue Jun 29 17:06:19 2021 -0400 Merge pull request #476 from shravyaramesh/tma937-tagg-camera [TMA-937] Tagg Camera commit d4b210518eaffd3bf1320ca7ce7fa4a6d611528f Author: Ivan Chen Date: Tue Jun 29 17:04:10 2021 -0400 Cleanup code, Update camera options commit 3f826ec0741d3f0d0c85a17e5d0a09eef402dbf2 Author: Ivan Chen Date: Tue Jun 29 16:45:45 2021 -0400 Set to only allow photos commit 9d30c0c211e6b0b1b87e5de93a043e6e9f06beb3 Author: Ivan Chen Date: Tue Jun 29 16:44:41 2021 -0400 Cleanup code, Fix gallery icon bug commit f6fdd5d913c29855644f226d09d6cba60faf6e21 Author: Ivan Chen Date: Tue Jun 29 16:32:19 2021 -0400 Add error handling commit 5fcffd40746b2074d523f53dc82c824d147444e5 Author: Ivan Chen Date: Tue Jun 29 16:29:06 2021 -0400 Refactor buttons commit f273a7aa1c2e27692c2a03ae1e2fc9b81360558d Author: Shravya Ramesh Date: Fri Jun 25 17:18:47 2021 -0700 Fix lint errors commit 448e91ed0b6c7519c02bbe1ac32a9d51989679db Author: Shravya Ramesh Date: Fri Jun 25 16:58:05 2021 -0700 Fix lint errors commit 6f94f0bb6dbe12e23f4222a0d0e3ffb09af965d7 Author: Shravya Ramesh Date: Fri Jun 25 16:50:13 2021 -0700 Add missing description for permissions commit 727c6384a2a07c42cd132d02da8c7dbb5757ea4f Author: Shravya Ramesh Date: Fri Jun 25 16:50:00 2021 -0700 Refactor code, Fix orientation bug commit f596a0246a9b9453df3a93c8c3fc5c9137bb50fc Author: Shravya Ramesh Date: Fri Jun 25 03:26:00 2021 -0700 Create camera screen, Add to Navigator commit 0646d38547319200f7f725cdd76b1ed9b531a188 Author: Shravya Ramesh Date: Fri Jun 25 03:24:54 2021 -0700 Navigate to camera screen, Move image picker funct commit f0762b7a3171f99833eb3c3f5e723c472dbc4879 Author: Shravya Ramesh Date: Fri Jun 25 03:23:56 2021 -0700 Add assets for camera screen commit 3c4676b7646fbddc43bf5d9796b7cbac185b6664 Author: Shravya Ramesh Date: Fri Jun 25 03:23:33 2021 -0700 Add package, install for camera lib --- src/utils/camera.ts | 65 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 65 insertions(+) create mode 100644 src/utils/camera.ts (limited to 'src/utils') diff --git a/src/utils/camera.ts b/src/utils/camera.ts new file mode 100644 index 00000000..73461ad7 --- /dev/null +++ b/src/utils/camera.ts @@ -0,0 +1,65 @@ +import CameraRoll from '@react-native-community/cameraroll'; +import {Dispatch, RefObject, SetStateAction} from 'react'; +import {Alert} from 'react-native'; +import {RNCamera} from 'react-native-camera'; +import ImagePicker from 'react-native-image-crop-picker'; +import {ScreenType} from 'src/types'; +import {ERROR_UPLOAD} from '../constants/strings'; + +/* + * Captures a photo and pauses to shoe the preview of the picture taken + */ +export const takePicture = ( + cameraRef: RefObject, + setShowSaveButton: Dispatch>, + setCapturedImage: Dispatch>, +) => { + if (cameraRef !== null) { + cameraRef.current?.pausePreview(); + const options = { + forceUpOrientation: true, + writeExif: false, + }; + cameraRef.current?.takePictureAsync(options).then((response) => { + setShowSaveButton(true); + setCapturedImage(response.uri); + }); + } +}; + +export const downloadImage = (capturedImageURI: string) => { + CameraRoll.save(capturedImageURI, {album: 'Recents', type: 'photo'}) + .then((_res) => Alert.alert('Saved to device!')) + .catch((_err) => Alert.alert('Failed to save to device!')); +}; + +export const navigateToImagePicker = ( + navigation: any, + screenType: ScreenType, + title: string, +) => { + ImagePicker.openPicker({ + smartAlbums: [ + 'Favorites', + 'RecentlyAdded', + 'SelfPortraits', + 'Screenshots', + 'UserLibrary', + ], + mediaType: 'photo', + }) + .then((picture) => { + if ('path' in picture) { + navigation.navigate('ZoomInCropper', { + screenType, + title, + image: picture, + }); + } + }) + .catch((err) => { + if (err.code && err.code !== 'E_PICKER_CANCELLED') { + Alert.alert(ERROR_UPLOAD); + } + }); +}; -- cgit v1.2.3-70-g09d2 From 3b7297189633cda8b886fa06f4b9d4787b6aa7c7 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Wed, 30 Jun 2021 14:27:25 -0400 Subject: Clean up code, Remove tab bar logic to use modal style instead --- src/components/camera/GalleryIcon.tsx | 14 ++++++- src/components/comments/ZoomInCropper.tsx | 17 +-------- src/components/moments/Moment.tsx | 62 ++++--------------------------- src/routes/main/MainStackScreen.tsx | 14 +------ src/screens/moments/CameraScreen.tsx | 37 +++++------------- src/utils/camera.ts | 54 ++++++++++++++++----------- 6 files changed, 66 insertions(+), 132 deletions(-) (limited to 'src/utils') diff --git a/src/components/camera/GalleryIcon.tsx b/src/components/camera/GalleryIcon.tsx index c49ace7d..bc8b1d41 100644 --- a/src/components/camera/GalleryIcon.tsx +++ b/src/components/camera/GalleryIcon.tsx @@ -23,7 +23,19 @@ export const GalleryIcon: React.FC = ({ const navigation = useNavigation(); return ( navigateToImagePicker(navigation, screenType, title)} + onPress={() => + navigateToImagePicker((pic) => + navigation.navigate('ZoomInCropper', { + screenType, + title, + media: { + filename: pic.filename, + uri: pic.path, + isVideo: false, + }, + }), + ) + } style={styles.saveButton}> {mostRecentPhotoUri !== '' ? ( = ({ const [y0, setY0] = useState(); const [y1, setY1] = useState(); - // Removes bottom navigation bar on current screen and add it back when navigating away - useFocusEffect( - useCallback(() => { - navigation.dangerouslyGetParent()?.setOptions({ - tabBarVisible: false, - }); - return () => { - navigation.dangerouslyGetParent()?.setOptions({ - tabBarVisible: true, - }); - }; - }, [navigation]), - ); - // Setting original aspect ratio of image useEffect(() => { if (media.uri) { diff --git a/src/components/moments/Moment.tsx b/src/components/moments/Moment.tsx index b080ca4a..25d69fba 100644 --- a/src/components/moments/Moment.tsx +++ b/src/components/moments/Moment.tsx @@ -1,8 +1,9 @@ import {useNavigation} from '@react-navigation/native'; import React from 'react'; -import {StyleProp, StyleSheet, View, ViewStyle} from 'react-native'; +import {Alert, StyleProp, StyleSheet, View, ViewStyle} from 'react-native'; import {Text} from 'react-native-animatable'; import {ScrollView, TouchableOpacity} from 'react-native-gesture-handler'; +import ImagePicker from 'react-native-image-crop-picker'; import LinearGradient from 'react-native-linear-gradient'; import DeleteIcon from '../../assets/icons/delete-logo.svg'; import DownIcon from '../../assets/icons/down_icon.svg'; @@ -12,6 +13,7 @@ import UpIcon from '../../assets/icons/up_icon.svg'; import {TAGG_LIGHT_BLUE} from '../../constants'; import {MomentType, ScreenType} from '../../types'; import {normalize, SCREEN_WIDTH} from '../../utils'; +import {navigateToVideoPicker} from '../../utils/camera'; import MomentTile from './MomentTile'; interface MomentProps { @@ -53,59 +55,6 @@ const Moment: React.FC = ({ }, }); }; - /** - * This function opens the ImagePicker, only lets you select video files, - * formats the file extension, then makes a call to the server to get the presigned URL, - * after which it makes a POST request to the returned URL to upload the file directly to S3. - * params: none - * @returns: none - */ - const navigateToVideoPicker = () => { - ImagePicker.openPicker({ - mediaType: 'video', - }) - .then(async (vid) => { - console.log(vid); - if (vid.path) { - navigateToCaptionScreenForVideo(vid.path); - } - }) - .catch((err) => { - if (err.code && err.code !== 'E_PICKER_CANCELLED') { - Alert.alert(ERROR_UPLOAD); - } - }); - }; - - const navigateToImagePicker = () => { - ImagePicker.openPicker({ - smartAlbums: [ - 'Favorites', - 'RecentlyAdded', - 'SelfPortraits', - 'Screenshots', - 'UserLibrary', - ], - mediaType: 'any', - }) - .then((picture) => { - if (picture.path && picture.filename) { - navigation.navigate('ZoomInCropper', { - screenType, - title, - media: { - filename: picture.filename, - uri: picture.path, - isVideo: false, - }, - }); - } - }) - .catch((err) => { - if (err.code && err.code !== 'E_PICKER_CANCELLED') { - Alert.alert(ERROR_UPLOAD); - } - }); const navigateToCameraScreen = () => { navigation.navigate('CameraScreen', { title, @@ -153,7 +102,10 @@ const Moment: React.FC = ({ Alert.alert('Video Upload', 'pick one', [ { text: 'gallery', - onPress: navigateToVideoPicker, + onPress: () => + navigateToVideoPicker((vid) => + navigateToCaptionScreenForVideo(vid.path), + ), }, { text: 'camera (simulator will not work)', diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx index f6adeab1..65a695f5 100644 --- a/src/routes/main/MainStackScreen.tsx +++ b/src/routes/main/MainStackScreen.tsx @@ -332,6 +332,7 @@ const MainStackScreen: React.FC = ({route}) => { name="ZoomInCropper" component={ZoomInCropper} options={{ + ...modalStyle, gestureEnabled: false, }} /> @@ -339,6 +340,7 @@ const MainStackScreen: React.FC = ({route}) => { name="CameraScreen" component={CameraScreen} options={{ + ...modalStyle, gestureEnabled: false, }} /> @@ -407,18 +409,6 @@ const styles = StyleSheet.create({ letterSpacing: normalize(1.3), fontWeight: '700', }, - whiteHeaderTitle: { - fontSize: normalize(16), - letterSpacing: normalize(1.3), - fontWeight: '700', - color: 'white', - }, - blackHeaderTitle: { - fontSize: normalize(16), - letterSpacing: normalize(1.3), - fontWeight: '700', - color: 'black', - }, }); export default MainStackScreen; diff --git a/src/screens/moments/CameraScreen.tsx b/src/screens/moments/CameraScreen.tsx index c6ed1116..1826f9d7 100644 --- a/src/screens/moments/CameraScreen.tsx +++ b/src/screens/moments/CameraScreen.tsx @@ -1,8 +1,8 @@ import CameraRoll from '@react-native-community/cameraroll'; import {useBottomTabBarHeight} from '@react-navigation/bottom-tabs'; -import {RouteProp, useFocusEffect} from '@react-navigation/core'; +import {RouteProp} from '@react-navigation/core'; import {StackNavigationProp} from '@react-navigation/stack'; -import React, {createRef, useCallback, useEffect, useState} from 'react'; +import React, {createRef, useEffect, useState} from 'react'; import {StyleSheet, TouchableOpacity, View} from 'react-native'; import {CameraType, FlashMode, RNCamera} from 'react-native-camera'; import CloseIcon from '../../assets/ionicons/close-outline.svg'; @@ -36,22 +36,6 @@ const CameraScreen: React.FC = ({route, navigation}) => { const [mostRecentPhoto, setMostRecentPhoto] = useState(''); const [showSaveButton, setShowSaveButton] = useState(false); - /* - * Removes bottom navigation bar on current screen and add it back when navigating away - */ - useFocusEffect( - useCallback(() => { - navigation.dangerouslyGetParent()?.setOptions({ - tabBarVisible: false, - }); - return () => { - navigation.dangerouslyGetParent()?.setOptions({ - tabBarVisible: true, - }); - }; - }, [navigation]), - ); - /* * Chooses the last picture from gallery to display as the gallery button icon */ @@ -75,9 +59,10 @@ const CameraScreen: React.FC = ({route, navigation}) => { navigation.navigate('CaptionScreen', { screenType, title, - image: { - filename: capturedImage, - path: capturedImage, + media: { + filename: 'dont have that info', + uri: capturedImage, + isVideo: false, // TODO: false for now }, }); }; @@ -116,7 +101,10 @@ const CameraScreen: React.FC = ({route, navigation}) => { )} - takePicture(cameraRef, setShowSaveButton, setCapturedImage) + takePicture(cameraRef, (pic) => { + setShowSaveButton(true); + setCapturedImage(pic.uri); + }) } style={styles.captureButtonContainer}> @@ -155,11 +143,6 @@ const styles = StyleSheet.create({ flexDirection: 'column', backgroundColor: 'black', }, - preview: { - flex: 1, - justifyContent: 'flex-end', - alignItems: 'center', - }, captureButtonContainer: { alignSelf: 'center', backgroundColor: 'transparent', diff --git a/src/utils/camera.ts b/src/utils/camera.ts index 73461ad7..1ee5dbf4 100644 --- a/src/utils/camera.ts +++ b/src/utils/camera.ts @@ -1,9 +1,8 @@ import CameraRoll from '@react-native-community/cameraroll'; -import {Dispatch, RefObject, SetStateAction} from 'react'; +import {RefObject} from 'react'; import {Alert} from 'react-native'; -import {RNCamera} from 'react-native-camera'; -import ImagePicker from 'react-native-image-crop-picker'; -import {ScreenType} from 'src/types'; +import {RNCamera, TakePictureResponse} from 'react-native-camera'; +import ImagePicker, {Image, Video} from 'react-native-image-crop-picker'; import {ERROR_UPLOAD} from '../constants/strings'; /* @@ -11,8 +10,7 @@ import {ERROR_UPLOAD} from '../constants/strings'; */ export const takePicture = ( cameraRef: RefObject, - setShowSaveButton: Dispatch>, - setCapturedImage: Dispatch>, + callback: (pic: TakePictureResponse) => void, ) => { if (cameraRef !== null) { cameraRef.current?.pausePreview(); @@ -20,9 +18,8 @@ export const takePicture = ( forceUpOrientation: true, writeExif: false, }; - cameraRef.current?.takePictureAsync(options).then((response) => { - setShowSaveButton(true); - setCapturedImage(response.uri); + cameraRef.current?.takePictureAsync(options).then((pic) => { + callback(pic); }); } }; @@ -33,11 +30,7 @@ export const downloadImage = (capturedImageURI: string) => { .catch((_err) => Alert.alert('Failed to save to device!')); }; -export const navigateToImagePicker = ( - navigation: any, - screenType: ScreenType, - title: string, -) => { +export const navigateToImagePicker = (callback: (pic: Image) => void) => { ImagePicker.openPicker({ smartAlbums: [ 'Favorites', @@ -48,13 +41,32 @@ export const navigateToImagePicker = ( ], mediaType: 'photo', }) - .then((picture) => { - if ('path' in picture) { - navigation.navigate('ZoomInCropper', { - screenType, - title, - image: picture, - }); + .then((pic) => { + if (pic.path && pic.filename) { + callback(pic); + } + }) + .catch((err) => { + if (err.code && err.code !== 'E_PICKER_CANCELLED') { + Alert.alert(ERROR_UPLOAD); + } + }); +}; + +/** + * This function opens the ImagePicker, only lets you select video files, + * formats the file extension, then makes a call to the server to get the presigned URL, + * after which it makes a POST request to the returned URL to upload the file directly to S3. + * params: none + * @returns: none + */ +export const navigateToVideoPicker = (callback: (vid: Video) => void) => { + ImagePicker.openPicker({ + mediaType: 'video', + }) + .then(async (vid) => { + if (vid.path) { + callback(vid); } }) .catch((err) => { -- cgit v1.2.3-70-g09d2 From c548f8df62c3775058ffa18e201ca230a641e6c1 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Wed, 30 Jun 2021 15:18:57 -0400 Subject: Cleanup code --- src/components/camera/GalleryIcon.tsx | 24 ++++-------------------- src/components/camera/SaveButton.tsx | 4 ++-- src/components/moments/Moment.tsx | 4 +--- src/screens/moments/CameraScreen.tsx | 20 +++++++++++++++++--- src/utils/camera.ts | 4 ++-- 5 files changed, 26 insertions(+), 30 deletions(-) (limited to 'src/utils') diff --git a/src/components/camera/GalleryIcon.tsx b/src/components/camera/GalleryIcon.tsx index bc8b1d41..8d396550 100644 --- a/src/components/camera/GalleryIcon.tsx +++ b/src/components/camera/GalleryIcon.tsx @@ -1,14 +1,12 @@ -import {useNavigation} from '@react-navigation/native'; import React from 'react'; import {Image, Text, TouchableOpacity, View} from 'react-native'; -import {ScreenType} from '../../types'; import {navigateToImagePicker} from '../../utils/camera'; +import {Image as ImageType} from 'react-native-image-crop-picker'; import {styles} from './styles'; interface GalleryIconProps { - screenType: ScreenType; - title: string; mostRecentPhotoUri: string; + callback: (pic: ImageType) => void; } /* @@ -16,26 +14,12 @@ interface GalleryIconProps { * On click, navigates to the image picker */ export const GalleryIcon: React.FC = ({ - screenType, - title, mostRecentPhotoUri, + callback, }) => { - const navigation = useNavigation(); return ( - navigateToImagePicker((pic) => - navigation.navigate('ZoomInCropper', { - screenType, - title, - media: { - filename: pic.filename, - uri: pic.path, - isVideo: false, - }, - }), - ) - } + onPress={() => navigateToImagePicker(callback)} style={styles.saveButton}> {mostRecentPhotoUri !== '' ? ( = ({capturedImageURI}) => ( { - downloadImage(capturedImageURI); + saveImageToGallery(capturedImageURI); }} style={styles.saveButton}> diff --git a/src/components/moments/Moment.tsx b/src/components/moments/Moment.tsx index 25d69fba..f057b329 100644 --- a/src/components/moments/Moment.tsx +++ b/src/components/moments/Moment.tsx @@ -55,6 +55,7 @@ const Moment: React.FC = ({ }, }); }; + const navigateToCameraScreen = () => { navigation.navigate('CameraScreen', { title, @@ -195,9 +196,6 @@ const styles = StyleSheet.create({ color: TAGG_LIGHT_BLUE, maxWidth: '70%', }, - flexer: { - flex: 1, - }, scrollContainer: { height: SCREEN_WIDTH / 3.25, backgroundColor: '#eee', diff --git a/src/screens/moments/CameraScreen.tsx b/src/screens/moments/CameraScreen.tsx index 1826f9d7..b3275764 100644 --- a/src/screens/moments/CameraScreen.tsx +++ b/src/screens/moments/CameraScreen.tsx @@ -15,7 +15,7 @@ import { } from '../../components'; import {MainStackParams} from '../../routes'; import {HeaderHeight, normalize, SCREEN_WIDTH} from '../../utils'; -import {takePicture} from '../../utils/camera'; +import {navigateToImagePicker, takePicture} from '../../utils/camera'; type CameraScreenRouteProps = RouteProp; export type CameraScreenNavigationProps = StackNavigationProp< @@ -52,6 +52,7 @@ const CameraScreen: React.FC = ({route, navigation}) => { ); }, [capturedImage]); + console.log(capturedImage); /* * Appears once a picture has been captured to navigate to the caption screen */ @@ -123,8 +124,21 @@ const CameraScreen: React.FC = ({route, navigation}) => { ) : ( + navigateToImagePicker((pic) => { + if (pic.filename) { + navigation.navigate('ZoomInCropper', { + screenType, + title, + media: { + filename: pic.filename, + uri: pic.path, + isVideo: false, + }, + }); + } + }) + } /> )} diff --git a/src/utils/camera.ts b/src/utils/camera.ts index 1ee5dbf4..877c8c2f 100644 --- a/src/utils/camera.ts +++ b/src/utils/camera.ts @@ -6,7 +6,7 @@ import ImagePicker, {Image, Video} from 'react-native-image-crop-picker'; import {ERROR_UPLOAD} from '../constants/strings'; /* - * Captures a photo and pauses to shoe the preview of the picture taken + * Captures a photo and pauses to show the preview of the picture taken */ export const takePicture = ( cameraRef: RefObject, @@ -24,7 +24,7 @@ export const takePicture = ( } }; -export const downloadImage = (capturedImageURI: string) => { +export const saveImageToGallery = (capturedImageURI: string) => { CameraRoll.save(capturedImageURI, {album: 'Recents', type: 'photo'}) .then((_res) => Alert.alert('Saved to device!')) .catch((_err) => Alert.alert('Failed to save to device!')); -- cgit v1.2.3-70-g09d2 From 159ae12d6679441d16791bbf23d05240e3779101 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Wed, 30 Jun 2021 15:33:02 -0400 Subject: Fix camera orientation --- src/utils/camera.ts | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) (limited to 'src/utils') diff --git a/src/utils/camera.ts b/src/utils/camera.ts index 877c8c2f..7e4fc14e 100644 --- a/src/utils/camera.ts +++ b/src/utils/camera.ts @@ -1,7 +1,11 @@ import CameraRoll from '@react-native-community/cameraroll'; import {RefObject} from 'react'; import {Alert} from 'react-native'; -import {RNCamera, TakePictureResponse} from 'react-native-camera'; +import { + RNCamera, + TakePictureOptions, + TakePictureResponse, +} from 'react-native-camera'; import ImagePicker, {Image, Video} from 'react-native-image-crop-picker'; import {ERROR_UPLOAD} from '../constants/strings'; @@ -14,8 +18,9 @@ export const takePicture = ( ) => { if (cameraRef !== null) { cameraRef.current?.pausePreview(); - const options = { + const options: TakePictureOptions = { forceUpOrientation: true, + orientation: 'portrait', writeExif: false, }; cameraRef.current?.takePictureAsync(options).then((pic) => { -- cgit v1.2.3-70-g09d2 From 919a7c14633f0a381613cebf73e8f29d84d3ebe2 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Wed, 30 Jun 2021 15:49:18 -0400 Subject: Add option to mirror image --- src/utils/camera.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'src/utils') diff --git a/src/utils/camera.ts b/src/utils/camera.ts index 7e4fc14e..e5eba5f8 100644 --- a/src/utils/camera.ts +++ b/src/utils/camera.ts @@ -21,6 +21,7 @@ export const takePicture = ( const options: TakePictureOptions = { forceUpOrientation: true, orientation: 'portrait', + mirrorImage: true, writeExif: false, }; cameraRef.current?.takePictureAsync(options).then((pic) => { -- cgit v1.2.3-70-g09d2 From 9eb246e92aad427ac4d12840960f0be531f43d19 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Wed, 30 Jun 2021 15:57:55 -0400 Subject: Squashed commit of the following: commit 7046c2673c54ecf2f418a85fbcfc2c4872858697 Merge: 5480267b c6900bc6 Author: Ivan Chen Date: Wed Jun 30 15:16:02 2021 -0400 Merge pull request #479 from brian-tagg/tma959-gif-handle [TMA-959] GIF handle commit c6900bc62b2ea9a1eb07088ac02556c0dd1d5ebc Author: Brian Kim Date: Thu Jul 1 04:00:53 2021 +0900 Redo extraneous file commit 4eda8db632ca996ff9712872b2076a8675a63523 Author: Brian Kim Date: Thu Jul 1 03:52:50 2021 +0900 Updates from product commit 1c1975265fb6013c34c8e766a7f11b0c5b8d1e11 Author: Brian Kim Date: Thu Jul 1 01:23:19 2021 +0900 Respond to comments commit 50344b4236e235fdd42997c1fe85f2c1bd014e47 Author: Brian Kim Date: Tue Jun 29 23:04:22 2021 +0900 Fixed up some merge issues commit 014af4ac61bae6e38a4965ceb274b147ac3395c6 Author: Brian Kim Date: Tue Jun 29 23:01:24 2021 +0900 Construct and merge with master --- src/components/moments/MomentPost.tsx | 4 +++- src/screens/moments/CameraScreen.tsx | 16 ++++++++++++++-- src/utils/camera.ts | 29 ++++++++++++++++++++++++++--- 3 files changed, 43 insertions(+), 6 deletions(-) (limited to 'src/utils') diff --git a/src/components/moments/MomentPost.tsx b/src/components/moments/MomentPost.tsx index cb3a138b..f5a256d6 100644 --- a/src/components/moments/MomentPost.tsx +++ b/src/components/moments/MomentPost.tsx @@ -78,7 +78,9 @@ const MomentPost: React.FC = ({ moment.moment_url.endsWith('jpg') || moment.moment_url.endsWith('JPG') || moment.moment_url.endsWith('PNG') || - moment.moment_url.endsWith('png') + moment.moment_url.endsWith('png') || + moment.moment_url.endsWith('GIF') || + moment.moment_url.endsWith('gif') ); /* diff --git a/src/screens/moments/CameraScreen.tsx b/src/screens/moments/CameraScreen.tsx index 7b71f9e5..4ca79c4f 100644 --- a/src/screens/moments/CameraScreen.tsx +++ b/src/screens/moments/CameraScreen.tsx @@ -16,7 +16,11 @@ import { } from '../../components'; import {MainStackParams} from '../../routes'; import {HeaderHeight, normalize, SCREEN_WIDTH} from '../../utils'; -import {navigateToImagePicker, takePicture} from '../../utils/camera'; +import { + navigateToImagePicker, + showGIFFailureAlert, + takePicture, +} from '../../utils/camera'; type CameraScreenRouteProps = RouteProp; export type CameraScreenNavigationProps = StackNavigationProp< @@ -146,7 +150,15 @@ const CameraScreen: React.FC = ({route, navigation}) => { mostRecentPhotoUri={mostRecentPhoto} callback={() => navigateToImagePicker((pic) => { - navigateToCropper(pic.path); + const filename = pic.filename; + if ( + filename && + (filename.endsWith('gif') || filename.endsWith('GIF')) + ) { + showGIFFailureAlert(() => navigateToCropper(pic.path)); + } else { + navigateToCropper(pic.path); + } }) } /> diff --git a/src/utils/camera.ts b/src/utils/camera.ts index e5eba5f8..0be4d27c 100644 --- a/src/utils/camera.ts +++ b/src/utils/camera.ts @@ -48,9 +48,7 @@ export const navigateToImagePicker = (callback: (pic: Image) => void) => { mediaType: 'photo', }) .then((pic) => { - if (pic.path && pic.filename) { - callback(pic); - } + callback(pic); }) .catch((err) => { if (err.code && err.code !== 'E_PICKER_CANCELLED') { @@ -81,3 +79,28 @@ export const navigateToVideoPicker = (callback: (vid: Video) => void) => { } }); }; + +export const showGIFFailureAlert = (onSuccess: () => void) => + Alert.alert( + 'Warning', + 'The app currently cannot handle GIFs, and will only save a static image.', + [ + { + text: 'Cancel', + onPress: () => {}, + style: 'cancel', + }, + { + text: 'Post', + onPress: onSuccess, + style: 'default', + }, + ], + { + cancelable: true, + onDismiss: () => + Alert.alert( + 'This alert was dismissed by tapping outside of the alert dialog.', + ), + }, + ); -- cgit v1.2.3-70-g09d2 From 3b73e88ac85b4c45ba34f9ddbc859b21edcc0f6b Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Wed, 30 Jun 2021 15:58:41 -0400 Subject: Remove unused comment --- src/utils/camera.ts | 7 ------- 1 file changed, 7 deletions(-) (limited to 'src/utils') diff --git a/src/utils/camera.ts b/src/utils/camera.ts index 0be4d27c..9433ccc7 100644 --- a/src/utils/camera.ts +++ b/src/utils/camera.ts @@ -57,13 +57,6 @@ export const navigateToImagePicker = (callback: (pic: Image) => void) => { }); }; -/** - * This function opens the ImagePicker, only lets you select video files, - * formats the file extension, then makes a call to the server to get the presigned URL, - * after which it makes a POST request to the returned URL to upload the file directly to S3. - * params: none - * @returns: none - */ export const navigateToVideoPicker = (callback: (vid: Video) => void) => { ImagePicker.openPicker({ mediaType: 'video', -- cgit v1.2.3-70-g09d2 From 04dd962e8113dda15c54883d092e58d96da92edd Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Thu, 1 Jul 2021 16:09:03 -0400 Subject: Undo mirror image option --- src/utils/camera.ts | 1 - 1 file changed, 1 deletion(-) (limited to 'src/utils') diff --git a/src/utils/camera.ts b/src/utils/camera.ts index 9433ccc7..3937129a 100644 --- a/src/utils/camera.ts +++ b/src/utils/camera.ts @@ -21,7 +21,6 @@ export const takePicture = ( const options: TakePictureOptions = { forceUpOrientation: true, orientation: 'portrait', - mirrorImage: true, writeExif: false, }; cameraRef.current?.takePictureAsync(options).then((pic) => { -- cgit v1.2.3-70-g09d2