@reactoo/watchtogether-sdk-js 2.6.82 → 2.6.83

package/example/bulk_join_room/README.md

@@ -0,0 +1,24 @@
+# Bulk join script
+
+## URL
+The script is available at `<domain>/bulk_join_room/bulk_join_room.html`
+
+## Script update
+- Take the latest version of the bulk_join_room.html script from [picitujeromanov/WR-SDK](https://github.com/picitujeromanov/WR-SDK) project and copy it to this folder
+- Include the persons_gifs folder too
+- Build the SDK in SDK project and copy the result (content of dist folder including the min.js version) to the sdk-dist folder
+- Update the bulk_join_room.html - set the route to the built sdk to `./sdk-dist/watchtogether-sdk.js`
+- Do not make any other changes. It will be developed only in SDK project and copied here using these instructions
+
+## Security
+This script is publicly available and the is not name and password protected. This script is also available in SPM NPM package, so it already is publicly available
+
+## Usage
+- Open the script - `<domain>/bulk_join_room/bulk_join_room.html`
+- Set the Room ID
+- Click `Create users and join room`
+- Disconnect all participants using the `Leave`
+- If you want to rejoin participants it is required to reload the page with the script
+- You can also use other options like pin hash when required but
+  - Do not add more than 5 participants with less than 5000ms timeout between participants joints 
+  - Do not add more than 32 participants (there are only 32 participants gifs available)

package/example/bulk_join_room/bulk_join_room.html

@@ -62,10 +62,10 @@
 
 	// This will generate array with length 32 and numbers from 0 to 31. Every number is unique
 	let randomGifOrder = Array(32).fill(0)
-			.map((_, i) => i + 1)
-			.map((value) => ({ value, sort: Math.random() }))
-			.sort((a, b) => a.sort - b.sort)
-			.map(({ value }) => value);
+		.map((_, i) => i + 1)
+		.map((value) => ({ value, sort: Math.random() }))
+		.sort((a, b) => a.sort - b.sort)
+		.map(({ value }) => value);
 
 	function joinParticipants() {
 		participantsCount = parseInt(document.getElementById('users-count').value);
@@ -106,11 +106,11 @@
 
 		return participantsData.reduce((promiseChain, participantData) => {
 			return promiseChain.then(() => fetch(participantData.gifUrl))
-					.then(response => createGifDecoder(response.body, participantData))
-					.then(() => participantData.imageDecoder.decode({frameIndex: participantData.frameIndex}))
-					.then(decodeResult => renderImage(decodeResult, participantData))
-					.then(() => joinRoom(participantData))
-					.then(() => new Promise(resolve => setTimeout(resolve, timeoutBetweenParticipantsJoins)));
+				.then(response => createGifDecoder(response.body, participantData))
+				.then(() => participantData.imageDecoder.decode({frameIndex: participantData.frameIndex}))
+				.then(decodeResult => renderImage(decodeResult, participantData))
+				.then(() => joinRoom(participantData))
+				.then(() => new Promise(resolve => setTimeout(resolve, timeoutBetweenParticipantsJoins)));
 		}, Promise.resolve());
 	}
 
@@ -167,30 +167,30 @@
 
 		// Decode the next frame ahead of display so it's ready in time.
 		participantData.imageDecoder.decode({frameIndex: participantData.frameIndex})
-				.then( nextDecodeResult => setTimeout(_ => {
-					renderImage(nextDecodeResult, participantData);
-				}, decodeResult.image.duration / 1000.0))
-				.catch(e => {
-					// We can end up requesting an imageIndex past the end since we're using
-					// a ReadableStrem from fetch(), when this happens just wrap around.
-					if (e instanceof RangeError) {
-						participantData.frameIndex = 0;
-						participantData.imageDecoder.decode({frameIndex: imageIndex}).then(decodeResult => renderImage(decodeResult, participantData));
-					} else {
-						throw e;
-					}
-				});
+			.then( nextDecodeResult => setTimeout(_ => {
+				renderImage(nextDecodeResult, participantData);
+			}, decodeResult.image.duration / 1000.0))
+			.catch(e => {
+				// We can end up requesting an imageIndex past the end since we're using
+				// a ReadableStrem from fetch(), when this happens just wrap around.
+				if (e instanceof RangeError) {
+					participantData.frameIndex = 0;
+					participantData.imageDecoder.decode({frameIndex: imageIndex}).then(decodeResult => renderImage(decodeResult, participantData));
+				} else {
+					throw e;
+				}
+			});
 	}
 
 	function joinRoom(participantData) {
 		return participantData.sdkInstance.auth.deviceLogin(false, participantData.id)
-				.then(() => participantData.sdkInstance.room.createSession({roomId, pinHash}))
-				.then(session => {
-					participantData.session = session;
-					return Promise.all([session, session.connect()])
-				})
-				.then(([session, _]) => session.publishLocal(participantData.canvas.captureStream(), 'camera0'))
-				.then(() => document.getElementById('joined-participants-count').value = ++joinedParticipantsCount);
+			.then(() => participantData.sdkInstance.room.createSession({roomId, pinHash}))
+			.then(session => {
+				participantData.session = session;
+				return Promise.all([session, session.connect()])
+			})
+			.then(([session, _]) => session.publishLocal(participantData.canvas.captureStream(), 'camera0'))
+			.then(() => document.getElementById('joined-participants-count').value = ++joinedParticipantsCount);
 	}
 
 	function disconnectRoom(participantData) {

package/package.json

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

package/src/modules/wt-room.js

@@ -1574,6 +1574,11 @@ class RoomSession {
 					mids.forEach(mid => {
 
 						const {source, simulcastBitrates} = p.webrtcStuff.tracksMap.find(t => t.mid === mid) || {};
+
+						if(!simulcastBitrates) {
+							return;
+						}
+
 						const initialSubstreamBeenSet = !!p.webrtcStuff.initialSimulcastSubstreamBeenSet[mid];
 						const manualSelectedSubstream = p.webrtcStuff.simulcastSubstreamManualSelect?.[mid];
 						const defaultSelectedSubstream = typeof this.simulcastDefaultManualSubstream === 'object'
@@ -1624,7 +1629,6 @@ class RoomSession {
 						else if(simulcastMode === 'controlled') {
 							const currentSubstream = p.webrtcStuff.selectedSubstream[mid];
 							const settingsForCurrentSubstream = simulcastBitrates?.[simulcastBitrates.length - 1 - currentSubstream];
-							console.log('test', simulcastBitrates, currentSubstream, settingsForCurrentSubstream)
 							let directionDecision = 0;
 							if(p.webrtcStuff?.stats?.[mid]?.length > this._upStatsLength) {
 								const upMedianStats = this._calculateMedianStats(p.webrtcStuff.stats[mid].slice(this._upStatsLength * -1));