fcr-ui-scene 3.2.0 → 3.3.1

package/lib/modules/layout/store.js

@@ -23,25 +23,31 @@ exports["default"] = void 0;
 require("core-js/modules/es.array.filter.js");
 require("core-js/modules/es.array.find.js");
 require("core-js/modules/es.array.for-each.js");
+require("core-js/modules/es.array.includes.js");
 require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.array.map.js");
 require("core-js/modules/es.array.push.js");
 require("core-js/modules/es.array.slice.js");
 require("core-js/modules/es.array.some.js");
 require("core-js/modules/es.function.bind.js");
 require("core-js/modules/es.map.js");
+require("core-js/modules/es.object.entries.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/es.object.values.js");
 require("core-js/modules/es.set.js");
+require("core-js/modules/es.string.includes.js");
 require("core-js/modules/es.string.iterator.js");
 require("core-js/modules/es.weak-map.js");
 require("core-js/modules/esnext.async-iterator.filter.js");
 require("core-js/modules/esnext.async-iterator.find.js");
 require("core-js/modules/esnext.async-iterator.for-each.js");
+require("core-js/modules/esnext.async-iterator.map.js");
 require("core-js/modules/esnext.async-iterator.some.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.filter.js");
 require("core-js/modules/esnext.iterator.find.js");
 require("core-js/modules/esnext.iterator.for-each.js");
+require("core-js/modules/esnext.iterator.map.js");
 require("core-js/modules/esnext.iterator.some.js");
 require("core-js/modules/esnext.map.delete-all.js");
 require("core-js/modules/esnext.map.emplace.js");
@@ -95,6 +101,7 @@ var _type = require("agora-edu-core/lib/type");
 var _decorator = require("agora-foundation/lib/decorator");
 var _logger = require("agora-foundation/lib/logger");
 var _type2 = require("../video-window/type");
+var _eventStore = require("../../common/event-store");
 var _constant = require("../../utilities/constant");
 var _type3 = require("./type");
 var _Layout = require("./components/Layout");
@@ -104,8 +111,11 @@ var _type4 = require("../whiteboard/type");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _type5 = require("agora-edu-core/lib/room-control/chatroom-control/type");
 var _type6 = require("agora-rte-sdk/lib/core/scene/type");
+var _attendee = require("agora-ui-foundation/lib/components/participants/attendee");
+var _type7 = require("agora-edu-core/lib/room-control/privilege-control/type");
+var _get = _interopRequireDefault(require("lodash/get"));
 var _LayoutStore;
-var _initProto, _participantDecs, _init_participant, _chatDecs, _init_chat, _chatActionDecs, _init_chatAction, _stateBarDecs, _init_stateBar, _actionBarDecs, _init_actionBar, _layersDecs, _init_layers, _whiteboardDecs, _init_whiteboard, _init_collapsed, _init_galleryMaxSize, _init_aside, _init_asideContent, _init_localUserRole, _init_barHovering, _init_barLocked, _init_barHidden, _init_asideWidth, _init_userVolumeMap, _init_chatRoomState, _init_videoWindowPreviewType, _init_whiteboardActive, _init_spotlightStreamId, _init_shouldHideNonVideoParticipants, _init_participantCount, _init_ownerUser, _init_localUser, _init_enableSpotlight, _setWhiteboardActiveDecs, _setAsideWidthDecs, _updateSlotsDecs, _updateAsideContentDecs, _getAllowedOperationsDecs, _toggleLayoutDecs, _toggleCollapsedDecs, _setGalleryMaxSizeDecs, _toggleAsideDecs, _asideWidthChangedDecs, _toggleLayoutBarLockDecs, _toggleLayoutBarHiddenDecs, _resetLockTimerDecs, _setHoveringHandlerDecs, _setHoveringLeaveHandlerDecs, _onUserInfoUpdatedDecs, _handleLayoutUpdatedDecs, _init__handleLayoutUpdated, _handleFoldListChangedDecs, _handleMainListChangedDecs, _setBarHoveringDecs, _onAllUserCountUpdatedDecs, _handleConnectionUpdatedDecs, _onAudioVolumeUpdatedDecs, _ref;
+var _initProto, _participantDecs, _init_participant, _chatDecs, _init_chat, _chatActionDecs, _init_chatAction, _stateBarDecs, _init_stateBar, _actionBarDecs, _init_actionBar, _layersDecs, _init_layers, _whiteboardDecs, _init_whiteboard, _init_collapsed, _init_galleryMaxSize, _init_aside, _init_asideContent, _init_localUserRole, _init_barHovering, _init_barLocked, _init_barHidden, _init_asideWidth, _init_userVolumeMap, _init_chatRoomState, _init_videoWindowPreviewType, _init_whiteboardActive, _init_spotlightStreamId, _init_shouldHideNonVideoParticipants, _init_participantCount, _init_ownerUser, _init_localUser, _init_enableSpotlight, _init_isWaitingRoomNotify, _notifyParticipantShowWaitingRoomDecs, _setIsWaitingRoomNotifyDecs, _setWhiteboardActiveDecs, _setAsideWidthDecs, _updateSlotsDecs, _updateAsideContentDecs, _getAllowedOperationsDecs, _toggleLayoutDecs, _toggleCollapsedDecs, _setGalleryMaxSizeDecs, _toggleAsideDecs, _asideWidthChangedDecs, _toggleLayoutBarLockDecs, _toggleLayoutBarHiddenDecs, _resetLockTimerDecs, _setHoveringHandlerDecs, _setHoveringLeaveHandlerDecs, _onUserInfoUpdatedDecs, _handleLayoutUpdatedDecs, _init__handleLayoutUpdated, _handleFoldListChangedDecs, _handleMainListChangedDecs, _setBarHoveringDecs, _onAllUserCountUpdatedDecs, _handleConnectionUpdatedDecs, _onAudioVolumeUpdatedDecs, _ref;
 function _classPrivateFieldInitSpec(e, t, a) { _checkPrivateRedeclaration(e, t), t.set(e, a); }
 function _checkPrivateRedeclaration(e, t) { if (t.has(e)) throw new TypeError("Cannot initialize the same private elements twice on an object"); }
 function _classPrivateFieldSet(s, a, r) { return s.set(_assertClassBrand(s, a), r), r; }
@@ -142,7 +152,8 @@ var _W = /*#__PURE__*/new WeakMap();
 var _X = /*#__PURE__*/new WeakMap();
 var _Y = /*#__PURE__*/new WeakMap();
 var _Z = /*#__PURE__*/new WeakMap();
-_ref = (_participantDecs = [_mobx.observable, _mobx.observable.ref], _chatDecs = [_mobx.observable, _mobx.observable.ref], _chatActionDecs = [_mobx.observable, _mobx.observable.ref], _stateBarDecs = [_mobx.observable, _mobx.observable.ref], _actionBarDecs = [_mobx.observable, _mobx.observable.ref], _layersDecs = [_mobx.observable, _mobx.observable.ref], _whiteboardDecs = [_mobx.observable, _mobx.observable.ref], _setWhiteboardActiveDecs = [_mobx.action, _mobx.action.bound], _setAsideWidthDecs = [_mobx.action, _mobx.action.bound], _updateSlotsDecs = [_mobx.action, _mobx.action.bound], _updateAsideContentDecs = [_mobx.action, _mobx.action.bound], _getAllowedOperationsDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutDecs = [_mobx.action, _mobx.action.bound], _toggleCollapsedDecs = [_mobx.action, _mobx.action.bound], _setGalleryMaxSizeDecs = [_mobx.action, _mobx.action.bound], _toggleAsideDecs = [_mobx.action, _mobx.action.bound], _asideWidthChangedDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutBarLockDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutBarHiddenDecs = [_mobx.action, _mobx.action.bound], _resetLockTimerDecs = [_mobx.action, _mobx.action.bound], _setHoveringHandlerDecs = [_mobx.action, _mobx.action.bound], _setHoveringLeaveHandlerDecs = [_mobx.action, _mobx.action.bound], _onUserInfoUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleLayoutUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleFoldListChangedDecs = [_mobx.action, _mobx.action.bound], _handleMainListChangedDecs = [_mobx.action, _mobx.action.bound], _setBarHoveringDecs = [_mobx.action, _mobx.action.bound], _onAllUserCountUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleConnectionUpdatedDecs = [_mobx.action, _mobx.action.bound], _onAudioVolumeUpdatedDecs = [_mobx.action, _mobx.action.bound], "logger");
+var _a = /*#__PURE__*/new WeakMap();
+_ref = (_participantDecs = [_mobx.observable, _mobx.observable.ref], _chatDecs = [_mobx.observable, _mobx.observable.ref], _chatActionDecs = [_mobx.observable, _mobx.observable.ref], _stateBarDecs = [_mobx.observable, _mobx.observable.ref], _actionBarDecs = [_mobx.observable, _mobx.observable.ref], _layersDecs = [_mobx.observable, _mobx.observable.ref], _whiteboardDecs = [_mobx.observable, _mobx.observable.ref], _notifyParticipantShowWaitingRoomDecs = [_mobx.action, _mobx.action.bound], _setIsWaitingRoomNotifyDecs = [_mobx.action, _mobx.action.bound], _setWhiteboardActiveDecs = [_mobx.action, _mobx.action.bound], _setAsideWidthDecs = [_mobx.action, _mobx.action.bound], _updateSlotsDecs = [_mobx.action, _mobx.action.bound], _updateAsideContentDecs = [_mobx.action, _mobx.action.bound], _getAllowedOperationsDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutDecs = [_mobx.action, _mobx.action.bound], _toggleCollapsedDecs = [_mobx.action, _mobx.action.bound], _setGalleryMaxSizeDecs = [_mobx.action, _mobx.action.bound], _toggleAsideDecs = [_mobx.action, _mobx.action.bound], _asideWidthChangedDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutBarLockDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutBarHiddenDecs = [_mobx.action, _mobx.action.bound], _resetLockTimerDecs = [_mobx.action, _mobx.action.bound], _setHoveringHandlerDecs = [_mobx.action, _mobx.action.bound], _setHoveringLeaveHandlerDecs = [_mobx.action, _mobx.action.bound], _onUserInfoUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleLayoutUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleFoldListChangedDecs = [_mobx.action, _mobx.action.bound], _handleMainListChangedDecs = [_mobx.action, _mobx.action.bound], _setBarHoveringDecs = [_mobx.action, _mobx.action.bound], _onAllUserCountUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleConnectionUpdatedDecs = [_mobx.action, _mobx.action.bound], _onAudioVolumeUpdatedDecs = [_mobx.action, _mobx.action.bound], "logger");
 var LayoutStore = exports["default"] = /*#__PURE__*/function () {
   function LayoutStore(params) {
     var _this = this;
@@ -152,11 +163,18 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     (0, _defineProperty2["default"])(this, "_localView", null);
     (0, _defineProperty2["default"])(this, "_subscriptions", []);
     (0, _defineProperty2["default"])(this, "_barLockTimer", 0);
+    (0, _defineProperty2["default"])(this, "_liveStreamState", _type.FcrLiveStreamingState.STOPPED);
     (0, _defineProperty2["default"])(this, "_chatRoomObserver", {
       onConnectionStateUpdated: this._handleConnectionUpdated.bind(this),
       onErrorOccurred: function onErrorOccurred() {},
       onTextMessageReceived: function onTextMessageReceived() {}
     });
+    (0, _defineProperty2["default"])(this, "_waitingRoomUserObserver", {
+      onRemoteUsersLeft: this._handleRemoteWaitingUserLeft.bind(this)
+    });
+    (0, _defineProperty2["default"])(this, "_waitingRoomObserver", {
+      onRoomMessageReceived: this._handleMessageReceived.bind(this)
+    });
     (0, _defineProperty2["default"])(this, "_managerRoleUpdateForToast", new Set([_type.FcrUserRole.HOST, _type.FcrUserRole.COHOST]));
     // Slots
     _classPrivateFieldInitSpec(this, _A, _init_participant(this, null));
@@ -189,6 +207,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     _classPrivateFieldInitSpec(this, _X, _init_ownerUser(this, undefined));
     _classPrivateFieldInitSpec(this, _Y, _init_localUser(this));
     _classPrivateFieldInitSpec(this, _Z, _init_enableSpotlight(this, true));
+    _classPrivateFieldInitSpec(this, _a, _init_isWaitingRoomNotify(this, true));
     (0, _defineProperty2["default"])(this, "_handleLayoutUpdated", _init__handleLayoutUpdated(this, function (layout) {
       if (layout === _type3.FcrUIVideoWindowLayoutType.Speaker) {
         _this._switchToSpeaker();
@@ -206,7 +225,8 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
       _this._videoWindowDataSource.setSpeakerSpotlight(streamId);
     });
     var userControl = params.userControl,
-      chatRoomControl = params.chatRoomControl;
+      chatRoomControl = params.chatRoomControl,
+      roomControl = params.roomControl;
     this._securityStore = params.securityStore;
     this._deviceStore = params.deviceStore;
     this._uiEventStore = params.uiEventStore;
@@ -214,7 +234,13 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     this._streamControl = params.streamControl;
     this._chatRoomControl = chatRoomControl;
     this._whiteBoardControl = params.whiteBoardControl;
+    this._privilegeControl = params.privilegeControl;
     this.localUser = userControl.getLocalUser();
+    roomControl.addObserver({
+      onLiveStreamingStateUpdated: function onLiveStreamingStateUpdated(_, state) {
+        _this._liveStreamState = state;
+      }
+    });
     this._addListeners();
     //@ts-ignore
     window.layoutStore = this;
@@ -439,6 +465,14 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     set: function set(v) {
       _classPrivateFieldSet(_Z, this, v);
     }
+  }, {
+    key: "isWaitingRoomNotify",
+    get: function get() {
+      return _classPrivateFieldGet(_a, this);
+    },
+    set: function set(v) {
+      _classPrivateFieldSet(_a, this, v);
+    }
   }, {
     key: "deviceStore",
     get: function get() {
@@ -449,6 +483,16 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     get: function get() {
       return this._streamControl;
     }
+  }, {
+    key: "isWaterMarkEnabled",
+    get: function get() {
+      return this._securityStore.isWaterMarkEnabled();
+    }
+  }, {
+    key: "isMulti",
+    get: function get() {
+      return this._securityStore.isMulti();
+    }
   }, {
     key: "layout",
     get: function get() {
@@ -593,6 +637,24 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
       var _this$_userControl$ge;
       return (_this$_userControl$ge = this._userControl.getLocalUser()) === null || _this$_userControl$ge === void 0 ? void 0 : _this$_userControl$ge.userId;
     }
+  }, {
+    key: "getWaterMarkContent",
+    value: function getWaterMarkContent() {
+      return this._securityStore.getWaterMarkContent();
+    }
+  }, {
+    key: "notifyParticipantShowWaitingRoom",
+    value: function notifyParticipantShowWaitingRoom() {
+      this._uiEventStore.sendEvent(_constant.UIAction.TOGGLE_PARTICIPANT_TAB, _constant.RoomType.WAITING_ROOM);
+      this._uiEventStore.sendEvent(_constant.UIAction.CHANGE_PARTICIPANT_TAB, _constant.RoomType.WAITING_ROOM);
+      this._uiEventStore.sendEvent(_constant.UIAction.COLSE_NOTIFICATION, _eventStore.NotificationContentType.WAITING_ROOM);
+    }
+  }, {
+    key: "setIsWaitingRoomNotify",
+    value: function setIsWaitingRoomNotify() {
+      this.isWaitingRoomNotify = false;
+      this._uiEventStore.sendEvent(_constant.UIAction.COLSE_NOTIFICATION, _eventStore.NotificationContentType.WAITING_ROOM);
+    }
   }, {
     key: "hasMutePermission",
     value: function hasMutePermission(targetRole) {
@@ -614,7 +676,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
       var success = this._videoWindowDataSource.toggleMainStream(streamId);
       if (success) {
         if (this.layout === _type3.FcrUIVideoWindowLayoutType.Gallery) {
-          this.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Speaker);
+          this.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Speaker, true);
         }
       }
     }
@@ -689,7 +751,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     key: "setWhiteboardActive",
     value: function setWhiteboardActive(active) {
       this.whiteboardActive = active;
-      if (!active) {
+      if (!active && this.manualLayout) {
         this._uiEventStore.sendEvent(_constant.UIAction.TOGGLE_LAYOUT, {
           layout: this.manualLayout
         });
@@ -858,6 +920,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "onUserInfoUpdated",
     value: function onUserInfoUpdated(roomId, event) {
+      var _this5 = this;
       this._videoWindowDataSource.update(event.modifiedUser);
       this.setLocalUserRole(this._userControl.getLocalUser().userRole);
       if (this._managerRoleUpdateForToast.has(event.modifiedUser.userRole)) {
@@ -866,11 +929,15 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
         var toastContent = function toastContent() {
           var contentText = '';
           if (event.modifiedUser.userRole === _type.FcrUserRole.HOST) {
-            contentText = isMe ? (0, _i18n.transI18n)('fmt_attendies_tips_mine_new_host', {
-              reason1: userName
-            }) : (0, _i18n.transI18n)('fmt_attendies_tips_new_host', {
-              reason1: userName
-            });
+            if (_this5._liveStreamState === _type.FcrLiveStreamingState.STARTED) {
+              contentText = "\u79FB\u4EA4 \u4E3B\u6301\u4EBA\u5B8C\u6210\uFF0C\u76F4\u64AD\u505C\u6B62\uFF0C\u8BF7\u91CD\u65B0\u5F00\u542F\u76F4\u64AD";
+            } else {
+              contentText = isMe ? (0, _i18n.transI18n)('fmt_attendies_tips_mine_new_host', {
+                reason1: userName
+              }) : (0, _i18n.transI18n)('fmt_attendies_tips_new_host', {
+                reason1: userName
+              });
+            }
           } else if (event.modifiedUser.userRole === _type.FcrUserRole.COHOST) {
             contentText = isMe ? (0, _i18n.transI18n)('fmt_attendies_tips_mine_new_co_host') : (0, _i18n.transI18n)('fmt_attendies_tips_new_co_host', {
               reason1: userName
@@ -917,7 +984,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     key: "muteAudio",
     value: function muteAudio(mute, userId) {
       this._uiEventStore.sendEvent(_constant.UIAction.PARTICIPANT_ACTION, {
-        action: mute ? _constant.ParticipantType.MUTE_AUDIO : _constant.ParticipantType.UNMUTE_AUDIO,
+        action: mute ? _attendee.ParticipantActionType.MUTE_AUDIO : _attendee.ParticipantActionType.UNMUTE_AUDIO,
         userId: userId
       });
     }
@@ -1024,11 +1091,18 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
           this.ownerUser = _ownerUserId ? this._userControl.getUser(_ownerUserId) : undefined;
         }
       }
+      if (action === _constant.UIAction.WAITING_ROOM_CREATED) {
+        var room = payload.room;
+        this._waitingRoomControl = room;
+        this._waitingRoomControl.addObserver(this._waitingRoomObserver);
+        this._waitingRoomUserControl = room.getUserControl();
+        this._waitingRoomUserControl.addObserver(this._waitingRoomUserObserver);
+      }
     }
   }, {
     key: "_addListeners",
     value: function _addListeners() {
-      var _this5 = this;
+      var _this6 = this;
       this._uiEventStore.addObserver({
         onEvent: this.onEvent
       });
@@ -1055,112 +1129,112 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
       });
       this._whiteBoardControl.addObserver({
         onActive: function onActive() {
-          return _this5.setWhiteboardActive(true);
+          return _this6.setWhiteboardActive(true);
         },
         onInactive: function onInactive() {
-          return _this5.setWhiteboardActive(false);
+          return _this6.setWhiteboardActive(false);
         }
       });
       this._chatRoomControl.addObserver(this._chatRoomObserver);
       this._subscriptions.push((0, _mobx.reaction)(function () {
-        return _this5.mainList.length;
+        return _this6.mainList.length;
       }, function (length) {
         if (length < 2) {
-          if (_this5.layout === _type3.FcrUIVideoWindowLayoutType.Speaker) {
-            _this5.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Gallery);
+          if (_this6.layout === _type3.FcrUIVideoWindowLayoutType.Speaker) {
+            _this6.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Gallery);
           }
         }
-        _this5._uiEventStore.sendEvent(_constant.UIAction.MAIN_LIST_LENGTH_CHANGED, length);
+        _this6._uiEventStore.sendEvent(_constant.UIAction.MAIN_LIST_LENGTH_CHANGED, length);
       }), (0, _mobx.reaction)(function () {
-        return _this5.whiteboardActive;
+        return _this6.whiteboardActive;
       }, function (opened) {
         if (opened) {
-          var ownerUserId = _this5._whiteBoardControl.getBoardActiveInfo().ownerUserId;
-          var ownerUser = _this5._userControl.getUser(ownerUserId);
-          _this5._videoWindowDataSource.addBoard(ownerUser, ownerUserId === _this5.localUserId);
-          if (_this5.layout === _type3.FcrUIVideoWindowLayoutType.Gallery) {
-            _this5.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Speaker);
+          var ownerUserId = _this6._whiteBoardControl.getBoardActiveInfo().ownerUserId;
+          var ownerUser = _this6._userControl.getUser(ownerUserId);
+          _this6._videoWindowDataSource.addBoard(ownerUser, ownerUserId === _this6.localUserId);
+          if (_this6.layout === _type3.FcrUIVideoWindowLayoutType.Gallery) {
+            _this6.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Speaker);
           }
         } else {
-          _this5._videoWindowDataSource.removeBoard();
+          _this6._videoWindowDataSource.removeBoard();
         }
       }), (0, _mobx.reaction)(function () {
-        return _this5._securityStore.hasWriteBoardPermission();
+        return _this6._securityStore.hasWriteBoardPermission();
       }, function (canEdit) {
-        if (!_this5.mainList.some(function (u) {
+        if (!_this6.mainList.some(function (u) {
           return u.type === _type3.FcrUIWindowType.BOARD;
         })) return;
-        _this5._videoWindowDataSource.updateBoard(canEdit);
+        _this6._videoWindowDataSource.updateBoard(canEdit);
       }), (0, _mobx.reaction)(function () {
-        return _this5.galleryMaxSize;
+        return _this6.galleryMaxSize;
       }, function (size) {
-        _this5._uiEventStore.notifyLayoutSizeChanged({
+        _this6._uiEventStore.notifyLayoutSizeChanged({
           size: size
         });
       }), (0, _mobx.reaction)(function () {
-        return _this5.asideContent;
+        return _this6.asideContent;
       }, function (asideContent) {
         if (asideContent.participant || asideContent.chat) {
-          _this5.toggleAside(true);
+          _this6.toggleAside(true);
         }
         if (!asideContent.participant && !asideContent.chat) {
-          _this5.toggleAside(false);
+          _this6.toggleAside(false);
         }
       }, {
         fireImmediately: true
       }), (0, _mobx.reaction)(function () {
         return {
-          cameraEnabled: _this5._deviceStore.cameraEnabled,
-          cameraId: _this5._deviceStore.cameraId
+          cameraEnabled: _this6._deviceStore.cameraEnabled,
+          cameraId: _this6._deviceStore.cameraId
         };
       }, function (_ref13) {
         var cameraEnabled = _ref13.cameraEnabled,
           cameraId = _ref13.cameraId;
-        if (!cameraEnabled && _this5._localView) {
-          _this5.stopLocalPreview(_this5._localView);
+        if (!cameraEnabled && _this6._localView) {
+          _this6.stopLocalPreview(_this6._localView);
         }
-        if (cameraEnabled && cameraId && _this5._localView) {
-          _this5.startLocalPreview(_this5._localView);
+        if (cameraEnabled && cameraId && _this6._localView) {
+          _this6.startLocalPreview(_this6._localView);
         }
       }), (0, _mobx.reaction)(function () {
-        return _this5.barLocked;
+        return _this6.barLocked;
       }, function (barLocked) {
-        if (_this5._barLockTimer && barLocked) {
-          _this5.resetLockTimer();
+        if (_this6._barLockTimer && barLocked) {
+          _this6.resetLockTimer();
         } else {
-          _this5.setHoveringHandler();
+          _this6.setHoveringHandler();
         }
       }), (0, _mobx.reaction)(function () {
-        return _this5._deviceStore.microphoneVolumeLevel;
+        return _this6._deviceStore.microphoneVolumeLevel;
       }, function (volume) {
         (0, _mobx.runInAction)(function () {
-          _this5.userVolumeMap.set('0', volume);
+          _this6.userVolumeMap.set('0', volume);
         });
       }), (0, _mobx.reaction)(function () {
         return {
-          count: _this5.participantCount,
-          enableSpotlight: _this5.enableSpotlight
+          count: _this6.participantCount,
+          enableSpotlight: _this6.enableSpotlight
         };
       }, function (_ref14) {
         var count = _ref14.count,
           enableSpotlight = _ref14.enableSpotlight;
-        var enableSetSpotlight = _this5._isSetSpotlightEnable(count, enableSpotlight);
-        _this5._videoWindowDataSource.setSpotlightEnabled(enableSetSpotlight);
+        var enableSetSpotlight = _this6._isSetSpotlightEnable(count, enableSpotlight);
+        _this6._videoWindowDataSource.setSpotlightEnabled(enableSetSpotlight);
       }),
       // 录制的特殊逻辑：
       // 因为录制机器人不发流，且当前切换布局的逻辑是有多个人的视频窗口才切换到 speaker layout
       // 所以当房间只有主持人的时候录制机器人的视角不会切换到 speaker layout，故加上以下逻辑
       (0, _mobx.reaction)(function () {
-        var _this5$currentShareDa;
-        return (_this5$currentShareDa = _this5.currentShareData) === null || _this5$currentShareDa === void 0 ? void 0 : _this5$currentShareDa.hasScreenSharing;
+        var _this6$currentShareDa;
+        return (_this6$currentShareDa = _this6.currentShareData) === null || _this6$currentShareDa === void 0 ? void 0 : _this6$currentShareDa.hasScreenSharing;
       }, function (hasScreenSharing) {
-        if (_this5.isRobot) {
+        if (_this6.isRobot) {
           if (hasScreenSharing) {
-            _this5.logger.info('set layout to speaker for robot');
-            _this5.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Speaker);
+            _this6.logger.info('set layout to speaker for robot');
+            _this6.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Speaker);
           } else {
-            _this5.logger.info('set layout to gallery for robot');
-            _this5.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Gallery);
+            _this6.logger.info('set layout to gallery for robot');
+            _this6.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Gallery);
           }
         }
       }, {
@@ -1200,13 +1274,13 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "_initStream",
     value: function _initStream() {
-      var _this6 = this;
+      var _this7 = this;
       var isSharingScreen = false;
       this._streamControl.getStreamList().forEach(function (stream) {
         if (stream.videoSourceType === _agoraEduCore.FcrVideoSourceType.SCREEN) {
           isSharingScreen = true;
         }
-        _this6._handleStreamAdded(stream);
+        _this7._handleStreamAdded(stream);
       });
       if (isSharingScreen && this.layout === _type3.FcrUIVideoWindowLayoutType.Gallery) {
         this.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Speaker);
@@ -1252,34 +1326,34 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "_onStreamsAdded",
     value: function _onStreamsAdded(roomId, events) {
-      var _this7 = this;
+      var _this8 = this;
       events.forEach(function (_ref15) {
         var modifiedStream = _ref15.modifiedStream;
-        _this7._handleStreamAdded(modifiedStream);
+        _this8._handleStreamAdded(modifiedStream);
       });
     }
   }, {
     key: "_onStreamsUpdated",
     value: function _onStreamsUpdated(roomId, events) {
-      var _this8 = this;
+      var _this9 = this;
       events.forEach(function (_ref16) {
         var modifiedStream = _ref16.modifiedStream;
-        _this8._videoWindowDataSource.update(modifiedStream);
+        _this9._videoWindowDataSource.update(modifiedStream);
       });
     }
   }, {
     key: "_onStreamsRemoved",
     value: function _onStreamsRemoved(roomId, events) {
-      var _this9 = this;
+      var _this10 = this;
       events.forEach(function (_ref17) {
         var modifiedStream = _ref17.modifiedStream;
-        _this9._videoWindowDataSource["delete"](modifiedStream);
+        _this10._videoWindowDataSource["delete"](modifiedStream);
       });
       var hasScreenStream = events === null || events === void 0 ? void 0 : events.find(function (event) {
         var type = event.modifiedStream.streamType;
         return type === _type6.AgoraRteMediaStreamType.BOTH || type === _type6.AgoraRteMediaStreamType.VIDEO;
       });
-      if (hasScreenStream) {
+      if (hasScreenStream && this.manualLayout) {
         this._uiEventStore.sendEvent(_constant.UIAction.TOGGLE_LAYOUT, {
           layout: this.manualLayout
         });
@@ -1294,14 +1368,14 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "_findSpotlightStream",
     value: function _findSpotlightStream() {
-      var _this10 = this;
+      var _this11 = this;
       //find the max volume stream
       var res = {
         streamId: '',
         volume: 0
       };
       this.userVolumeMap.forEach(function (volume, id) {
-        var windowData = _this10.mainListMapByAudioStreamId.get(id);
+        var windowData = _this11.mainListMapByAudioStreamId.get(id);
         if (id !== '0' && !res.streamId && volume > 0 && windowData !== null && windowData !== void 0 && windowData.hasMicrophoneAudioStream) {
           res = {
             streamId: windowData.windowId,
@@ -1311,10 +1385,42 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
       });
       return res;
     }
+  }, {
+    key: "_handleRemoteWaitingUserLeft",
+    value: function _handleRemoteWaitingUserLeft(roomId, events) {
+      var _this$_privilegeContr;
+      var targetRoles = (_this$_privilegeContr = this._privilegeControl.getSecurityInfo(_type7.FcrSecurityAction.WaitingRoom).info) === null || _this$_privilegeContr === void 0 ? void 0 : _this$_privilegeContr.targetRoles;
+      if (this._waitingRoomUserControl) {
+        var users = this._waitingRoomUserControl.getUsers();
+        var userCount = Object.entries(users).map(function (_ref18) {
+          var _ref19 = (0, _slicedToArray2["default"])(_ref18, 2),
+            userId = _ref19[0],
+            user = _ref19[1];
+          return user;
+        }).filter(function (user) {
+          return targetRoles.includes(user.userRole);
+        }).length;
+        if (userCount === 0) {
+          this._uiEventStore.sendEvent(_constant.UIAction.COLSE_NOTIFICATION, _eventStore.NotificationContentType.WAITING_ROOM);
+        }
+      }
+    }
+  }, {
+    key: "_handleMessageReceived",
+    value: function _handleMessageReceived(roomId, message) {
+      if ((0, _get["default"])(message, 'payload.data.messageKey') === _type.RoomMessageKey.USER_WAITING_ROOM_JOINED && this.isWaitingRoomNotify) {
+        this._uiEventStore.showNotification({
+          type: _eventStore.NotificationContentType.WAITING_ROOM,
+          onOk: this.notifyParticipantShowWaitingRoom,
+          onClose: this.setIsWaitingRoomNotify,
+          placement: 'topLeft'
+        });
+      }
+    }
   }]);
 }();
 _LayoutStore = LayoutStore;
-var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_LayoutStore, [[_participantDecs, 17, "participant"], [_chatDecs, 17, "chat"], [_chatActionDecs, 17, "chatAction"], [_stateBarDecs, 17, "stateBar"], [_actionBarDecs, 17, "actionBar"], [_layersDecs, 17, "layers"], [_whiteboardDecs, 17, "whiteboard"], [_mobx.observable, 1, "collapsed"], [_mobx.observable, 1, "galleryMaxSize"], [_mobx.observable, 1, "aside"], [_mobx.observable, 1, "asideContent"], [_mobx.observable, 1, "localUserRole"], [_mobx.observable, 1, "barHovering"], [_mobx.observable, 1, "barLocked"], [_mobx.observable, 1, "barHidden"], [_mobx.observable, 1, "asideWidth"], [_mobx.observable, 1, "userVolumeMap"], [_mobx.observable, 1, "chatRoomState"], [_mobx.observable, 1, "videoWindowPreviewType"], [_mobx.observable, 1, "whiteboardActive"], [_mobx.observable, 1, "spotlightStreamId"], [_mobx.observable, 1, "shouldHideNonVideoParticipants"], [_mobx.observable, 1, "participantCount"], [_mobx.observable, 1, "ownerUser"], [_mobx.observable, 1, "localUser"], [_mobx.observable, 1, "enableSpotlight"], [_mobx.computed, 3, "layout"], [_mobx.computed, 3, "manualLayout"], [_mobx.computed, 3, "mainList"], [_mobx.computed, 3, "mainListMapByAudioStreamId"], [_mobx.computed, 3, "foldList"], [_mobx.computed, 3, "galleryList"], [_mobx.computed, 3, "carouselList"], [_mobx.computed, 3, "hasPinnedStream"], [_mobx.computed, 3, "isManager"], [_mobx.computed, 3, "isRobot"], [_mobx.computed, 3, "findSpotlightUser"], [_mobx.computed, 3, "microphoneEnabled"], [_mobx.computed, 3, "isHostOrCoHost"], [_decorator.bound, 2, "hasMutePermission"], [_decorator.bound, 2, "hasUnmutePermission"], [_decorator.bound, 2, "hasRequestStartAudioPermission"], [_decorator.bound, 2, "toggleMainStream"], [_decorator.bound, 2, "addPin"], [_decorator.bound, 2, "removePin"], [_decorator.bound, 2, "setVideoOrientation"], [_decorator.bound, 2, "setAllowChat"], [_decorator.bound, 2, "handleSetPinState"], [_setWhiteboardActiveDecs, 18, "setWhiteboardActive"], [_setAsideWidthDecs, 18, "setAsideWidth"], [_updateSlotsDecs, 18, "updateSlots"], [_updateAsideContentDecs, 18, "updateAsideContent"], [_decorator.bound, 2, "closeParticipantFromAside"], [_decorator.bound, 2, "moveParticipantFromAsideToDialog"], [_decorator.bound, 2, "closeChatFromAside"], [_decorator.bound, 2, "closeAsideChat"], [_decorator.bound, 2, "moveChatFromAsideToDialog"], [_decorator.bound, 2, "openPrivateChat"], [_getAllowedOperationsDecs, 18, "getAllowedOperations"], [_toggleLayoutDecs, 18, "toggleLayout"], [_toggleCollapsedDecs, 18, "toggleCollapsed"], [_setGalleryMaxSizeDecs, 18, "setGalleryMaxSize"], [_toggleAsideDecs, 18, "toggleAside"], [_asideWidthChangedDecs, 18, "asideWidthChanged"], [_toggleLayoutBarLockDecs, 18, "toggleLayoutBarLock"], [_toggleLayoutBarHiddenDecs, 18, "toggleLayoutBarHidden"], [_resetLockTimerDecs, 18, "resetLockTimer"], [_setHoveringHandlerDecs, 18, "setHoveringHandler"], [_setHoveringLeaveHandlerDecs, 18, "setHoveringLeaveHandler"], [_onUserInfoUpdatedDecs, 18, "onUserInfoUpdated"], [_mobx.action, 2, "setLocalUserRole"], [_decorator.bound, 2, "stopLocalPreview"], [_decorator.bound, 2, "startLocalPreview"], [_decorator.bound, 2, "setAllowChatWithPayload"], [_decorator.bound, 2, "muteAudio"], [_decorator.bound, 2, "sendParticipantEvent"], [_decorator.bound, 2, "onEvent"], [_decorator.bound, 2, "_addListeners"], [_handleFoldListChangedDecs, 18, "_handleFoldListChanged"], [_handleMainListChangedDecs, 18, "_handleMainListChanged"], [_mobx.action, 2, "_switchToSpeaker"], [_mobx.action, 2, "_switchToGallery"], [_setBarHoveringDecs, 18, "_setBarHovering"], [_onAllUserCountUpdatedDecs, 18, "_onAllUserCountUpdated"], [_decorator.bound, 2, "_initStream"], [_decorator.bound, 2, "_isSetSpotlightEnable"], [_decorator.bound, 2, "_handleSpotlightAdded"], [_decorator.bound, 2, "_handleSpotlightRemoved"], [_handleConnectionUpdatedDecs, 18, "_handleConnectionUpdated"], [_decorator.bound, 2, "_handleStreamAdded"], [_decorator.bound, 2, "_onStreamsAdded"], [_decorator.bound, 2, "_onStreamsUpdated"], [_decorator.bound, 2, "_onStreamsRemoved"], [_onAudioVolumeUpdatedDecs, 18, "_onAudioVolumeUpdated"], [_handleLayoutUpdatedDecs, 16, "_handleLayoutUpdated"]], []).e, 28);
+var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_LayoutStore, [[_participantDecs, 17, "participant"], [_chatDecs, 17, "chat"], [_chatActionDecs, 17, "chatAction"], [_stateBarDecs, 17, "stateBar"], [_actionBarDecs, 17, "actionBar"], [_layersDecs, 17, "layers"], [_whiteboardDecs, 17, "whiteboard"], [_mobx.observable, 1, "collapsed"], [_mobx.observable, 1, "galleryMaxSize"], [_mobx.observable, 1, "aside"], [_mobx.observable, 1, "asideContent"], [_mobx.observable, 1, "localUserRole"], [_mobx.observable, 1, "barHovering"], [_mobx.observable, 1, "barLocked"], [_mobx.observable, 1, "barHidden"], [_mobx.observable, 1, "asideWidth"], [_mobx.observable, 1, "userVolumeMap"], [_mobx.observable, 1, "chatRoomState"], [_mobx.observable, 1, "videoWindowPreviewType"], [_mobx.observable, 1, "whiteboardActive"], [_mobx.observable, 1, "spotlightStreamId"], [_mobx.observable, 1, "shouldHideNonVideoParticipants"], [_mobx.observable, 1, "participantCount"], [_mobx.observable, 1, "ownerUser"], [_mobx.observable, 1, "localUser"], [_mobx.observable, 1, "enableSpotlight"], [_mobx.observable, 1, "isWaitingRoomNotify"], [_mobx.computed, 3, "isWaterMarkEnabled"], [_mobx.computed, 3, "isMulti"], [_mobx.computed, 3, "layout"], [_mobx.computed, 3, "manualLayout"], [_mobx.computed, 3, "mainList"], [_mobx.computed, 3, "mainListMapByAudioStreamId"], [_mobx.computed, 3, "foldList"], [_mobx.computed, 3, "galleryList"], [_mobx.computed, 3, "carouselList"], [_mobx.computed, 3, "hasPinnedStream"], [_mobx.computed, 3, "isManager"], [_mobx.computed, 3, "isRobot"], [_mobx.computed, 3, "findSpotlightUser"], [_mobx.computed, 3, "microphoneEnabled"], [_mobx.computed, 3, "isHostOrCoHost"], [_decorator.bound, 2, "getWaterMarkContent"], [_notifyParticipantShowWaitingRoomDecs, 18, "notifyParticipantShowWaitingRoom"], [_setIsWaitingRoomNotifyDecs, 18, "setIsWaitingRoomNotify"], [_decorator.bound, 2, "hasMutePermission"], [_decorator.bound, 2, "hasUnmutePermission"], [_decorator.bound, 2, "hasRequestStartAudioPermission"], [_decorator.bound, 2, "toggleMainStream"], [_decorator.bound, 2, "addPin"], [_decorator.bound, 2, "removePin"], [_decorator.bound, 2, "setVideoOrientation"], [_decorator.bound, 2, "setAllowChat"], [_decorator.bound, 2, "handleSetPinState"], [_setWhiteboardActiveDecs, 18, "setWhiteboardActive"], [_setAsideWidthDecs, 18, "setAsideWidth"], [_updateSlotsDecs, 18, "updateSlots"], [_updateAsideContentDecs, 18, "updateAsideContent"], [_decorator.bound, 2, "closeParticipantFromAside"], [_decorator.bound, 2, "moveParticipantFromAsideToDialog"], [_decorator.bound, 2, "closeChatFromAside"], [_decorator.bound, 2, "closeAsideChat"], [_decorator.bound, 2, "moveChatFromAsideToDialog"], [_decorator.bound, 2, "openPrivateChat"], [_getAllowedOperationsDecs, 18, "getAllowedOperations"], [_toggleLayoutDecs, 18, "toggleLayout"], [_toggleCollapsedDecs, 18, "toggleCollapsed"], [_setGalleryMaxSizeDecs, 18, "setGalleryMaxSize"], [_toggleAsideDecs, 18, "toggleAside"], [_asideWidthChangedDecs, 18, "asideWidthChanged"], [_toggleLayoutBarLockDecs, 18, "toggleLayoutBarLock"], [_toggleLayoutBarHiddenDecs, 18, "toggleLayoutBarHidden"], [_resetLockTimerDecs, 18, "resetLockTimer"], [_setHoveringHandlerDecs, 18, "setHoveringHandler"], [_setHoveringLeaveHandlerDecs, 18, "setHoveringLeaveHandler"], [_onUserInfoUpdatedDecs, 18, "onUserInfoUpdated"], [_mobx.action, 2, "setLocalUserRole"], [_decorator.bound, 2, "stopLocalPreview"], [_decorator.bound, 2, "startLocalPreview"], [_decorator.bound, 2, "setAllowChatWithPayload"], [_decorator.bound, 2, "muteAudio"], [_decorator.bound, 2, "sendParticipantEvent"], [_decorator.bound, 2, "onEvent"], [_decorator.bound, 2, "_addListeners"], [_handleFoldListChangedDecs, 18, "_handleFoldListChanged"], [_handleMainListChangedDecs, 18, "_handleMainListChanged"], [_mobx.action, 2, "_switchToSpeaker"], [_mobx.action, 2, "_switchToGallery"], [_setBarHoveringDecs, 18, "_setBarHovering"], [_onAllUserCountUpdatedDecs, 18, "_onAllUserCountUpdated"], [_decorator.bound, 2, "_initStream"], [_decorator.bound, 2, "_isSetSpotlightEnable"], [_decorator.bound, 2, "_handleSpotlightAdded"], [_decorator.bound, 2, "_handleSpotlightRemoved"], [_handleConnectionUpdatedDecs, 18, "_handleConnectionUpdated"], [_decorator.bound, 2, "_handleStreamAdded"], [_decorator.bound, 2, "_onStreamsAdded"], [_decorator.bound, 2, "_onStreamsUpdated"], [_decorator.bound, 2, "_onStreamsRemoved"], [_onAudioVolumeUpdatedDecs, 18, "_onAudioVolumeUpdated"], [_decorator.bound, 2, "_handleRemoteWaitingUserLeft"], [_decorator.bound, 2, "_handleMessageReceived"], [_handleLayoutUpdatedDecs, 16, "_handleLayoutUpdated"]], []).e, 29);
 _init_participant = _applyDecs$e[0];
 _init_chat = _applyDecs$e[1];
 _init_chatAction = _applyDecs$e[2];
@@ -1341,6 +1447,7 @@ _init_participantCount = _applyDecs$e[22];
 _init_ownerUser = _applyDecs$e[23];
 _init_localUser = _applyDecs$e[24];
 _init_enableSpotlight = _applyDecs$e[25];
-_init__handleLayoutUpdated = _applyDecs$e[26];
-_initProto = _applyDecs$e[27];
+_init_isWaitingRoomNotify = _applyDecs$e[26];
+_init__handleLayoutUpdated = _applyDecs$e[27];
+_initProto = _applyDecs$e[28];
 (0, _defineProperty2["default"])(LayoutStore, "MIN_USERS_TO_ENABLE_SPOTLIGHT", 2);

package/lib/modules/layout/video-window-datasource.d.ts

@@ -66,7 +66,7 @@ export declare class FcrUIVideoWindowDataSource {
     private _spotlightPool;
     accessor spotlightEnabled: boolean;
     accessor layoutType: FcrUIVideoWindowLayoutType;
-    accessor manualLayout: FcrUIVideoWindowLayoutType;
+    accessor manualLayout: FcrUIVideoWindowLayoutType | undefined;
     accessor pinLimitedCount: number;
     accessor mainListLimitedCount: number;
     accessor foldListLimitedCount: number;

package/lib/modules/layout/video-window-datasource.js

@@ -438,7 +438,7 @@ var FcrUIVideoWindowDataSource = exports.FcrUIVideoWindowDataSource = /*#__PURE_
     (0, _defineProperty2["default"])(this, "_spotlightPool", new FcrUISpeakerSpotlightPool());
     _classPrivateFieldInitSpec(this, _A2, _init_spotlightEnabled(this, true));
     _classPrivateFieldInitSpec(this, _B2, _init_layoutType(this, _type.FcrUIVideoWindowLayoutType.Gallery));
-    _classPrivateFieldInitSpec(this, _C2, _init_manualLayout(this, _type.FcrUIVideoWindowLayoutType.Gallery));
+    _classPrivateFieldInitSpec(this, _C2, _init_manualLayout(this, undefined));
     _classPrivateFieldInitSpec(this, _D2, _init_pinLimitedCount(this, 1));
     _classPrivateFieldInitSpec(this, _E2, _init_mainListLimitedCount(this, 255));
     _classPrivateFieldInitSpec(this, _F2, _init_foldListLimitedCount(this, 255));

package/lib/modules/live-streaming/index.dev.js

@@ -25,7 +25,7 @@ window.__DEV_ENGINE_IS_READY__.then(/*#__PURE__*/(0, _asyncToGenerator2["default
         _context.next = 4;
         return engine.login();
       case 4:
-        roomControl = engine.createRoomControl(roomId);
+        roomControl = engine.createMainRoomControl(roomId);
         roomConfig = {
           userRole: _type.FcrUserRole.HOST,
           userName: 'test-user',

package/lib/modules/notification/context.d.ts

@@ -0,0 +1,2 @@
+import NotificationStore from './store';
+export declare const StoreContext: import("react").Context<NotificationStore>;

package/lib/modules/notification/context.js

@@ -0,0 +1,9 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StoreContext = void 0;
+var _react = require("react");
+var StoreContext = exports.StoreContext = /*#__PURE__*/(0, _react.createContext)(null);