@reactoo/watchtogether-sdk-js 2.8.0-beta.4 → 2.8.0-beta.6

package/example/index.html

@@ -576,6 +576,10 @@
             Instance.room.getSessionByConstructId(constructId).setRestrictSubscribeToUserIds(userIds)
         }
 
+        window.restart = function () {
+            Instance.room.getSessionByConstructId(constructId).restart()
+        }
+
 
     </script>
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reactoo/watchtogether-sdk-js",
-  "version": "2.8.0-beta.4",
+  "version": "2.8.0-beta.6",
   "description": "Javascript SDK for Reactoo",
   "main": "dist/watchtogether-sdk.min.js",
   "module": "dist/watchtogether-sdk.min.js",

package/src/models/room-session.js

@@ -156,22 +156,24 @@ let roomSession = function ({roomId, pinHash, role, options = {}}, room, wt) {
 			room.isRestarting = true;
 
 			let wasPublished = room.isPublished;
-			let handle = room._getHandle(room.handleId);
-			let stream = null;
-			if (handle?.webrtcStuff?.stream && wasPublished) {
-				stream = handle.webrtcStuff.stream;
-			}
+			let streams = room.getLocalStreams();
 
 			return this.disconnect()
 				.then(() => wait(1000)) //TODO: remove 1000ms wait by waiting for proper events from janus
 				.then(() => this.connect({reactooRoomId}))
 				.then(() => {
-					if (isObserver) {
+					if(streams.length) {
+						return streams.reduce((promise, stream) => {
+							return promise.then(() => {
+								return this.publishLocal(stream.stream, stream.source);
+							});
+						}, Promise.resolve())
+
+					} else if (wasPublished) {
 						return this.publishLocal(null);
-					} else if (stream) {
-						return this.publishLocal(stream);
-					} else
+					} else {
 						return Promise.resolve()
+					}
 				})
 				.then(() => {
 					room.isRestarting = false;

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

@@ -278,6 +278,7 @@ class RoomSession {
 		// helper flags
 
 		this.isSupposeToBeConnected = false;
+		this.isRestarting = false; // used from outside
 		this.isConnecting = false;
 		this.isEstablishingConnection = false;
 		this.isDisconnecting = false;
@@ -800,7 +801,7 @@ class RoomSession {
 	// feed_id === id of participant
 
 	#updateTransceiverMap(handleId, streams = []) {
-		this._log('Updating current transceiver map', 'Is me: ' + handleId === this.#publisherHandle.handleId, handleId, streams);
+		this._log('Updating current transceiver map', 'Is me: ' + handleId === this.#publisherHandle?.handleId, handleId, streams);
 		let handle = this.#getHandle(handleId);
 		if (!handle) {
 			this.emit('error', {
@@ -1131,12 +1132,12 @@ class RoomSession {
 		} else if (type === "webrtcup") {
 			//none universal
 		} else if (type === "hangup") {
-			this._log('hangup on', handle.handleId, handle.handleId === this.#publisherHandle.handleId, json);
+			this._log('hangup on', handle.handleId, handle.handleId === this.handleId, json);
 			if(this.#getHandle(handle.handleId)) {
 				this.#cleanupHandle(handle.handleId, true).catch(() => {});
 			}
 		} else if (type === "detached") {
-			this._log('detached on', handle.handleId, handle.handleId === this.#publisherHandle.handleId, json);
+			this._log('detached on', handle.handleId, handle.handleId === this.handleId, json);
 			if(this.#getHandle(handle.handleId)) {
 				this.#destroyHandle(handle.handleId).catch(() => {});
 			}
@@ -1158,7 +1159,7 @@ class RoomSession {
 
 		// LOCAL
 
-		if (sender === this.#publisherHandle.handleId) {
+		if (sender === this.#publisherHandle?.handleId) {
 			if (type === "event") {
 
 				var plugindata = json["plugindata"] || {};
@@ -1229,7 +1230,7 @@ class RoomSession {
 
 
 					if (leaving === 'ok') {
-						this._log('leaving', this.#publisherHandle.handleId, 'this is us');
+						this._log('leaving', this.#publisherHandle?.handleId, 'this is us');
 						
 						this.#emitLocalFeedUpdate({feedRemoval: true});
 
@@ -1251,8 +1252,8 @@ class RoomSession {
 					}
 
 					if (unpublished === 'ok') {
-						this._log('unpublished', this.#publisherHandle.handleId, 'this is us');
-						this.#cleanupHandle(this.#publisherHandle.handleId, true).catch(() => {});
+						this._log('unpublished', this.#publisherHandle?.handleId, 'this is us');
+						this.#cleanupHandle(this.#publisherHandle?.handleId, true).catch(() => {});
 
 					} else if (unpublished) {
 						this._log('unpublished', unpublished);
@@ -1290,7 +1291,7 @@ class RoomSession {
 				}
 
 				if (jsep !== undefined && jsep !== null) {
-					this.#webrtcPeer(this.#publisherHandle.handleId, jsep)
+					this.#webrtcPeer(this.#publisherHandle?.handleId, jsep)
 						.catch(err => {
 							this.emit('error', err);
 						});
@@ -1304,7 +1305,7 @@ class RoomSession {
 
 				this._log('Configuring bitrate: ' + this.initialBitrate);
 				if (this.initialBitrate > 0) {
-					this.sendMessage(this.#publisherHandle.handleId, {
+					this.sendMessage(this.#publisherHandle?.handleId, {
 						"body": {
 							"request": "configure",
 							"bitrate": this.initialBitrate
@@ -1379,7 +1380,9 @@ class RoomSession {
 				config.dataChannelOpen = this.defaultDataChannelLabel === data?.label && data?.state === 'open';
 			}
 
-			if (handleId === this.#publisherHandle.handleId && this.defaultDataChannelLabel === data?.label) {
+
+
+			if (handleId === this.handleId && this.defaultDataChannelLabel === data?.label) {
 				this._isDataChannelOpen = data?.state === 'open';
 				this.emit('dataChannel', data?.state === 'open');
 			}
@@ -1400,13 +1403,13 @@ class RoomSession {
 					config.dataChannelOpen = false;
 				}
 			}
-			if (handleId === this.#publisherHandle.handleId && this.defaultDataChannelLabel === data.label) {
+			if (handleId === this.handleId && this.defaultDataChannelLabel === data.label) {
 				this._isDataChannelOpen = false;
 				this.emit('dataChannel', false);
 			}
 		}
 
-		if (handleId === this.#publisherHandle.handleId && type === 'message') {
+		if (handleId === this.handleId && type === 'message') {
 
 			let d = null;
 
@@ -1490,18 +1493,24 @@ class RoomSession {
 
 		try {
 			if (handle.webrtcStuff.stream) {
-				if(!this.isConnecting) {
-					handle.webrtcStuff.stream?.getTracks().forEach(track => track.stop());
+
+				if(this.isRestarting && handleId === this.handleId) {
+					handle.webrtcStuff.stream?.getTracks().forEach(track => track.onended = null);
 				}
 				else {
-					handle.webrtcStuff.stream?.getTracks().forEach(track => track.onended = null);
+					handle.webrtcStuff.stream?.getTracks().forEach(track => track.stop());
 				}
+
 			}
 			if(handle.webrtcStuff?.tracks?.length > 0) {
 				handle.webrtcStuff.tracks.forEach(track => {
 					if (track) {
-						track.stop();
-						track.onended = null;
+						if(this.isRestarting && handleId === this.handleId) {
+							track.onended = null;
+						}
+						else {
+							track.stop();
+						}
 					}
 				});
 			}
@@ -1558,7 +1567,7 @@ class RoomSession {
 			lastSwitchTime : new Map(),
 		}
 
-		if(this.#publisherHandle && handleId === this.#publisherHandle.handleId) {
+		if(this.#publisherHandle && handleId === this.#publisherHandle?.handleId) {
 			this.#emitLocalFeedUpdate({feedRemoval: true});
 		}
 		else if(this.#subscriberHandle && handleId === this.#subscriberHandle.handleId) {
@@ -1571,7 +1580,7 @@ class RoomSession {
 	}
 	
 	async #joinAsPublisher(roomId, pin, userId, display) {
-		return this.sendMessage(this.#publisherHandle.handleId, {
+		return this.sendMessage(this.#publisherHandle?.handleId, {
 			body: {
 				"request": "join", "room": roomId, "pin": pin, "ptype": "publisher", "display": display, ...(this.webrtcVersion > 1000 ? {id: userId} : {})
 			}
@@ -1658,7 +1667,7 @@ class RoomSession {
 
 	async #leaveRoom(dontWait = false) {
 		return this.isConnected
-			? this.sendMessage(this.#publisherHandle.handleId, {body: {"request": "leave"}}, dontWait)
+			? this.sendMessage(this.#publisherHandle?.handleId, {body: {"request": "leave"}}, dontWait)
 				.finally(() => {
 					this.isConnected = false;
 					this.emit('joined', false);
@@ -1992,6 +2001,27 @@ class RoomSession {
 			});
 	}
 
+	getLocalStreams() {
+		const streamMap = this.#publisherHandle?.webrtcStuff?.streamMap[this.id];
+		if(!streamMap) {
+			return [];
+		}
+		return Object.keys(streamMap).reduce((acc, source) => {
+			const sourceTrackIds = streamMap[source] ?? [];
+			const sourceRelatedTracks = this.#publisherHandle?.webrtcStuff?.tracks?.filter(t => sourceTrackIds.includes(t.id)) ?? [];
+			if(sourceRelatedTracks.length) {
+				const stream = new MediaStream();
+				sourceRelatedTracks.forEach(track => {
+					if(track) {
+						stream.addTrack(track);
+					}
+				});
+				acc.push({source, stream});
+			}
+			return acc
+		}, [])
+	}
+
 	#enableDebug() {
 		this._log = console.log.bind(console);
 	}
@@ -2382,7 +2412,7 @@ class RoomSession {
 		// removing this so we can cache ice candidates again
 		config.remoteSdp = null;
 
-		if (this.#publisherHandle.handleId === handleId) {
+		if (this.handleId === handleId) {
 			this._log('Performing local ICE restart');
 			let hasAudio = !!(config.stream && config.stream.getAudioTracks().length > 0);
 			let hasVideo = !!(config.stream && config.stream.getVideoTracks().length > 0);
@@ -2531,7 +2561,7 @@ class RoomSession {
 			.then( (response) => {
 
 				// if type offer and its me and we want dtx we mungle the sdp
-				if(handleId === this.#publisherHandle.handleId && type === 'offer' && this.enableDtx) {
+				if(handleId === this.handleId && type === 'offer' && this.enableDtx) {
 					// enable DTX
 					response.sdp = response.sdp.replace("useinbandfec=1", "useinbandfec=1;usedtx=1")
 				}
@@ -2841,7 +2871,7 @@ class RoomSession {
 		let hasAudio = !!(stream && stream.getAudioTracks().length > 0);
 		let hasVideo = !!(stream && stream.getVideoTracks().length > 0);
 
-		this.#setupTransceivers(this.#publisherHandle.handleId, [hasAudio, false, hasVideo, false, audioTransceiver, videoTransceiver]);
+		this.#setupTransceivers(this.handleId, [hasAudio, false, hasVideo, false, audioTransceiver, videoTransceiver]);
 
 		const emitEvents = () => {
 			this.isPublished = true;
@@ -2950,7 +2980,7 @@ class RoomSession {
 
 	async unpublishLocal(dontWait = false) {
 		return this.isPublished
-			? this.sendMessage(this.#publisherHandle.handleId, {body: {"request": "unpublish"}}, dontWait)
+			? this.sendMessage(this.handleId, {body: {"request": "unpublish"}}, dontWait)
 				.finally(r => {
 					this.isPublished = false;
 					this.emit('published', false);
@@ -3293,6 +3323,9 @@ class RoomSession {
 				const display = transceiverData?.feed_display ?? null;
 				const description = transceiverData.feed_description ?? null;
 
+				const currentLayer = handle.webrtcStuff?.currentLayers?.get(mid);
+				const currentSubstream = currentLayer.substream;
+
 				return handle.webrtcStuff.pc.getStats(track)
 					.then(stats => {
 
@@ -3310,6 +3343,7 @@ class RoomSession {
 							frameRate: 0,
 							freezeCount: 0,
 							totalFreezesDuration: 0,
+							selectedSubstream: currentSubstream,
 						};
 
 						let selectedCandidatePairId = null;
@@ -3645,7 +3679,8 @@ class RoomSession {
 					jitter,
 					packetLoss,
 					rtt,
-					totalFreezesDuration
+					totalFreezesDuration,
+					selectedSubstream
 				} = stat.parsedStats;
 
 				let description = {};
@@ -3667,7 +3702,8 @@ class RoomSession {
 						jitter,
 						packetLoss,
 						rtt,
-						totalFreezesDuration
+						totalFreezesDuration,
+						selectedSubstream
 					}
 				}
 			});