@reactoo/watchtogether-sdk-js 2.8.0 → 2.8.1-5.beta.1

package/src/modules/wt-room-sfu.js

@@ -234,6 +234,7 @@ class RoomSession {
 		this.enableDtx = false;
 		this.simulcast = false;
 
+
 		this.defaultSimulcastSettings = {
 			"default" : {
 				mode: "controlled", // controlled, manual, browserControlled
@@ -274,6 +275,7 @@ class RoomSession {
 		this.sessionId = null;
 		this.apisecret = null;
 		this.ws = null;
+		this.wsOpen = false;
 
 		// helper flags
 
@@ -291,6 +293,7 @@ class RoomSession {
 		this.requestMuteStatusTimeout = 100;
 		this._statsInterval = 3000;
 		this._statsIntervalId = null;
+		this._sendMessageWebsocketTimeout = 30000;
 		this._sendMessageTimeout = 10000;
 		this._keepAlivePeriod = 25000;
 		this._longPollTimeout = 60000;
@@ -313,6 +316,7 @@ class RoomSession {
 			this.#enableDebug();
 		}
 
+
 	}
 
 	#httpAPICall = function(url, options) {
@@ -501,6 +505,7 @@ class RoomSession {
 				id,
 				userId,
 				role,
+				mid,
 				fullUserId: display,
 				constructId: this.constructId,
 				track: track,
@@ -540,6 +545,7 @@ class RoomSession {
 				role,
 				fullUserId: display,
 				constructId: this.constructId,
+				mid: null,
 				track: null,
 				source: null,
 				adding: false,
@@ -882,6 +888,23 @@ class RoomSession {
 		}
 	}
 
+	sendMessageViaDataChannel(label = this.defaultDataChannelLabel, data) {
+		if(this.#publisherHandle) {
+			if(label === null) {
+				Object.keys(this.#publisherHandle.webrtcStuff.dataChannel).forEach((key) => {
+					const channel = this.#publisherHandle.webrtcStuff.dataChannel[key];
+					channel.send(JSON.stringify(data));
+				})
+			}
+			else {
+				const channel = this.#publisherHandle.webrtcStuff.dataChannel[label];
+				if(channel) {
+					channel.send(JSON.stringify(data));
+				}
+			}
+		}
+	}
+
 	async sendMessage(handleId, message = {body: 'Example Body'}, dontWait = false, dontResolveOnAck = false, retry = 0) {
 		return this.#send({
 			"janus": "message",
@@ -923,6 +946,9 @@ class RoomSession {
 				}
 				return json;
 			})
+			.catch(e => {
+				return Promise.reject({error: e, requestData});
+			})
 	}
 
 	async #sendWebsockets(request = {}, ignoreResponse = false, dontResolveOnAck = false, retry = 0) {
@@ -936,21 +962,36 @@ class RoomSession {
 		};
 		this._log(requestData);
 		const op = () => new Promise((resolve, reject) => {
+
 			let messageTimeoutId = null;
-			let abortResponse = () => {
-				this._abortController.signal.removeEventListener('abort', abortResponse);
+
+			let cleanup = () => {
 				clearTimeout(messageTimeoutId);
+				this._abortController.signal.removeEventListener('abort', abortResponse);
 				this.ws.removeEventListener('message', parseResponse);
+			};
+
+			let abortResponse = () => {
+				cleanup();
 				reject({type: 'warning', id: 4, message: 'connection cancelled'})
 			};
 
+			// we may get multiple responses from parallel requests, so we need to make sure we only resolve the one we sent
+
 			let parseResponse = (event) => {
-				let json = JSON.parse(event.data);
+				let json;
+				try {
+					json = JSON.parse(event.data);
+				}
+				catch (e) {}
+
+				if(!json) {
+					return;
+				}
+
 				let r_transaction = json['transaction'];
 				if (r_transaction === transaction && (!dontResolveOnAck || json['janus'] !== 'ack')) {
-					clearTimeout(messageTimeoutId);
-					this._abortController.signal.removeEventListener('abort', abortResponse);
-					this.ws.removeEventListener('message', parseResponse);
+					cleanup();
 					if (json['janus'] === 'error') {
 						if (json?.error?.code == 403) {
 							this.disconnect();
@@ -967,31 +1008,78 @@ class RoomSession {
 					this.ws.send(JSON.stringify(requestData));
 				}
 				resolve();
-			} else {
+			}
+			else {
 				if (this.ws && this.ws.readyState === 1) {
+
 					this.ws.addEventListener('message', parseResponse);
+
 					messageTimeoutId = setTimeout(() => {
-						this.ws.removeEventListener('message', parseResponse);
-						this._abortController.signal.removeEventListener('abort', abortResponse);
+						cleanup();
 						reject({type: 'warning', id: 6, message: 'send timeout', data: requestData});
 					}, this._sendMessageTimeout);
+
 					this._abortController.signal.addEventListener('abort', abortResponse);
+
 					this.ws.send(JSON.stringify(requestData));
-				} else {
+				}
+				else {
+					cleanup();
 					reject({type: 'warning', id: 7, message: 'No connection to WebSockets', data: requestData});
 				}
 			}
 		})
 
 		return op().catch(e => {
-			if (e.id === 17) {
+			if (e.id === 4 ) {
 				return Promise.reject(e);
 			}
-			else if(e.id === 29 && retry > 0) {
-				return wait(this._sendMessageTimeout).then(() => this.#send(request, ignoreResponse, dontResolveOnAck, retry - 1));
+			else if(e.id === 7 && this.isSupposeToBeConnected) {
+
+				return new Promise((resolve, reject) => {
+
+					let establishConnectionTimeoutId = null;
+
+					const cleanup = () => {
+						clearTimeout(establishConnectionTimeoutId);
+						this._abortController.signal.removeEventListener('abort', abort);
+						this.off('webSocketsConnectionOpened', connection);
+					};
+
+					const connection = () => {
+						cleanup();
+						resolve(this.#sendWebsockets(request, ignoreResponse, dontResolveOnAck, retry - 1));
+					};
+					const timeout = () => {
+						cleanup();
+						reject({type: 'warning', id: 46, message: 'WebSocket connection did not open during wait period', data: requestData});
+					};
+					const abort = () => {
+						cleanup();
+						reject({type: 'warning', id: 47, message: 'WebSocket connection was aborted', data: requestData});
+					};
+
+
+					if(this.wsOpen) {
+
+						this._log('Retrying failed WebSocket request', requestData);
+
+						resolve(this.#sendWebsockets(request, ignoreResponse, dontResolveOnAck, retry - 1));
+					}
+					else {
+
+						this._log('Waiting for WebSocket connection to open before sending request', requestData);
+
+						this._abortController.signal.addEventListener('abort', abort);
+						establishConnectionTimeoutId = setTimeout(timeout, this._sendMessageWebsocketTimeout);
+						this.once('webSocketsConnectionOpened', connection);
+					}
+
+				})
+
 			}
-			else if(retry > 0) {
-				return this.#send(request, ignoreResponse, dontResolveOnAck, retry - 1);
+			else if(retry > 0 && this.isSupposeToBeConnected) {
+				return this.#sendWebsockets(request, ignoreResponse, dontResolveOnAck, retry - 1);
 			}
 			else {
 				return Promise.reject(e);
@@ -1034,6 +1122,9 @@ class RoomSession {
 
 	#connectionClosed() {
 
+		this.wsOpen = false;
+		this.emit('webSocketsConnectionClosed');
+
 		if (!this.isConnected || this.isConnecting || this.isDisconnecting) {
 			return;
 		}
@@ -1041,7 +1132,7 @@ class RoomSession {
 		this.#reconnect()
 			.catch(e => {
 				if(e.type !== 'warning') {
-					this.disconnect();
+					this.disconnect().catch(() => {});
 				}
 				this.emit('error', e)
 			});
@@ -1112,7 +1203,12 @@ class RoomSession {
 		if (type === "trickle") {
 			let candidate = json["candidate"];
 			let config = handle.webrtcStuff;
-			if (config.pc && config.remoteSdp) {
+			if (config.pc &&
+				config.remoteSdp &&
+				!config.isIceRestarting &&
+				config.pc.iceConnectionState !== 'closed' &&
+				config.pc.iceConnectionState !== 'failed' &&
+				config.pc.iceConnectionState !== 'disconnected') {
 
 				if (!candidate || candidate.completed === true) {
 					config.pc.addIceCandidate(null).catch((e) => {
@@ -1380,8 +1476,6 @@ class RoomSession {
 				config.dataChannelOpen = this.defaultDataChannelLabel === data?.label && data?.state === 'open';
 			}
 
-
-
 			if (handleId === this.handleId && this.defaultDataChannelLabel === data?.label) {
 				this._isDataChannelOpen = data?.state === 'open';
 				this.emit('dataChannel', data?.state === 'open');
@@ -1394,19 +1488,8 @@ class RoomSession {
 				type: 'warning',
 				id: 12,
 				message: 'data event warning',
-				data: [handleId, data]
+				data: [handleId, data, data.error?.message, data.error?.errorDetail]
 			});
-
-			if (handle) {
-				let config = handle.webrtcStuff;
-				if(this.defaultDataChannelLabel === data.label) {
-					config.dataChannelOpen = false;
-				}
-			}
-			if (handleId === this.handleId && this.defaultDataChannelLabel === data.label) {
-				this._isDataChannelOpen = false;
-				this.emit('dataChannel', false);
-			}
 		}
 
 		if (handleId === this.handleId && type === 'message') {
@@ -1422,6 +1505,18 @@ class RoomSession {
 			this.emit('data', d);
 		}
 
+		if(handleId !== this.handleId && type === 'message') {
+			let d = null;
+
+			try {
+				d = JSON.parse(data)
+			} catch (e) {
+				this.emit('error', {type: 'warning', id: 45, message: 'data message parse error', data: [handleId, e]});
+				return;
+			}
+			this.emit('dataMessage', d);
+		}
+
 	}
 
 	async #createHandle() {
@@ -1711,6 +1806,10 @@ class RoomSession {
 			this.ws.addEventListener('message', this.__handleWsEventsBoundFn);
 
 			this.ws.onopen = () => {
+
+				this.wsOpen = true;
+				this.emit('webSocketsConnectionOpened');
+
 				this._abortController.signal.removeEventListener('abort', abortConnect);
 				if(!reclaim) {
 					this.#send({"janus": "create"})
@@ -1824,10 +1923,10 @@ class RoomSession {
 			}
 			let _rejectTimeout = () => {
 				cleanup();
-				reject({type: 'warning', id: 44, message: 'Connection timeout'})
+				reject({type: 'error', id: 44, message: 'Connection timeout'})
 			}
 			this.once('joined', _resolve);
-			timeoutId = setTimeout(_rejectTimeout, 10000)
+			timeoutId = setTimeout(_rejectTimeout, 15000)
 			this._abortController.signal.addEventListener('abort', _rejectAbort);
 		})
 	}
@@ -1875,8 +1974,6 @@ class RoomSession {
 		enableDtx = false
 	) {
 
-		this.isSupposeToBeConnected = true;
-
 		if (this.isConnecting) {
 			this.emit('error',  {type: 'warning', id: 23, message: 'connection already in progress'});
 			return
@@ -1886,6 +1983,8 @@ class RoomSession {
 			await this.disconnect();
 		}
 
+		this.isSupposeToBeConnected = true;
+
 		this._abortController = new AbortController();
 
 		this.sessionId = null;
@@ -1936,6 +2035,9 @@ class RoomSession {
 			await this.#waitForConnectEvent();
 
 		} catch (error) {
+			if(error?.type !== 'warning') {
+				this.disconnect().catch(() => {});
+			}
 			this.emit('error', error);
 		} finally {
 			this.isConnecting = false;
@@ -1975,14 +2077,34 @@ class RoomSession {
 		await this.#destroyHandle(this.#subscriberHandle?.handleId, false);
 		
 		this.#wipeListeners();
-		if (this.ws && this.ws.readyState === 1) {
+
+		if(!this.useWebsockets) {
+
+			if(this.token) {
+				await this.#send({"janus": "destroy"}, true);
+			}
+		}
+
+		else if (this.ws && this.ws.readyState === 1) {
 			await this.#send({"janus": "destroy"}, true);
 			this.ws.close();
 		}
 
 		this.#subscriberJoinPromise = null;
+
 		this.sessionId = null;
+		this.server = null;
+		this.protocol = null;
+		this.iceServers = null;
+		this.token = null;
+		this.roomId = null;
+		this.pin = null;
+		this.id = null;
+		this.display = null;
+		this.userId = null;
+
 		this.isPublished = false;
+		this.isConnecting = false;
 		this.isConnected = false;
 		this.isDisconnecting = false;
 		this.emit('publishing', false);
@@ -2111,7 +2233,7 @@ class RoomSession {
 
 						let descriptions = [];
 						let transceivers = config.pc.getTransceivers();
-						Object.keys(config.streamMap[this.id]).forEach(source => {
+						Object.keys(config.streamMap[this.id]??{}).forEach(source => {
 							const simulcastConfigForSource = this.#findSimulcastConfig(source, this.simulcastSettings);
 							config.streamMap[this.id][source].forEach(trackId => {
 								let t = transceivers.find(transceiver => transceiver.sender.track && transceiver.sender.track.id === trackId)
@@ -2157,6 +2279,7 @@ class RoomSession {
 				}
 				this.emit('iceState', [handleId, handleId === this.#publisherHandle?.handleId, config.pc.iceConnectionState]);
 			};
+
 			config.pc.onicecandidate = (event) => {
 				if (event.candidate == null || (adapter.browserDetails.browser === 'edge' && event.candidate.candidate.indexOf('endOfCandidates') > 0)) {
 					config.iceDone = true;
@@ -2409,9 +2532,6 @@ class RoomSession {
 
 		config.isIceRestarting = true;
 
-		// removing this so we can cache ice candidates again
-		config.remoteSdp = null;
-
 		if (this.handleId === handleId) {
 			this._log('Performing local ICE restart');
 			let hasAudio = !!(config.stream && config.stream.getAudioTracks().length > 0);
@@ -2604,6 +2724,9 @@ class RoomSession {
 	}
 	
 	#publishRemote(handleId, jsep) {
+
+		console.log('picaaaa');
+
 		let handle = this.#getHandle(handleId);
 		if (!handle) {
 			return Promise.reject({
@@ -2682,7 +2805,7 @@ class RoomSession {
 		if (!config.stream) {
 			return;
 		}
-		let sourceTrackIds = (config.streamMap[this.id][source] || []);
+		let sourceTrackIds = (config.streamMap[this.id]?.[source] || []);
 		let remainingTracks = [];
 		for(let i = 0; i < sourceTrackIds.length; i++) {
 			let foundTrack = config.tracks.find(t => t.id === sourceTrackIds[i]);
@@ -2752,7 +2875,7 @@ class RoomSession {
 		let existingTracks = [...(config.streamMap?.[this.id]?.[source] || [])];
 
 		if(stream?.getTracks().length) {
-			if(!config.streamMap[this.id]) {
+			if(!config.streamMap?.[this.id]) {
 				config.streamMap[this.id] = {};
 			}
 			config.streamMap[this.id][source] = stream?.getTracks()?.map(track => track.id) || [];
@@ -2772,8 +2895,8 @@ class RoomSession {
 			} catch (e) {
 				this._log(e);
 			}
-			config.stream.removeTrack(oldAudioStream);
-			config?.tracks.splice(oldAudioStreamIndex, 1);
+			config?.stream?.removeTrack(oldAudioStream);
+			config?.tracks?.splice(oldAudioStreamIndex, 1);
 		}
 
 		// remove old video track related to this source
@@ -2860,7 +2983,7 @@ class RoomSession {
 		// we possibly created new transceivers, so we need to get them again
 
 		transceivers = config.pc.getTransceivers();
-		existingTracks = [...(config.streamMap[this.id][source] || [])];
+		existingTracks = [...(config.streamMap[this.id]?.[source] || [])];
 		if(!audioTransceiver) {
 			audioTransceiver = transceivers.find(transceiver => transceiver.sender.track && transceiver.sender.track.kind === 'audio' && existingTracks.includes(transceiver.sender.track.id))
 		}
@@ -2919,7 +3042,7 @@ class RoomSession {
 			}
 
 			this.isMuted = [];
-			for(const source of Object.keys(config.streamMap[this.id])) {
+			for(const source of Object.keys(config.streamMap[this.id]??{})) {
 				const audioTrack = config.stream?.getAudioTracks()?.find(track => config.streamMap[this.id][source].includes(track.id));
 				const videoTrack = config.stream?.getVideoTracks()?.find(track => config.streamMap[this.id][source].includes(track.id));
 				this.isMuted.push({type: 'audio', value: !audioTrack || !audioTrack.enabled, source, mid: transceivers.find(transceiver => transceiver.sender?.track?.kind === 'audio' && transceiver.sender?.track?.id === audioTrack?.id)?.mid});
@@ -3003,7 +3126,7 @@ class RoomSession {
 		let transceivers = config.pc?.getTransceivers();
 		let transceiver = null;
 		if(source) {
-			transceiver = transceivers?.find(t => t.sender && t.sender.track && t.receiver.track.kind === "audio" && (config.streamMap[this.id][source] || []).includes(t.sender.track.id));
+			transceiver = transceivers?.find(t => t.sender && t.sender.track && t.receiver.track.kind === "audio" && (config.streamMap[this.id]?.[source] || []).includes(t.sender.track.id));
 		}
 		else {
 			transceiver = transceivers?.find(t => t.sender && t.sender.track && t.receiver.track.kind === "audio" && (mid ? t.mid === mid : true));
@@ -3013,7 +3136,7 @@ class RoomSession {
 		}
 
 		this.isMuted = [];
-		for(const source of Object.keys(config.streamMap[this.id])) {
+		for(const source of Object.keys(config.streamMap[this.id]??{})) {
 			const audioTrack = config.stream?.getAudioTracks()?.find(track => config.streamMap[this.id][source].includes(track.id));
 			const audioTransceiver = transceivers?.find(transceiver => transceiver.sender.track && transceiver.sender.track.kind === 'audio' && transceiver.sender.track.id === audioTrack?.id);
 			const videoTrack = config.stream?.getVideoTracks()?.find(track => config.streamMap[this.id][source].includes(track.id));
@@ -3040,7 +3163,7 @@ class RoomSession {
 		let transceivers = config.pc?.getTransceivers();
 		let transceiver = null;
 		if(source) {
-			transceiver = transceivers?.find(t => t.sender && t.sender.track && t.receiver.track.kind === "video" && (config.streamMap[this.id][source] || []).includes(t.sender.track.id));
+			transceiver = transceivers?.find(t => t.sender && t.sender.track && t.receiver.track.kind === "video" && (config.streamMap[this.id]?.[source] || []).includes(t.sender.track.id));
 		}
 		else {
 			transceiver = transceivers?.find(t => t.sender && t.sender.track && t.receiver.track.kind === "video" && (mid ? t.mid === mid : true));
@@ -3049,7 +3172,7 @@ class RoomSession {
 			transceiver.sender.track.enabled = value !== null ? !!value : !transceiver.sender.track.enabled;
 		}
 		this.isMuted = [];
-		for(const source of Object.keys(config.streamMap[this.id])) {
+		for(const source of Object.keys(config.streamMap[this.id]??{})) {
 			const audioTrack = config.stream?.getAudioTracks()?.find(track => config.streamMap[this.id][source].includes(track.id));
 			const audioTransceiver = transceivers?.find(transceiver => transceiver.sender.track && transceiver.sender.track.kind === 'audio' && transceiver.sender.track.id === audioTrack?.id);
 			const videoTrack = config.stream?.getVideoTracks()?.find(track => config.streamMap[this.id][source].includes(track.id));
@@ -3172,7 +3295,7 @@ class RoomSession {
 		let config = handle.webrtcStuff;
 		let descriptions = [];
 		let transceivers = config.pc.getTransceivers();
-		Object.keys(config.streamMap[this.id]).forEach(source => {
+		Object.keys(config.streamMap[this.id]??{}).forEach(source => {
 			const simulcastConfigForSource = this.#findSimulcastConfig(source, this.simulcastSettings);
 			config.streamMap[this.id][source].forEach(trackId => {
 				let t = transceivers.find(transceiver => transceiver.sender.track && transceiver.sender.track.id === trackId)