fcr-ui-scene 3.3.0 → 3.4.0

package/lib/modules/layout/store.js

@@ -19,7 +19,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports["default"] = exports.StoreContext = 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");
@@ -96,8 +96,8 @@ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/cl
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _mobx = require("mobx");
-var _agoraEduCore = require("agora-edu-core");
-var _type = require("agora-edu-core/lib/type");
+var _fcrCore = require("fcr-core");
+var _type = require("fcr-core/lib/type");
 var _decorator = require("agora-foundation/lib/decorator");
 var _logger = require("agora-foundation/lib/logger");
 var _type2 = require("../video-window/type");
@@ -106,16 +106,19 @@ var _constant = require("../../utilities/constant");
 var _type3 = require("./type");
 var _Layout = require("./components/Layout");
 var _videoWindowDatasource = require("./video-window-datasource");
-var _toast = require("agora-ui-foundation/lib/components/toast");
 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 _type5 = require("fcr-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 _type7 = require("fcr-core/lib/room-control/type");
+var _type8 = require("fcr-core/lib/room-control/privilege-control/type");
 var _get = _interopRequireDefault(require("lodash/get"));
+var _parameters = require("../../utilities/parameters");
+var _react = require("react");
+var _mobxUtils = require("mobx-utils");
 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, _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;
+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, _init_interpreterUsers, _init_interpreterState, _notifyParticipantShowWaitingRoomDecs, _setIsWaitingRoomNotifyDecs, _setWhiteboardActiveDecs, _setAsideWidthDecs, _updateSlotsDecs, _updateAsideContentDecs, _toggleLayoutDecs, _toggleCollapsedDecs, _setGalleryMaxSizeDecs, _toggleAsideDecs, _asideWidthChangedDecs, _toggleLayoutBarLockDecs, _toggleLayoutBarHiddenDecs, _resetLockTimerDecs, _setHoveringHandlerDecs, _setHoveringLeaveHandlerDecs, _handleLiveLayoutChangeDecs, _onUserInfoUpdatedDecs, _handleLayoutUpdatedDecs, _init__handleLayoutUpdated, _handleFoldListChangedDecs, _handleMainListChangedDecs, _setBarHoveringDecs, _onAllUserCountUpdatedDecs, _handleConnectionUpdatedDecs, _onAudioVolumeUpdatedDecs, _getInterpreterStateDecs, _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; }
@@ -153,10 +156,13 @@ var _X = /*#__PURE__*/new WeakMap();
 var _Y = /*#__PURE__*/new WeakMap();
 var _Z = /*#__PURE__*/new WeakMap();
 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 _b = /*#__PURE__*/new WeakMap();
+var _c = /*#__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], _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], _handleLiveLayoutChangeDecs = [_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], _getInterpreterStateDecs = [_mobx.action, _mobx.action.bound], "logger");
 var LayoutStore = exports["default"] = /*#__PURE__*/function () {
   function LayoutStore(params) {
-    var _this = this;
+    var _this = this,
+      _defaultVideoGalleryS;
     (0, _classCallCheck2["default"])(this, LayoutStore);
     (0, _defineProperty2["default"])(this, _ref, (_initProto(this), (0, _logger.getLogger)()));
     (0, _defineProperty2["default"])(this, "_videoWindowDataSource", new _videoWindowDatasource.FcrUIVideoWindowDataSource());
@@ -165,9 +171,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     (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() {}
+      onConnectionStateUpdated: this._handleConnectionUpdated.bind(this)
     });
     (0, _defineProperty2["default"])(this, "_waitingRoomUserObserver", {
       onRemoteUsersLeft: this._handleRemoteWaitingUserLeft.bind(this)
@@ -186,7 +190,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     _classPrivateFieldInitSpec(this, _G, _init_whiteboard(this, null));
     // State
     _classPrivateFieldInitSpec(this, _H, _init_collapsed(this, true));
-    _classPrivateFieldInitSpec(this, _I, _init_galleryMaxSize(this, _type3.GalleryMaxSize.Normal));
+    _classPrivateFieldInitSpec(this, _I, _init_galleryMaxSize(this));
     _classPrivateFieldInitSpec(this, _J, _init_aside(this, false));
     _classPrivateFieldInitSpec(this, _K, _init_asideContent(this, {
       participant: false,
@@ -199,7 +203,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     _classPrivateFieldInitSpec(this, _P, _init_asideWidth(this, _Layout.MinAsideWidth));
     _classPrivateFieldInitSpec(this, _Q, _init_userVolumeMap(this, new Map()));
     _classPrivateFieldInitSpec(this, _R, _init_chatRoomState(this, _type5.FcrChatRoomConnectionState.Disconnected));
-    _classPrivateFieldInitSpec(this, _S, _init_videoWindowPreviewType(this, _type2.FcrVideoWindowPreviewType.MIX));
+    _classPrivateFieldInitSpec(this, _S, _init_videoWindowPreviewType(this, _type2.FcrVideoWindowPreviewType.SMALL));
     _classPrivateFieldInitSpec(this, _T, _init_whiteboardActive(this, false));
     _classPrivateFieldInitSpec(this, _U, _init_spotlightStreamId(this, ''));
     _classPrivateFieldInitSpec(this, _V, _init_shouldHideNonVideoParticipants(this, false));
@@ -208,6 +212,12 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     _classPrivateFieldInitSpec(this, _Y, _init_localUser(this));
     _classPrivateFieldInitSpec(this, _Z, _init_enableSpotlight(this, true));
     _classPrivateFieldInitSpec(this, _a, _init_isWaitingRoomNotify(this, true));
+    _classPrivateFieldInitSpec(this, _b, _init_interpreterUsers(this, []));
+    //  翻译官列表
+    _classPrivateFieldInitSpec(this, _c, _init_interpreterState(this));
+    (0, _defineProperty2["default"])(this, "getAllowedOperations", (0, _mobxUtils.computedFn)(function (targetRole, isSelf) {
+      return _this._securityStore.getAllowedOperations(targetRole, isSelf);
+    }));
     (0, _defineProperty2["default"])(this, "_handleLayoutUpdated", _init__handleLayoutUpdated(this, function (layout) {
       if (layout === _type3.FcrUIVideoWindowLayoutType.Speaker) {
         _this._switchToSpeaker();
@@ -226,7 +236,8 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     });
     var userControl = params.userControl,
       chatRoomControl = params.chatRoomControl,
-      roomControl = params.roomControl;
+      roomControl = params.roomControl,
+      interpreterControl = params.interpreterControl;
     this._securityStore = params.securityStore;
     this._deviceStore = params.deviceStore;
     this._uiEventStore = params.uiEventStore;
@@ -235,10 +246,43 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     this._chatRoomControl = chatRoomControl;
     this._whiteBoardControl = params.whiteBoardControl;
     this._privilegeControl = params.privilegeControl;
+    this._interpreterControl = interpreterControl;
+    this._roomControl = roomControl;
+    var defaultVideoGallerySize = (0, _parameters.getDefaultVideoGallerySize)(params.parameters);
+    if (defaultVideoGallerySize) {
+      defaultVideoGallerySize = Math.min(Math.max(defaultVideoGallerySize, 16), 25);
+    }
+    this.galleryMaxSize = (_defaultVideoGalleryS = defaultVideoGallerySize) !== null && _defaultVideoGalleryS !== void 0 ? _defaultVideoGalleryS : _type3.GalleryMaxSize.Normal;
+    this.interpreterUsers = this._interpreterControl.getInterpreterUserList() || [];
+    this.interpreterState = this.getInterpreterState();
+    this._interpreterControl.addObserver({
+      onInterpreterUsersUpdated: function onInterpreterUsersUpdated(roomId, users) {
+        _this.interpreterUsers = users;
+      },
+      onInterpreterStateUpdated: function onInterpreterStateUpdated() {
+        _this.interpreterState = _this.getInterpreterState();
+        _this.interpreterUsers = _this._interpreterControl.getInterpreterUserList() || [];
+      }
+    });
     this.localUser = userControl.getLocalUser();
+    params.roomStore.addObserver({
+      onJoinWaitingRoom: function onJoinWaitingRoom(roomControl, securityStore) {
+        var room = roomControl;
+        _this._waitingRoomControl = room;
+        _this._waitingRoomControl.addObserver(_this._waitingRoomObserver);
+        _this._waitingRoomUserControl = room.getUserControl();
+        _this._waitingRoomUserControl.addObserver(_this._waitingRoomUserObserver);
+      }
+    });
     roomControl.addObserver({
-      onLiveStreamingStateUpdated: function onLiveStreamingStateUpdated(_, state) {
+      onLiveStreamingStateUpdated: function onLiveStreamingStateUpdated(_, state, pageUrl, reason) {
         _this._liveStreamState = state;
+        if (state === _type.FcrLiveStreamingState.STOPPED && reason === _type7.FcrLiveStreamingStateUpdatedReason.HOSTCHANGED) {
+          _this._uiEventStore.showToast({
+            type: 'info',
+            message: (0, _i18n.transI18n)('fmt_broadcast_livestream_tips_hand_over_pc_to_mobile')
+          });
+        }
       }
     });
     this._addListeners();
@@ -256,6 +300,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     if (this.isRobot) {
       this.updateAsideContent(false, true);
     }
+    (0, _parameters.getDefaultVideoGallerySize)(params.parameters);
   }
   return (0, _createClass2["default"])(LayoutStore, [{
     key: "participant",
@@ -473,6 +518,22 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     set: function set(v) {
       _classPrivateFieldSet(_a, this, v);
     }
+  }, {
+    key: "interpreterUsers",
+    get: function get() {
+      return _classPrivateFieldGet(_b, this);
+    },
+    set: function set(v) {
+      _classPrivateFieldSet(_b, this, v);
+    }
+  }, {
+    key: "interpreterState",
+    get: function get() {
+      return _classPrivateFieldGet(_c, this);
+    },
+    set: function set(v) {
+      _classPrivateFieldSet(_c, this, v);
+    }
   }, {
     key: "deviceStore",
     get: function get() {
@@ -508,13 +569,13 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     get: function get() {
       var _this2 = this;
       var sourceList = this._videoWindowDataSource.mainList.filter(function (i) {
-        return !i.isMySelf || i.videoSourceType !== _agoraEduCore.FcrVideoSourceType.SCREEN;
+        return !i.isMySelf || i.videoSourceType !== _fcrCore.FcrVideoSourceType.SCREEN;
       });
       var existHasVideoStreamUser = sourceList.some(function (i) {
         return i.hasVideoStream;
       });
       return this.shouldHideNonVideoParticipants ? sourceList.filter(function (i) {
-        var visible = i.isMySelf && !existHasVideoStreamUser || i.hasVideoStream || i.videoSourceType === _agoraEduCore.FcrVideoSourceType.SCREEN || i.type === _type3.FcrUIWindowType.BOARD;
+        var visible = i.isMySelf && !existHasVideoStreamUser || i.hasVideoStream || i.videoSourceType === _fcrCore.FcrVideoSourceType.SCREEN || i.type === _type3.FcrUIWindowType.BOARD;
         if (!visible && i.isPin) {
           _this2.removePin(i.windowId, (0, _i18n.transI18n)('fmt_internalsetting_other_hide_no_video_pin_cancelled'));
         }
@@ -543,7 +604,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     key: "currentShareData",
     get: function get() {
       return this.mainList.find(function (item) {
-        return item.videoSourceType === _agoraEduCore.FcrVideoSourceType.SCREEN || item.type === _type3.FcrUIWindowType.BOARD;
+        return item.videoSourceType === _fcrCore.FcrVideoSourceType.SCREEN || item.type === _type3.FcrUIWindowType.BOARD;
       });
     }
   }, {
@@ -688,22 +749,18 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
           return u.windowId === streamId;
         });
         if (!(stream !== null && stream !== void 0 && stream.hasVideoStream)) {
-          _toast.FcrToastApi.open({
-            toastProps: {
-              type: 'error',
-              content: (0, _i18n.transI18n)('fmt_internalsetting_other_hide_no_video_pin_cancelled')
-            }
+          this._uiEventStore.showToast({
+            type: 'error',
+            message: (0, _i18n.transI18n)('fmt_internalsetting_other_hide_no_video_pin_cancelled')
           });
           return;
         }
       }
       var success = this._videoWindowDataSource.addPin(streamId);
       if (success) {
-        _toast.FcrToastApi.open({
-          toastProps: {
-            type: 'normal',
-            content: (0, _i18n.transI18n)('fmt_settings_tips_screenlocked')
-          }
+        this._uiEventStore.showToast({
+          type: 'normal',
+          message: (0, _i18n.transI18n)('fmt_settings_tips_screenlocked')
         });
         if (this.layout === _type3.FcrUIVideoWindowLayoutType.Gallery) {
           this.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Speaker);
@@ -715,11 +772,9 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     value: function removePin(streamId) {
       var toastText = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : (0, _i18n.transI18n)('fmt_settings_tips_screenunlock');
       this._videoWindowDataSource.removePin(streamId);
-      _toast.FcrToastApi.open({
-        toastProps: {
-          type: 'normal',
-          content: toastText
-        }
+      this._uiEventStore.showToast({
+        type: 'normal',
+        message: toastText
       });
     }
   }, {
@@ -840,12 +895,15 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
       var user = Object.values(this === null || this === void 0 || (_this$_userControl = this._userControl) === null || _this$_userControl === void 0 ? void 0 : _this$_userControl.getUsers()).find(function (u) {
         return u.userId === userId;
       });
-      user && this._uiEventStore.notifyChatUpdateTarget(user);
+      user && this._uiEventStore.notifyChatUpdateTarget(user, _constant.RoomType.MAIN_ROOM);
     }
   }, {
-    key: "getAllowedOperations",
-    value: function getAllowedOperations(targetRole, isSelf) {
-      return this._securityStore.getAllowedOperations(targetRole, isSelf);
+    key: "openRenameDialog",
+    value: function openRenameDialog(userId) {
+      this._uiEventStore.sendEvent(_constant.UIAction.PARTICIPANT_ACTION, {
+        action: _attendee.ParticipantActionType.RENAME_IN_MEETING,
+        userId: userId
+      });
     }
   }, {
     key: "toggleLayout",
@@ -909,6 +967,17 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     value: function setHoveringLeaveHandler() {
       return !this.barLocked && this._setBarHovering(false);
     }
+  }, {
+    key: "handleLiveLayoutChange",
+    value: function handleLiveLayoutChange(modifiedUser) {
+      if (modifiedUser.userId === this.getLocalUserId() && modifiedUser.userRole === _type.FcrUserRole.HOST) {
+        // 当本人变成主持人时
+        if (this._liveStreamState === _type.FcrLiveStreamingState.STARTED) {
+          // 直播中，切换布局
+          this._roomControl.updateLiveStreamingLayout(this.layout === _type3.FcrUIVideoWindowLayoutType.Speaker ? _type.FcrLiveStreamingLayoutType.SPEAKER : _type.FcrLiveStreamingLayoutType.GALLERY);
+        }
+      }
+    }
   }, {
     key: "release",
     value: function release() {
@@ -923,21 +992,18 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
       var _this5 = this;
       this._videoWindowDataSource.update(event.modifiedUser);
       this.setLocalUserRole(this._userControl.getLocalUser().userRole);
-      if (this._managerRoleUpdateForToast.has(event.modifiedUser.userRole)) {
+      this.handleLiveLayoutChange(event.modifiedUser);
+      if (this._managerRoleUpdateForToast.has(event.modifiedUser.userRole) && event.reason === _type6.AgoraRteUserUpdatedReason.ROLE) {
         var userName = event.modifiedUser.userName;
         var isMe = event.modifiedUser.userId === this.getLocalUserId();
         var toastContent = function toastContent() {
           var contentText = '';
           if (event.modifiedUser.userRole === _type.FcrUserRole.HOST) {
-            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
-              });
-            }
+            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
@@ -950,6 +1016,11 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
           message: toastContent()
         });
       }
+      if (event.reason === _type6.AgoraRteUserUpdatedReason.NAME) {
+        setTimeout(function () {
+          _this5.localUser = _this5._userControl.getLocalUser();
+        }, 1000);
+      }
     }
   }, {
     key: "setLocalUserRole",
@@ -1091,13 +1162,6 @@ 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",
@@ -1277,7 +1341,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
       var _this7 = this;
       var isSharingScreen = false;
       this._streamControl.getStreamList().forEach(function (stream) {
-        if (stream.videoSourceType === _agoraEduCore.FcrVideoSourceType.SCREEN) {
+        if (stream.videoSourceType === _fcrCore.FcrVideoSourceType.SCREEN) {
           isSharingScreen = true;
         }
         _this7._handleStreamAdded(stream);
@@ -1316,7 +1380,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "_handleStreamAdded",
     value: function _handleStreamAdded(modifiedStream) {
-      if (modifiedStream.videoSourceType === _agoraEduCore.FcrVideoSourceType.SCREEN) {
+      if (modifiedStream.videoSourceType === _fcrCore.FcrVideoSourceType.SCREEN) {
         if (this.layout === _type3.FcrUIVideoWindowLayoutType.Gallery) {
           this.toggleLayout(_type3.FcrUIVideoWindowLayoutType.Speaker);
         }
@@ -1350,8 +1414,8 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
         _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;
+        var videoType = event.modifiedStream.videoSourceType;
+        return videoType === _fcrCore.FcrVideoSourceType.SCREEN;
       });
       if (hasScreenStream && this.manualLayout) {
         this._uiEventStore.sendEvent(_constant.UIAction.TOGGLE_LAYOUT, {
@@ -1362,7 +1426,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "_onAudioVolumeUpdated",
     value: function _onAudioVolumeUpdated(roomId, streamId, volume) {
-      this.userVolumeMap.set(streamId, volume);
+      this.userVolumeMap.set(streamId, Math.floor(volume / 255 * 100));
       this._setSpotlightStream();
     }
   }, {
@@ -1389,7 +1453,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     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;
+      var targetRoles = (_this$_privilegeContr = this._privilegeControl.getSecurityInfo(_type8.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) {
@@ -1417,10 +1481,15 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
         });
       }
     }
+  }, {
+    key: "getInterpreterState",
+    value: function getInterpreterState() {
+      return this._interpreterControl.getState().enable;
+    }
   }]);
 }();
 _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.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);
+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.observable, 1, "interpreterUsers"], [_mobx.observable, 1, "interpreterState"], [_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"], [_decorator.bound, 2, "openRenameDialog"], [_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"], [_handleLiveLayoutChangeDecs, 18, "handleLiveLayoutChange"], [_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"], [_getInterpreterStateDecs, 18, "getInterpreterState"], [_handleLayoutUpdatedDecs, 16, "_handleLayoutUpdated"]], []).e, 31);
 _init_participant = _applyDecs$e[0];
 _init_chat = _applyDecs$e[1];
 _init_chatAction = _applyDecs$e[2];
@@ -1448,6 +1517,9 @@ _init_ownerUser = _applyDecs$e[23];
 _init_localUser = _applyDecs$e[24];
 _init_enableSpotlight = _applyDecs$e[25];
 _init_isWaitingRoomNotify = _applyDecs$e[26];
-_init__handleLayoutUpdated = _applyDecs$e[27];
-_initProto = _applyDecs$e[28];
-(0, _defineProperty2["default"])(LayoutStore, "MIN_USERS_TO_ENABLE_SPOTLIGHT", 2);
+_init_interpreterUsers = _applyDecs$e[27];
+_init_interpreterState = _applyDecs$e[28];
+_init__handleLayoutUpdated = _applyDecs$e[29];
+_initProto = _applyDecs$e[30];
+(0, _defineProperty2["default"])(LayoutStore, "MIN_USERS_TO_ENABLE_SPOTLIGHT", 2);
+var StoreContext = exports.StoreContext = /*#__PURE__*/(0, _react.createContext)(null);

package/lib/modules/layout/type.d.ts

@@ -1,5 +1,5 @@
-import { FcrRoomConnectorType, FcrVideoSourceType } from 'agora-edu-core';
-import { FcrUserRole } from 'agora-edu-core/lib/type';
+import { FcrRoomConnectorType, FcrVideoSourceType } from 'fcr-core';
+import { FcrUserRole } from 'fcr-core/lib/type';
 export declare enum FcrUIVideoWindowLayoutType {
     /** Show a carousel on top and a big video on the rest of the screen. */
     Speaker = "speaker",

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

@@ -1,6 +1,6 @@
 import { FcrUIVideoWindowData, FcrUIVideoWindowFoldSortingPriority, FcrUIVideoWindowLayoutType, FcrUIVideoWindowMainSortingPriority, FcrUIWindowType } from './type';
-import { FcrStreamInfo, FcrUserInfo, FcrUserRole } from 'agora-edu-core/lib/type';
-import { FcrRoomConnectorType, FcrVideoSourceType } from 'agora-edu-core';
+import { FcrStreamInfo, FcrUserInfo, FcrUserRole } from 'fcr-core/lib/type';
+import { FcrRoomConnectorType, FcrVideoSourceType } from 'fcr-core';
 type FcrStreamUIData = Omit<FcrStreamInfo, 'owner'> & {
     owner: FcrUserInfo;
 };
@@ -31,7 +31,7 @@ export declare class FcrUIVideoWindowDataImpl implements FcrUIVideoWindowData {
     get userId(): string;
     get userName(): string;
     get ownerRoleType(): FcrUserRole;
-    get videoSourceType(): FcrVideoSourceType;
+    get videoSourceType(): FcrVideoSourceType.CAMERA | FcrVideoSourceType.SCREEN;
     get isMySelf(): boolean;
     get sortingPriority(): FcrUIVideoWindowMainSortingPriority | FcrUIVideoWindowFoldSortingPriority;
     constructor(type: FcrUIWindowType, { videoStream, audioStream, boardUserInfo, }: {
@@ -86,6 +86,7 @@ export declare class FcrUIVideoWindowDataSource {
     update(user: FcrUserInfo): void;
     delete(stream: FcrStreamInfo): void;
     addPin(streamId: string): boolean;
+    private _updateSpeakerSpotlightPosition;
     removePin(streamId: string): true | undefined;
     setSpeakerSpotlight(streamId: string): void;
     toggleMainStream(windowId: string): boolean;
@@ -99,6 +100,7 @@ export declare class FcrUIVideoWindowDataSource {
     private _insertEndByPriority;
     private _findInsertBeginningIndex;
     private _findInsertEndIndex;
+    private _findCurrentSpeakerSpotlight;
     private _findItemIndexWithWindowId;
     private _findItemIndexWithUserId;
     private _findItemIndexWithAudioStreamId;