Merge pull request 'Add onVideoChunkReady' (#78) from ivan/addOnVideoChunkReady into master
Reviewed-on: railbird/rn-playground#78
This commit is contained in:
commit
9e170380db
@ -13,12 +13,13 @@ import {
|
|||||||
} from "react-native-vision-camera";
|
} from "react-native-vision-camera";
|
||||||
import { RecordingButton } from "./capture-button";
|
import { RecordingButton } from "./capture-button";
|
||||||
import { useIsForeground } from "./is-foreground";
|
import { useIsForeground } from "./is-foreground";
|
||||||
import { useIsFocused } from '@react-navigation/native'
|
import { useIsFocused } from "@react-navigation/native";
|
||||||
|
|
||||||
export default function CameraScreen(): React.ReactElement {
|
export default function CameraScreen(): React.ReactElement {
|
||||||
const camera = useRef<Camera>(null);
|
const camera = useRef<Camera>(null);
|
||||||
const { hasPermission, requestPermission } = useCameraPermission();
|
const { hasPermission, requestPermission } = useCameraPermission();
|
||||||
const [isCameraInitialized, setIsCameraInitialized] = useState<boolean>(false);
|
const [isCameraInitialized, setIsCameraInitialized] =
|
||||||
|
useState<boolean>(false);
|
||||||
|
|
||||||
const isForeground = useIsForeground();
|
const isForeground = useIsForeground();
|
||||||
const isFocused = useIsFocused();
|
const isFocused = useIsFocused();
|
||||||
@ -37,6 +38,10 @@ export default function CameraScreen(): React.ReactElement {
|
|||||||
console.log(`Media captured! ${JSON.stringify(media)}`);
|
console.log(`Media captured! ${JSON.stringify(media)}`);
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
const onVideoChunkReady = useCallback((event) => {
|
||||||
|
console.log(`Chunk ready in react-native`, event.nativeEvent);
|
||||||
|
}, []);
|
||||||
|
|
||||||
if (!hasPermission) {
|
if (!hasPermission) {
|
||||||
requestPermission();
|
requestPermission();
|
||||||
// Error handling in case they refuse to give permission
|
// Error handling in case they refuse to give permission
|
||||||
@ -59,7 +64,7 @@ export default function CameraScreen(): React.ReactElement {
|
|||||||
};
|
};
|
||||||
|
|
||||||
if (device === null) {
|
if (device === null) {
|
||||||
console.log(device)
|
console.log(device);
|
||||||
return (
|
return (
|
||||||
<Text>
|
<Text>
|
||||||
Camera not available. Does user have permissions: {hasPermission}
|
Camera not available. Does user have permissions: {hasPermission}
|
||||||
@ -76,6 +81,7 @@ export default function CameraScreen(): React.ReactElement {
|
|||||||
format={format}
|
format={format}
|
||||||
onInitialized={onInitialized}
|
onInitialized={onInitialized}
|
||||||
onError={onError}
|
onError={onError}
|
||||||
|
onVideoChunkReady={onVideoChunkReady}
|
||||||
video={true}
|
video={true}
|
||||||
orientation={orientation} // TODO: #60
|
orientation={orientation} // TODO: #60
|
||||||
isActive={isActive}
|
isActive={isActive}
|
||||||
|
@ -1 +1 @@
|
|||||||
Subproject commit fb425458904eb240466768be08352973fd2f78d8
|
Subproject commit 0e05fc314fb759ec0944bf09c07aba9ad753fc2b
|
@ -1,17 +1,26 @@
|
|||||||
import React, { useState, useEffect } from 'react';
|
import React, { useState, useEffect } from "react";
|
||||||
import { Alert, Button, View, Text, TextInput, TouchableWithoutFeedback, Keyboard } from "react-native";
|
import {
|
||||||
import auth, { FirebaseAuthTypes } from '@react-native-firebase/auth';
|
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
|
// 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
|
// 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
|
// Currently working for Android builds, iOS has open issue #56
|
||||||
|
|
||||||
export default function Login() {
|
export default function Login() {
|
||||||
const [phoneNumber, setPhoneNumber] = useState<string>('');
|
const [phoneNumber, setPhoneNumber] = useState<string>("");
|
||||||
const [code, setCode] = useState<string>('');
|
const [code, setCode] = useState<string>("");
|
||||||
|
|
||||||
const [user, setUser] = useState(null);
|
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) {
|
async function onAuthStateChanged(user: any) {
|
||||||
setUser(user);
|
setUser(user);
|
||||||
@ -26,16 +35,18 @@ export default function Login() {
|
|||||||
|
|
||||||
async function signInWithPhoneNumber(phoneNumber: string) {
|
async function signInWithPhoneNumber(phoneNumber: string) {
|
||||||
if (!phoneNumber) {
|
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 {
|
try {
|
||||||
const confirmation = await auth().signInWithPhoneNumber(phoneNumber);
|
const confirmation = await auth().signInWithPhoneNumber(phoneNumber);
|
||||||
setConfirm(confirmation);
|
setConfirm(confirmation);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
// TODO: implement more robust error handling by parsing err message
|
// TODO: implement more robust error handling by parsing err message
|
||||||
console.warn(err)
|
console.warn(err);
|
||||||
Alert.alert(
|
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 {
|
try {
|
||||||
await confirm?.confirm(code);
|
await confirm?.confirm(code);
|
||||||
} catch {
|
} 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 subscriber;
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<TouchableWithoutFeedback onPress={() => Keyboard.dismiss()}>
|
<TouchableWithoutFeedback onPress={() => Keyboard.dismiss()}>
|
||||||
<View style={{ alignItems: 'center' }}>
|
<View style={{ alignItems: "center" }}>
|
||||||
<TextInput
|
<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"
|
placeholder="Phone"
|
||||||
textContentType="telephoneNumber"
|
textContentType="telephoneNumber"
|
||||||
keyboardType="phone-pad"
|
keyboardType="phone-pad"
|
||||||
@ -69,7 +84,13 @@ export default function Login() {
|
|||||||
/>
|
/>
|
||||||
{confirm && (
|
{confirm && (
|
||||||
<TextInput
|
<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"
|
placeholder="Code"
|
||||||
keyboardType="number-pad"
|
keyboardType="number-pad"
|
||||||
textContentType="oneTimeCode"
|
textContentType="oneTimeCode"
|
||||||
@ -80,15 +101,19 @@ export default function Login() {
|
|||||||
)}
|
)}
|
||||||
<Button
|
<Button
|
||||||
title={!confirm ? "Receive code" : "Confirm code"}
|
title={!confirm ? "Receive code" : "Confirm code"}
|
||||||
onPress={() => !confirm ? signInWithPhoneNumber(phoneNumber) : confirmCode()}
|
onPress={() =>
|
||||||
|
!confirm ? signInWithPhoneNumber(phoneNumber) : confirmCode()
|
||||||
|
}
|
||||||
/>
|
/>
|
||||||
{user && (
|
{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>
|
<Text>Phone number: {user?.phoneNumber}</Text>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</View>
|
</View>
|
||||||
</TouchableWithoutFeedback>
|
</TouchableWithoutFeedback>
|
||||||
)
|
);
|
||||||
}
|
}
|
Loading…
Reference in New Issue
Block a user