Update gh-pages

website/index.html

@@ -32,6 +32,72 @@
     <input id="pwd" type="text" placeholder="password">
     <button id="connect">connect</button>
 </div>
+<script>
+    async function PeerConnection(media) {
+        const pc = new RTCPeerConnection({
+            iceServers: [{urls: 'stun:stun.l.google.com:19302'}]
+        })
+
+        const localTracks = []
+
+        if (/camera|microphone/.test(media)) {
+            const tracks = await getMediaTracks('user', {
+                video: media.indexOf('camera') >= 0,
+                audio: media.indexOf('microphone') >= 0,
+            })
+            tracks.forEach(track => {
+                pc.addTransceiver(track, {direction: 'sendonly'})
+                if (track.kind === 'video') localTracks.push(track)
+            })
+        }
+
+        if (media.indexOf('display') >= 0) {
+            const tracks = await getMediaTracks('display', {
+                video: true,
+                audio: media.indexOf('speaker') >= 0,
+            })
+            tracks.forEach(track => {
+                pc.addTransceiver(track, {direction: 'sendonly'})
+                if (track.kind === 'video') localTracks.push(track)
+            })
+        }
+
+        if (/video|audio/.test(media)) {
+            const tracks = ['video', 'audio']
+                .filter(kind => media.indexOf(kind) >= 0)
+                .map(kind => pc.addTransceiver(kind, {direction: 'recvonly'}).receiver.track)
+            localTracks.push(...tracks)
+        }
+
+        document.getElementById('video').srcObject = new MediaStream(localTracks)
+
+        return pc
+    }
+
+    async function getMediaTracks(media, constraints) {
+        try {
+            const stream = media === 'user'
+                ? await navigator.mediaDevices.getUserMedia(constraints)
+                : await navigator.mediaDevices.getDisplayMedia(constraints)
+            return stream.getTracks()
+        } catch (e) {
+            console.warn(e)
+            return []
+        }
+    }
+
+    function getOffer(pc, timeout) {
+        return new Promise((resolve, reject) => {
+            pc.addEventListener('icegatheringstatechange', () => {
+                if (pc.iceGatheringState === 'complete') resolve(pc.localDescription.sdp)
+            })
+
+            pc.createOffer().then(offer => pc.setLocalDescription(offer))
+
+            setTimeout(() => resolve(pc.localDescription.sdp), timeout || 5000)
+        })
+    }
+</script>
 <script>
     function decode(buffer) {
         return String.fromCharCode(...new Uint8Array(buffer))
@@ -70,45 +136,12 @@
             }
         }
     }
-
+</script>
-    function PeerConnection() {
+<script>
-        return new Promise((resolve, reject) => {
+    async function connect(share, pwd, media, tracker) {
-            const pc = new RTCPeerConnection({
-                iceServers: [{urls: 'stun:stun.l.google.com:19302'}]
-            })
-
-            pc.addEventListener('icegatheringstatechange', () => {
-                if (pc.iceGatheringState === 'complete') resolve(pc)
-            })
-
-            pc.addEventListener('track', ev => {
-                const video = document.getElementById('video')
-
-                // when audio track not exist in Chrome
-                if (ev.streams.length === 0) return
-
-                // when audio track not exist in Firefox
-                if (ev.streams[0].id[0] === '{') return
-
-                // when stream already init
-                if (video.srcObject !== null) return
-
-                video.srcObject = ev.streams[0]
-            })
-
-            pc.addTransceiver('video', {direction: 'recvonly'})
-            pc.addTransceiver('audio', {direction: 'recvonly'})
-
-            pc.createOffer().then(offer => pc.setLocalDescription(offer))
-
-            setTimeout(() => resolve(pc), 3000)
-        })
-    }
-
-    async function connect(share, pwd, tracker) {
         const crypto = await cipher(share, pwd)
-        const pc = await PeerConnection()
+        const pc = await PeerConnection(media || 'video+audio')
-        const offer = await crypto.encrypt(pc.localDescription.sdp)
+        const offer = await crypto.encrypt(await getOffer(pc))
 
         const ws = new WebSocket(tracker || 'wss://tracker.openwebtorrent.com/')
         ws.addEventListener('open', () => {
@@ -146,8 +179,9 @@
         const params = new URLSearchParams(location.hash.substring(1))
         const share = params.get('share')
         const pwd = params.get('pwd')
+        const media = params.get('media')
         const tracker = params.get('tr')
-        connect(share, pwd, tracker)
+        connect(share, pwd, media, tracker)
         document.getElementById('login').style.display = 'none'
     }
 </script>