diff --git a/component/video/camera.tsx b/component/video/camera.tsx index a954d97..ce1abf1 100644 --- a/component/video/camera.tsx +++ b/component/video/camera.tsx @@ -1,16 +1,16 @@ import React, { useCallback, useRef, useState } from 'react' -import { StyleSheet, Text, View } from 'react-native' -import { Camera, useCameraPermission, useCameraDevice, useCameraFormat, PhotoFile, VideoFile, CameraRuntimeError } from 'react-native-vision-camera' +import { Button, StyleSheet, Text, View } from 'react-native' +import { Camera, useCameraPermission, useCameraDevice, useCameraFormat, PhotoFile, VideoFile, CameraRuntimeError, Orientation } from 'react-native-vision-camera' import { RecordingButton } from './capture-button' import { useIsForeground } from './is-foreground' export default function CameraScreen(): React.ReactElement { const camera = useRef(null) const { hasPermission, requestPermission } = useCameraPermission() - const [isCameraInitialized, setIsCameraInitialized] = useState(false) + const [isCameraInitialized, setIsCameraInitialized] = useState(false) - const isForeground = useIsForeground() - const isActive = isForeground + const isForeground: boolean = useIsForeground() + const isActive: boolean = isForeground // Should be combined with isFocused hook const onError = useCallback((error: CameraRuntimeError) => { console.error(error) @@ -37,12 +37,21 @@ export default function CameraScreen(): React.ReactElement { const format = useCameraFormat(device, [ { videoResolution: { width: 3048, height: 2160 } }, { fps: 60 } - ]) + ]) // this sets as a target + + //Orientation detection + const [orientation, setOrientation] = useState('portrait'); + + const toggleOrientation = () => { + setOrientation(currentOrientation => + currentOrientation === 'landscape-left' ? 'portrait' : 'landscape-left' // Can adjust this and the type to match what we want + ); + }; if (device === null) { return Camera not available. Does user have permissions: {hasPermission} } - + return ( hasPermission && ( @@ -54,18 +63,24 @@ export default function CameraScreen(): React.ReactElement { onInitialized={onInitialized} onError={onError} video={true} - photo={false} - orientation='portrait' // TODO: #60 + orientation={orientation} // TODO: #60 isActive={isActive} /> + +