railbird/railbird-gql
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add onVideoChunkReady

Browse Source
This commit is contained in:
Ivan Malison 2024-02-01 19:43:44 -07:00
parent a0af0ad300
commit 23f0beb646
3 changed files with 57 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
component/video/camera.tsx
View File

@ -13,12 +13,13 @@ import {
} from "react-native-vision-camera";
import { RecordingButton } from "./capture-button";
import { useIsForeground } from "./is-foreground";
import { useIsFocused } from '@react-navigation/native'
import { useIsFocused } from "@react-navigation/native";
export default function CameraScreen(): React.ReactElement {
const camera = useRef<Camera>(null);
const { hasPermission, requestPermission } = useCameraPermission();
const [isCameraInitialized, setIsCameraInitialized] = useState<boolean>(false);
const [isCameraInitialized, setIsCameraInitialized] =
useState<boolean>(false);
const isForeground = useIsForeground();
const isFocused = useIsFocused();
@ -37,6 +38,10 @@ export default function CameraScreen(): React.ReactElement {
console.log(`Media captured! ${JSON.stringify(media)}`);
}, []);
const onVideoChunkReady = useCallback((event) => {
console.log(`Chunk ready in react-native`, event.nativeEvent);
}, []);
if (!hasPermission) {
requestPermission();
// Error handling in case they refuse to give permission
@ -59,7 +64,7 @@ export default function CameraScreen(): React.ReactElement {
};
if (device === null) {
console.log(device)
console.log(device);
return (
<Text>
Camera not available. Does user have permissions: {hasPermission}
@ -76,6 +81,7 @@ export default function CameraScreen(): React.ReactElement {
format={format}
onInitialized={onInitialized}
onError={onError}
onVideoChunkReady={onVideoChunkReady}
video={true}
orientation={orientation} // TODO: #60
isActive={isActive}

2
react-native-vision-camera

@ -1 +1 @@
Subproject commit fb425458904eb240466768be08352973fd2f78d8
Subproject commit 0e05fc314fb759ec0944bf09c07aba9ad753fc2b

61
screens/login.tsx
View File

@ -1,17 +1,26 @@
import React, { useState, useEffect } from 'react';
import { Alert, Button, View, Text, TextInput, TouchableWithoutFeedback, Keyboard } from "react-native";
import auth, { FirebaseAuthTypes } from '@react-native-firebase/auth';
import React, { useState, useEffect } from "react";
import {
Alert,
Button,
View,
Text,
TextInput,
TouchableWithoutFeedback,
Keyboard,
} from "react-native";
import auth, { FirebaseAuthTypes } from "@react-native-firebase/auth";
// This code is beginning of Auth Implementation - actual implementation will differ and involve more UI
// Does not have a restart or proper handling of code confirmation, should only be used for obtaining token/testing
// Currently working for Android builds, iOS has open issue #56
export default function Login() {
const [phoneNumber, setPhoneNumber] = useState<string>('');
const [code, setCode] = useState<string>('');
const [phoneNumber, setPhoneNumber] = useState<string>("");
const [code, setCode] = useState<string>("");
const [user, setUser] = useState(null);
const [confirm, setConfirm] = useState<FirebaseAuthTypes.ConfirmationResult | null>(null);
const [confirm, setConfirm] =
useState<FirebaseAuthTypes.ConfirmationResult | null>(null);
async function onAuthStateChanged(user: any) {
setUser(user);
@ -26,16 +35,18 @@ export default function Login() {
async function signInWithPhoneNumber(phoneNumber: string) {
if (!phoneNumber) {
return Alert.alert('Please enter a valid phone number with a country code');
return Alert.alert(
"Please enter a valid phone number with a country code",
);
}
try {
const confirmation = await auth().signInWithPhoneNumber(phoneNumber);
setConfirm(confirmation);
} catch (err) {
// TODO: implement more robust error handling by parsing err message
console.warn(err)
console.warn(err);
Alert.alert(
'There was an error. Make sure you are using a country code (ex: +1 for US)'
"There was an error. Make sure you are using a country code (ex: +1 for US)",
);
}
}
@ -44,7 +55,7 @@ export default function Login() {
try {
await confirm?.confirm(code);
} catch {
Alert.alert('Invalid code, please try again.');
Alert.alert("Invalid code, please try again.");
}
}
@ -53,13 +64,17 @@ export default function Login() {
return subscriber;
}, []);
return (
<TouchableWithoutFeedback onPress={() => Keyboard.dismiss()}>
<View style={{ alignItems: 'center' }}>
<View style={{ alignItems: "center" }}>
<TextInput
style={{ width: '50%', height: 30, borderWidth: 1, borderColor: 'black', marginBottom: 20 }}
style={{
width: "50%",
height: 30,
borderWidth: 1,
borderColor: "black",
marginBottom: 20,
}}
placeholder="Phone"
textContentType="telephoneNumber"
keyboardType="phone-pad"
@ -69,7 +84,13 @@ export default function Login() {
/>
{confirm && (
<TextInput
style={{ width: '50%', height: 30, borderWidth: 1, borderColor: 'black', marginBottom: 20 }}
style={{
width: "50%",
height: 30,
borderWidth: 1,
borderColor: "black",
marginBottom: 20,
}}
placeholder="Code"
keyboardType="number-pad"
textContentType="oneTimeCode"
@ -80,15 +101,19 @@ export default function Login() {
)}
<Button
title={!confirm ? "Receive code" : "Confirm code"}
onPress={() => !confirm ? signInWithPhoneNumber(phoneNumber) : confirmCode()}
onPress={() =>
!confirm ? signInWithPhoneNumber(phoneNumber) : confirmCode()
}
/>
{user && (
<>
<Text style={{ marginTop: 10 }}>Display name: {user?.displayName}</Text>
<Text style={{ marginTop: 10 }}>
Display name: {user?.displayName}
</Text>
<Text>Phone number: {user?.phoneNumber}</Text>
</>
)}
</View>
</TouchableWithoutFeedback>
)
);
}