@reactoo/watchtogether-sdk-js 2.7.49 → 2.7.50

package/example/index.html

@@ -189,7 +189,7 @@
             return Instance.iot.iotLogout()
         }
 
-        function itoLogin() {
+        function iotLogin() {
             return Instance.iot.iotLogin()
         }
 
@@ -197,6 +197,10 @@
             return Instance.iot.subscribe(topic)
         }
 
+        function updateCredentials() {
+            return Instance.iot.__updateCredentials()
+        }
+
         let Instance = WatchTogetherSDK({debug:true})({instanceType:'reactooDemo'});
 
         Instance.auth.$on('login', (r) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reactoo/watchtogether-sdk-js",
-  "version": "2.7.49",
+  "version": "2.7.50",
   "description": "Javascript SDK for Reactoo",
   "main": "src/index.js",
   "unpkg": "dist/watchtogether-sdk.min.js",

package/src/index.js

@@ -2,7 +2,7 @@
 
 import Room from './modules/wt-room';
 import Auth from './modules/wt-auth';
-import Iot from './modules/wt-iot';
+import Iot from './modules/wt-iot2';
 
 import auth from './models/auth';
 import room from './models/room';

package/src/modules/wt-iot-worker.worker.js

@@ -0,0 +1,164 @@
+import { mqtt, iot } from 'aws-iot-device-sdk-v2';
+console.log('Worker: Starting up');
+
+let connection = null;
+
+self.onmessage = function(event) {
+    const { type, params, topic, message } = event.data;
+    console.log(`Worker: Received message of type: ${type}`);
+
+    switch (type) {
+        case 'connect':
+            connect(params);
+            break;
+        case 'disconnect':
+            disconnect();
+            break;
+        case 'is_connected':
+            isConnected();
+            break;
+        case 'clear_topics':
+            // No action needed in the worker
+            break;
+        case 'subscribe':
+            subscribe(topic);
+            break;
+        case 'unsubscribe':
+            unsubscribe(topic);
+            break;
+        case 'send':
+            send(topic, message);
+            break;
+    }
+};
+
+function connect(params) {
+    console.log('Worker: Attempting to connect');
+    const { apiMqttUrl, apiMqttClientId, region, accessKeyId, secretAccessKey, sessionToken } = params;
+
+    const configBuilder = iot.AwsIotMqttConnectionConfigBuilder.new_with_websockets();
+
+    configBuilder.with_clean_session(true);
+    configBuilder.with_client_id(apiMqttClientId);
+    configBuilder.with_endpoint(apiMqttUrl);
+    configBuilder.with_credentials(region, accessKeyId, secretAccessKey, sessionToken);
+    configBuilder.with_keep_alive_seconds(30);
+    configBuilder.with_ping_timeout_ms(3000);
+    configBuilder.with_reconnect_max_sec(5);
+    configBuilder.with_reconnect_min_sec(1);
+
+    const config = configBuilder.build();
+
+    const client = new mqtt.MqttClient();
+    connection = client.new_connection(config);
+
+    setupConnectionListeners();
+
+    connection.connect()
+        .then(() => {
+            console.log('Worker: Connection successful');
+            self.postMessage({ type: 'connect_result', data: {success: true} });
+        })
+        .catch((error) => {
+            console.error('Worker: Connection failed', error);
+            self.postMessage({ type: 'connect_result', data: {success: false, error: error.message} });
+        });
+}
+
+function disconnect() {
+    if (connection) {
+        connection.disconnect()
+            .then(() => {
+                self.postMessage({ type: 'disconnect_result', data: {success: true} });
+            })
+            .catch((error) => {
+                self.postMessage({ type: 'disconnect_result', data: { success: false, error: error.message} });
+            });
+    } else {
+        self.postMessage({ type: 'disconnect_result', data: {success: true} });
+    }
+}
+
+function isConnected() {
+    const connected = connection && connection.currentState === 0 && connection.desiredState === 0;
+    self.postMessage({ type: 'is_connected_result', data:{connected} });
+}
+
+function subscribe(topic) {
+    if (connection && connection.currentState === 0 && connection.desiredState === 0) {
+        connection.subscribe(topic, mqtt.QoS.AtLeastOnce)
+            .then(() => {
+                self.postMessage({ type: 'subscribe_result', data: {success: true} });
+            })
+            .catch((error) => {
+                self.postMessage({ type: 'subscribe_result', data: {success: false, error: error.message} });
+            });
+    } else {
+        self.postMessage({ type: 'subscribe_result', data: {success: false, error: 'Not connected'} });
+    }
+}
+
+function unsubscribe(topic) {
+    if (connection && connection.currentState === 0 && connection.desiredState === 0) {
+        connection.unsubscribe(topic)
+            .then(() => {
+                self.postMessage({ type: 'unsubscribe_result', data: {success: true} });
+            })
+            .catch((error) => {
+                self.postMessage({ type: 'unsubscribe_result', data: {success: false, error: error.message} });
+            });
+    } else {
+        self.postMessage({ type: 'unsubscribe_result', data: {success: false, error: 'Not connected'} });
+    }
+}
+
+function send(topic, message) {
+    if (connection && connection.currentState === 0 && connection.desiredState === 0) {
+        connection.publish(topic, message, mqtt.QoS.AtLeastOnce, false);
+    } else {
+        console.error('Cannot send message: Not connected');
+    }
+}
+
+function setupConnectionListeners() {
+    connection.on('connect', () => {
+        self.postMessage({ type: 'connect' });
+    });
+
+    connection.on('disconnect', () => {
+        self.postMessage({ type: 'disconnect' });
+    });
+
+    connection.on('error', (error) => {
+        self.postMessage({ type: 'error', data: error });
+    });
+
+    connection.on('interrupt', (error) => {
+        self.postMessage({ type: 'interrupt', data: error });
+    });
+
+    connection.on('resume', (error) => {
+        self.postMessage({ type: 'resume', data: error });
+    });
+
+    connection.on('message', (topic, payload) => {
+        self.postMessage({ type: 'message', data: { topic, payload } });
+    });
+
+    connection.on('connection_success', (error) => {
+        self.postMessage({ type: 'connection_success', data: error });
+    });
+
+    connection.on('connection_failure', (error) => {
+        self.postMessage({ type: 'connection_failure', data: error });
+    });
+
+    // Add a general error handler for uncaught exceptions
+    self.addEventListener('error', (error) => {
+        console.error('Worker: Uncaught error', error);
+        self.postMessage({ type: 'uncaught_error', error: error.message });
+    });
+}
+
+// Add this at the end of the file
+console.log('Worker: Setup complete');

package/src/modules/wt-iot2.js

@@ -0,0 +1,355 @@
+import emitter from './wt-emitter';
+import { decodeJanusDisplay } from "./wt-utils";
+import Worker from './wt-iot-worker.worker.js';
+
+class Iot {
+    constructor(enableDebugFlag) {
+        Object.assign(this, emitter());
+        this.decoder = new TextDecoder('utf-8');
+        this.log = Iot.noop;
+        this.credentialsExpirationCheckIntervalId = null;
+        this.currentCredentialsExpirationStamp = null;
+        this.lastConnectParams = null;
+        this.subscribedTopics = new Set();
+        this.initWorker();
+
+        if (enableDebugFlag) {
+            this.enableDebug();
+        }
+    }
+
+    static noop() {}
+
+    enableDebug() {
+        this.log = console.log.bind(console);
+    }
+
+    initWorker() {
+        this.worker = new Worker();
+        this.worker.onmessage = this.handleWorkerMessage.bind(this);
+    }
+
+    connect(apiMqttUrl, apiMqttClientId, region, accessKeyId, secretAccessKey, sessionToken, expiration) {
+        this.log('iot connect called, we disconnect first just to be sure');
+        return this.disconnect()
+            .catch(() => {
+                // we dont care if disconnect fails
+                return Promise.resolve();
+            })
+            .finally(() => {
+                this.log('iot connect');
+                this.startCredentialsExpirationCheck(expiration);
+                this.lastConnectParams = { apiMqttUrl, apiMqttClientId, region, accessKeyId, secretAccessKey, sessionToken, expiration };
+
+                return new Promise((resolve, reject) => {
+                    const timeoutId = setTimeout(() => {
+                        this.off('worker:connect_result');
+                        reject(new Error('Connection timeout'));
+                    }, 5000);
+
+                    const handleConnectResult = (event) => {
+                        clearTimeout(timeoutId);
+                        this.off('worker:connect_result', handleConnectResult);
+                        if (event.success) {
+                            resolve();
+                        } else {
+                            reject(new Error(event.error));
+                        }
+                    };
+
+                    this.on('worker:connect_result', handleConnectResult);
+
+                    this.worker.postMessage({
+                        type: 'connect',
+                        params: this.lastConnectParams
+                    });
+                });
+            });
+    }
+
+    disconnect() {
+        this.log('iot disconnect');
+        this.stopCredentialsExpirationCheck();
+        return new Promise((resolve, reject) => {
+            const timeoutId = setTimeout(() => {
+                this.off('worker:disconnect_result');
+                reject(new Error('Disconnect timeout'));
+            }, 5000);
+
+            const handleDisconnectResult = (event) => {
+                clearTimeout(timeoutId);
+                this.off('worker:disconnect_result', handleDisconnectResult);
+                if (event.success) {
+                    resolve();
+                } else {
+                    reject(new Error(event.error));
+                }
+            };
+            this.on('worker:disconnect_result', handleDisconnectResult);
+            this.worker.postMessage({ type: 'disconnect' });
+        });
+    }
+
+    isConnected() {
+        return new Promise((resolve) => {
+            const handleIsConnectedResult = (event) => {
+                this.off('worker:is_connected_result', handleIsConnectedResult);
+                resolve(event.connected);
+            };
+
+            this.on('worker:is_connected_result', handleIsConnectedResult);
+            this.worker.postMessage({ type: 'is_connected' });
+        });
+    }
+
+    clearTopics() {
+        this.subscribedTopics.clear();
+        this.worker.postMessage({ type: 'clear_topics' });
+    }
+
+    subscribe(topic) {
+        this.log('iot subscribe', topic);
+        if (typeof topic === 'string' && topic.trim() !== '') {
+            return new Promise((resolve, reject) => {
+                const handleSubscribeResult = (event) => {
+                    this.off('worker:subscribe_result', handleSubscribeResult);
+                    if (event.success) {
+                        this.subscribedTopics.add(topic);
+                        resolve();
+                    } else {
+                        reject(new Error(event.error));
+                    }
+                };
+
+                this.on('worker:subscribe_result', handleSubscribeResult);
+                this.worker.postMessage({ type: 'subscribe', topic });
+            });
+        } else {
+            this.log('Invalid topic:', topic);
+            return Promise.reject(new Error('Invalid topic'));
+        }
+    }
+
+    unsubscribe(topic) {
+        this.log('iot unsubscribe', topic);
+        if (typeof topic === 'string' && topic.trim() !== '') {
+            return new Promise((resolve, reject) => {
+                const handleUnsubscribeResult = (event) => {
+                    this.off('worker:unsubscribe_result', handleUnsubscribeResult);
+                    if (event.success) {
+                        this.subscribedTopics.delete(topic);
+                        resolve();
+                    } else {
+                        reject(new Error(event.error));
+                    }
+                };
+
+                this.on('worker:unsubscribe_result', handleUnsubscribeResult);
+                this.worker.postMessage({ type: 'unsubscribe', topic });
+            });
+        } else {
+            this.log('Invalid topic:', topic);
+            return Promise.reject(new Error('Invalid topic'));
+        }
+    }
+
+    send(topic, message) {
+        this.log('iot send', topic, message);
+        let msg = typeof message === 'object' ? JSON.stringify(message) : message;
+        this.worker.postMessage({ type: 'send', topic, message: msg });
+    }
+
+    handleWorkerMessage(event) {
+        const { type, data } = event.data;
+        switch (type) {
+            case 'message':
+                this.handleMessage(data.topic, new Uint8Array(data.payload));
+                break;
+            case 'connect':
+            case 'disconnect':
+            case 'error':
+            case 'interrupt':
+            case 'resume':
+            case 'connection_success':
+            case 'connection_failure':
+                this.emit(type, data);
+                break;
+            case 'connect_result':
+            case 'disconnect_result':
+            case 'is_connected_result':
+            case 'subscribe_result':
+            case 'unsubscribe_result':
+                this.emit(`worker:${type}`, data);
+                break;
+        }
+    }
+
+    handleMessage(topic, payload) {
+        const topicParts = topic.split('/');
+        let message;
+        try {
+            message = JSON.parse(this.decoder.decode(payload));
+        } catch (error) {
+            this.log('Error parsing message:', error);
+            return;
+        }
+
+        if(message.display) {
+            const decodedDisplay = decodeJanusDisplay(message.display);
+            if(decodedDisplay.userId) {
+                message = {...message, userId: decodedDisplay.userId, role: decodedDisplay.role, start: decodedDisplay.start};
+            }
+        }
+
+        if(topicParts[0] === 'user') { // user
+            const userId = topicParts[1].replace("_", ':');
+            this.emit('message', {userId, ...message, event: message.event ? `user:${message.event}` : 'user'});
+        } else if(topicParts[0] === 'wt') {
+            const event = message.event;
+            const roomId = topicParts[2];
+            if(topicParts[1] === 'room') { // room
+                if(
+                    event === 'message' ||
+                    event === 'template_updated' ||
+                    event === 'record_start' ||
+                    event === 'record_stop' ||
+                    event === 'record_configured' ||
+                    event === 'record_livestream_available' ||
+                    event === 'record_livestream_kick' ||
+                    event === 'user_update_displayname' ||
+                    event === 'user_update_avatar' ||
+                    event === 'user_update_bio' ||
+                    event === 'user_update_customattributes' ||
+                    event === 'user_update_privateattributes' ||
+                    event === 'channel_changed' ||
+                    event === "instance_homepage_changed" ||
+                    event === "instance_settings_changed" ||
+                    event === "externalmix_changed" ||
+                    event === "video_uploaded" ||
+                    event === "change_user_devices" ||
+                    event === "queue" ||
+                    event === "title_changed" ||
+                    event === "videowall_changed" ||
+                    event === 'left' || //user removed room a.k.a. left the room
+                    event === 'kicked' ||
+                    event === 'banned' ||
+                    event === 'unbanned' ||
+                    event === 'approved' ||
+                    event === 'muted' ||
+                    event === 'unmuted' ||
+                    event === 'messageRemoved' ||
+                    event === 'messageReported' ||
+                    event === 'chatClear' ||
+                    event === 'handRaised' ||
+                    event === 'handLowered' ||
+                    event === 'handsCleared' ||
+                    event === 'volume_set' ||
+                    event === 'asset_created'
+                ) {
+                    this.emit('message', {event, ...message, roomId})
+                }
+                else if(event === 'joined' || event === 'leaving') {
+                    this.emit('message', {event, ...message, isObserver:!!message.isObserver, roomId});
+                }
+            }
+            else if(topicParts[1] === 'instanceroom') { // instance
+                if(event === 'add_room' || event === 'remove_room' || event === 'set_room' || event === "instance_homepage_changed" || event === 'instance_settings_changed') {
+                    this.emit('message', {event, ...message});
+                }
+            }
+            else if(topicParts[1] === 'externalmix') {
+                const event = message.event;
+                this.emit('message', {event, ...message});
+            }
+            else if(topicParts[1] === 'asset') {
+                this.emit('message',  {event: 'asset', assetId: topicParts[2], ...message});
+            }
+        } else if(topicParts[0] === 'wtr' || topicParts[0] === 'gwtr') {
+            const recorderId = topicParts[1];
+            const sessionId = topicParts[2];
+            if(topicParts[3] === 'control') {
+                this.emit('message', {event: 'recorder_control', ...message, recorderId, sessionId});
+            } // recorder control
+            else if(topicParts[3] === 'monitor') {
+                this.emit('message', {event: 'recorder_monitor', ...message, recorderId, sessionId});
+            } // recorder monitor
+        }
+    }
+
+    startCredentialsExpirationCheck(expiration) {
+        this.stopCredentialsExpirationCheck();
+        this.currentCredentialsExpirationStamp = new Date(expiration).getTime();
+        this.credentialsExpirationCheckIntervalId = setInterval(() => {
+            const currentTimeStamp = new Date().getTime();
+            // update 15 minutes before expiration
+            if(this.currentCredentialsExpirationStamp - currentTimeStamp <= 900000) {
+                this.log('iot credentials expired, updating');
+                this.emit('updateCredentials');
+            }
+        }, 5000);
+    }
+
+    stopCredentialsExpirationCheck() {
+        clearInterval(this.credentialsExpirationCheckIntervalId);
+        this.credentialsExpirationCheckIntervalId = null;
+    }
+
+    updateWebSocketCredentials(accessKeyId, secretAccessKey, sessionToken, expiration) {
+        this.log('iot updateWebSocketCredentials');
+        this.lastConnectParams = {...this.lastConnectParams, accessKeyId, secretAccessKey, sessionToken, expiration };
+        const currentTopics = new Set(this.subscribedTopics);
+        return this.connect(
+            this.lastConnectParams.apiMqttUrl,
+            this.lastConnectParams.apiMqttClientId,
+            this.lastConnectParams.region,
+            accessKeyId,
+            secretAccessKey,
+            sessionToken,
+            expiration
+        ).then(() => {
+            // Resubscribe to topics
+            currentTopics.forEach(topic => this.subscribe(topic));
+            return true;
+        });
+    }
+
+    checkConnection() {
+        return new Promise((resolve, reject) => {
+            if (this.subscribedTopics.size === 0) {
+                reject(new Error('No subscribed topics available for connection check', {cause: -1}));
+                return;
+            }
+
+            let suitableTopic = Array.from(this.subscribedTopics).find(topic => topic.indexOf('user') > -1);
+
+            if (!suitableTopic) {
+                reject(new Error('No suitable topic found for connection check', {cause: -1}));
+                return;
+            }
+
+            const testMessage = {
+                type: 'keep_alive',
+                timestamp: Date.now()
+            };
+
+            const timeoutId = setTimeout(() => {
+                this.off('message', checkMessageHandler);
+                reject(new Error('Connection check timeout'));
+            }, 5000);
+
+            const checkMessageHandler = (message) => {
+                if (message.type === 'keep_alive' && message.timestamp === testMessage.timestamp) {
+                    clearTimeout(timeoutId);
+                    this.off('message', checkMessageHandler);
+                    resolve();
+                }
+            };
+
+            this.on('message', checkMessageHandler);
+
+            this.send(suitableTopic, testMessage);
+        });
+    }
+}
+
+export default Iot;

package/webpack.config.js

@@ -22,9 +22,9 @@ module.exports = (env, argv) => {
       libraryTarget: 'umd',
       libraryExport: 'default',
       umdNamedDefine: true,
-      globalObject: "typeof self !== 'undefined' ? self : this"
+      globalObject: "typeof self !== 'undefined' ? self : this",
+      publicPath: '',
     },
-    // Remove the experiments section
     module: {
       rules: [
         {
@@ -36,7 +36,9 @@ module.exports = (env, argv) => {
         },
         {
           test: /\.worker\.js$/,
-          use: { loader: 'worker-loader' }
+          use: [
+            { loader: 'worker-loader', options: { inline: 'no-fallback' } },
+          ]
         }
       ]
     },
@@ -44,6 +46,11 @@ module.exports = (env, argv) => {
       new webpack.BannerPlugin(banner),
       new webpack.ProvidePlugin({
         process: 'process/browser',
+        Buffer: ['buffer', 'Buffer'],
+      }),
+      new webpack.DefinePlugin({
+        'typeof window': JSON.stringify('object'),
+        'window': 'self',
       }),
     ],
     optimization: {

package/src/modules/iot-worker.worker.js

@@ -1,84 +0,0 @@
-import { mqtt, iot } from 'aws-iot-device-sdk-v2';
-
-let connection = null;
-
-self.onmessage = function(e) {
-	const { action, payload } = e.data;
-
-	switch (action) {
-		case 'connect':
-			connect(payload);
-			break;
-		case 'disconnect':
-			disconnect();
-			break;
-		case 'subscribe':
-			subscribe(payload.topic);
-			break;
-		case 'unsubscribe':
-			unsubscribe(payload.topic);
-			break;
-		case 'send':
-			send(payload.topic, payload.message);
-			break;
-	}
-};
-
-function connect({ apiMqttUrl, apiMqttClientId, region, accessKeyId, secretAccessKey, sessionToken }) {
-	const configBuilder = iot.AwsIotMqttConnectionConfigBuilder.new_with_websockets();
-
-	configBuilder.with_clean_session(true);
-	configBuilder.with_client_id(apiMqttClientId);
-	configBuilder.with_endpoint(apiMqttUrl);
-	configBuilder.with_credentials(region, accessKeyId, secretAccessKey, sessionToken);
-	configBuilder.with_keep_alive_seconds(30);
-	configBuilder.with_ping_timeout_ms(3000);
-
-	const config = configBuilder.build();
-
-	const client = new mqtt.MqttClient();
-	connection = client.new_connection(config);
-
-	connection.on('connect', () => {
-		self.postMessage({ event: 'connect' });
-	});
-
-	connection.on('disconnect', () => {
-		self.postMessage({ event: 'disconnect' });
-	});
-
-	connection.on('error', (error) => {
-		self.postMessage({ event: 'error', error: error.toString() });
-	});
-
-	connection.on('message', (topic, payload) => {
-		self.postMessage({ event: 'message', topic, payload: new Uint8Array(payload) });
-	});
-
-	connection.connect();
-}
-
-function disconnect() {
-	if (connection) {
-		connection.disconnect();
-		connection = null;
-	}
-}
-
-function subscribe(topic) {
-	if (connection) {
-		connection.subscribe(topic, mqtt.QoS.AtLeastOnce);
-	}
-}
-
-function unsubscribe(topic) {
-	if (connection) {
-		connection.unsubscribe(topic);
-	}
-}
-
-function send(topic, message) {
-	if (connection) {
-		connection.publish(topic, message, mqtt.QoS.AtLeastOnce);
-	}
-}