created repo

2014-09-15 09:01:01 -07:00 · 2014-09-15 09:01:01 -07:00 · 27ab13cd63
commit 27ab13cd63
4 changed files with 147 additions and 0 deletions
--- a/README.md
+++ b/README.md
@ -0,0 +1,24 @@
+WebRTC Example
+==============
+
+#### shane tully
+#### shanetully.com
+
+An 'as simple as it gets' WebRTC example.
+
+See LINK for a detailed walkthrough of the code.
+
+### Usage
+
+The signaling server uses Node.js and `ws` and can be started as such:
+
+```
+$ npm install ws
+$ node server/server.js
+```
+
+With the client running, open `client/index.html` in a recent version of either Firefox or Chrome.
+
+### License
+
+MIT
--- a/client/index.html
+++ b/client/index.html
@ -0,0 +1,18 @@
+<html>
+    <head>
+        <script src="webrtc.js"></script>
+    </head>
+
+    <body>
+        <video id="localVideo" autoplay muted style="width:40%;"></video>
+        <video id="remoteVideo" autoplay style="width:40%;"></video>
+
+        <br />
+
+        <input type="button" id="start" onclick="start(true)" value="Start Video"></input>
+
+        <script type="text/javascript">
+            pageReady();
+        </script>
+    </body>
+</html>
--- a/client/webrtc.js
+++ b/client/webrtc.js
@ -0,0 +1,89 @@
+var localVideo;
+var remoteVideo;
+var peerConnection;
+var peerConnectionConfig = {'iceServers': [{'url': 'stun:stun.services.mozilla.com'}, {'url': 'stun:stun.l.google.com:19302'}]};
+ 
+navigator.getUserMedia = navigator.getUserMedia || navigator.mozGetUserMedia || navigator.webkitGetUserMedia;
+window.RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
+window.RTCIceCandidate = window.RTCIceCandidate || window.mozRTCIceCandidate || window.webkitRTCIceCandidate;
+window.RTCSessionDescription = window.RTCSessionDescription || window.mozRTCSessionDescription || window.webkitRTCSessionDescription;
+
+function pageReady() {
+    localVideo = document.getElementById('localVideo');
+    remoteVideo = document.getElementById('remoteVideo');
+
+    serverConnection = new WebSocket('ws://127.0.0.1:3434');
+    serverConnection.onmessage = gotMessageFromServer;
+
+    var constraints = {
+        video: true,
+        audio: true, 
+    };
+
+    if(navigator.getUserMedia) {
+        navigator.getUserMedia(constraints, getUserMediaSuccess, getUserMediaError);
+    } else {
+        alert('Your browser does not support getUserMedia API');
+    }
+}
+
+function getUserMediaSuccess(stream) {
+    localStream = stream;
+    localVideo.src = window.URL.createObjectURL(stream);
+}
+
+function start(isCaller) {
+    peerConnection = new RTCPeerConnection(peerConnectionConfig);
+    peerConnection.onicecandidate = gotIceCandidate;
+    peerConnection.onaddstream = gotRemoteStream;
+    peerConnection.addStream(localStream);
+
+    if(isCaller) {
+        peerConnection.createOffer(gotDescription, createOfferError);
+    }
+}
+
+function gotMessageFromServer(message) {
+    if(!peerConnection) start(false);
+
+    var signal = JSON.parse(message.data);
+    if(signal.sdp) {
+        peerConnection.setRemoteDescription(new RTCSessionDescription(signal.sdp), function() {
+            peerConnection.createAnswer(gotDescription, createAnswerError);
+        });
+    } else if(signal.ice) {
+        peerConnection.addIceCandidate(new RTCIceCandidate(signal.ice));
+    }
+}
+
+function gotIceCandidate(event) {
+    if(event.candidate != null) {
+        serverConnection.send(JSON.stringify({'ice': event.candidate}));
+    }
+}
+
+function gotDescription(description) {
+    console.log('got description');
+    peerConnection.setLocalDescription(description, function () {
+        serverConnection.send(JSON.stringify({'sdp': description}));
+    }, function() {console.log('set description error')});
+}
+
+function gotRemoteStream(event) {
+    console.log("got remote stream");
+    remoteVideo.src = window.URL.createObjectURL(event.stream);
+}
+
+// Error functions....
+
+function getUserMediaError(error) {
+    console.log(error);
+}
+
+function createOfferError(error) {
+    console.log(error);
+}
+
+function createAnswerError(error) {
+    console.log(error);
+}
--- a/server/server.js
+++ b/server/server.js
@ -0,0 +1,16 @@
+var WebSocketServer = require('ws').Server;
+
+var wss = new WebSocketServer({port: 3434});
+
+wss.broadcast = function(data) {
+    for(var i in this.clients) {
+        this.clients[i].send(data);
+    }
+};
+
+wss.on('connection', function(ws) {
+    ws.on('message', function(message) {
+        console.log('received: %s', message);
+        wss.broadcast(message);
+    });
+});