hook up more UI stuff and lobby server

max-mapper · Mar 27, 2015 · 72ef91b · 72ef91b
1 parent 01a44ad
commit 72ef91b
Show file tree

Hide file tree

Showing 5 changed files with 78 additions and 115 deletions.
diff --git a/index.html b/index.html
@@ -13,6 +13,14 @@
     </style>
 </head>
 <body class="wi-100">
+  <div class="sharing-container dn">
+    <main class="center mw8 phm phl-ns ptl pbxl">
+      <p class="mono gray lh-copy thin mw7 f4 f3-ns">
+        You are now sharing your screen. Press CMD+Q to Quit.
+      </p>
+    </main>
+  </div>
+
   <div class="content-container">
     <header class="bb b--light-gray pvm">
       <div class="center mw8 phm phl-ns">

diff --git a/index.js b/index.js
@@ -5,8 +5,11 @@ var SimplePeer = require('simple-peer')
 var clipboard = require('clipboard')
 
 var request = require('request')
+var ssejson = require('ssejson')
 
 var DEV = process.env.LOCALDEV || false
+var server = 'http://catlobby.maxogden.com'
+// var server = 'http://localhost:5005'
 
 var video, videoSize, robot
 
@@ -15,7 +18,8 @@ var containers = {
   join: document.querySelector('.join-container'),
   content: document.querySelector('.content-container'),
   choose: document.querySelector('.choose-container'),
-  video: document.querySelector('.video-container')
+  video: document.querySelector('.video-container'),
+  sharing: document.querySelector('.sharing-container')
 }
 
 var buttons = {
@@ -65,6 +69,7 @@ function startHandshake(remote) {
     navigator.webkitGetUserMedia(constraints, function(stream) {
       var peer = new SimplePeer({ initiator: true, stream: stream, trickle: false })
       console.log('host peer', peer)
+      inputs.copy.value = 'Loading...'
       handleSignal(peer, remote)
     }, function(e) {
       if (e.code == e.PERMISSION_DENIED) {
@@ -77,27 +82,67 @@ function startHandshake(remote) {
 
 function handleSignal(peer, remote) {
   window.peer = peer
+  var pingName
+
   peer.on('signal', function (data) {
     // sdp is ~2.5k usually, that's too big for a URL, so we zlib deflate it
-    zlib.deflate(JSON.stringify(data), function(err, deflated) {
+    var stringified = JSON.stringify(data)
+    zlib.deflate(stringified, function(err, deflated) {
       var connectionString = deflated.toString('base64')
       var code = encodeURIComponent(connectionString)
-      inputs.copy.value = code
-      buttons.copy.addEventListener('click', function(e) {
-        e.preventDefault()
-        clipboard.writeText(code)
-      })
+      console.log('sdp length', code.length)
+
+      // upload pong sdp
+      if (remote) {
+        if (!pingName) return inputs.paste.value = 'Error! Please Quit'
+        request.post({body: code, uri: server + '/pong/' + pingName}, function resp (err, resp, body) {
+          if (err) return inputs.paste.value = err.message
+        })
+      }
+
+      // upload initial sdp
+      if (!remote) {
+        request.post({body: code, uri: server + '/ping'}, function resp (err, resp, body) {
+          if (err) return inputs.copy.value = 'Error! ' + err.message
+          var ping = JSON.parse(body)
+          inputs.copy.value = ping.name
+          buttons.copy.addEventListener('click', function(e) {
+            e.preventDefault()
+            clipboard.writeText(ping.name)
+          })
+
+          // listen for sdp pongs
+          var req = request(server + '/pongs/' + ping.name)
+            .pipe(ssejson.parse())
+            .on('data', function data (pong) {
+              console.log('pong sdp length', pong.length)
+              inflate(pong, function inflated (err, stringified) {
+                if (err) return inputs.copy.value = 'Error! Please Quit'
+                peer.signal(JSON.parse(stringified.toString()))
+                req.end()
+              })
+            })
+            .on('error', function error (err) {
+              inputs.copy.value = err.message
+            })
+        })
+      }
     })
   })
 
   buttons.paste.addEventListener('click', function(e) {
     e.preventDefault()
-    var code = inputs.paste.value
-    if (!code) return
-    code = decodeURIComponent(code)
-    zlib.inflate(new Buffer(code, 'base64'), function(err, inflated) {
-      if (err) return
-      peer.signal(JSON.parse(inflated.toString()))
+    var ping = inputs.paste.value
+    inputs.paste.value = 'Connecting...'
+    if (!ping) return
+    request({uri: server + '/ping/' + ping}, function resp (err, resp, data) {
+      if (err) return inputs.paste.value = 'Error! ' + err.message
+      console.log('sdp response length', data.length)
+      inflate(data, function inflated (err, stringified) {
+        if (err) return
+        pingName = ping
+        peer.signal(JSON.parse(stringified.toString()))
+      })
     })
   })
 
@@ -112,7 +157,10 @@ function handleSignal(peer, remote) {
 
   function onConnect() {
     containers.content.className += ' dn' // hide ui
-    if (!remote) return
+    if (!remote) {
+      containers.sharing.className += ' db' // show
+      return
+    }
     console.log('start sending...')
 
     window.addEventListener('mousedown', function mousedown (e) {
@@ -150,7 +198,12 @@ function handleSignal(peer, remote) {
       return data
     }
   }
-
+
+  function inflate (data, cb) {
+    data = decodeURIComponent(data.toString())
+    zlib.inflate(new Buffer(data, 'base64'), cb)
+  }
+
   peer.on('stream', function (stream) {
     video = document.createElement('video')
     video.src = window.URL.createObjectURL(stream)

diff --git a/limit-stream.js b/limit-stream.js
diff --git a/lobby.js b/lobby.js
diff --git a/package.json b/package.json
@@ -5,23 +5,18 @@
   "main": "app.js",
   "scripts": {
     "app": "atom-shell app.js",
-    "build": "atom-shell-packager . Screenshare",
-    "start": "node lobby.js"
+    "build": "atom-shell-packager . Screenshare"
   },
   "author": "max ogden",
   "license": "BSD",
   "dependencies": {
-    "cat-names": "^1.0.2",
-    "concat-stream": "^1.4.7",
     "debug": "^2.1.0",
-    "http-hash-router": "^1.1.0",
     "menubar": "^2.0.3",
-    "pumpify": "^1.3.3",
     "request": "^2.54.0",
     "robotjs": "maxogden/robotjs#keyupdown",
     "simple-peer": "^4.0.4",
+    "ssejson": "^1.2.0",
     "throttleit": "^1.0.0",
-    "through2": "^0.6.3",
     "vkey": "^1.0.0"
   },
   "devDependencies": {