@reactoo/watchtogether-sdk-js 2.4.40 → 2.5.0

package/src/modules/wt-iot.js

@@ -1,14 +1,18 @@
-import Paho from 'paho-mqtt';
+
+import {device} from 'aws-iot-device-sdk';
 import emitter from './wt-emitter';
 
 class Iot {
     
     constructor(enableDebugFlag) {
         Object.assign(this, emitter());
-        this.debug = enableDebugFlag;
-        this.instance = null;
-        this.promise = null;
+        this.device = null;
+        this.decoder = new TextDecoder('utf-8');
+        this.connectionActive = false;
         this.log = Iot.noop;
+        this.debugFlag = enableDebugFlag;
+        this.credentialsExpirationCheckIntervalId = null;
+        this.currentCredentialsExpirationStamp = null
         if(enableDebugFlag) {
             this.enableDebug();
         }
@@ -20,101 +24,141 @@ class Iot {
         this.log = console.log.bind(console);
     }
     
-    connect(apiMqttUrl, apiMqttClientId, timeout = 5, mqttVersion, useSSL) {
-        return this.promise = this.disconnect()
-            .then(() => {
-                this.instance = new Paho.Client(apiMqttUrl, apiMqttClientId);
-                this.instance.connect({
-                    onSuccess: this.__connectCb.bind(this),
-                    onFailure: this.__failureCb.bind(this),
-                    useSSL,
-                    timeout,
-                    mqttVersion,
-                    keepAliveInterval: 15,
-                    reconnect: false
-                });
-                this.instance.onConnectionLost = this.__closeCb.bind(this);
-                this.instance.onMessageArrived = this.__messageCb.bind(this);
-                return new Promise((resolve, reject) => {
-                    let __ = () => {
-                        this.off('connected', __);
-                        this.off('error', ___);
-                        this.off('disconnected', ___);
-                        resolve(this.instance)
-                    };
-                    
-                    let ___ = (e) => {
-                        this.off('connected', __);
-                        this.off('error', ___);
-                        this.off('disconnected', ___);
-                        reject(e)
-                    };
-                    
-                    this.on('connected', __);
-                    this.on('error', ___);
-                    this.on('disconnected', ___);
-                });
-            });
+    startCredentialsExpirationCheck(expiration) {
+        this.stopCredentialsExpirationCheck();
+        this.currentCredentialsExpirationStamp = new Date(expiration).getTime();
+        this.credentialsExpirationCheckIntervalId = setInterval(() => {
+            const curentTimeStamp = new Date().getTime();
+            if(this.currentCredentialsExpirationStamp - curentTimeStamp <= 300000) {
+                this.emit('updateCredentials');
+            }
+        }, 5000);
     }
     
-    disconnect() {
-        if(!this.instance) {
-            this.log('No Paho instance');
-            return this.promise = Promise.resolve(this.instance);
-        }
-        if(!this.instance.isConnected()) {
-            this.log('Paho instance not connected');
-            return this.promise = Promise.resolve(this.instance);
+    stopCredentialsExpirationCheck() {
+        clearInterval(this.credentialsExpirationCheckIntervalId);
+        this.credentialsExpirationCheckIntervalId = null;
+    }
+    
+    updateWebSocketCredentials(accessKeyId, secretAccessKey, sessionToken, expiration) {
+        if(this.device) {
+            this.device.updateWebSocketCredentials(accessKeyId, secretAccessKey, sessionToken);
+            this.startCredentialsExpirationCheck(expiration);
         }
+    }
+    
+    connect(apiMqttUrl, apiMqttClientId, region, accessKeyId, secretAccessKey, sessionToken, expiration, forceDisconnect = false) {
+        return this.disconnect(forceDisconnect).then(() => {
+            return new Promise((resolve, reject) => {
+                this.device = device({
+                    protocol:'wss',
+                    clientId: apiMqttClientId,
+                    region,
+                    host: apiMqttUrl,
+                    accessKeyId: accessKeyId,
+                    secretKey: secretAccessKey,
+                    sessionToken: sessionToken,
+                    keepalive: 15,
+                    maximumReconnectTimeMs: 8000,
+                    enableMetrics: false,
+                    debug: this.debugFlag,
+                    autoResubscribe: true
+                });
+                
+                this.startCredentialsExpirationCheck(expiration);
+                
+                let __s = () => {
+                    this.device.off('connect', __s);
+                    this.device.off('error', __e);
+                    resolve(this.device)
+                };
+                
+                let __e = (e) => {
+                    this.device.off('connect', __s);
+                    this.device.off('error', __e);
+                    reject(e);
+                };
+                
+                this.device.once('connect', __s);
+                this.device.once('error', __e);
+                
+                this.device.on('message', this.__messageCb.bind(this));
+                this.device.on('connect', this.__connectCb.bind(this));
+                this.device.on('reconnect', this.__reconnectCb.bind(this));
+                this.device.on('error', this.__failureCb.bind(this));
+                this.device.on('close', this.__closeCb.bind(this));
+                this.device.on('offline', this.__offlineCb.bind(this));
+                
+            })
+        })
         
-        return new Promise((resolve) => {
-            let ___ = () => {
-                this.promise = Promise.resolve(this.instance);
-                this.off('error', ___);
-                this.off('disconnected', ___);
-                resolve(this.instance);
-            };
-            this.on('error', ___);
-            this.on('disconnected', ___);
-            try {
-                this.instance.disconnect();
-            } catch (e) {
-                return resolve(this.instance);
+    }
+    
+    disconnect(force = false) {
+        
+        this.stopCredentialsExpirationCheck();
+        
+        return new Promise((resolve, reject) => {
+            if(!this.device) {
+                resolve();
+                return;
             }
+            let __i = null;
+            let __c = () => {
+                clearTimeout(__i);
+                this.device = null;
+                resolve();
+            };
+            __i = setTimeout(__c, 4000);
+            this.device.off('message', this.__messageCb.bind(this));
+            this.device.off('connect', this.__connectCb.bind(this));
+            this.device.off('reconnect', this.__reconnectCb.bind(this));
+            this.device.off('error', this.__failureCb.bind(this));
+            this.device.off('close', this.__closeCb.bind(this));
+            this.device.off('offline', this.__offlineCb.bind(this));
+            this.device.end(force, __c);
         });
     }
     
     isConnected() {
-        return this.instance && this.instance.isConnected();
+        return this.connectionActive;
     }
     
     subscribe(topic) {
-        return this.instance && this.instance.isConnected() && this.instance.subscribe(topic);
+        return this.device && this.device.subscribe(topic);
     }
     
     unsubscribe(topic) {
-        return this.instance && this.instance.isConnected() && this.instance.unsubscribe(topic);
+        return this.device && this.device.unsubscribe(topic);
     }
     
     send(topic, message) {
-        let msg = new Paho.Message(typeof message === 'object' ? JSON.stringify(message) : message);
-        msg.destinationName = topic;
-        return this.instance && this.instance.send(msg)
+        let msg = typeof message === 'object' ? JSON.stringify(message) : message;
+        return this.device && this.device.publish(topic, msg);
     }
     
+    __reconnectCb() {
+        this.emit('reconnect');
+    }
     __connectCb() {
-        this.emit('connected');
+        this.connectionActive = true;
+        this.emit('connect');
     }
     __failureCb(err) {
         this.emit('error', err);
     }
     __closeCb(responseObject) {
-        this.emit('disconnected', responseObject.errorCode !== 0);
+        this.connectionActive = false;
+        this.emit('close');
     }
-    __messageCb(message) {
+    __offlineCb(responseObject) {
+        this.emit('offline');
+    }
+    
+    __messageCb(t, message, packet) {
         
-        const payload = JSON.parse(message.payloadString);
-        const topic = message.destinationName.split('/');
+        const topic = t.split('/');
+        const payload = JSON.parse(this.decoder.decode(message));
         
         if(topic[0] === 'user') { // user
             const userId = topic[1].replace("_", ':');
@@ -137,7 +181,12 @@ class Iot {
                     event === 'user_update_privateattributes' ||
                     event === 'channel_changed' ||
                     event === "instance_homepage_changed" ||
-                    event === "externalmix_changed"
+                    event === "instance_settings_changed" ||
+                    event === "externalmix_changed" ||
+                    event === "video_uploaded" ||
+                    event === "change_user_devices" ||
+                    event === "queue" ||
+                    event === "title_changed"
                 ) {
                     this.emit('message', {event, ...payload, roomId})
                 }
@@ -154,7 +203,8 @@ class Iot {
                     event === 'unmuted' ||
                     event === 'messageRemoved' ||
                     event === 'messageReported' ||
-                    event === 'chatClear'
+                    event === 'chatClear' ||
+                    event === 'handRaised' || event === 'handLowered' || event === 'handsCleared'
                 ) {
                     this.emit('message', {event, ...payload});
                 }
@@ -163,7 +213,7 @@ class Iot {
                 }
             }
             else if(topic[1] === 'instanceroom') { // instance
-                if(event === 'add_room' || event === 'remove_room' || event === 'set_room' || event === "instance_homepage_changed") {
+                if(event === 'add_room' || event === 'remove_room' || event === 'set_room' || event === "instance_homepage_changed" || event === 'instance_settings_changed') {
                     this.emit('message', {event, ...payload});
                 }
             }

package/src/modules/wt-room.js

@@ -6,87 +6,32 @@ import {generateUUID} from "./wt-utils";
 
 class Room {
 	
-	constructor(enableDebugFlag) {
-		
+	constructor(debug) {
+		this.debug = debug;
 		this.sessions = [];
 		this.safariVp8 = false;
 		this.browser = adapter.browserDetails.browser;
 		this.browserDetails = adapter.browserDetails;
-		this.initialized = false;
-		this.log = Room.noop;
-		this.enableDebugFlag = enableDebugFlag;
-		if (enableDebugFlag) {
-			this.enableDebug();
-		}
-		
+
+		this.isWebrtcSupported = Room.isWebrtcSupported();
+		this.safariVp8TestPromise = Room.testSafariVp8();
+
+		this.safariVp8 = null;
+		this.safariVp8TestPromise.then(safariVp8 => {
+			this.safariVp8 = safariVp8;
+		})
+
 		// Let's get it started
-		this.isReady = this.initialize();
+		this.whenInitialized = this.initialize();
 	}
 	
 	initialize() {
-		return new Promise((resolve, reject) => {
-			if (this.initialized) {
-				resolve(this);
-			}
-			if (!Room.isWebrtcSupported()) {
-				reject({type: 'error', id: 0, message: 'WebRTC is not supported on this platform', data: null})
-			}
-			Room.testSafariVp8()
-				.then(isVP8 => {
-					this.setExitListeners();
-					this.safariVp8 = isVP8;
-					this.initialized = true;
-					return adapter.browserDetails.browser !== 'safari' || (this.safariVp8) //&& 'MediaSource' in window
-						? resolve(this)
-						: reject({type: 'error', id: 0, message: 'This browser is not supported', data: null})
-				});
-		});
-	}
-	
-	createSession(type = 'reactooroom', options = {}) {
-		let session = new RoomSession(this.enableDebugFlag, type, options);
-		this.sessions.push(session);
-		return session;
-	}
-	
-	closeSessionByConstructId(constructId) {
-		let sessionIndex = this.sessions.findIndex(session => session.constructId === constructId);
-		if (sessionIndex > -1) {
-			return this.sessions[sessionIndex].destroy()
-				.then(() => {
-					this.sessions.splice(sessionIndex, 1);
-					return true
-				})
-		}
-		return Promise.resolve();
-	}
-	
-	closeSessionBySessionId(sessionId) {
-		let sessionIndex = this.sessions.findIndex(session => session.sessionId === sessionId);
-		if (sessionIndex > -1) {
-			return this.sessions[sessionIndex].destroy()
-				.then(() => {
-					this.sessions.splice(sessionIndex, 1);
-					return true
-				})
-		}
-		return Promise.resolve();
+		return this.safariVp8TestPromise
+			.then(() => this);
 	}
 	
-	closeSessions() {
-		this.sessions.forEach(session => session.destroy().catch(e => this.log(e)));
-		this.sessions.length = 0;
-	}
-	
-	setExitListeners() {
-		window.addEventListener('pagehide', (event) => {
-			if (!event.persisted) {
-				this.closeSessions()
-			}
-		});
-		window.addEventListener('beforeunload', () => {
-			this.closeSessions()
-		});
+	createSession(constructId = null, type = 'reactooroom', options = {}) {
+		return new RoomSession(constructId, type, this.debug, options);
 	}
 	
 	static testSafariVp8() {
@@ -119,28 +64,11 @@ class Room {
 		});
 	}
 	
-	static randomString(len) {
-		var charSet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
-		var randomString = '';
-		for (var i = 0; i < len; i++) {
-			var randomPoz = Math.floor(Math.random() * charSet.length);
-			randomString += charSet.substring(randomPoz, randomPoz + 1);
-		}
-		return randomString;
-	}
-	
 	static isWebrtcSupported() {
 		return window.RTCPeerConnection !== undefined && window.RTCPeerConnection !== null &&
 			navigator.mediaDevices !== undefined && navigator.mediaDevices !== null &&
 			navigator.mediaDevices.getUserMedia !== undefined && navigator.mediaDevices.getUserMedia !== null;
 	}
-	
-	static noop() {
-	}
-	
-	enableDebug() {
-		this.log = console.log.bind(console);
-	}
 }
 
 class RoomSession {
@@ -148,6 +76,16 @@ class RoomSession {
 	static noop() {
 	
 	}
+
+	static randomString(len) {
+		var charSet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+		var randomString = '';
+		for (var i = 0; i < len; i++) {
+			var randomPoz = Math.floor(Math.random() * charSet.length);
+			randomString += charSet.substring(randomPoz, randomPoz + 1);
+		}
+		return randomString;
+	}
 	
 	//TODO: solve
 	// #eventList = ['error', 'kicked', 'addLocalParticipant', ,'addRemoteInstructor','addRemoteParticipant','addRemoteTalkback', 'addRemoteObserver', 'removeRemoteInstructor', 'removeLocalParticipant', 'removeRemoteParticipant', 'removeRemoteTalkback', 'removeRemoteObserver', 'localMuted', 'localHasVideo', 'localHasAudio', 'data', 'iceState', 'connectionState', 'joined', 'joining', 'dataChannel', 'disconnect', 'observerIds', 'talkbackIds', 'instructorId', 'published', 'publishing', 'remoteTrackMuted', 'streamingStatus', 'streaming', 'streamStarting'];
@@ -164,12 +102,7 @@ class RoomSession {
 		}
 	};
 	
-	constructor(enableDebugFlag, type = 'reactooroom', options = {
-		classroomObserverSubscribeToInstructor: false,
-		classroomInstructorSubscribeToParticipants: false,
-		safariBugHotfixEnabled: true
-	}) {
-		
+	constructor(constructId = null, type = 'reactooroom', debug, options = {}) {
 		this.server = null;
 		this.iceServers = null;
 		this.token = null;
@@ -182,15 +115,22 @@ class RoomSession {
 		this.isMonitor = false; // currently used just for classroom context so monitor user only subscribes to participants and not trainer (for other monitor this flag is not necessary)
 		this.recordingFilename = null;
 		this.pluginName = RoomSession.sessionTypes()[type];
-		this.options = options;
-		//this.pluginName = this.#sessionTypes[type];
+		this.options = {
+			...{
+				debug: debug,
+				classroomObserverSubscribeToInstructor: false,
+				classroomInstructorSubscribeToParticipants: false,
+				safariBugHotfixEnabled: adapter.browserDetails.browser === 'safari' && adapter.browserDetails.version < 605
+			},
+			options
+		};
 		
 		Object.assign(this, emitter());
 		
 		this.id = null;
 		this.privateId = null;
 		
-		this.constructId = Room.randomString(16);
+		this.constructId = constructId || RoomSession.randomString(16);
 		this.sessionId = null;
 		this.handleId = null;
 		this.ws = null;
@@ -217,11 +157,11 @@ class RoomSession {
 		this.isVideoMuted = false;
 		this.isVideoEnabled = false;
 		this.isAudioEnabed = false;
-		
+
 		this.isUnifiedPlan = RoomSession.checkUnifiedPlan();
-		
+
 		this._log = RoomSession.noop;
-		if (enableDebugFlag) {
+		if (this.options.debug) {
 			this._enableDebug();
 		}
 	}
@@ -279,8 +219,7 @@ class RoomSession {
 	}
 	
 	_send(request = {}, ignoreResponse = false, dontResolveOnAck = false) {
-		
-		let transaction = Room.randomString(12);
+		let transaction = RoomSession.randomString(12);
 		let requestData = {
 			...request,
 			transaction,
@@ -486,7 +425,7 @@ class RoomSession {
 								/*
 	
 									monitor/talkback -> all but talkback
-									observer -> all but instructor and talkback
+									observer -> all but talkback
 									instructor -> no one
 									participant -> only instructor, observer and talkback
 									
@@ -582,13 +521,13 @@ class RoomSession {
 								/*
 	
 									monitor/talkback -> all but talkback
-									observer -> all but instructor and talkback
+									observer -> all but talkback
 									instructor -> no one
 									participant -> only instructor, observer and talkback
 									
 									1st line -> Im not monitor/talkback and im not observer and im not instructor and user to subscribe is instructor or observer or talkback
 									2nd line -> Im monitor/talkback and im not instructor and user connecting is not talkback
-									3rd line -> Im observer and im not instructor and user connecting is not talkback
+									3rd line ->  Im observer and im not instructor and user connecting is not talkback
 									
 								*/
 								
@@ -709,7 +648,7 @@ class RoomSession {
 							"request": "configure",
 							"bitrate": this.initialBitrate
 						}
-					}).catch(e => null)
+					}).catch(() => null)
 				}
 			}
 		}
@@ -778,17 +717,13 @@ class RoomSession {
 		}
 		
 		if (type === 'error') {
-			
-			//TODO: find a better way
-			if (!this.disconnectingPromise) {
-				this._log('silent data event error')
-				this.emit('error', {
-					type: this.handleId === handleId ? 'error' : 'warning',
-					id: 9,
-					message: 'data event error',
-					data: [handleId, data]
-				});
-			}
+
+			this.emit('error', {
+				type: 'warning',
+				id: 9,
+				message: 'data event warning',
+				data: [handleId, data]
+			});
 			
 			if (handle) {
 				let config = handle.webrtcStuff;
@@ -817,7 +752,6 @@ class RoomSession {
 	
 	//removeHandle === true -> hangup, detach, removeHandle === false -> hangup
 	_removeParticipant(handleId, rfid, removeHandle = true) {
-		
 		let handle = this._getHandle(handleId, rfid);
 		
 		if (!handle) {
@@ -856,7 +790,7 @@ class RoomSession {
 				try {
 					handle.webrtcStuff.pc.close();
 				} catch (e) {
-				
+
 				}
 				handle.webrtcStuff = {
 					stream: null,
@@ -870,11 +804,6 @@ class RoomSession {
 					iceDone: false,
 				};
 				
-				if (removeHandle) {
-					let handleIndex = this._participants.findIndex(p => p.handleId === handleId);
-					this._participants.splice(handleIndex, 1);
-				}
-				
 				if (handleId === this.handleId) {
 					this._isDataChannelOpen = false;
 					this._isPublished = false;
@@ -896,6 +825,11 @@ class RoomSession {
 					}
 					this.emit(eventName, {id: handleId, userId: handle.userId});
 				}
+
+				if (removeHandle) {
+					let handleIndex = this._participants.findIndex(p => p.handleId === handleId);
+					this._participants.splice(handleIndex, 1);
+				}
 				
 				return true;
 			});
@@ -948,7 +882,7 @@ class RoomSession {
 	_leaveRoom(dontWait = false) {
 		return this._hasJoined
 			? this.sendMessage(this.handleId, {body: {"request": "leave"}}, dontWait)
-				.finally((r) => {
+				.finally(() => {
 					this._hasJoined = false;
 					this.emit('joined', false);
 				})
@@ -1068,7 +1002,7 @@ class RoomSession {
 		return this.connectingPromise;
 	}
 	
-	disconnect(dontWaitForResponses = false) {
+	disconnect() {
 		if (this.disconnectingPromise) {
 			return this.disconnectingPromise;
 		}
@@ -1077,8 +1011,8 @@ class RoomSession {
 		this.disconnectingPromise = Promise.all(this._participants.map(p => this._removeParticipant(p.handleId)))
 			.finally(() => {
 				this._wipeListeners();
-				this._send({"janus": "destroy"}, true);
 				if (this.ws && this.ws.readyState === 1) {
+					this._send({"janus": "destroy"}, true);
 					this.ws.close();
 				}
 				this.sessionId = null;
@@ -1183,16 +1117,16 @@ class RoomSession {
 	}
 	
 	
-	destroy(dontWaitForResponses = false) {
+	destroy() {
 		
 		if (this.sessiontype === 'reactooroom') {
-			return this.disconnect(dontWaitForResponses)
+			return this.disconnect()
 				.then(() => {
 					this.clear();
 					return true;
 				});
 		} else if (this.sessiontype === 'streaming') {
-			return this.stopStream(dontWaitForResponses)
+			return this.stopStream()
 				.then(() => {
 					this.clear();
 					return true
@@ -2001,7 +1935,7 @@ class RoomSession {
 		}
 		let config = handle.webrtcStuff;
 		
-		if(this.options.safariBugHotfixEnabled && adapter.browserDetails.browser === 'safari') {
+		if(this.options.safariBugHotfixEnabled) {
 			this.isVideoMuted = !this.isVideoMuted;
 		}
 		else if (this.isUnifiedPlan) {

package/src/modules/wt-utils.js

@@ -2,14 +2,14 @@ import Fingerprint2 from '@fingerprintjs/fingerprintjs';
 
 let wait = function(ms) { return new Promise(resolve => setTimeout(resolve, ms))};
 
-let getBrowserFingerprint = function (instanceType = '') {
+let getBrowserFingerprint = function (instanceType = '', salt = '') {
     return new Promise((resolve) => {
         let options = {
             extraComponents : [
                 {
                     key: 'instanceType',
                     getData: function (done, options) {
-                        done(instanceType)
+                        done(instanceType + '_' + salt)
                     }
                 }
             ]