@unboundcx/video-sdk-client 2.0.0 → 2.0.2

package/managers/RemoteMediaManager.js

@@ -474,21 +474,23 @@ export class RemoteMediaManager extends EventEmitter {
 	 * @returns {number} - Optimal spatial layer (0-2)
 	 */
 	_calculateOptimalSpatialLayer(width, height) {
-		// Use the larger dimension to determine quality
-		const maxDimension = Math.max(width, height);
-
-		// Spatial layer mapping (assumes standard simulcast layers):
-		// Layer 0: 320x180  - for thumbnails < 240px
-		// Layer 1: 960x540  - for medium tiles 240px - 540px
-		// Layer 2: 1920x1080 - for large tiles/fullscreen > 540px
-
-		if (maxDimension <= 240) {
-			return 0; // Low quality for small thumbnails
-		} else if (maxDimension <= 540) {
-			return 1; // Medium quality for smaller grid tiles
-		} else {
-			return 2; // High quality (1080p) for anything larger
-		}
+		// Pick the smallest simulcast layer whose source resolution is >=
+		// the number of pixels the browser will actually paint for this
+		// tile. Browsers render at CSS pixels × devicePixelRatio; on
+		// Retina (DPR=2) a 540px CSS tile actually displays 1080 device
+		// pixels and *does* benefit from the 1080p source, while on a
+		// standard (DPR=1) display that same 540px tile can be served
+		// from the 540p source without any visible difference.
+		//
+		// Source resolutions (rid l/m/h in MediasoupManager produce
+		// options): 480×270, 960×540, 1920×1080.
+		const dpr =
+			(typeof window !== 'undefined' && window.devicePixelRatio) || 1;
+		const maxPx = Math.max(width || 0, height || 0) * dpr;
+
+		if (maxPx <= 480) return 0; // ≤480 px → 270p source suffices
+		if (maxPx <= 960) return 1; // ≤960 px → 540p source suffices
+		return 2; // larger → need 1080p source
 	}
 
 	/**

package/managers/StatsCollector.js

@@ -9,16 +9,35 @@ export class StatsCollector {
     this.sendTransportStatsTimeout = null;
     this.recvTransportStatsInterval = null;
     this.tracks = new Map(); // trackId -> { participantId, kind }
-    this.onStatsCallback = null; // Callback for local stats updates
+    this.onStatsCallback = null; // Host-app callback (UI display)
+    this._internalCallbacks = []; // SDK-internal subscribers (QualityMonitor)
   }
 
   /**
-   * Set callback for stats updates (for local UI display)
+   * Set callback for stats updates (for local UI display). Calling this
+   * replaces the prior host callback. SDK-internal subscribers (like
+   * QualityMonitor) use addInternalCallback() instead so they can't be
+   * accidentally clobbered by the host calling setStatsCallback.
    */
   setStatsCallback(callback) {
     this.onStatsCallback = callback;
   }
 
+  /**
+   * SDK-internal: append a stats subscriber that survives host
+   * setStatsCallback() calls. Used by QualityMonitor so it can keep
+   * receiving stats even when the meet UI installs its own callback.
+   * Returns an unsubscribe function.
+   */
+  addInternalCallback(callback) {
+    if (typeof callback !== 'function') return () => {};
+    this._internalCallbacks.push(callback);
+    return () => {
+      const i = this._internalCallbacks.indexOf(callback);
+      if (i >= 0) this._internalCallbacks.splice(i, 1);
+    };
+  }
+
   /**
    * Register a track for stats collection
    */
@@ -676,9 +695,21 @@ export class StatsCollector {
       bandwidth,
     };
 
-    // Call local callback first (for UI display)
+    // Fan out to host callback (UI display) AND SDK-internal subscribers
+    // (e.g. QualityMonitor). Internal subscribers go first so monitor
+    // state updates BEFORE the UI sees the sample — the host callback
+    // may read monitor state to render badges. Each callback is wrapped
+    // so one throwing subscriber can't starve the others (or the server
+    // emit below).
+    for (const cb of this._internalCallbacks || []) {
+      try { cb(statData); } catch (err) {
+        this.logger.warn('StatsCollector :: internal callback error', err);
+      }
+    }
     if (this.onStatsCallback) {
-      this.onStatsCallback(statData);
+      try { this.onStatsCallback(statData); } catch (err) {
+        this.logger.warn('StatsCollector :: host callback error', err);
+      }
     }
 
     // Emit to server

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@unboundcx/video-sdk-client",
-	"version": "2.0.0",
+	"version": "2.0.2",
 	"description": "Framework-agnostic WebRTC video meeting SDK powered by mediasoup",
 	"type": "module",
 	"main": "index.js",