Browse Source

Examples: Enhanced media-receiver example

Paul-Louis Ageneau 3 years ago
parent
commit
464c4882e7
1 changed files with 12 additions and 10 deletions
  1. 12 10
      examples/media-receiver/main.html

+ 12 - 10
examples/media-receiver/main.html

@@ -12,32 +12,34 @@
 
 
 <script>
 <script>
     document.querySelector('button').addEventListener('click',  async () => {
     document.querySelector('button').addEventListener('click',  async () => {
-        let offer = JSON.parse(document.querySelector('textarea').value);
-        rtc = new RTCPeerConnection({
+        const offer = JSON.parse(document.querySelector('textarea').value);
+        const pc = new RTCPeerConnection({
             // Recommended for libdatachannel
             // Recommended for libdatachannel
             bundlePolicy: "max-bundle",
             bundlePolicy: "max-bundle",
         });
         });
 
 
-        rtc.onicegatheringstatechange = (state) => {
-            if (rtc.iceGatheringState === 'complete') {
+        pc.onicegatheringstatechange = (state) => {
+            if (pc.iceGatheringState === 'complete') {
                 // We only want to provide an answer once all of our candidates have been added to the SDP.
                 // We only want to provide an answer once all of our candidates have been added to the SDP.
-                let answer = rtc.localDescription;
+                const answer = pc.localDescription;
                 document.querySelector('textarea').value = JSON.stringify({"type": answer.type, sdp: answer.sdp});
                 document.querySelector('textarea').value = JSON.stringify({"type": answer.type, sdp: answer.sdp});
                 document.querySelector('p').value = 'Please paste the answer in the receiver application.';
                 document.querySelector('p').value = 'Please paste the answer in the receiver application.';
                 alert('Please paste the answer in the receiver application.');
                 alert('Please paste the answer in the receiver application.');
             }
             }
         }
         }
-        await rtc.setRemoteDescription(offer);
 
 
-        let media = await navigator.mediaDevices.getUserMedia({
+        await pc.setRemoteDescription(offer);
+
+        const media = await navigator.mediaDevices.getUserMedia({
             video: {
             video: {
                 width: 1280,
                 width: 1280,
                 height: 720
                 height: 720
             }
             }
         });
         });
-        media.getTracks().forEach(track => rtc.addTrack(track, media));
-        let answer = await rtc.createAnswer();
-        await rtc.setLocalDescription(answer);
+        media.getTracks().forEach(track => pc.addTrack(track, media));
+
+        const answer = await pc.createAnswer();
+        await pc.setLocalDescription(answer);
     })
     })
 </script>
 </script>