diff --git a/public/index.html b/public/index.html index b14b2bc..da8967e 100644 --- a/public/index.html +++ b/public/index.html @@ -102,7 +102,7 @@
- +
{{call.peer}}
diff --git a/public/main.js b/public/main.js index d9599c1..ef7a0d0 100644 --- a/public/main.js +++ b/public/main.js @@ -17,8 +17,8 @@ var app = new Vue({ document.querySelector('.messages').appendChild(newMessage); }, renderVideo:function(stream, selector = '#remoteVideo') { - console.log('renderVideo', stream); - // document.querySelector(selector).srcObject = stream; + console.log('renderVideo', {stream, selector}); + document.querySelector(selector).srcObject = stream; }, connectToPeer: function(peerId) { this.logMessage(`Connecting to ${peerId}...`); @@ -32,9 +32,9 @@ var app = new Vue({ }); let call = this.peer.call(peerId, this.stream); - call.on('stream', this.renderVideo); + call.on('stream', (stream) => this.renderVideo(stream, '#video-'+call.connectionId)); call.on('close', () => { - console.log(`Call with ${peerId} was closed.`); + console.log(`[OUT] Call with ${peerId} was closed.`); this.calls = this.calls.filter(c => c.connectionId === call.connectionId); }); this.calls.push(call); @@ -81,10 +81,9 @@ var app = new Vue({ this.peer.on('call', (call) => { console.log('INCOMING CALL', call); call.answer(this.stream); // Answer the call with an A/V stream. - // this.renderVideo(this.stream, '#localVideo'); - call.on('stream', this.renderVideo); + call.on('stream', (stream) => this.renderVideo(stream, '#video-'+call.connectionId)); call.on('close', () => { - console.log(`Call with ${call.peer} was closed.`); + console.log(`[INC] Call with ${call.peer} was closed.`); this.calls = this.calls.filter(c => c.connectionId === call.connectionId); }); this.calls.push(call);