lombardo

apps/rpc.js

@@ -7,6 +7,21 @@ function uuidv4() {
   )
 }
 
+function rpcStatusCheck() {
+    console.table(Object.values(allRPCs).map(({target, kind, rpc}) =>
+        ({target, kind, status: rpc.iceConnectionState})
+    ))
+}
+
+function rpcCleanUp(kind, target) {
+    for([uid, info] of Object.entries(allRPCs)) {
+        if(info.kind === kind && info.target === target) {
+            info.rpc.close()
+            delete allRPCs[uid]
+        }
+    }
+}
+
 addEventListener('rpc-needed', ({detail}) => {
     const {kind, target} = detail.value
     const isInitiatedLocally = !detail.source
@@ -19,18 +34,19 @@ addEventListener('rpc-needed', ({detail}) => {
         }
     }
     rpc.ontrack = ({streams: [stream]}) => {
-        stream.getTracks().forEach(track =>
+        stream.getTracks().forEach(track => {
             allRPCs[uid].receiver.addTrack(track, stream)
-        )
+        })
     }
     rpc.oniceconnectionstatechange = (e) => {
-        console.log(rpc.iceConnectionState)
+        console.log(`${target} ${kind} ${rpc.iceConnectionState}`)
     }
     rpc.onnegotiationneeded = (e) => {
         // if(isInitiatedLocally) {
             // signal({kind: 'rpc-initiate', value: {uid}})
         // }
     }
+    rpcCleanUp(kind, target)
     allRPCs[uid] = {kind, target, rpc, isInitiatedLocally}
     signal({kind: 'rpc-new', value: {kind, target, uid}})
     if(isInitiatedLocally) {
@@ -40,16 +56,20 @@ addEventListener('rpc-needed', ({detail}) => {
 
 addEventListener('rpc-setup', async ({detail}) => {
     const {uid, sender, receiver} = detail.value
+    const {rpc, isInitiatedLocally, hasOffer} = allRPCs[uid]
     allRPCs[uid].sender = sender
     allRPCs[uid].receiver = receiver
-
     if(sender) {
-        sender.getTracks().forEach(tr => allRPCs[uid].rpc.addTrack(tr, sender))
+        sender.getTracks().forEach(tr => rpc.addTrack(tr, sender))
     }
+    allRPCs[uid].isSetup = true
 
-    if(allRPCs[uid].isInitiatedLocally) {
+    if(isInitiatedLocally) {
         signal({kind: 'rpc-initiate', value: {uid}})
     }
+    else if(hasOffer) {
+        signal({kind: 'rpc-respond', value: {uid}})
+    }
 })
 
 addEventListener('rpc-initiate', async({detail}) => {
@@ -64,9 +84,20 @@ addEventListener('rpc-initiate', async({detail}) => {
 
 addEventListener('rpc-offer', async ({detail}) => {
     const {uid} = detail.value
-    const {rpc, target} = allRPCs[uid]
+    const {rpc, isSetup} = allRPCs[uid]
 
     await rpc.setRemoteDescription(detail.value)
+    allRPCs[uid].hasOffer = true
+
+    if(isSetup) {
+        signal({kind: 'rpc-respond', value: {uid}})
+    }
+})
+
+addEventListener('rpc-respond', async({detail}) => {
+    const {uid} = detail.value
+    const {rpc, target} = allRPCs[uid]
+
     const localAnswer = await rpc.createAnswer()
     await rpc.setLocalDescription(localAnswer)
 

apps/video.js

@@ -45,9 +45,12 @@ const Video = {
 }
 const Toggle = {
     view({attrs: {key, label}}) {
-        const onclick = () => {
+        const onclick = async () => {
             VideoShare[key] = !VideoShare[key]
-            VideoShare.getStream()
+            await VideoShare.getStream()
+            State.others.forEach(target =>
+                signal({kind: 'rpc-needed', value: {kind: 'video', target}})
+            )
         }
         const checked = VideoShare[key]
         return m('label.styled',
@@ -94,9 +97,9 @@ const VideoShare = {
             .catch(error => console.error(error))
             .then(stream => {VideoShare.streams[State.username] = stream})
         m.redraw()
-        State.others.forEach(target =>
+        State.others.forEach(target => {
             signal({kind: 'rpc-needed', value: {kind: 'video', target}})
-        )
+        })
     },
     view() {
         const dims = [
@@ -117,9 +120,6 @@ const VideoShare = {
         )
     },
 }
-addEventListener('join', ({detail: {value: target}}) => {
-    signal({kind: 'rpc-needed', value: {kind: 'video', target}})
-})
 addEventListener('load', () => {
     Headers.push([VideoShareConfig])
     Apps.push([VideoShare, {key: 'stream-container'}])

pico.js

@@ -65,14 +65,14 @@ const connect = (username) => {
         const message = JSON.parse(e.data)
 
         if(message.online) {
-            const difference = (l1, l2) => l1.filter(u => !l2.includes(u))
-            difference(message.online, State.online).forEach(username => {
-                if(username === State.username) return
+            const isNew = (username) => !State.online.includes(username)
+            const isGone = (username) => !message.online.includes(username)
+            const isAfter = (_, idx, ll) => ll.indexOf(State.username) < idx
+            message.online.filter(isNew).filter(isAfter).forEach(username => {
                 signal({kind: 'post', ts: message.ts, value: `${username} joined`})
                 signal({kind: 'join', value: username})
             })
-            difference(State.online, message.online).forEach(username => {
-                if(username === State.username) return
+            State.online.filter(isGone).forEach(username => {
                 signal({kind: 'post', ts: message.ts, value: `${username} left`})
                 signal({kind: 'leave', value: username})
             })