@webex/plugin-meetings 3.0.0-beta.39 → 3.0.0-beta.391

package/dist/multistream/remoteMediaManager.js

@@ -23,12 +23,14 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/getPrototypeOf"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/defineProperty"));
 var _remove2 = _interopRequireDefault(require("lodash/remove"));
+var _forEach2 = _interopRequireDefault(require("lodash/forEach"));
 var _cloneDeep2 = _interopRequireDefault(require("lodash/cloneDeep"));
 var _internalMediaCore = require("@webex/internal-media-core");
 var _loggerProxy = _interopRequireDefault(require("../common/logs/logger-proxy"));
 var _eventsScope = _interopRequireDefault(require("../common/events/events-scope"));
 var _remoteMedia = require("./remoteMedia");
 var _remoteMediaGroup = require("./remoteMediaGroup");
+var _constants = require("../constants");
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = _Reflect$construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct) return false; if (_Reflect$construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 /* Predefined layouts: */
@@ -69,6 +71,7 @@ var OnePlusFiveLayout = {
 };
 
 // A layout with 2 big panes for 2 main active speakers and a strip of 6 small panes for other active speakers:
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 var TwoMainPlusSixSmallLayout = {
   activeSpeakerVideoPaneGroups: [{
     id: 'mainGroupWith2BigPanes',
@@ -151,6 +154,7 @@ var Event;
 exports.Event = Event;
 (function (Event) {
   Event["AudioCreated"] = "AudioCreated";
+  Event["InterpretationAudioCreated"] = "InterpretationAudioCreated";
   Event["ScreenShareAudioCreated"] = "ScreenShareAudioCreated";
   Event["VideoLayoutChanged"] = "VideoLayoutChanged";
 })(Event || (exports.Event = Event = {}));
@@ -191,7 +195,10 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
     _this.receiveSlotManager = receiveSlotManager;
     _this.mediaRequestManagers = mediaRequestManagers;
     _this.media = {
-      audio: undefined,
+      audio: {
+        main: undefined,
+        si: undefined
+      },
       video: {
         activeSpeakerGroups: {},
         memberPanes: {}
@@ -203,7 +210,10 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
     };
     _this.checkConfigValidity();
     _this.slots = {
-      audio: [],
+      audio: {
+        main: [],
+        si: undefined
+      },
       screenShare: {
         audio: [],
         video: undefined
@@ -319,10 +329,13 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
       });
 
       // release all audio receive slots
-      this.slots.audio.forEach(function (slot) {
+      this.slots.audio.main.forEach(function (slot) {
         return _this2.receiveSlotManager.releaseSlot(slot);
       });
-      this.slots.audio.length = 0;
+      this.slots.audio.main.length = 0;
+      if (this.slots.audio.si) {
+        this.receiveSlotManager.releaseSlot(this.slots.audio.si);
+      }
 
       // release screen share slots
       this.slots.screenShare.audio.forEach(function (slot) {
@@ -435,15 +448,16 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
               }
               throw new Error('setLayout() called before start()');
             case 4:
+              _loggerProxy.default.logger.log("RemoteMediaManager#setLayout --> new layout selected: ".concat(layoutId));
               this.currentLayoutId = layoutId;
               this.currentLayout = (0, _cloneDeep2.default)(this.config.video.layouts[this.currentLayoutId]);
-              _context3.next = 8;
+              _context3.next = 9;
               return this.updateVideoReceiveSlots();
-            case 8:
+            case 9:
               this.updateVideoRemoteMediaObjects();
               this.updateScreenShareVideoRemoteMediaObject();
               this.emitVideoLayoutChangedEvent();
-            case 11:
+            case 12:
             case "end":
               return _context3.stop();
           }
@@ -465,75 +479,206 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
       return this.currentLayoutId;
     }
 
+    /**
+     * sets the preferLiveVideo
+     */
+  }, {
+    key: "setPreferLiveVideo",
+    value: function setPreferLiveVideo(preferLiveVideo) {
+      _loggerProxy.default.logger.log("RemoteMediaManager#setPreferLiveVideo --> setPreferLiveVideo is called to set preferLiveVideo to ".concat(preferLiveVideo));
+      this.config.video.preferLiveVideo = preferLiveVideo;
+      (0, _values.default)(this.media.video.activeSpeakerGroups).forEach(function (activeSpeakerGroup) {
+        activeSpeakerGroup.setPreferLiveVideo(preferLiveVideo, false);
+      });
+      this.mediaRequestManagers.video.commit();
+    }
+
+    /**
+     * Sets CSIs for multiple RemoteMedia instances belonging to RemoteMediaGroup.
+     * For each entry in the remoteMediaCsis array:
+     * - if csi is specified, the RemoteMedia instance is pinned to that CSI
+     * - if csi is undefined, the RemoteMedia instance is unpinned
+     */
+  }, {
+    key: "setActiveSpeakerCsis",
+    value: function setActiveSpeakerCsis(remoteMediaCsis) {
+      (0, _values.default)(this.media.video.activeSpeakerGroups).forEach(function (remoteMediaGroup) {
+        var groupRemoteMediaCsis = remoteMediaCsis.filter(function (_ref) {
+          var remoteMedia = _ref.remoteMedia;
+          return remoteMediaGroup.includes(remoteMedia);
+        });
+        if (groupRemoteMediaCsis.length > 0) {
+          remoteMediaGroup.setActiveSpeakerCsis(groupRemoteMediaCsis, false);
+        }
+      });
+      this.mediaRequestManagers.video.commit();
+    }
+
+    /**
+     * Sets which named media group need receiving
+     * @param {MediaType} mediaType of the stream
+     * @param {number} languageCode of the stream. If the languageId is 0, the named media group request will be canceled,
+     * and only receive the main audio stream.
+     * @returns {void}
+     */
+  }, {
+    key: "setReceiveNamedMediaGroup",
+    value: function () {
+      var _setReceiveNamedMediaGroup = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4(mediaType, languageId) {
+        var _this$config$namedMed;
+        var value;
+        return _regenerator.default.wrap(function _callee4$(_context4) {
+          while (1) switch (_context4.prev = _context4.next) {
+            case 0:
+              if (!(mediaType !== _internalMediaCore.MediaType.AudioMain)) {
+                _context4.next = 2;
+                break;
+              }
+              throw new Error("cannot set receive named media group which media type is ".concat(mediaType));
+            case 2:
+              value = languageId;
+              if (!(value === ((_this$config$namedMed = this.config.namedMediaGroup) === null || _this$config$namedMed === void 0 ? void 0 : _this$config$namedMed.value))) {
+                _context4.next = 5;
+                break;
+              }
+              return _context4.abrupt("return");
+            case 5:
+              this.config.namedMediaGroup = {
+                type: _constants.NAMED_MEDIA_GROUP_TYPE_AUDIO,
+                value: value
+              };
+              if (this.media.audio.si) {
+                _context4.next = 11;
+                break;
+              }
+              _context4.next = 9;
+              return this.createInterpretationAudioMedia(true);
+            case 9:
+              _context4.next = 12;
+              break;
+            case 11:
+              this.media.audio.si.setNamedMediaGroup(this.config.namedMediaGroup, true);
+            case 12:
+            case "end":
+              return _context4.stop();
+          }
+        }, _callee4, this);
+      }));
+      function setReceiveNamedMediaGroup(_x2, _x3) {
+        return _setReceiveNamedMediaGroup.apply(this, arguments);
+      }
+      return setReceiveNamedMediaGroup;
+    }()
     /**
      * Creates the audio slots
      */
   }, {
     key: "createAudioMedia",
     value: function () {
-      var _createAudioMedia = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee4() {
+      var _createAudioMedia = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee5() {
         var i, slot;
-        return _regenerator.default.wrap(function _callee4$(_context4) {
-          while (1) switch (_context4.prev = _context4.next) {
+        return _regenerator.default.wrap(function _callee5$(_context5) {
+          while (1) switch (_context5.prev = _context5.next) {
             case 0:
+              _context5.next = 2;
+              return this.createInterpretationAudioMedia(false);
+            case 2:
               i = 0;
-            case 1:
+            case 3:
               if (!(i < this.config.audio.numOfActiveSpeakerStreams)) {
-                _context4.next = 9;
+                _context5.next = 11;
                 break;
               }
-              _context4.next = 4;
+              _context5.next = 6;
               return this.receiveSlotManager.allocateSlot(_internalMediaCore.MediaType.AudioMain);
-            case 4:
-              slot = _context4.sent;
-              this.slots.audio.push(slot);
             case 6:
+              slot = _context5.sent;
+              this.slots.audio.main.push(slot);
+            case 8:
               i += 1;
-              _context4.next = 1;
+              _context5.next = 3;
               break;
-            case 9:
-              // create a remote media group
-              this.media.audio = new _remoteMediaGroup.RemoteMediaGroup(this.mediaRequestManagers.audio, this.slots.audio, 255, true);
+            case 11:
+              // create a remote media group for main audio
+              this.media.audio.main = new _remoteMediaGroup.RemoteMediaGroup(this.mediaRequestManagers.audio, this.slots.audio.main, 255, true);
               this.emit({
                 file: 'multistream/remoteMediaManager',
                 function: 'createAudioMedia'
-              }, Event.AudioCreated, this.media.audio);
-            case 11:
+              }, Event.AudioCreated, this.media.audio.main);
+            case 13:
             case "end":
-              return _context4.stop();
+              return _context5.stop();
           }
-        }, _callee4, this);
+        }, _callee5, this);
       }));
       function createAudioMedia() {
         return _createAudioMedia.apply(this, arguments);
       }
       return createAudioMedia;
     }()
+    /**
+     * Creates the audio slots for named media
+     */
+  }, {
+    key: "createInterpretationAudioMedia",
+    value: function () {
+      var _createInterpretationAudioMedia = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee6(commitRequest) {
+        var _this$config$namedMed2, _this$config$namedMed3;
+        return _regenerator.default.wrap(function _callee6$(_context6) {
+          while (1) switch (_context6.prev = _context6.next) {
+            case 0:
+              if (!(((_this$config$namedMed2 = this.config.namedMediaGroup) === null || _this$config$namedMed2 === void 0 ? void 0 : _this$config$namedMed2.type) === _constants.NAMED_MEDIA_GROUP_TYPE_AUDIO && (_this$config$namedMed3 = this.config.namedMediaGroup) !== null && _this$config$namedMed3 !== void 0 && _this$config$namedMed3.value)) {
+                _context6.next = 6;
+                break;
+              }
+              _context6.next = 3;
+              return this.receiveSlotManager.allocateSlot(_internalMediaCore.MediaType.AudioMain);
+            case 3:
+              this.slots.audio.si = _context6.sent;
+              // create a remote media group for si audio
+              this.media.audio.si = new _remoteMediaGroup.RemoteMediaGroup(this.mediaRequestManagers.audio, [this.slots.audio.si], 255, commitRequest, {
+                namedMediaGroup: this.config.namedMediaGroup
+              });
+              this.emit({
+                file: 'multistream/remoteMediaManager',
+                function: 'createInterpretationAudioMedia'
+              }, Event.InterpretationAudioCreated, this.media.audio.si);
+            case 6:
+            case "end":
+              return _context6.stop();
+          }
+        }, _callee6, this);
+      }));
+      function createInterpretationAudioMedia(_x4) {
+        return _createInterpretationAudioMedia.apply(this, arguments);
+      }
+      return createInterpretationAudioMedia;
+    }()
     /**
      * Creates receive slots required for receiving screen share audio and video
      */
   }, {
     key: "createScreenShareReceiveSlots",
     value: function () {
-      var _createScreenShareReceiveSlots = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee5() {
+      var _createScreenShareReceiveSlots = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee7() {
         var i, slot, isAnyLayoutContainingScreenShareVideo;
-        return _regenerator.default.wrap(function _callee5$(_context5) {
-          while (1) switch (_context5.prev = _context5.next) {
+        return _regenerator.default.wrap(function _callee7$(_context7) {
+          while (1) switch (_context7.prev = _context7.next) {
             case 0:
               i = 0;
             case 1:
               if (!(i < this.config.audio.numOfScreenShareStreams)) {
-                _context5.next = 9;
+                _context7.next = 9;
                 break;
               }
-              _context5.next = 4;
+              _context7.next = 4;
               return this.receiveSlotManager.allocateSlot(_internalMediaCore.MediaType.AudioSlides);
             case 4:
-              slot = _context5.sent;
+              slot = _context7.sent;
               this.slots.screenShare.audio.push(slot);
             case 6:
               i += 1;
-              _context5.next = 1;
+              _context7.next = 1;
               break;
             case 9:
               // video
@@ -541,18 +686,18 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
                 return !!layout.screenShareVideo;
               });
               if (!isAnyLayoutContainingScreenShareVideo) {
-                _context5.next = 14;
+                _context7.next = 14;
                 break;
               }
-              _context5.next = 13;
+              _context7.next = 13;
               return this.receiveSlotManager.allocateSlot(_internalMediaCore.MediaType.VideoSlides);
             case 13:
-              this.slots.screenShare.video = _context5.sent;
+              this.slots.screenShare.video = _context7.sent;
             case 14:
             case "end":
-              return _context5.stop();
+              return _context7.stop();
           }
-        }, _callee5, this);
+        }, _callee7, this);
       }));
       function createScreenShareReceiveSlots() {
         return _createScreenShareReceiveSlots.apply(this, arguments);
@@ -618,109 +763,221 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
     }
 
     /**
-     * Allocates receive slots to all video panes in the current selected layout
+     * Allocates receive slots to all active speaker video panes
+     * in the current selected layout.
+     *
+     * Allocation tries to keep the same order of the slots between the previous
+     * layout and the new one. Sorting helps making sure that highest priority slots
+     * go in the same order in the new layout.
      */
   }, {
-    key: "allocateSlotsToVideoPaneGroups",
-    value: function allocateSlotsToVideoPaneGroups() {
+    key: "allocateSlotsToActiveSpeakerPaneGroups",
+    value: function allocateSlotsToActiveSpeakerPaneGroups() {
       var _this$currentLayout2,
         _this$currentLayout2$,
-        _this5 = this,
-        _this$currentLayout3,
-        _this$currentLayout3$;
-      this.receiveSlotAllocations = {
-        activeSpeaker: {},
-        receiverSelected: {}
-      };
-      (_this$currentLayout2 = this.currentLayout) === null || _this$currentLayout2 === void 0 ? void 0 : (_this$currentLayout2$ = _this$currentLayout2.activeSpeakerVideoPaneGroups) === null || _this$currentLayout2$ === void 0 ? void 0 : _this$currentLayout2$.forEach(function (group) {
+        _this$currentLayout2$2,
+        _this5 = this;
+      (_this$currentLayout2 = this.currentLayout) === null || _this$currentLayout2 === void 0 ? void 0 : (_this$currentLayout2$ = _this$currentLayout2.activeSpeakerVideoPaneGroups
+      // sorting in descending order based on group priority
+      ) === null || _this$currentLayout2$ === void 0 ? void 0 : (_this$currentLayout2$2 = _this$currentLayout2$.sort(function (a, b) {
+        return a.priority < b.priority ? 1 : -1;
+      })) === null || _this$currentLayout2$2 === void 0 ? void 0 : _this$currentLayout2$2.forEach(function (group) {
         _this5.receiveSlotAllocations.activeSpeaker[group.id] = {
           slots: []
         };
         for (var paneIndex = 0; paneIndex < group.numPanes; paneIndex += 1) {
-          // allocate a slot from the "unused" list
-          var freeSlot = _this5.slots.video.unused.pop();
+          // allocate a slot from the "unused" list, by grabbing in same order (shift) as previous layout
+          var freeSlot = _this5.slots.video.unused.shift();
           if (freeSlot) {
             _this5.slots.video.activeSpeaker.push(freeSlot);
             _this5.receiveSlotAllocations.activeSpeaker[group.id].slots.push(freeSlot);
           }
         }
       });
+    }
+
+    /**
+     * Allocates receive slots to all receiver selected video panes
+     * in the current selected layout
+     */
+  }, {
+    key: "allocateSlotsToReceiverSelectedVideoPaneGroups",
+    value: function allocateSlotsToReceiverSelectedVideoPaneGroups() {
+      var _this$currentLayout3,
+        _this$currentLayout3$,
+        _this6 = this;
       (_this$currentLayout3 = this.currentLayout) === null || _this$currentLayout3 === void 0 ? void 0 : (_this$currentLayout3$ = _this$currentLayout3.memberVideoPanes) === null || _this$currentLayout3$ === void 0 ? void 0 : _this$currentLayout3$.forEach(function (memberPane) {
         // check if there is existing slot for this csi
-        var existingSlot = _this5.slots.video.receiverSelected.find(function (slot) {
+        var existingSlot = _this6.slots.video.receiverSelected.find(function (slot) {
           return slot.csi === memberPane.csi;
         });
-        var isExistingSlotAlreadyAllocated = (0, _values.default)(_this5.receiveSlotAllocations.receiverSelected).includes(existingSlot);
+        var isExistingSlotAlreadyAllocated = (0, _values.default)(_this6.receiveSlotAllocations.receiverSelected).includes(existingSlot);
         if (memberPane.csi !== undefined && existingSlot && !isExistingSlotAlreadyAllocated) {
           // found it, so use it
-          _this5.receiveSlotAllocations.receiverSelected[memberPane.id] = existingSlot;
+          _this6.receiveSlotAllocations.receiverSelected[memberPane.id] = existingSlot;
         } else {
           // allocate a slot from the "unused" list
-          var freeSlot = _this5.slots.video.unused.pop();
+          var freeSlot = _this6.slots.video.unused.pop();
           if (freeSlot) {
-            _this5.slots.video.receiverSelected.push(freeSlot);
-            _this5.receiveSlotAllocations.receiverSelected[memberPane.id] = freeSlot;
+            _this6.slots.video.receiverSelected.push(freeSlot);
+            _this6.receiveSlotAllocations.receiverSelected[memberPane.id] = freeSlot;
           }
         }
       });
     }
 
     /**
-     * Makes sure we have the right number of receive slots created for the current layout
-     * and allocates them to the right video panes / pane groups
-     *
-     * @returns {Promise}
+     * Ensures that we have enough slots for the current layout.
      */
   }, {
-    key: "updateVideoReceiveSlots",
+    key: "refillRequiredSlotsIfNeeded",
     value: function () {
-      var _updateVideoReceiveSlots = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee6() {
-        var _this$slots$video$unu4;
+      var _refillRequiredSlotsIfNeeded = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee8() {
         var requiredNumSlots, totalNumSlots, numSlotsToCreate;
-        return _regenerator.default.wrap(function _callee6$(_context6) {
-          while (1) switch (_context6.prev = _context6.next) {
+        return _regenerator.default.wrap(function _callee8$(_context8) {
+          while (1) switch (_context8.prev = _context8.next) {
             case 0:
               requiredNumSlots = this.getRequiredNumVideoSlotsForLayout(this.currentLayout);
-              totalNumSlots = this.slots.video.unused.length + this.slots.video.activeSpeaker.length + this.slots.video.receiverSelected.length; // ensure we have enough total slots for current layout
+              totalNumSlots = this.slots.video.unused.length + this.slots.video.activeSpeaker.length + this.slots.video.receiverSelected.length;
               if (!(totalNumSlots < requiredNumSlots)) {
-                _context6.next = 13;
+                _context8.next = 13;
                 break;
               }
               numSlotsToCreate = requiredNumSlots - totalNumSlots;
             case 4:
               if (!(numSlotsToCreate > 0)) {
-                _context6.next = 13;
+                _context8.next = 13;
                 break;
               }
-              _context6.t0 = this.slots.video.unused;
-              _context6.next = 8;
+              _context8.t0 = this.slots.video.unused;
+              _context8.next = 8;
               return this.receiveSlotManager.allocateSlot(_internalMediaCore.MediaType.VideoMain);
             case 8:
-              _context6.t1 = _context6.sent;
-              _context6.t0.push.call(_context6.t0, _context6.t1);
+              _context8.t1 = _context8.sent;
+              _context8.t0.push.call(_context8.t0, _context8.t1);
               numSlotsToCreate -= 1;
-              _context6.next = 4;
+              _context8.next = 4;
               break;
             case 13:
-              // move all no longer needed receiver-selected slots to "unused"
-              this.trimReceiverSelectedSlots();
+            case "end":
+              return _context8.stop();
+          }
+        }, _callee8, this);
+      }));
+      function refillRequiredSlotsIfNeeded() {
+        return _refillRequiredSlotsIfNeeded.apply(this, arguments);
+      }
+      return refillRequiredSlotsIfNeeded;
+    }()
+    /**
+     * Move all active speaker slots to "unused"
+     */
+  }, {
+    key: "trimActiveSpeakerSlots",
+    value: function trimActiveSpeakerSlots() {
+      var _this$slots$video$unu4;
+      (_this$slots$video$unu4 = this.slots.video.unused).push.apply(_this$slots$video$unu4, (0, _toConsumableArray2.default)(this.slots.video.activeSpeaker));
+      this.slots.video.activeSpeaker.length = 0;
+    }
 
+    /**
+     * Logs the state of the receive slots
+     */
+  }, {
+    key: "logMainVideoReceiveSlots",
+    value: function logMainVideoReceiveSlots() {
+      var logMessage = '';
+      (0, _forEach2.default)(this.receiveSlotAllocations.activeSpeaker, function (group, groupName) {
+        logMessage += "\ngroup: ".concat(groupName, "\n").concat(group.slots.map(function (slot) {
+          return slot.logString;
+        }).join(', '));
+      });
+      logMessage += '\nreceiverSelected:\n';
+      (0, _forEach2.default)(this.receiveSlotAllocations.receiverSelected, function (slot, key) {
+        logMessage += " ".concat(key, ": ").concat(slot.logString, "\n");
+      });
+      _loggerProxy.default.logger.log("RemoteMediaManager#logMainVideoReceiveSlots --> MAIN VIDEO receive slots: unused=".concat(this.slots.video.unused.length, ", activeSpeaker=").concat(this.slots.video.activeSpeaker.length, ", receiverSelected=").concat(this.slots.video.receiverSelected.length).concat(logMessage));
+    }
+
+    /** logs main audio slots */
+  }, {
+    key: "logMainAudioReceiveSlots",
+    value: function logMainAudioReceiveSlots() {
+      _loggerProxy.default.logger.log("RemoteMediaManager#logMainAudioReceiveSlots --> MAIN AUDIO receive slots: ".concat(this.slots.audio.main.map(function (slot) {
+        return slot.logString;
+      }).join(', ')));
+    }
+
+    /** logs slides video slots */
+  }, {
+    key: "logSlidesVideoReceiveSlots",
+    value: function logSlidesVideoReceiveSlots() {
+      var _this$slots$screenSha;
+      _loggerProxy.default.logger.log("RemoteMediaManager#logSlidesVideoReceiveSlots --> SLIDES VIDEO receive slot: ".concat((_this$slots$screenSha = this.slots.screenShare.video) === null || _this$slots$screenSha === void 0 ? void 0 : _this$slots$screenSha.logString));
+    }
+
+    /** logs slides audio slots */
+  }, {
+    key: "logSlidesAudioReceiveSlots",
+    value: function logSlidesAudioReceiveSlots() {
+      _loggerProxy.default.logger.log("RemoteMediaManager#logSlidesAudioReceiveSlots --> SLIDES AUDIO receive slots: ".concat(this.slots.screenShare.audio.map(function (slot) {
+        return slot.logString;
+      }).join(', ')));
+    }
+
+    /** Logs all current receive slots */
+  }, {
+    key: "logAllReceiveSlots",
+    value: function logAllReceiveSlots() {
+      this.logMainVideoReceiveSlots();
+      this.logMainAudioReceiveSlots();
+      this.logSlidesVideoReceiveSlots();
+      this.logSlidesAudioReceiveSlots();
+    }
+
+    /**
+     * Makes sure we have the right number of receive slots created for the current layout
+     * and allocates them to the right video panes / pane groups
+     *
+     * @returns {Promise}
+     */
+  }, {
+    key: "updateVideoReceiveSlots",
+    value: function () {
+      var _updateVideoReceiveSlots = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee9() {
+        return _regenerator.default.wrap(function _callee9$(_context9) {
+          while (1) switch (_context9.prev = _context9.next) {
+            case 0:
               // move all active speaker slots to "unused"
-              (_this$slots$video$unu4 = this.slots.video.unused).push.apply(_this$slots$video$unu4, (0, _toConsumableArray2.default)(this.slots.video.activeSpeaker));
-              this.slots.video.activeSpeaker.length = 0;
+              this.trimActiveSpeakerSlots();
+
+              // move all no longer needed receiver-selected slots to "unused"
+              this.trimReceiverSelectedSlots();
 
+              // ensure we have enough total slots for current layout
+              _context9.next = 4;
+              return this.refillRequiredSlotsIfNeeded();
+            case 4:
               // allocate the slots to the right panes / pane groups
-              this.allocateSlotsToVideoPaneGroups();
-              _loggerProxy.default.logger.log("RemoteMediaManager#updateVideoReceiveSlots --> receive slots updated: unused=".concat(this.slots.video.unused.length, ", activeSpeaker=").concat(this.slots.video.activeSpeaker.length, ", receiverSelected=").concat(this.slots.video.receiverSelected.length));
+              // reset allocations
+              this.receiveSlotAllocations = {
+                activeSpeaker: {},
+                receiverSelected: {}
+              };
+              // allocate active speaker
+              this.allocateSlotsToActiveSpeakerPaneGroups();
+              // allocate receiver selected
+              this.allocateSlotsToReceiverSelectedVideoPaneGroups();
+              this.logMainVideoReceiveSlots();
 
               // If this is the initial layout, there may be some "unused" slots left because of the preallocation
               // done in this.preallocateVideoReceiveSlots(), so release them now
               this.releaseUnusedVideoSlots();
-            case 19:
+            case 9:
             case "end":
-              return _context6.stop();
+              return _context9.stop();
           }
-        }, _callee6, this);
+        }, _callee9, this);
       }));
       function updateVideoReceiveSlots() {
         return _updateVideoReceiveSlots.apply(this, arguments);
@@ -734,7 +991,7 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
   }, {
     key: "updateVideoRemoteMediaObjects",
     value: function updateVideoRemoteMediaObjects() {
-      var _this6 = this;
+      var _this7 = this;
       // invalidate all the previous remote media objects and cancel their media requests
       this.invalidateCurrentRemoteMedia({
         audio: false,
@@ -748,19 +1005,19 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
       this.media.video.activeSpeakerGroups = {};
       this.media.video.memberPanes = {};
       var _loop = function _loop() {
-        var _this6$currentLayout, _this6$currentLayout$;
+        var _this7$currentLayout, _this7$currentLayout$;
         var _Object$entries$_i = (0, _slicedToArray2.default)(_Object$entries[_i], 2),
           groupId = _Object$entries$_i[0],
           group = _Object$entries$_i[1];
-        var paneGroupInCurrentLayout = (_this6$currentLayout = _this6.currentLayout) === null || _this6$currentLayout === void 0 ? void 0 : (_this6$currentLayout$ = _this6$currentLayout.activeSpeakerVideoPaneGroups) === null || _this6$currentLayout$ === void 0 ? void 0 : _this6$currentLayout$.find(function (groupInLayout) {
+        var paneGroupInCurrentLayout = (_this7$currentLayout = _this7.currentLayout) === null || _this7$currentLayout === void 0 ? void 0 : (_this7$currentLayout$ = _this7$currentLayout.activeSpeakerVideoPaneGroups) === null || _this7$currentLayout$ === void 0 ? void 0 : _this7$currentLayout$.find(function (groupInLayout) {
           return groupInLayout.id === groupId;
         });
         if (paneGroupInCurrentLayout) {
-          var mediaGroup = new _remoteMediaGroup.RemoteMediaGroup(_this6.mediaRequestManagers.video, group.slots, paneGroupInCurrentLayout.priority, false, {
-            preferLiveVideo: _this6.config.video.preferLiveVideo,
+          var mediaGroup = new _remoteMediaGroup.RemoteMediaGroup(_this7.mediaRequestManagers.video, group.slots, paneGroupInCurrentLayout.priority, false, {
+            preferLiveVideo: _this7.config.video.preferLiveVideo,
             resolution: paneGroupInCurrentLayout.size
           });
-          _this6.media.video.activeSpeakerGroups[groupId] = mediaGroup;
+          _this7.media.video.activeSpeakerGroups[groupId] = mediaGroup;
         } else {
           // this should never happen, because this.receiveSlotAllocations are created based on current layout configuration
           _loggerProxy.default.logger.warn("a group id ".concat(groupId, " from this.receiveSlotAllocations.activeSpeaker cannot be found in the current layout configuration"));
@@ -772,21 +1029,21 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
 
       // create new remoteMedia objects
       var _loop2 = function _loop2() {
-        var _this6$currentLayout2, _this6$currentLayout3;
+        var _this7$currentLayout2, _this7$currentLayout3;
         var _Object$entries3$_i = (0, _slicedToArray2.default)(_Object$entries3[_i2], 2),
           paneId = _Object$entries3$_i[0],
           slot = _Object$entries3$_i[1];
-        var paneInCurrentLayout = (_this6$currentLayout2 = _this6.currentLayout) === null || _this6$currentLayout2 === void 0 ? void 0 : (_this6$currentLayout3 = _this6$currentLayout2.memberVideoPanes) === null || _this6$currentLayout3 === void 0 ? void 0 : _this6$currentLayout3.find(function (paneInLayout) {
+        var paneInCurrentLayout = (_this7$currentLayout2 = _this7.currentLayout) === null || _this7$currentLayout2 === void 0 ? void 0 : (_this7$currentLayout3 = _this7$currentLayout2.memberVideoPanes) === null || _this7$currentLayout3 === void 0 ? void 0 : _this7$currentLayout3.find(function (paneInLayout) {
           return paneInLayout.id === paneId;
         });
         if (paneInCurrentLayout) {
-          var remoteMedia = new _remoteMedia.RemoteMedia(slot, _this6.mediaRequestManagers.video, {
+          var remoteMedia = new _remoteMedia.RemoteMedia(slot, _this7.mediaRequestManagers.video, {
             resolution: paneInCurrentLayout.size
           });
           if (paneInCurrentLayout.csi) {
             remoteMedia.sendMediaRequest(paneInCurrentLayout.csi, false);
           }
-          _this6.media.video.memberPanes[paneId] = remoteMedia;
+          _this7.media.video.memberPanes[paneId] = remoteMedia;
         } else {
           // this should never happen, because this.receiveSlotAllocations are created based on current layout configuration
           _loggerProxy.default.logger.warn("a pane id ".concat(paneId, " from this.receiveSlotAllocations.receiverSelected cannot be found in the current layout configuration"));
@@ -837,8 +1094,13 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
         screenShareAudio = options.screenShareAudio,
         screenShareVideo = options.screenShareVideo,
         commit = options.commit;
-      if (audio && this.media.audio) {
-        this.media.audio.stop(commit);
+      if (audio) {
+        if (this.media.audio.main) {
+          this.media.audio.main.stop(commit);
+        }
+        if (this.media.audio.si) {
+          this.media.audio.si.stop(commit);
+        }
       }
       if (video) {
         (0, _values.default)(this.media.video.activeSpeakerGroups).forEach(function (remoteMediaGroup) {
@@ -910,14 +1172,14 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
   }, {
     key: "addMemberVideoPane",
     value: function () {
-      var _addMemberVideoPane = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee7(newPane) {
+      var _addMemberVideoPane = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee10(newPane) {
         var _this$currentLayout5;
         var receiveSlot, remoteMedia;
-        return _regenerator.default.wrap(function _callee7$(_context7) {
-          while (1) switch (_context7.prev = _context7.next) {
+        return _regenerator.default.wrap(function _callee10$(_context10) {
+          while (1) switch (_context10.prev = _context10.next) {
             case 0:
               if (this.currentLayout) {
-                _context7.next = 2;
+                _context10.next = 2;
                 break;
               }
               throw new Error('There is no current layout selected, call start() first');
@@ -926,16 +1188,16 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
                 this.currentLayout.memberVideoPanes = [];
               }
               if (!(newPane.id in this.currentLayout.memberVideoPanes)) {
-                _context7.next = 5;
+                _context10.next = 5;
                 break;
               }
               throw new Error("duplicate pane id ".concat(newPane.id, " - this pane already exists in current layout's memberVideoPanes"));
             case 5:
               this.currentLayout.memberVideoPanes.push(newPane);
-              _context7.next = 8;
+              _context10.next = 8;
               return this.receiveSlotManager.allocateSlot(_internalMediaCore.MediaType.VideoMain);
             case 8:
-              receiveSlot = _context7.sent;
+              receiveSlot = _context10.sent;
               this.slots.video.receiverSelected.push(receiveSlot);
               remoteMedia = new _remoteMedia.RemoteMedia(receiveSlot, this.mediaRequestManagers.video, {
                 resolution: newPane.size
@@ -944,14 +1206,14 @@ var RemoteMediaManager = /*#__PURE__*/function (_EventsScope) {
                 remoteMedia.sendMediaRequest(newPane.csi, true);
               }
               this.media.video.memberPanes[newPane.id] = remoteMedia;
-              return _context7.abrupt("return", remoteMedia);
+              return _context10.abrupt("return", remoteMedia);
             case 14:
             case "end":
-              return _context7.stop();
+              return _context10.stop();
           }
-        }, _callee7, this);
+        }, _callee10, this);
       }));
-      function addMemberVideoPane(_x2) {
+      function addMemberVideoPane(_x5) {
         return _addMemberVideoPane.apply(this, arguments);
       }
       return addMemberVideoPane;