Add video and audio streams to host view

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

@@ -33,6 +33,7 @@ class GuestSession
   createTelepathDocument: (data, connection) ->
     doc = telepath.Document.deserialize(data.doc, site: telepath.createSite(@getId()))
 
+
     servers = null
     mediaConnection = new webkitRTCPeerConnection(servers)
     mediaConnection.onicecandidate = (event) =>
@@ -44,6 +45,10 @@ class GuestSession
       @trigger 'stream-ready', @stream
       console.log('Added Stream', @stream)
 
+    constraints = {video: true, audio: true}
+    success = (stream) => mediaConnection.addStream(stream)
+    navigator.webkitGetUserMedia constraints, success, console.error
+
     atom.windowState = doc.get('windowState')
     @repository = doc.get('collaborationState.repositoryState')
 

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

@@ -26,8 +26,6 @@ class GuestView extends View
 
   addStream: (stream) ->
     return unless stream
-    console.log "STREAM", @video[0]
-
     @video[0].src = URL.createObjectURL(stream)
 
   updateParticipants: (participants) ->

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

@@ -14,21 +14,24 @@ class HostSession
   participants: null
   peer: null
   sharing: false
-  mediaConnection: null
+  stream: null
 
   start: ->
     return if @peer?
 
     servers = null
-    @mediaConnection = new webkitRTCPeerConnection(servers)
-    @mediaConnection.onicecandidate = (event) =>
+    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)
+    mediaConnection.onaddstream = ({@stream}) =>
+      @trigger 'stream-ready', @stream
+      console.log('Added Stream', @stream)
 
+    constraints = {video: true, audio: true}
+    success = (stream) => mediaConnection.addStream(stream)
     navigator.webkitGetUserMedia constraints, success, console.error
 
     @peer = createPeer()
@@ -53,19 +56,19 @@ class HostSession
       guest.on 'changed', ({key, newValue}) =>
         switch key
           when 'ready'
-            @mediaConnection.createOffer (description) =>
+            mediaConnection.createOffer (description) =>
               console.log "Create Offer", description
-              @mediaConnection.setLocalDescription(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)
+            mediaConnection.setRemoteDescription(sessionDescription)
           when 'candidate'
             guestCandidate = new RTCIceCandidate newValue.toObject()
             console.log('Host received candidate', guestCandidate)
-            @mediaConnection.addIceCandidate(new RTCIceCandidate(guestCandidate))
+            mediaConnection.addIceCandidate(new RTCIceCandidate(guestCandidate))
           else
             throw new Error("Unknown guest key '#{key}'")
 

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

@@ -6,6 +6,7 @@ class HostView extends View
   @content: ->
     @div class: 'collaboration', tabindex: -1, =>
       @div outlet: 'share', type: 'button', class: 'share'
+      @video autoplay: true, outlet: 'video'
       @div outlet: 'participants'
 
   hostSession: null
@@ -28,8 +29,17 @@ class HostView extends View
     @hostSession.on 'participants-changed', (participants) =>
       @updateParticipants(participants)
 
+    @addStream(@hostSession.stream)
+    @hostSession.on 'stream-ready', (stream) =>
+      console.log "Stream is ready", stream
+      @addStream(stream)
+
     @attach()
 
+  addStream: (stream) ->
+    return unless stream
+    @video[0].src = URL.createObjectURL(stream)
+
   updateParticipants: (participants) ->
     @participants.empty()
     hostId = @hostSession.getId()

src/packages/collaboration/stylesheets/collaboration.less

@@ -29,4 +29,8 @@
     width: @width;
     margin: 2px;
   }
+
+  video {
+    width: @width;
+  }
 }