Make global variables part of window in basicExample (lynckia#1605)

Arri98 · Jun 30, 2020 · b7ad34e · b7ad34e
1 parent e2996a9
commit b7ad34e
Showing 1 changed file with 33 additions and 33 deletions.
diff --git a/extras/basic_example/public/script.js b/extras/basic_example/public/script.js
@@ -5,10 +5,10 @@
 /* eslint-disable no-param-reassign, no-console */
 
 const serverUrl = '/';
-let localStream;
-let room;
-let recording;
-let recordingId;
+window.localStream = undefined;
+window.room = undefined;
+window.recording = false;
+window.recordingId = '';
 
 const getParameterByName = (name) => {
   // eslint-disable-next-line
@@ -26,15 +26,15 @@ const testConnection = () => {
 
 // eslint-disable-next-line no-unused-vars
 function startRecording() {
-  if (room !== undefined) {
-    if (!recording) {
-      room.startRecording(localStream, (id) => {
-        recording = true;
-        recordingId = id;
+  if (window.room !== undefined) {
+    if (!window.recording) {
+      window.room.startRecording(window.localStream, (id) => {
+        window.recording = true;
+        window.recordingId = id;
       });
     } else {
-      room.stopRecording(recordingId);
-      recording = false;
+      window.room.stopRecording(window.recordingId);
+      window.recording = false;
     }
   }
 }
@@ -43,13 +43,13 @@ let slideShowMode = false;
 
 // eslint-disable-next-line no-unused-vars
 function toggleSlideShowMode() {
-  const streams = room.remoteStreams;
+  const streams = window.room.remoteStreams;
   const cb = (evt) => {
     console.log('SlideShowMode changed', evt);
   };
   slideShowMode = !slideShowMode;
   streams.forEach((stream) => {
-    if (localStream.getID() !== stream.getID()) {
+    if (window.localStream.getID() !== stream.getID()) {
       console.log('Updating config');
       stream.updateConfiguration({ slideShowMode }, cb);
     }
@@ -61,7 +61,7 @@ const startBasicExample = () => {
   document.getElementById('slideShowMode').disabled = false;
   document.getElementById('startWarning').hidden = true;
   document.getElementById('startButton').hidden = true;
-  recording = false;
+  window.recording = false;
   const screen = getParameterByName('screen');
   const roomName = getParameterByName('room') || 'basicExampleRoom';
   const singlePC = getParameterByName('singlePC') || false;
@@ -85,7 +85,7 @@ const startBasicExample = () => {
     config.extensionId = 'okeephmleflklcdebijnponpabbmmgeo';
   }
   Erizo.Logger.setLogLevel(Erizo.Logger.INFO);
-  localStream = Erizo.Stream(config);
+  window.localStream = Erizo.Stream(config);
   const createToken = (roomData, callback) => {
     const req = new XMLHttpRequest();
     const url = `${serverUrl}createToken/`;
@@ -110,7 +110,7 @@ const startBasicExample = () => {
   createToken(roomData, (response) => {
     const token = response;
     console.log(token);
-    room = Erizo.Room({ token });
+    window.room = Erizo.Room({ token });
 
     const subscribeToStreams = (streams) => {
       if (autoSubscribe) {
@@ -124,31 +124,31 @@ const startBasicExample = () => {
       };
 
       streams.forEach((stream) => {
-        if (localStream.getID() !== stream.getID()) {
-          room.subscribe(stream, { slideShowMode, metadata: { type: 'subscriber' }, offerFromErizo });
+        if (window.localStream.getID() !== stream.getID()) {
+          window.room.subscribe(stream, { slideShowMode, metadata: { type: 'subscriber' }, offerFromErizo });
           stream.addEventListener('bandwidth-alert', cb);
         }
       });
     };
 
-    room.addEventListener('room-connected', (roomEvent) => {
+    window.room.addEventListener('room-connected', (roomEvent) => {
       const options = { metadata: { type: 'publisher' } };
       const enableSimulcast = getParameterByName('simulcast');
       if (enableSimulcast) options.simulcast = { numSpatialLayers: 2 };
       subscribeToStreams(roomEvent.streams);
 
       if (!onlySubscribe) {
-        room.publish(localStream, options);
+        window.room.publish(window.localStream, options);
       }
-      room.addEventListener('quality-level', (qualityEvt) => {
+      window.room.addEventListener('quality-level', (qualityEvt) => {
         console.log(`New Quality Event, connection quality: ${qualityEvt.message}`);
       });
       if (autoSubscribe) {
-        room.autoSubscribe({ '/attributes/type': 'publisher' }, {}, { audio: true, video: true, data: false }, () => {});
+        window.room.autoSubscribe({ '/attributes/type': 'publisher' }, {}, { audio: true, video: true, data: false }, () => {});
       }
     });
 
-    room.addEventListener('stream-subscribed', (streamEvent) => {
+    window.room.addEventListener('stream-subscribed', (streamEvent) => {
       const stream = streamEvent.stream;
       const div = document.createElement('div');
       div.setAttribute('style', 'width: 320px; height: 240px;float:left;');
@@ -158,17 +158,17 @@ const startBasicExample = () => {
       stream.show(`test${stream.getID()}`);
     });
 
-    room.addEventListener('stream-added', (streamEvent) => {
+    window.room.addEventListener('stream-added', (streamEvent) => {
       const streams = [];
       streams.push(streamEvent.stream);
-      if (localStream) {
-        localStream.setAttributes({ type: 'publisher' });
+      if (window.localStream) {
+        window.localStream.setAttributes({ type: 'publisher' });
       }
       subscribeToStreams(streams);
       document.getElementById('recordButton').disabled = false;
     });
 
-    room.addEventListener('stream-removed', (streamEvent) => {
+    window.room.addEventListener('stream-removed', (streamEvent) => {
       // Remove stream from DOM
       const stream = streamEvent.stream;
       if (stream.elementID !== undefined) {
@@ -177,23 +177,23 @@ const startBasicExample = () => {
       }
     });
 
-    room.addEventListener('stream-failed', () => {
+    window.room.addEventListener('stream-failed', () => {
       console.log('Stream Failed, act accordingly');
     });
 
     if (onlySubscribe) {
-      room.connect({ singlePC });
+      window.room.connect({ singlePC });
     } else {
       const div = document.createElement('div');
       div.setAttribute('style', 'width: 320px; height: 240px; float:left');
       div.setAttribute('id', 'myVideo');
       document.getElementById('videoContainer').appendChild(div);
 
-      localStream.addEventListener('access-accepted', () => {
-        room.connect({ singlePC });
-        localStream.show('myVideo');
+      window.localStream.addEventListener('access-accepted', () => {
+        window.room.connect({ singlePC });
+        window.localStream.show('myVideo');
       });
-      localStream.init();
+      window.localStream.init();
     }
   });
 };