diff --git a/public/index.html b/public/index.html index eba1285..78c847d 100755 --- a/public/index.html +++ b/public/index.html @@ -27,7 +27,8 @@
Audio
- +
+

diff --git a/public/webrtc.js b/public/webrtc.js index cdbc315..9decfd4 100755 --- a/public/webrtc.js +++ b/public/webrtc.js @@ -81,8 +81,12 @@ class Remote { element = null; constructor(id, stream) { + document.getElementById("remote").innerHTML += ` + + `; this.element = document.getElementById(id); this.element.srcObject = stream; + View.log(this.element); } } @@ -93,6 +97,10 @@ class Preview { this.element = document.getElementById(id); this.element.srcObject = stream; } + + destructor() { + this.element.remove(); + } } class Server { @@ -105,19 +113,34 @@ class Server { } class Peer { + peer = null; + streams = {}; constructor(stream) { this.peer = new RTCPeerConnection(Config.iceConfig); - this.peer.onicecandidate = this.gotIceCandidate; - this.peer.ontrack = (event) => new Remote('remoteVideo', event.streams[0]); + this.peer.onicecandidate = (event) => { + if(event.candidate != null) { + Server.server.send(JSON.stringify({'ice': event.candidate, 'uuid': Config.getUUID()})); + } + }; + this.peer.ontrack = (event) => { + event.streams.forEach((stream) => { + this.streams[stream.id] = new Remote(stream.id, stream); + }); + View.log("/ontrack:", this.streams); + }; + this.peer.onremovestream = (event) => { + event.streams.forEach((stream) => { + this.streams[stream.id].destructor(); + delete this.streams[stream.id]; + }); + View.log("/onremovestream:", this.streams); + }; + this.peer.onconnectionstatechange = (event) => { + View.log("/onconnectionstatechange:", this.streams, this.peer.connectionState); + }; this.peer.addStream(stream); } - gotIceCandidate(event) { - if(event.candidate != null) { - Server.server.send(JSON.stringify({'ice': event.candidate, 'uuid': Config.getUUID()})); - } - } - offer(cb) { this.peer .createOffer({ @@ -127,8 +150,11 @@ class Peer { .then(cb) .catch(View.error); } + + destructor() { + this.peer.close(); + } } -Peer.peer = null; class Entropy { static pageReady() {