Closed torretorich closed 1 year ago
pe1ros
commented
2 years ago Hello! @torretorich
You can use sendAudio method on instance current Call with param true/false - that says about send audio or not.
For more information you can check our docs.
For example:
const Client = Voximplant.getInstance();
const currentCall = useRef().current;
currentCall = await Client.call(number, callSettings);
currentCall.sendAudio(false); // audio will be muted
torretorich
commented
2 years ago import { View, Text,StyleSheet,Pressable,PermissionsAndroid,Platform,Alert,Dimensions} from 'react-native'
import React,{useEffect,useState,useRef} from 'react'
import Ionicons from 'react-native-vector-icons/Ionicons';
import MaterialIcon from "react-native-vector-icons/MaterialCommunityIcons"
import CallActionBox from '../../Components/CallActionBox';
import { NavigationContainer } from '@react-navigation/native';
import { useNavigation,useRoute } from '@react-navigation/native';
import { Voximplant } from 'react-native-voximplant';
import Draggable from 'react-native-draggable';
import { TouchableOpacity } from 'react-native-gesture-handler';
import { CameraType } from 'react-native-voximplant/src/Voximplant';
const permissions = [
PermissionsAndroid.PERMISSIONS.RECORD_AUDIO,
PermissionsAndroid.PERMISSIONS.CAMERA,
]
const windowWidth = Dimensions.get('window').width;
const windowHeight = Dimensions.get('window').height;
export default function CallingScreen(props) {
const [permissionsGranted,setPermissionGranted] = useState(false)
const [callStatus,setCallStatus] = useState("Initializing...")
const [localVideoStreamId,setLocalVideoStreamId] = useState("")
const [remoteVideoStreamId,setRemoteVideoStreamId] = useState("")
const [isMuted,setIsAudioMuted] = useState(false)
const [videoView,setVideoView] = useState(false)
const navigation = useNavigation()
const route = useRoute()
const {user,call: incomingCall,isIncomingCall} = route?.params;
const voximplant = Voximplant.getInstance();
const call = useRef(incomingCall);
console.log("fe",route.params);
// audio will be muted
const endpoint = useRef(null)
const params = props.route.params;
const callId = params ? params.callId : null;
const Client = voximplant
var currentCall = useRef().current;
const goBack=()=>{
navigation.pop()
}
useEffect(() => {
const getPermissions = async() =>{
const granted = await PermissionsAndroid.requestMultiple(permissions);
// console.warn(granted);
const recordAudioGranted =
granted[PermissionsAndroid.PERMISSIONS.RECORD_AUDIO]==="granted"
const cameraGranted =
granted[PermissionsAndroid.PERMISSIONS.CAMERA] ==="granted"
if(!cameraGranted || !recordAudioGranted){
alert("Permission Not Granted")
}
else{
setPermissionGranted(true);
}
}
if(Platform.OS==="android"){
getPermissions()
}
else{
setPermissionGranted(true)
}
}, [])
useEffect(() => {
if(!permissionsGranted){
return;
}
const callSetting = {
video:{
sendVideo:true,
receiveVideo:true
}
}
const makeCall = async() =>{
call.current = await voximplant.call(user.userName,callSetting)
subscribeToCallEvents();} ;
const answerCall = async() =>{
subscribeToCallEvents();
endpoint.current = call.current.getEndpoints()[0];
subscribeToEndpointEvent()
call.current.answer(callSetting)
}
const subscribeToCallEvents = () =>{
call.current.on(Voximplant.CallEvents.Failed,callEvent=>{
showError(callEvent.reason)
})
call.current.on(Voximplant.CallEvents.ProgressToneStart,callEvent=>{
setCallStatus("Calling")
})
call.current.on(Voximplant.CallEvents.Connected,callEvent=>{
setCallStatus("Connected")
})
call.current.on(Voximplant.CallEvents.Disconnected,callEvent=>{
navigation.navigate("Contacts")
})
call.current.on(Voximplant.CallEvents.LocalVideoStreamAdded,callEvent=>{
setLocalVideoStreamId(callEvent.videoStream.id)
})
call.current.on(Voximplant.CallEvents.EndpointAdded,callEvent=>{
endpoint.current = callEvent.endpoint;
subscribeToEndpointEvent();
})
}
const subscribeToEndpointEvent = async() =>{
endpoint.current.on(Voximplant.EndpointEvents.RemoteVideoStreamAdded,endpointEvent =>{
setRemoteVideoStreamId(endpointEvent.videoStream.id)
})
}
const showError = reason =>{
Alert.alert("Call Failed",Reason: ${reason},[{text:"ok",onPress:navigation.navigate("Contacts")}]);
}
if(isIncomingCall){
answerCall();
}
else{
makeCall();
}
return()=>{
call.current.off(Voximplant.CallEvents.Failed)
call.current.off(Voximplant.CallEvents.ProgressToneStart)
call.current.off(Voximplant.CallEvents.Connnected)
call.current.off(Voximplant.CallEvents.Disconnected)
};
}, [permissionsGranted]);
const onHangupPress = ()=>{
call.current.hangup()
}
const onReverseCamera = ()=>{
console.warn("check log");
Voximplant.CameraType.BACK
}
const onToggleCamera = ()=>{
console.warn("pressed");
Voximplant.CameraType.BACK.back
}
const onToggleMicrophone = async()=>{
console.warn("mic");
const callSetting = {
video:{
sendVideo:true,
receiveVideo:true,
sendAudio:false
},
audio:{
sendAudio:false
}
}
currentCall = await Client.call(route.params.user.userName,callSetting);
currentCall.sendAudio(false);
}
return (
) } const styles = StyleSheet.create({ page:{ backgroundColor:"orange", height:"100%", width:"100%" }, cameraPreview:{ backgroundColor:"orange", flex:1, alignItems:"center", paddingTop:10, }, name:{ fontSize:30, fontWeight:"bold", color:"white", marginTop:50, marginBottom:10 }, phoneNumber:{ color:"white" }, backButton:{ position:"absolute", top:64, left:8, paddingHorizontal:20 }, localVideo:{ backgroundColor:"rgb(0,0,0)", width:windowWidth0.29, height:windowHeight0.22, right:10, borderRadius:10, }, remoteVideo:{ backgroundColor:"rgb(0,0,0)", width:windowWidth, position:"absolute", borderRadius:10, height:windowHeight, bottom:windowHeight0 }, remoteVideo1:{ backgroundColor:"rgb(0,0,0)", width:windowWidth0.29, height:windowHeight0.22, right:10, borderRadius:10, }, locaklVideo1:{ backgroundColor:"rgb(0,0,0)", width:windowWidth, borderRadius:10, height:windowHeight, bottom:windowHeight0 } })
torretorich
commented
2 years ago i implement with this code but mute function is not working.
pe1ros
commented
2 years ago Hello! @torretorich
You have some issues in code:
1) CallSettings don't have audio parameters, you may check correct parameters in our docs
2) To mute audio in the call, it is required to call Call.sendAudio(false) API for the current active call instance. In your onToggleMicrophone method implementation you create a new call and it does not look correctly as it leads to multiple calls at the same time and probably unexpected behavior on the application side if it is designed for a single call at the moment.
If I understand your code correctly, your onToggleMicrophone method should look something like:
const onToggleMicrophone = async () => {
console.warn("mic");
call.current.sendAudio(false); //assuming call.current is the current active call
}yes, you are right it was my fault . now it's working properly thankyou so much. can you help to reverse camera functionality?
pe1ros
commented
2 years ago Hello @torretorich !
We glad to help you, you can check realization main piece SDK API in ours React Native Voximplant Demo Projects.
You need to do something like that:
import {Voximplant} from 'react-native-voximplant';
const CameraManager = Voximplant.Hardware.CameraManager.getInstance();
const cameraType = Voximplant.Hardware.CameraType;
const [cameraState, setCameraState] = useState(cameraType.FRONT);
const toggleCameraMode = () => {
if (cameraState === cameraType.FRONT) {
CameraManager.switchCamera(cameraType.BACK);
setCameraState(cameraType.BACK);
} else {
CameraManager.switchCamera(cameraType.FRONT);
setCameraState(cameraType.FRONT);
}
};Thanks again for help to me. I have one more issue in speaker functionality. when call is connect with another user, loud speaker is not working, call connect with ear speaker. can you help me to solve this issue.
pe1ros
commented
2 years ago Hello @torretorich !
We glad to help you, you can check realization main piece SDK API in ours React Native Voximplant Demo Projects.
You need to do something like that:
import {Voximplant} from 'react-native-voximplant';
const AudioDeviceManager =
Voximplant.Hardware.AudioDeviceManager.getInstance();
const selectAudioDevice = async (device: string) => {
// device equal one of these: 'Earpiece', 'Speaker', 'WiredHeadset', 'Bluetooth'
await AudioDeviceManager.selectAudioDevice(device);
};
bsor-dev
commented
1 year ago @torretorich did you manage to fix this?
torretorich
commented
1 year ago yes it's solve thank you so much for help.
i apply props of voximplant docs front and back with function but there is show an error like that is undefined function. if anyone apply these props please help how to apply in react native?