Stream audio and video feed of host to guest view

Conflicts:
	src/packages/collaboration/lib/session-utils.coffee

src/packages/collaboration/lib/guest-session.coffee

@@ -15,6 +15,7 @@ class GuestSession
   participants: null
   repository: null
   peer: null
+  stream: null
 
   constructor: (sessionId) ->
     @peer = createPeer()
@@ -31,14 +32,50 @@ class GuestSession
 
   createTelepathDocument: (data, connection) ->
     doc = telepath.Document.deserialize(data.doc, site: telepath.createSite(@getId()))
+
+    servers = null
+    mediaConnection = new webkitRTCPeerConnection(servers)
+    mediaConnection.onicecandidate = (event) =>
+      return unless event.candidate?
+      console.log "Set Guest Candidate", event.candidate
+      doc.set 'collaborationState.guest.candidate', event.candidate
+
+    mediaConnection.onaddstream = ({@stream}) =>
+      @trigger 'stream-ready', @stream
+      console.log('Added Stream', @stream)
+
     atom.windowState = doc.get('windowState')
     @repository = doc.get('collaborationState.repositoryState')
+
     @participants = doc.get('collaborationState.participants')
     @participants.on 'changed', =>
       @trigger 'participants-changed', @participants.toObject()
+
+    guest = doc.get 'collaborationState.guest'
+    host = doc.get('collaborationState.host')
+    host.on 'changed', ({key, newValue}) =>
+      switch key
+        when 'description'
+          hostDescription = newValue.toObject()
+          console.log "Received host description", hostDescription
+          sessionDescription = new RTCSessionDescription(hostDescription)
+          mediaConnection.setRemoteDescription(sessionDescription)
+          mediaConnection.createAnswer (guestDescription) =>
+            console.log "Set guest description", guestDescription
+            mediaConnection.setLocalDescription(guestDescription)
+            guest.set('description', guestDescription)
+        when 'candidate'
+          hostCandidate = new RTCIceCandidate newValue.toObject()
+          console.log('Guest received candidate', hostCandidate)
+          mediaConnection.addIceCandidate(hostCandidate)
+        else
+          throw new Error("Unknown host key '#{key}'")
+
     connectDocument(doc, connection)
     @mirrorRepository(data.repoSnapshot)
 
+    guest.set 'ready', true
+
   mirrorRepository: (repoSnapshot)->
     repoUrl = @repository.get('url')
     [repoName] = url.parse(repoUrl).path.split('/')[-1..]

src/packages/collaboration/lib/guest-view.coffee

@@ -6,6 +6,7 @@ class GuestView extends View
   @content: ->
     @div class: 'collaboration', tabindex: -1, =>
       @div class: 'guest'
+      @video autoplay: true, outlet: 'video'
       @div outlet: 'participants'
 
   guestSession: null
@@ -16,8 +17,19 @@ class GuestView extends View
 
     @updateParticipants(@guestSession.participants.toObject())
 
+    @addStream(@guestSession.stream)
+    @guestSession.on 'stream-ready', (stream) =>
+      console.log "Stream is ready", stream
+      @addStream(stream)
+
     @attach()
 
+  addStream: (stream) ->
+    return unless stream
+    console.log "STREAM", @video[0]
+
+    @video[0].src = URL.createObjectURL(stream)
+
   updateParticipants: (participants) ->
     @participants.empty()
     guestId = @guestSession.getId()

src/packages/collaboration/lib/host-session.coffee

@@ -14,10 +14,23 @@ class HostSession
   participants: null
   peer: null
   sharing: false
+  mediaConnection: null
 
   start: ->
     return if @peer?
 
+    servers = null
+    @mediaConnection = new webkitRTCPeerConnection(servers)
+    @mediaConnection.onicecandidate = (event) =>
+      return unless event.candidate?
+      console.log "Set Host Candidate", event.candidate
+      @doc.set 'collaborationState.host.candidate', event.candidate
+
+    constraints = {video: true, audio: true}
+    success = (stream) => @mediaConnection.addStream(stream)
+
+    navigator.webkitGetUserMedia constraints, success, console.error
+
     @peer = createPeer()
     @doc = telepath.Document.create({}, site: telepath.createSite(@getId()))
     @doc.set('windowState', atom.windowState)
@@ -26,12 +39,36 @@ class HostSession
         console.error(error)
         return
 
+      # FIXME: There be dragons here
       @doc.set 'collaborationState',
+        guest: {description: '', candidate: '', ready: false}
+        host: {description: '', candidate: ''}
         participants: []
         repositoryState:
           url: git.getConfigValue('remote.origin.url')
           branch: git.getShortHead()
 
+      host = @doc.get 'collaborationState.host'
+      guest = @doc.get 'collaborationState.guest'
+      guest.on 'changed', ({key, newValue}) =>
+        switch key
+          when 'ready'
+            @mediaConnection.createOffer (description) =>
+              console.log "Create Offer", description
+              @mediaConnection.setLocalDescription(description)
+              host.set 'description', description
+          when 'description'
+            guestDescription = newValue.toObject()
+            console.log "Received Guest description", guestDescription
+            sessionDescription = new RTCSessionDescription(guestDescription)
+            @mediaConnection.setRemoteDescription(sessionDescription)
+          when 'candidate'
+            guestCandidate = new RTCIceCandidate newValue.toObject()
+            console.log('Host received candidate', guestCandidate)
+            @mediaConnection.addIceCandidate(new RTCIceCandidate(guestCandidate))
+          else
+            throw new Error("Unknown guest key '#{key}'")
+
       @participants = @doc.get('collaborationState.participants')
       @participants.push
         id: @getId()

src/packages/collaboration/stylesheets/collaboration.less

@@ -1,6 +1,8 @@
 @import "bootstrap/less/variables.less";
 @import "octicon-mixins.less";
 
+@width: 64px;
+
 .collaboration {
   @item-line-height: @line-height-base * 1.25;
   padding: 10px;
@@ -23,8 +25,8 @@
 
   .avatar {
     border-radius: 3px;
-    height: 16px;
-    width: 16px;
+    height: @width;
+    width: @width;
     margin: 2px;
   }
 }