Merged in pre-prod-2-0 (pull request #387)

Release 2.2.0
Temasys · Jan 11, 2021 · 71ce9e8 · 71ce9e8
2 parents ca9a78e + 068e824
commit 71ce9e8
Show file tree

Hide file tree

Showing 530 changed files with 7,003 additions and 3,725 deletions.
diff --git a/README.md b/README.md
@@ -1,12 +1,12 @@
-# SKYLINK WEB SDK 2.1.5
+# SKYLINK WEB SDK 2.2.0
 > Temasys SkylinkJS Web SDK is an open-source client-side library for your web-browser that enables any website to easily leverage the capabilities of WebRTC and its direct data streaming powers between peers for audio/video conferencing or file transfer.
 
 You'll need a Temasys Account, and an App key to use this. [Register here to get your App key](https://console.temasys.io).
 
 #### Supported Browsers
 | Features                      | Chrome                   | Firefox                  | Safari                   | Edge (Chromium) | 
 |-------------------------------|--------------------------|--------------------------|--------------------------|-----------------|
-| Platforms:                    | Win, Mac, Linux, Android | Win, Mac, Linux, Android | Mac                      | Win, Mac        |
+| Platforms:                    | Win, Mac, Linux, Android | Win, Mac, Linux, Android | Mac, iOS                 | Win, Mac        |
 | Minimum Recommended Versions: | 72                       | 66                       | 13                       | 80              |
 | Screensharing                 | Yes                      | Yes                      | Yes                      | Yes             |
 | Video Call                    | Yes                      | Yes                      | Yes                      | Yes             |
@@ -35,7 +35,7 @@ You'll need a Temasys Account, and an App key to use this. [Register here to get
 #### Current versions and stability
 - We recommend that you always use the latest versions of the Temasys SkylinkJS Web SDK as WebRTC is still evolving and we adapt to changes very frequently.
 
-[Latest version: 2.1.5](https://github.com/Temasys/SkylinkJS/releases/tag/2.1.5)
+[Latest version: 2.2.0](https://github.com/Temasys/SkylinkJS/releases/tag/2.2.0)
 
 
 ## How to build your own Temasys SkylinkJS Web SDK

diff --git a/bitbucket-pipelines.yml b/bitbucket-pipelines.yml
@@ -8,7 +8,7 @@ pipelines:
            - npm install
            - npm run build
   branches:
-    staging-2-0:
+    "{staging-2-0,pre-prod-2-0}":
     - step:
           name: Build and Test
           script:

diff --git a/configs/app.js b/configs/app.js
@@ -1,22 +1,22 @@
 const config = {
-  apiBase: 'https://api.temasys.io',
   stats: {
     endPoints: {
       client: '/client',
       session: '/session',
       auth: '/auth',
-      signaling: '/signaling',
+      signaling: '/client/signaling',
       iceConnection: '/client/iceconnection',
       iceCandidate: '/client/icecandidate',
       iceGathering: '/client/icegathering',
       negotiation: '/client/negotiation',
       bandwidth: '/client/bandwidth',
       recording: '/client/recording',
       dataChannel: '/client/datachannel',
+      userMedia: '/client/usermedia',
     },
   },
 };
 
-config.stats.statsBase = `${config.apiBase}/rest/stats`;
+config.stats.statsBase = '/rest/stats';
 
 export default config;
diff --git a/configs/rollup/rollup.dev.config.js b/configs/rollup/rollup.dev.config.js
@@ -5,6 +5,7 @@ import commonJS from 'rollup-plugin-commonjs';
 import { terser } from 'rollup-plugin-terser';
 import externalGlobals from 'rollup-plugin-external-globals';
 import del from 'rollup-plugin-delete';
+import replace from '@rollup/plugin-replace';
 import paths from '../paths';
 import pkg from '../../package.json';
 import CONSTANTS from './constants';
@@ -58,6 +59,9 @@ const config = {
     warn(warning);
   },
   plugins: [
+    replace({
+      __sdkVersion__: JSON.stringify(pkg.version),
+    }),
     resolve({
       only: ['webrtc-adapter', 'clone', 'crypto-js', 'sdp', 'rtcpeerconnection-shim'],
     }),

diff --git a/demos/collection/config.example.js b/demos/collection/config.example.js
@@ -3,6 +3,12 @@
  Save your api settings like appKey, defaultRoom and room and save it
  in a file called [config.js]
  *********************************************************************/
+
+let APPKEYS = {
+  P2P: 'XXX-XXX-XXX-XXX-XXX',
+  MCU: 'XXX-XXX-XXX-XXX-XXX'
+};
+
 function getParameterByName(name, url) {
   if (!url) url = window.location.href;
   name = name.replace(/[\[\]]/g, "\\$&");
@@ -18,7 +24,7 @@ if (!getParameterByName('room')) {
 }
 
 const config = {
-  appKey: getParameterByName('appKey') || 'XXX-XXX-XXX-XXX-XXX',
+  appKey: getParameterByName('appKey') || APPKEYS.P2P,
   defaultRoom: getParameterByName('room'),
   enableIceTrickle: !getParameterByName('enableIceTrickle'),
   audioFallback: !!getParameterByName('audioFallback'),
@@ -44,4 +50,4 @@ if (secret) {
   };
 }
 
-export default config;
+export { config, APPKEYS };
diff --git a/demos/collection/kitchensink/main.js b/demos/collection/kitchensink/main.js
@@ -1,6 +1,6 @@
 /* eslint-disable import/extensions */
 import Skylink, { SkylinkLogger, SkylinkEventManager, SkylinkConstants } from '../../../build/skylink.complete.js';
-import config from '../config.js';
+import { config, APPKEYS } from '../config.js';
 
 /********************************************************
   API Settings
@@ -19,16 +19,17 @@ Demo.isMCU = false;
 
 
 window.Demo = Demo;
-const APPKEYS = {
-  p2p: 'c7ae7e8a-2e24-43a5-85c6-d4dafbdfecb6',
-  mcu: '6198a7fa-b8b0-4b0a-8079-4642198c8601',
-};
 let selectedPeers = [];
 let _peerId = null;
 let selectedAppKey = null;
 
 const { $, document } = window;
 
+if (window.location.href.indexOf("appKey=") > -1) {
+  $('#join_room_p2p_key').prop('disabled', true);
+  $('#join_room_mcu_key').prop('disabled', true);
+}
+
 //----- join room options
 const displayName = `name_user_${  Math.floor((Math.random() * 1000) + 1)}`;
 $('#display_user_info').val(displayName);
@@ -38,6 +39,16 @@ const joinRoomOptions = {
   userData: displayName,
 };
 
+if (config.bandwidth && config.bandwidth.video) {
+  joinRoomOptions.bandwidth = joinRoomOptions.bandwidth || {};
+  joinRoomOptions.bandwidth.video = parseInt(config.bandwidth.video);
+}
+
+if (config.bandwidth && config.bandwidth.audio) {
+  joinRoomOptions.bandwidth = joinRoomOptions.bandwidth || {};
+  joinRoomOptions.bandwidth.audio = parseInt(config.bandwidth.audio);
+}
+
 //----- set logging -----
 SkylinkLogger.setLevel(SkylinkLogger.logLevels.DEBUG, true);
 
@@ -239,17 +250,6 @@ SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.PEER_JOINED, (evt)
     newListEntry += '</td></tr>';
     $('#presence_list').append(newListEntry);
     $('#user' + peerId + ' .0').css('color', 'green');
-
-    // LOGGING
-    setTimeout(() => {
-      console.log("***** START *****")
-      console.log("getPeersCustomSettings", Demo.Skylink.getPeersCustomSettings(config.defaultRoom));
-      console.log("getPeerInfo", Demo.Skylink.getPeerInfo(config.defaultRoom, peerId));
-      console.log("getPeersDataChannels", Demo.Skylink.getPeersDataChannels(config.defaultRoom));
-      console.log("getStreams", Demo.Skylink.getStreams(config.defaultRoom));
-      console.log("getUserData", Demo.Skylink.getUserData(config.defaultRoom));
-      console.log("***** END *****")
-    }, 5000);
   }
 
   // create the peer video element
@@ -471,7 +471,7 @@ SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.STREAM_ENDED, (evt)
       screenElm.parentNode.removeChild(screenElm);
     }
 
-  Demo.Methods.updateStreams();
+  setTimeout(Demo.Methods.updateStreams, 1000);
 });
 
 SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.STREAM_MUTED, (evt) => {
@@ -489,10 +489,6 @@ SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.ROOM_LOCK, (evt) =>
   Demo.Methods.logToConsoleDOM(`Room is ${(isLocked ? 'locked' : 'unlocked')}`);
 });
 
-SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.ROOM_REJOIN, (evt) => {
-  Demo.Skylink.joinRoom(joinRoomOptions)
-});
-
 // //---------------------------------------------------
 // // MESSAGING EVENTS
 // //---------------------------------------------------
@@ -549,15 +545,54 @@ SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.STORED_MESSAGES, (e
 });
 
 // //---------------------------------------------------
-// // RECONNECT
+// // SOCKET EVENTS
 // //---------------------------------------------------
+SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.SESSION_DISCONNECT, (evt) => {
+  Demo.Methods.logToConsoleDOM(`SOCKET_SESSION_DISCONNECTED - ${evt.detail.reason}`, 'error');
+  let onlineInterval = null;
+  const reconnect = () => {
+    if (window.navigator.onLine) {
+      clearInterval(onlineInterval);
+      Demo.Methods.logToConsoleDOM(`Online now. Attempting to join room.`, 'info');
+      Demo.Skylink.leaveRoom(config.defaultRoom)
+      .then(() => {
+        Demo.Peers = 0;
+        Demo.PeerIds = [];
+        Demo.Skylink.joinRoom(joinRoomOptions)
+      })
+      .catch((err) =>{
+        Demo.Methods.logToConsoleDOM(`Failed to reconnect`, 'error');
+      })
+    } else {
+      Demo.Methods.logToConsoleDOM(`Still offline...`, 'error');
+    }
+  }
+
+  if (!onlineInterval) {
+    onlineInterval = setInterval(reconnect, 1000);
+  }
+});
+
+SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.CHANNEL_ERROR, (evt) => {
+  const eventDetail = evt.detail;
+  const { error } = eventDetail;
+  Demo.Methods.logToConsoleDOM(`CHANNEL_ERROR - ${error}`, 'error');
+});
+
+SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.SOCKET_ERROR, (evt) => {
+  const eventDetail = evt.detail;
+  const { error, errorCode } = eventDetail;
+  Demo.Methods.logToConsoleDOM(`CHANNEL_ERROR - ${errorCode} - ${error}`, 'error');
+});
+
+SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.CHANNEL_RETRY, (evt) => {
+  const eventDetail = evt.detail;
+  const { currentAttempt } = eventDetail;
+  Demo.Methods.logToConsoleDOM(`CHANNEL_RETRY - ${currentAttempt}`, 'error');
+});
+
 SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.CHANNEL_REOPEN, (evt) => {
-  Demo.Skylink.leaveRoom(config.defaultRoom)
-  .then(() => {
-    Demo.Peers = 0;
-    Demo.PeerIds = [];
-    Demo.Skylink.joinRoom(joinRoomOptions)
-  })
+  Demo.Methods.logToConsoleDOM(`CHANNEL_REOPEN`, 'info');
 });
 
 // //---------------------------------------------------
@@ -619,6 +654,12 @@ SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.ICE_CONNECTION_STAT
   }
   $(`#user${peerId} .${5}`).css('color', color);
 
+  if (state === SkylinkConstants.ICE_CONNECTION_STATE.FAILED || state === SkylinkConstants.ICE_CONNECTION_STATE.DISCONNECTED || state === SkylinkConstants.ICE_CONNECTION_STATE.CLOSED) {
+    Demo.Methods.logToConsoleDOM(`ICE_CONNECTION_STATE - ${state}`, 'error');
+  } else {
+    Demo.Methods.logToConsoleDOM(`ICE_CONNECTION_STATE - ${state}`, 'info');
+  }
+
   if (state === SkylinkConstants.ICE_CONNECTION_STATE.CHECKING) {
     setTimeout(() => {
       if ($(`#user${peerId} .${5}`).css('color') === 'orange') {
@@ -643,6 +684,7 @@ SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.CANDIDATE_GENERATIO
 SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.PEER_CONNECTION_STATE, (evt) => {
   const { peerId, state } = evt.detail;
   let color = 'red';
+
   switch (state) {
     case SkylinkConstants.PEER_CONNECTION_STATE.HAVE_LOCAL_OFFER:
     case SkylinkConstants.PEER_CONNECTION_STATE.HAVE_REMOTE_OFFER:
@@ -657,7 +699,14 @@ SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.PEER_CONNECTION_STA
       color = 'green';
       break;
   }
+
   $(`#user${peerId} .${6}`).css('color', color);
+
+  if (state === SkylinkConstants.PEER_CONNECTION_STATE.FAILED || state === SkylinkConstants.PEER_CONNECTION_STATE.DISCONNECTED || state === SkylinkConstants.PEER_CONNECTION_STATE.CLOSED) {
+    Demo.Methods.logToConsoleDOM(`PEER_CONNECTION_STATE - ${state}`, 'error');
+  } else {
+    Demo.Methods.logToConsoleDOM(`PEER_CONNECTION_STATE - ${state}`, 'info');
+  }
 });
 
 SkylinkEventManager.addEventListener(SkylinkConstants.EVENTS.DATA_CHANNEL_STATE, (evt) => {
@@ -981,14 +1030,14 @@ $(document).ready(function() {
         video: true,
       };
 
-    if (Demo.Streams && Demo.Streams[_peerId] && (Demo.Streams[_peerId].streams.video)) {
-      const clonedVideoStream = Object.values(Demo.Streams[_peerId].streams.video)[0].clone();
-      console.log("Cloned mediaStream", clonedVideoStream);
+    if (Demo.Streams && Demo.Streams[_peerId] && (Demo.Streams[_peerId].streams.audio || Demo.Streams[_peerId].streams.video)) {
       Demo.Skylink.stopStreams(config.defaultRoom)
-      .then(() => startSendStream(clonedVideoStream))
+      .then(() => startSendStream(mediaOptions))
       .catch((err) => console.error("stopStreams rejected", err));
     } else {
-      startSendStream(mediaOptions);
+      console.log("sending as prefetched stream");
+      Demo.Skylink.getUserMedia(mediaOptions)
+      .then((streams) => startSendStream(streams[1]));
     }
   });
   //---------------------------------------------------
@@ -1143,8 +1192,10 @@ $(document).ready(function() {
     console.log(appKey);
     if (appKey === 'mcu') {
       Demo.isMCU = true;
+      appKey = 'MCU';
     } else {
       Demo.isMCU = false;
+      appKey = 'P2P';
     }
     selectedAppKey = APPKEYS[appKey];
     $('#display_app_id').html(selectedAppKey);