sergiu/hub-video-tester
0
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Update client

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

92
src/App.js
View File

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