Update client

This commit is contained in:
Sergiu Toma 2021-02-22 20:58:55 +02:00
parent 831e52f0dc
commit 3f599fd979
1 changed files with 45 additions and 47 deletions

View File

@ -135,16 +135,17 @@ class App extends Component {
// setTimeout(() => {
// windowObjectReference = window.open("http://www.cnn.com/", "CNN_WindowName", windowFeatures);
// }, 500)
pc = new RTCPeerConnection(config)
stream = await navigator.mediaDevices.getUserMedia({video:true, audio:false})
localStream = stream
localVideo.srcObject = stream
pc.ontrack = this.onAddStream;
// pc.addTrack(localStream.getTracks()[0], localStream);
pc.addTrack(localStream.getTracks()[0], localStream)
// pc.addTrack(localStream.getTracks()[1], localStream)
pc.oniceconnectionstatechange = this.onIceConnectionStateChange;
pc.onsignalingstatechange = this.onSignalingStateChange;
// pc = new RTCPeerConnection(config)
// pc.ontrack = this.onAddStream;
// // pc.addTrack(localStream.getTracks()[0], localStream);
// pc.addTrack(localStream.getTracks()[0], localStream)
// // pc.addTrack(localStream.getTracks()[1], localStream)
// pc.oniceconnectionstatechange = this.onIceConnectionStateChange;
// pc.onsignalingstatechange = this.onSignalingStateChange;
// pc.onicecandidate = ({candidate}) => {
// console.log('IIIIIIIIIIIIIIIIIIIIIIIII2', this.state.callId);
// this.state.socket.emit('video', JSON.stringify({
@ -223,47 +224,37 @@ class App extends Component {
console.log('[VIDEO]', parseData);
if(parseData.type === 'notify-request') {
console.log('NOTIFY-REQUEST');
if(!this.state.callId) {
await pc.setLocalDescription(await pc.createOffer())
this.state.socket.emit('video', JSON.stringify({
origin_asset_id: this.state.user.asset.id,
dest_asset_id: parseInt(parseData.origin_asset_id),
type: 'notify-answer',
origin_asset_priority: this.state.user.asset.priority,
origin_asset_type_name: this.state.user.user_role.name,
origin_asset_name: this.state.user.asset.name,
video_call_id: parseInt(parseData.video_call_id),
answer: 'accepted', // answer: 'rejected'
sdp: pc.localDescription
}));
this.setState({ callId: parseInt(parseData.video_call_id), dest_asset_id: parseInt(parseData.origin_asset_id) })
}
// else {
// console.log('!!!!!!!!!!!!!!!!!', {
// origin_asset_id: this.state.user.asset.id,
// dest_asset_id: parseInt(this.state.dest_asset_id),
// type: 'offer',
// origin_asset_priority: this.state.user.asset.priority,
// origin_asset_type_name: this.state.user.user_role.name,
// origin_asset_name: this.state.user.asset.name,
// video_call_id: this.state.callId,
// sdp: pc.localDescription
// });
// socket.emit('video', JSON.stringify({
// origin_asset_id: this.state.user.asset.id,
// dest_asset_id: parseInt(this.state.dest_asset_id),
// type: 'offer',
// origin_asset_priority: this.state.user.asset.priority,
// origin_asset_type_name: this.state.user.user_role.name,
// origin_asset_name: this.state.user.asset.name,
// video_call_id: this.state.callId,
// sdp: pc.localDescription
// }));
// }
pc = new RTCPeerConnection(config)
pc.ontrack = this.onAddStream;
// pc.addTrack(localStream.getTracks()[0], localStream);
pc.addTrack(localStream.getTracks()[0], localStream)
// pc.addTrack(localStream.getTracks()[1], localStream)
pc.oniceconnectionstatechange = this.onIceConnectionStateChange;
pc.onsignalingstatechange = this.onSignalingStateChange;
console.log('NOTIFY-REQUEST');
await pc.setLocalDescription(await pc.createOffer())
this.state.socket.emit('video', JSON.stringify({
origin_asset_id: this.state.user.asset.id,
dest_asset_id: parseInt(parseData.origin_asset_id),
type: 'notify-answer',
origin_asset_priority: this.state.user.asset.priority,
origin_asset_type_name: this.state.user.user_role.name,
origin_asset_name: this.state.user.asset.name,
video_call_id: parseInt(parseData.video_call_id),
answer: 'accepted', // answer: 'rejected'
sdp: pc.localDescription
}));
this.setState({ callId: parseInt(parseData.video_call_id), dest_asset_id: parseInt(parseData.origin_asset_id) })
}
if(parseData.type === 'notify-answer') {
pc = new RTCPeerConnection(config)
pc.ontrack = this.onAddStream;
// pc.addTrack(localStream.getTracks()[0], localStream);
pc.addTrack(localStream.getTracks()[0], localStream)
// pc.addTrack(localStream.getTracks()[1], localStream)
pc.oniceconnectionstatechange = this.onIceConnectionStateChange;
pc.onsignalingstatechange = this.onSignalingStateChange;
console.log('NOTIFY-ANSWER');
this.setState({ callId: parseInt(parseData.video_call_id) })
this.offerReceived(parseData)
@ -320,7 +311,7 @@ class App extends Component {
} else if (parseData.type === 'notify-end') {
this.cleanVideoStreams();
}
});
@ -432,6 +423,13 @@ class App extends Component {
this.cleanVideoStreams();
}
cleanVideoStreams = () => {
this.setState({ dest_asset_id: '', callId: null });
pc.close();
// localVideo.srcObject = null;
// remoteVideo.srcObject = null;
}
render() {
const { login, password, user, hubStatus, arsSent, dest_asset_id, isCaller, callId, stunUrl, turnUrl, turnUsername, turnCredential } = { ...this.state };
return (
@ -516,7 +514,7 @@ class App extends Component {
<h4>status: {(hubStatus === 0 ? 'uninitialized' : hubStatus === 1 ? 'connecting' : hubStatus === 2 ? 'connected' : 'connection error' )}</h4>
<h4>ARS Sent: {arsSent === true ? 'TRUE' : 'FALSE'}</h4>
<h4>Call id: {callId}</h4>
<h4>Call id: {callId && callId}</h4>
<br></br>