fcr-ui-scene 3.6.1 → 3.6.2

package/lib/modules/share-screen/store.js

@@ -43,25 +43,19 @@ 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.push.js");
-require("core-js/modules/es.array.some.js");
-require("core-js/modules/es.date.to-json.js");
 require("core-js/modules/es.function.bind.js");
-require("core-js/modules/es.json.stringify.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/es.promise.js");
-require("core-js/modules/es.promise.finally.js");
-require("core-js/modules/es.string.includes.js");
 require("core-js/modules/es.string.iterator.js");
+require("core-js/modules/es.string.starts-with.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.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.some.js");
 require("core-js/modules/esnext.weak-map.delete-all.js");
 require("core-js/modules/esnext.weak-map.emplace.js");
 require("core-js/modules/web.dom-collections.for-each.js");
@@ -73,26 +67,21 @@ 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 _fcrCore = require("fcr-core");
-var _rendererEvent = require("../../utilities/renderer-event");
-var _types = require("fcr-core/lib/room-control/whiteboard-control/types");
 var _env = require("agora-foundation/lib/utilities/env");
 var _type = require("agora-rte-sdk/lib/core/rtc/type");
-var _type2 = require("agora-rte-sdk/lib/core/scene/type");
-var _type3 = require("agora-rte-sdk/lib/type");
 var _shareAudio = require("agora-ui-foundation/lib/components/room-screen-share-state-bar/share-audio");
 var _mobx = require("mobx");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _decorator = require("agora-foundation/lib/decorator");
-var _tools = require("../../utilities/tools");
 var _react = require("react");
-var _type4 = require("agora-ui-foundation/lib/components/icon/type");
+var _type2 = require("agora-ui-foundation/lib/components/icon/type");
 var _renderer = require("../../utilities/renderer");
 var _screenCapturePermission = require("../../utilities/screen-capture-permission");
 var _constant = require("../../utilities/constant");
 var _logger = require("../../utilities/logger");
 var _parameters = require("../../utilities/parameters");
 var _ShareScreenStore;
-var _initProto, _init_screenSharingState, _init_applicationCaptureSources, _init_screenCaptureSources, _init_currentSelection, _init_currentSelectionType, _init_shareWithAudio, _init_boardOwnerUser, _init_currentSelectionBounds, _init_connectionState, _handleChooseScreenDecs, _init_handleChooseScreen, _setShareWithAudioStateDecs, _hasLoopbackDeviceDecs, _setShareAudioProcessingChannelDecs, _openRelaunchTipsDialogDecs, _startPreviewDecs, _handleStopShareDecs, _handleStartShareDecs, _startLoopbackDecs, _handleShareStartWithAudioDecs, _handleShareStopWithAudioDecs, _openShareScreenSelectionDecs, _closeShareScreenSelectionDecs, _setControlBarWindowIdDecs, _openVideoWindowDialogDecs, _closeControlBarDecs, _closeVideoWindowDialogDecs, _setWithAudioStateDecs, _handleReplaceScreenDecs, _handleScreenCaptureStateUpdatedDecs, _setShareLockDecs, _handleStreamUpdateDecs, _initControlbarDecs, _ref;
+var _initProto, _init_boardOwnerUser, _handleChooseScreenDecs, _init_handleChooseScreen, _setShareWithAudioStateDecs, _hasLoopbackDeviceDecs, _setShareAudioProcessingChannelDecs, _openRelaunchTipsDialogDecs, _startRenderSharePreviewDecs, _stopRenderSharePreviewDecs, _handleStopShareDecs, _handleStartShareDecs, _openShareScreenSelectionDecs, _closeShareScreenSelectionDecs, _setControlBarWindowIdDecs, _openVideoWindowDialogDecs, _closeControlBarDecs, _closeVideoWindowDialogDecs, _handleReplaceScreenDecs, _initControlbarDecs, _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; }
@@ -104,15 +93,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 function _setFunctionName(e, t, n) { "symbol" == _typeof(t) && (t = (t = t.description) ? "[" + t + "]" : ""); try { Object.defineProperty(e, "name", { configurable: !0, value: n ? n + " " + t : t }); } catch (e) {} return e; }
 function _checkInRHS(e) { if (Object(e) !== e) throw TypeError("right-hand side of 'in' should be an object, got " + (null !== e ? _typeof(e) : "null")); return e; }
 var _A = /*#__PURE__*/new WeakMap();
-var _B = /*#__PURE__*/new WeakMap();
-var _C = /*#__PURE__*/new WeakMap();
-var _D = /*#__PURE__*/new WeakMap();
-var _E = /*#__PURE__*/new WeakMap();
-var _F = /*#__PURE__*/new WeakMap();
-var _G = /*#__PURE__*/new WeakMap();
-var _H = /*#__PURE__*/new WeakMap();
-var _I = /*#__PURE__*/new WeakMap();
-_ref = (_handleChooseScreenDecs = [_mobx.action, _mobx.action.bound], _setShareWithAudioStateDecs = [_mobx.action, _mobx.action.bound], _hasLoopbackDeviceDecs = [_mobx.action, _mobx.action.bound], _setShareAudioProcessingChannelDecs = [_mobx.action, _mobx.action.bound], _openRelaunchTipsDialogDecs = [_mobx.action, _mobx.action.bound], _startPreviewDecs = [_mobx.action, _mobx.action.bound], _handleStopShareDecs = [_mobx.action, _mobx.action.bound], _handleStartShareDecs = [_mobx.action, _mobx.action.bound], _startLoopbackDecs = [_mobx.action, _mobx.action.bound], _handleShareStartWithAudioDecs = [_mobx.action, _mobx.action.bound], _handleShareStopWithAudioDecs = [_mobx.action, _mobx.action.bound], _openShareScreenSelectionDecs = [_mobx.action, _mobx.action.bound], _closeShareScreenSelectionDecs = [_mobx.action, _mobx.action.bound], _setControlBarWindowIdDecs = [_mobx.action, _mobx.action.bound], _openVideoWindowDialogDecs = [_mobx.action, _mobx.action.bound], _closeControlBarDecs = [_mobx.action, _mobx.action.bound], _closeVideoWindowDialogDecs = [_mobx.action, _mobx.action.bound], _setWithAudioStateDecs = [_mobx.action, _mobx.action.bound], _handleReplaceScreenDecs = [_mobx.action, _mobx.action.bound], _handleScreenCaptureStateUpdatedDecs = [_mobx.action, _mobx.action.bound], _setShareLockDecs = [_mobx.action, _mobx.action.bound], _handleStreamUpdateDecs = [_mobx.action, _mobx.action.bound], _initControlbarDecs = [_mobx.action, _mobx.action.bound], "logger");
+_ref = (_handleChooseScreenDecs = [_mobx.action, _mobx.action.bound], _setShareWithAudioStateDecs = [_mobx.action, _mobx.action.bound], _hasLoopbackDeviceDecs = [_mobx.action, _mobx.action.bound], _setShareAudioProcessingChannelDecs = [_mobx.action, _mobx.action.bound], _openRelaunchTipsDialogDecs = [_mobx.action, _mobx.action.bound], _startRenderSharePreviewDecs = [_mobx.action, _mobx.action.bound], _stopRenderSharePreviewDecs = [_mobx.action, _mobx.action.bound], _handleStopShareDecs = [_mobx.action, _mobx.action.bound], _handleStartShareDecs = [_mobx.action, _mobx.action.bound], _openShareScreenSelectionDecs = [_mobx.action, _mobx.action.bound], _closeShareScreenSelectionDecs = [_mobx.action, _mobx.action.bound], _setControlBarWindowIdDecs = [_mobx.action, _mobx.action.bound], _openVideoWindowDialogDecs = [_mobx.action, _mobx.action.bound], _closeControlBarDecs = [_mobx.action, _mobx.action.bound], _closeVideoWindowDialogDecs = [_mobx.action, _mobx.action.bound], _handleReplaceScreenDecs = [_mobx.action, _mobx.action.bound], _initControlbarDecs = [_mobx.action, _mobx.action.bound], "logger");
 var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
   function ShareScreenStore(_ref2) {
     var _this = this;
@@ -125,48 +106,34 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
       sharedMemberDataSource = _ref2.sharedMemberDataSource,
       roomProvider = _ref2.roomProvider,
       sharedConfigDataSource = _ref2.sharedConfigDataSource,
-      connectionProvider = _ref2.connectionProvider,
-      screenShareDataSource = _ref2.screenShareDataSource;
+      screenShareProvider = _ref2.screenShareProvider,
+      annotationProvider = _ref2.annotationProvider,
+      sharedScreenShareSharedDataSource = _ref2.sharedScreenShareSharedDataSource,
+      connectionProvider = _ref2.connectionProvider;
     (0, _classCallCheck2["default"])(this, ShareScreenStore);
     (0, _defineProperty2["default"])(this, _ref, (_initProto(this), (0, _logger.createLogger)({
       prefix: 'ShareScreenStore'
     })));
     (0, _defineProperty2["default"])(this, "_disposers", []);
     (0, _defineProperty2["default"])(this, "_controlBarWindowId", -1);
-    (0, _defineProperty2["default"])(this, "_currentShareStreamId", '');
     (0, _defineProperty2["default"])(this, "_removeScreenStreamFailed", false);
-    (0, _defineProperty2["default"])(this, "_isReplaceScreen", false);
-    (0, _defineProperty2["default"])(this, "_previewDom", null);
-    (0, _defineProperty2["default"])(this, "_connectionObserver", {
-      onConnectionStateUpdated: function onConnectionStateUpdated(state) {
-        _this.connectionState = state;
-      }
-    });
+    (0, _defineProperty2["default"])(this, "_isOnline", true);
     (0, _defineProperty2["default"])(this, "_roomObserver", {
       onRoomClosed: this.handleStopShare,
       onLeaveMainRoom: this.handleStopShare
     });
-    (0, _defineProperty2["default"])(this, "_observer", {
-      onScreenCaptureStateUpdated: (0, _env.isElectron)() ? this._handleScreenCaptureStateUpdated : this._handleWebScreenCaptureStateUpdated
-    });
     (0, _defineProperty2["default"])(this, "_uiEventObserver", {
       onEvent: this._onUiEvent.bind(this)
     });
-    (0, _defineProperty2["default"])(this, "_streamObserver", {
-      onStreamsAdded: function onStreamsAdded(_, events) {
-        return _this._handleStreamUpdate('add', events);
-      },
-      onStreamsRemoved: function onStreamsRemoved(_, events) {
-        return _this._handleStreamUpdate('remove', events);
-      },
-      onStreamsUpdated: function onStreamsUpdated(_, events) {
-        return _this._handleStreamUpdate('update', events);
-      }
+    (0, _defineProperty2["default"])(this, "_screenCaptureStateObserver", {
+      onScreenCaptureStopped: this._handleOnScreenCaptureStopped.bind(this),
+      onScreenShareReplaceBegin: this._handleOnScreenShareReplaceBegin.bind(this),
+      onScreenCaptureStarted: this._handleOnScreenCaptureStarted.bind(this)
     });
     (0, _defineProperty2["default"])(this, "_boardObserver", {
       onActive: function onActive(ownerId) {
         _this.handleStopShare();
-        (0, _env.isElectron)() && _this._closeCapture();
+        _this._closeShareScreenComps();
         _this._closeShareScreenSelection();
         _this.boardOwnerUser = _this._userControl.getUser(ownerId);
       },
@@ -174,37 +141,14 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
         _this.boardOwnerUser = undefined;
       }
     });
-    (0, _defineProperty2["default"])(this, "_loopbackAudioSourceId", (0, _env.getPlatform)() === _env.FcrApplicationPlatform.MACOS && (0, _env.isElectron)() ? 'AgoraALD' : (0, _env.isElectron)() ? '' : 'default');
     (0, _defineProperty2["default"])(this, "_shareSelectionDialogId", '');
     (0, _defineProperty2["default"])(this, "_controlBarDialogId", '');
     (0, _defineProperty2["default"])(this, "_videoWindowDialogId", '');
-    (0, _defineProperty2["default"])(this, "_shareLocked", false);
-    (0, _defineProperty2["default"])(this, "_screenTrack", null);
-    (0, _defineProperty2["default"])(this, "_shareAudioTrack", null);
-    (0, _defineProperty2["default"])(this, "_currentShareId", '');
-    (0, _defineProperty2["default"])(this, "_currentShareType", _type.AgoraRtcScreenCaptureType.SCREEN);
-    (0, _defineProperty2["default"])(this, "_isOnline", true);
-    _classPrivateFieldInitSpec(this, _A, _init_screenSharingState(this, _fcrCore.FcrMediaSourceState.CLOSE));
-    _classPrivateFieldInitSpec(this, _B, _init_applicationCaptureSources(this, []));
-    _classPrivateFieldInitSpec(this, _C, _init_screenCaptureSources(this, []));
-    _classPrivateFieldInitSpec(this, _D, _init_currentSelection(this, (0, _env.isElectron)() ? '' : 'default'));
-    _classPrivateFieldInitSpec(this, _E, _init_currentSelectionType(this, _type.AgoraRtcScreenCaptureType.WINDOW));
-    _classPrivateFieldInitSpec(this, _F, _init_shareWithAudio(this, !(0, _env.isElectron)()));
-    // electron 默认 false，web 默认 true
-    _classPrivateFieldInitSpec(this, _G, _init_boardOwnerUser(this, undefined));
-    _classPrivateFieldInitSpec(this, _H, _init_currentSelectionBounds(this, {
-      x: 0,
-      y: 0,
-      width: 0,
-      height: 0
-    }));
-    _classPrivateFieldInitSpec(this, _I, _init_connectionState(this, _fcrCore.FcrConnectionState.CONNECTED));
+    _classPrivateFieldInitSpec(this, _A, _init_boardOwnerUser(this, undefined));
     (0, _defineProperty2["default"])(this, "handleChooseScreen", _init_handleChooseScreen(this, function (id) {
       var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _type.AgoraRtcScreenCaptureType.WINDOW;
       var bounds = arguments.length > 2 ? arguments[2] : undefined;
-      _this.currentSelection = id;
-      _this.currentSelectionType = type;
-      _this.currentSelectionBounds = bounds;
+      _this._sharedScreenShareSharedDataSource.setCurrentSelection(id, type, bounds);
     }));
     this._deviceProvider = deviceProvider;
     this._messageProvider = messageProvider;
@@ -213,18 +157,17 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
     this._securityStore = privilegeProvider;
     this._roomProvider = roomProvider;
     this._sharedMemberDataSource = sharedMemberDataSource;
+    this._screenShareProvider = screenShareProvider;
+    this._annotationProvider = annotationProvider;
+    this._sharedScreenShareSharedDataSource = sharedScreenShareSharedDataSource;
     this._connectionProvider = connectionProvider;
-    this._screenShareDataSource = screenShareDataSource;
-    this._streamControl = roomControl.getStreamControl();
     this._userControl = roomControl.getUserControl();
-    this._boardControl = roomControl.getBoardControl();
+    this._boardControl = roomControl.getSharingControl().getBoardControl();
     this._roomProvider.addObserver(this._roomObserver);
     this._eventProvider.addObserver(this._uiEventObserver);
-    this._streamControl.addObserver(this._streamObserver);
     this._boardControl.addObserver(this._boardObserver);
-    this._connectionProvider.addObserver(this._connectionObserver);
+    this._screenShareProvider.addObserver(this._screenCaptureStateObserver);
     this._addEventListeners();
-    this._syncShareStreamState();
     if ((0, _parameters.getStartScreenSharing)(sharedConfigDataSource.creatorConfig.parameters)) {
       var display = window.runtime.screen.getAllDisplays()[0];
       this.handleStartShare(String(display.id), _type.AgoraRtcScreenCaptureType.SCREEN, false, _shareAudio.AudioProcessingChannel.MONO, display.bounds);
@@ -243,7 +186,7 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
     }));
   }
   return (0, _createClass2["default"])(ShareScreenStore, [{
-    key: "screenSharingState",
+    key: "boardOwnerUser",
     get: function get() {
       return _classPrivateFieldGet(_A, this);
     },
@@ -251,108 +194,128 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
       _classPrivateFieldSet(_A, this, v);
     }
   }, {
-    key: "applicationCaptureSources",
+    key: "currentShareStreamId",
     get: function get() {
-      return _classPrivateFieldGet(_B, this);
-    },
-    set: function set(v) {
-      _classPrivateFieldSet(_B, this, v);
+      return this._sharedScreenShareSharedDataSource.currentShareStreamId;
     }
   }, {
-    key: "screenCaptureSources",
+    key: "screenTrack",
     get: function get() {
-      return _classPrivateFieldGet(_C, this);
-    },
-    set: function set(v) {
-      _classPrivateFieldSet(_C, this, v);
+      return this._sharedScreenShareSharedDataSource.screenTrack;
     }
   }, {
-    key: "currentSelection",
+    key: "currentShareType",
     get: function get() {
-      return _classPrivateFieldGet(_D, this);
-    },
-    set: function set(v) {
-      _classPrivateFieldSet(_D, this, v);
+      return this._sharedScreenShareSharedDataSource.currentShareType;
     }
   }, {
-    key: "currentSelectionType",
+    key: "localUser",
     get: function get() {
-      return _classPrivateFieldGet(_E, this);
-    },
-    set: function set(v) {
-      _classPrivateFieldSet(_E, this, v);
+      return this._sharedMemberDataSource.localUser;
     }
   }, {
-    key: "shareWithAudio",
+    key: "localUserRole",
     get: function get() {
-      return _classPrivateFieldGet(_F, this);
-    },
-    set: function set(v) {
-      _classPrivateFieldSet(_F, this, v);
+      return this._sharedMemberDataSource.localUserRole;
     }
   }, {
-    key: "boardOwnerUser",
+    key: "isHost",
     get: function get() {
-      return _classPrivateFieldGet(_G, this);
-    },
-    set: function set(v) {
-      _classPrivateFieldSet(_G, this, v);
+      return this._sharedMemberDataSource.isLocalUserHost;
     }
   }, {
-    key: "currentSelectionBounds",
+    key: "supportEnumScreen",
     get: function get() {
-      return _classPrivateFieldGet(_H, this);
-    },
-    set: function set(v) {
-      _classPrivateFieldSet(_H, this, v);
+      return this._deviceProvider.isCapabilitySupported(_fcrCore.FcrCapability.SCREEN_ENUMERATE);
+    }
+  }, {
+    key: "appWindowList",
+    get: function get() {
+      return this._sharedScreenShareSharedDataSource.appWindowList;
+    }
+  }, {
+    key: "displayList",
+    get: function get() {
+      return this._sharedScreenShareSharedDataSource.displayList;
     }
   }, {
     key: "connectionState",
     get: function get() {
-      return _classPrivateFieldGet(_I, this);
-    },
-    set: function set(v) {
-      _classPrivateFieldSet(_I, this, v);
+      return this._sharedScreenShareSharedDataSource.connectionState;
     }
   }, {
-    key: "localUser",
+    key: "screenSharingState",
     get: function get() {
-      return this._sharedMemberDataSource.localUser;
+      return this._sharedScreenShareSharedDataSource.screenSharingState;
     }
   }, {
-    key: "localUserRole",
+    key: "applicationCaptureSources",
     get: function get() {
-      return this._sharedMemberDataSource.localUserRole;
+      return this._sharedScreenShareSharedDataSource.applicationCaptureSources;
     }
   }, {
-    key: "isHost",
+    key: "screenCaptureSources",
     get: function get() {
-      return this._sharedMemberDataSource.isLocalUserHost;
+      return this._sharedScreenShareSharedDataSource.screenCaptureSources;
     }
   }, {
-    key: "supportEnumScreen",
+    key: "currentShareAudioProcessingChannel",
     get: function get() {
-      return this._deviceProvider.isCapabilitySupported(_fcrCore.FcrCapability.SCREEN_ENUMERATE);
+      return this._sharedScreenShareSharedDataSource.currentShareAudioProcessingChannel;
     }
   }, {
-    key: "appWindowList",
+    key: "currentSelectionId",
     get: function get() {
-      return this._deviceProvider.getWindowList();
+      return this._sharedScreenShareSharedDataSource.currentSelectionId;
     }
   }, {
-    key: "displayList",
+    key: "currentSelectionType",
     get: function get() {
-      return this._deviceProvider.getDisplayList();
+      return this._sharedScreenShareSharedDataSource.currentSelectionType;
     }
   }, {
-    key: "currentShareAudioProcessingChannel",
+    key: "shareWithAudio",
     get: function get() {
-      return this._screenShareDataSource.currentShareAudioProcessingChannel;
+      return this._sharedScreenShareSharedDataSource.shareWithAudio;
+    }
+  }, {
+    key: "currentSelectionBounds",
+    get: function get() {
+      return this._sharedScreenShareSharedDataSource.currentSelectionBounds;
+    }
+  }, {
+    key: "shareLock",
+    get: function get() {
+      return this._screenShareProvider.shareLock;
+    }
+  }, {
+    key: "currentShareId",
+    get: function get() {
+      return this._sharedScreenShareSharedDataSource.currentShareId;
+    }
+  }, {
+    key: "_handleOnScreenCaptureStopped",
+    value: function _handleOnScreenCaptureStopped() {
+      this.handleStopShare();
+    }
+  }, {
+    key: "_handleOnScreenCaptureStarted",
+    value: function _handleOnScreenCaptureStarted() {
+      this.prepareShareScreen();
+    }
+  }, {
+    key: "_hasScreenSharePermission",
+    value: function _hasScreenSharePermission() {
+      if (!this._securityStore.hasStartScreenSharePermission()) {
+        this._showToast((0, _i18n.transI18n)('fmt_screenshare_cohost_can_not_share_remind'), 'error');
+        return false;
+      }
+      return true;
     }
   }, {
     key: "setShareWithAudioState",
     value: function setShareWithAudioState(withAudio) {
-      this.shareWithAudio = withAudio;
+      this._sharedScreenShareSharedDataSource.setShareWithAudio(withAudio);
     }
   }, {
     key: "hasLoopbackDevice",
@@ -380,8 +343,8 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
     }()
   }, {
     key: "setShareAudioProcessingChannel",
-    value: function setShareAudioProcessingChannel(channel) {
-      this._screenShareDataSource.setCurrentShareAudioProcessingChannel(channel);
+    value: function setShareAudioProcessingChannel(currentShareAudioProcessingChannel) {
+      this._sharedScreenShareSharedDataSource.setCurrentShareAudioProcessingChannel(currentShareAudioProcessingChannel);
     }
   }, {
     key: "handlerBoardShareStop",
@@ -391,19 +354,18 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "release",
     value: function release() {
-      var _this$_screenTrack;
       this._disposers.forEach(function (disposer) {
         return disposer();
       });
       this._disposers = [];
-      this._closeCapture();
-      this._removeEventListeners();
+      this._closeShareScreenComps();
       this._eventProvider.removeObserver(this._uiEventObserver);
-      this._streamControl.removeObserver(this._streamObserver);
-      (_this$_screenTrack = this._screenTrack) === null || _this$_screenTrack === void 0 || _this$_screenTrack.removeObserver(this._observer);
+      // this.screenTrack?.removeObserver(this._observer);
+      this._screenShareProvider.removeObserver(this._screenCaptureStateObserver);
+      this._screenShareProvider.release();
       this._boardControl.removeObserver(this._boardObserver);
       this._roomProvider.removeObserver(this._roomObserver);
-      this._connectionProvider.removeObserver(this._connectionObserver);
+      this._removeEventListeners();
     }
   }, {
     key: "openRelaunchTipsDialog",
@@ -424,30 +386,20 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
       });
     }
   }, {
-    key: "startPreview",
-    value: function startPreview(dom) {
-      this._previewDom = dom;
-      if (dom) {
-        var _this$_screenTrack2;
-        (_this$_screenTrack2 = this._screenTrack) === null || _this$_screenTrack2 === void 0 || _this$_screenTrack2.startPreview({
-          renderMode: 1,
-          isMirror: false
-        }, dom);
-      } else {
-        var _this$_screenTrack3;
-        (_this$_screenTrack3 = this._screenTrack) === null || _this$_screenTrack3 === void 0 || _this$_screenTrack3.stopPreview(dom);
-        this._previewDom = null;
-      }
+    key: "startRenderSharePreview",
+    value: function startRenderSharePreview(dom) {
+      this._screenShareProvider.startRenderSharePreview(dom);
+    }
+  }, {
+    key: "stopRenderSharePreview",
+    value: function stopRenderSharePreview(screenTrack) {
+      this._screenShareProvider.stopRenderSharePreview(screenTrack);
     }
   }, {
     key: "handleStopShare",
     value: function handleStopShare() {
-      var _this$_screenTrack4, _this$_screenTrack5;
-      this._closeCapture();
-      this._removeScreenStream();
-      this._previewDom && ((_this$_screenTrack4 = this._screenTrack) === null || _this$_screenTrack4 === void 0 ? void 0 : _this$_screenTrack4.stopPreview(this._previewDom));
-      (_this$_screenTrack5 = this._screenTrack) === null || _this$_screenTrack5 === void 0 || _this$_screenTrack5.stop();
-      this._currentShareId = '';
+      this._closeShareScreenComps();
+      this._screenShareProvider.stopShareScreen();
     }
   }, {
     key: "prepareShareScreen",
@@ -479,7 +431,7 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
               return _context2.abrupt("return");
             case 3:
               this.supportEnumScreen && this._openShareScreenSelection();
-              !(0, _env.isElectron)() && this.handleStartShare(this.currentSelection, _type.AgoraRtcScreenCaptureType.SCREEN, true, _shareAudio.AudioProcessingChannel.MONO, this.currentSelectionBounds); // web 直接开始分享
+              !(0, _env.isElectron)() && this.handleStartShare(this.currentSelectionId, _type.AgoraRtcScreenCaptureType.SCREEN, true, _shareAudio.AudioProcessingChannel.MONO, this.currentSelectionBounds);
             case 5:
             case "end":
               return _context2.stop();
@@ -497,9 +449,7 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
       var _handleStartShare = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee3(id, type, withAudio) {
         var audioProcessingChannel,
           bounds,
-          excludeWindows,
           electronBounds,
-          screenTrack,
           _args3 = arguments;
         return _regenerator["default"].wrap(function _callee3$(_context3) {
           while (1) switch (_context3.prev = _context3.next) {
@@ -513,31 +463,40 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
               this._showToast((0, _i18n.transI18n)('fmt_screenshare_toast_network_error_unable_start_screen_share'), 'error');
               return _context3.abrupt("return", Promise.reject(false));
             case 5:
-              excludeWindows = [];
               if ((0, _env.isElectron)()) this._closeShareScreenSelection();
-              if (!(id.split('-')[0] === 'whiteboard')) {
-                _context3.next = 12;
+              if (!id.startsWith('whiteboard-')) {
+                _context3.next = 11;
                 break;
               }
               if (!(!this._securityStore.hasStartBoardPermission() && !this.isHost)) {
-                _context3.next = 10;
+                _context3.next = 9;
                 break;
               }
               return _context3.abrupt("return", this._showToast((0, _i18n.transI18n)('fmt_screenshare_tips_hostprohibits'), 'error'));
-            case 10:
+            case 9:
               this._eventProvider.sendEvent(_constant.FcrUIAction.OPEN_WHITEBOARD);
               return _context3.abrupt("return");
-            case 12:
+            case 11:
               electronBounds = (0, _env.isElectron)() ? window.runtime.screen.getDisplayNearestPoint(bounds) : null;
-              this._screenShareDataSource.setCurrentShareBounds((electronBounds === null || electronBounds === void 0 ? void 0 : electronBounds.bounds) || bounds);
+              this._sharedScreenShareSharedDataSource.setCurrentSelectionBounds((electronBounds === null || electronBounds === void 0 ? void 0 : electronBounds.bounds) || bounds);
               if (!(this.screenSharingState === _fcrCore.FcrMediaSourceState.OPEN)) {
-                _context3.next = 18;
+                _context3.next = 17;
                 break;
               }
               this._handleReplaceScreen(id, type, withAudio, audioProcessingChannel, bounds);
               this._setShareLock(false);
               return _context3.abrupt("return");
-            case 18:
+            case 17:
+              this._annotationProvider.setCurrentShareInfo({
+                id: id,
+                type: type,
+                bounds: bounds
+              });
+              this._annotationProvider.setBoundsToAnnotationWindow({
+                id: id,
+                type: type,
+                bounds: bounds
+              });
               this._eventProvider.sendEvent(_constant.FcrUIAction.SET_CURRENT_SHARE_SCREEN, {
                 id: id,
                 type: type,
@@ -545,61 +504,38 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
               });
               _context3.t0 = this.supportEnumScreen;
               if (!_context3.t0) {
-                _context3.next = 24;
+                _context3.next = 25;
                 break;
               }
-              _context3.next = 23;
+              _context3.next = 24;
               return this._validateShareStart(id, type);
-            case 23:
-              _context3.t0 = !_context3.sent;
             case 24:
+              _context3.t0 = !_context3.sent;
+            case 25:
               if (!_context3.t0) {
-                _context3.next = 26;
+                _context3.next = 27;
                 break;
               }
               return _context3.abrupt("return");
-            case 26:
-              if (!this._shareLocked) {
-                _context3.next = 28;
+            case 27:
+              if (!this.shareLock) {
+                _context3.next = 29;
                 break;
               }
               return _context3.abrupt("return", this._showToast((0, _i18n.transI18n)('fmt_screenshare_tips_enablecollection'), 'error'));
-            case 28:
+            case 29:
               this._setShareLock(true);
-              this.setShareWithAudioState(withAudio);
-              this._currentShareId = id;
-              this._currentShareType = type;
-              this.currentSelectionBounds = bounds;
-              if (withAudio) this._handleShareStartWithAudio();
+              this._sharedScreenShareSharedDataSource.setCurrentShareIdInfos(id, type, bounds);
               if (this._hasScreenSharePermission()) {
-                _context3.next = 37;
+                _context3.next = 34;
                 break;
               }
               this._setShareLock(false);
               return _context3.abrupt("return");
-            case 37:
-              this._initControlbar(); // 初始化控制栏，web 和 electron 都需要执行
-              if (!(0, _env.isElectron)()) {
-                _context3.next = 44;
-                break;
-              }
-              _context3.next = 41;
-              return this._createScreenStream(id);
-            case 41:
-              _context3.next = 43;
-              return this._getExcludeWindows();
-            case 43:
-              excludeWindows = _context3.sent;
-            case 44:
-              screenTrack = this._deviceProvider.getScreenTrack(id);
-              this._screenTrack = screenTrack;
-              screenTrack.addObserver(this._observer);
-              screenTrack.start(type, {
-                // preview: true,
-                withAudio: withAudio,
-                excludeWindows: excludeWindows
-              });
-            case 48:
+            case 34:
+              this._initControlbar();
+              this._screenShareProvider.startShareScreen(id, type, withAudio, false);
+            case 36:
             case "end":
               return _context3.stop();
           }
@@ -610,83 +546,41 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
       }
       return handleStartShare;
     }()
-  }, {
-    key: "_startLoopback",
-    value: function () {
-      var _startLoopback2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee4(withAudio) {
-        return _regenerator["default"].wrap(function _callee4$(_context4) {
-          while (1) switch (_context4.prev = _context4.next) {
-            case 0:
-              this._setWithAudioState(withAudio);
-              if (withAudio) {
-                this._handleShareStartWithAudio();
-              } else {
-                this._handleShareStopWithAudio();
-              }
-            case 2:
-            case "end":
-              return _context4.stop();
-          }
-        }, _callee4, this);
-      }));
-      function _startLoopback(_x4) {
-        return _startLoopback2.apply(this, arguments);
-      }
-      return _startLoopback;
-    }()
-  }, {
-    key: "_handleShareStartWithAudio",
-    value: function _handleShareStartWithAudio() {
-      this._shareAudioTrack = this._deviceProvider.getLoopbackTrack(this._loopbackAudioSourceId);
-      if (this._deviceProvider.isCapabilitySupported(_fcrCore.FcrCapability.LOOPBACK_CAPTURE)) {
-        this._shareAudioTrack.start();
-      }
-    }
-  }, {
-    key: "_handleShareStopWithAudio",
-    value: function _handleShareStopWithAudio() {
-      if (!this._shareAudioTrack) {
-        return;
-      }
-      if (this._deviceProvider.isCapabilitySupported(_fcrCore.FcrCapability.LOOPBACK_CAPTURE)) {
-        this._shareAudioTrack.stop();
-      }
-    }
   }, {
     key: "_openShareScreenSelection",
     value: function () {
-      var _openShareScreenSelection2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee5() {
+      var _openShareScreenSelection2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee4() {
         var _this4 = this;
         var windowList, displayList;
-        return _regenerator["default"].wrap(function _callee5$(_context5) {
-          while (1) switch (_context5.prev = _context5.next) {
+        return _regenerator["default"].wrap(function _callee4$(_context4) {
+          while (1) switch (_context4.prev = _context4.next) {
             case 0:
               this._shareSelectionDialogId = this._dialogProvider.openDialog(_constant.FcrUIDialogKey.SHARE_SCREEN, 'screen-selection');
-              _context5.next = 3;
+              _context4.next = 3;
               return this.appWindowList;
             case 3:
-              windowList = _context5.sent.filter(function (item) {
-                return !['AgoraHighLighter', 'Toast', 'Confirm'].includes(item.title) || item.isCurrent;
+              windowList = _context4.sent.filter(function (item) {
+                return !['AgoraHighLighter', 'Toast', 'Confirm', 'Annotation tool bar', 'Annotation', 'Video Window', 'Control Bar'].includes(item.title) || item.isCurrent;
               });
-              _context5.next = 6;
+              _context4.next = 6;
               return this.displayList;
             case 6:
-              displayList = _context5.sent;
+              displayList = _context4.sent;
               (0, _mobx.runInAction)(function () {
-                _this4.applicationCaptureSources = windowList.filter(function (item) {
+                _this4._sharedScreenShareSharedDataSource.setApplicationCaptureSources(windowList.filter(function (item) {
                   return !item.isCurrent;
-                });
-                _this4.screenCaptureSources = [{
+                }));
+                _this4._sharedScreenShareSharedDataSource.setScreenCaptureSources([{
                   title: (0, _i18n.transI18n)('fmt_share_options_whiteboard'),
                   id: "whiteboard-".concat(displayList[0].id),
-                  image: _type4.FcrIconType.FCR_WHITEBOARD2
-                }].concat((0, _toConsumableArray2["default"])(displayList));
+                  image: _type2.FcrIconType.FCR_WHITEBOARD2
+                }].concat((0, _toConsumableArray2["default"])(displayList)));
               });
             case 8:
             case "end":
-              return _context5.stop();
+              return _context4.stop();
           }
-        }, _callee5, this);
+        }, _callee4, this);
       }));
       function _openShareScreenSelection() {
         return _openShareScreenSelection2.apply(this, arguments);
@@ -725,315 +619,48 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
       this._eventProvider.sendEvent(_constant.FcrUIAction.CLOSE_VIDEO_WINDOW);
     }
   }, {
-    key: "_setWithAudioState",
-    value: function _setWithAudioState(withAudio) {
-      this.setShareWithAudioState(withAudio);
-      if (this._currentShareStreamId) {
-        this._streamControl.updatePublishPrivilegeOfStreams((0, _defineProperty2["default"])({}, this._currentShareStreamId, {
-          audioPrivilege: withAudio ? _fcrCore.FcrStreamPrivilegeOperation.HAS_PRIVILEGE : _fcrCore.FcrStreamPrivilegeOperation.NOPRIVILEGE,
-          videoPrivilege: _fcrCore.FcrStreamPrivilegeOperation.NOOPERATION
-        }));
+    key: "_handleOnScreenShareReplaceBegin",
+    value: function _handleOnScreenShareReplaceBegin(id, type, bounds) {
+      if ((0, _env.isElectron)()) {
+        this._initControlbar();
       }
+      this._eventProvider.sendEvent(_constant.FcrUIAction.SET_CURRENT_SHARE_SCREEN, {
+        id: id,
+        type: type,
+        bounds: bounds
+      });
+      this._annotationProvider.setCurrentShareInfo({
+        id: id,
+        type: type,
+        bounds: bounds
+      });
+      this._annotationProvider.setBoundsToAnnotationWindow({
+        id: id,
+        type: type,
+        bounds: bounds
+      });
     }
   }, {
     key: "_handleReplaceScreen",
     value: function _handleReplaceScreen(id, type, withAudio) {
-      var _this5 = this;
       var audioProcessingChannel = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : _shareAudio.AudioProcessingChannel.MONO;
       var bounds = arguments.length > 4 ? arguments[4] : undefined;
-      withAudio = (0, _env.isElectron)() ? withAudio : true; // electron 取 withAudio，web 默认为 true
-      if (this.shareWithAudio && !withAudio) {
-        this._handleShareStopWithAudio();
-      }
-      this.setShareWithAudioState(withAudio);
-      var screenTrack = this._screenTrack;
-      this._isReplaceScreen = true;
-      if (screenTrack) {
-        var observer = {
-          onScreenCaptureStateUpdated: function () {
-            var _onScreenCaptureStateUpdated = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee6(sourceId, state) {
-              var newScreenTrack, excludeWindows;
-              return _regenerator["default"].wrap(function _callee6$(_context6) {
-                while (1) switch (_context6.prev = _context6.next) {
-                  case 0:
-                    if (!(state === _fcrCore.FcrMediaSourceState.CLOSE)) {
-                      _context6.next = 19;
-                      break;
-                    }
-                    if ((0, _env.isElectron)()) {
-                      _this5._initControlbar();
-                    }
-                    _this5._eventProvider.sendEvent(_constant.FcrUIAction.SET_CURRENT_SHARE_SCREEN, {
-                      id: id,
-                      type: type,
-                      bounds: bounds
-                    });
-                    screenTrack.removeObserver(_this5._observer);
-                    screenTrack.removeObserver(observer);
-                    newScreenTrack = _this5._deviceProvider.getScreenTrack(id);
-                    if (withAudio) {
-                      _this5._handleShareStartWithAudio();
-                    }
-                    _this5._screenTrack = newScreenTrack;
-                    excludeWindows = [];
-                    if (!(0, _env.isElectron)()) {
-                      _context6.next = 13;
-                      break;
-                    }
-                    _context6.next = 12;
-                    return _this5._getExcludeWindows();
-                  case 12:
-                    excludeWindows = _context6.sent;
-                  case 13:
-                    newScreenTrack.addObserver(_this5._observer);
-                    newScreenTrack.start(type, {
-                      // preview: true,
-                      withAudio: withAudio,
-                      excludeWindows: excludeWindows
-                    });
-                    if (_this5._currentShareStreamId) {
-                      _this5._streamControl.bindLocalStreams([{
-                        streamId: _this5._currentShareStreamId,
-                        audioSourceId: _this5._loopbackAudioSourceId,
-                        videoSourceId: id
-                      }]);
-                    }
-                    _this5._currentShareId = id;
-                    _this5._currentShareType = type;
-                    _this5.currentSelectionBounds = bounds;
-                  case 19:
-                  case "end":
-                    return _context6.stop();
-                }
-              }, _callee6);
-            }));
-            function onScreenCaptureStateUpdated(_x5, _x6) {
-              return _onScreenCaptureStateUpdated.apply(this, arguments);
-            }
-            return onScreenCaptureStateUpdated;
-          }()
-        };
-        screenTrack.addObserver(observer);
-        screenTrack.stop();
-        this._previewDom && screenTrack.stopPreview(this._previewDom);
-      }
+      this._screenShareProvider.replaceScreenShare(id, type, withAudio, bounds);
     }
-  }, {
-    key: "_createScreenStream",
-    value: function () {
-      var _createScreenStream2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee7(videoSourceId) {
-        var _this6 = this;
-        var audioSourceId, streamId;
-        return _regenerator["default"].wrap(function _callee7$(_context7) {
-          while (1) switch (_context7.prev = _context7.next) {
-            case 0:
-              if (this._securityStore.hasStartScreenSharePermission()) {
-                _context7.next = 3;
-                break;
-              }
-              this._showToast((0, _i18n.transI18n)('fmt_screenshare_cohost_can_not_share_remind'), 'error');
-              return _context7.abrupt("return", this.handleStopShare());
-            case 3:
-              audioSourceId = this._loopbackAudioSourceId;
-              _context7.next = 6;
-              return this._streamControl.addLocalScreenStream({
-                streamType: _type2.AgoraRteMediaStreamType.BOTH,
-                videoSourceId: videoSourceId,
-                audioSourceId: audioSourceId
-              })["finally"](function () {
-                _this6._setShareLock(false);
-              });
-            case 6:
-              streamId = _context7.sent;
-              this._currentShareStreamId = streamId;
-            case 8:
-            case "end":
-              return _context7.stop();
-          }
-        }, _callee7, this);
-      }));
-      function _createScreenStream(_x7) {
-        return _createScreenStream2.apply(this, arguments);
-      }
-      return _createScreenStream;
-    }()
-  }, {
-    key: "_handleWebScreenCaptureStateUpdated",
-    value: function () {
-      var _handleWebScreenCaptureStateUpdated2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee8(sourceId, state) {
-        var _this$_screenTrack6;
-        return _regenerator["default"].wrap(function _callee8$(_context8) {
-          while (1) switch (_context8.prev = _context8.next) {
-            case 0:
-              this.screenSharingState = state;
-              if (state === _fcrCore.FcrMediaSourceState.OPEN) {
-                this._setShareLock(true);
-                this._createScreenStream(this._currentShareId);
-              }
-              if (state === _fcrCore.FcrMediaSourceState.CLOSE) {
-                this._setShareLock(false);
-                this._isReplaceScreen ? (_this$_screenTrack6 = this._screenTrack) === null || _this$_screenTrack6 === void 0 ? void 0 : _this$_screenTrack6.stop() : this.handleStopShare();
-              }
-              if (state === _fcrCore.FcrMediaSourceState.ERROR) {
-                this._setShareLock(false);
-                this._isReplaceScreen = false;
-              }
-            case 4:
-            case "end":
-              return _context8.stop();
-          }
-        }, _callee8, this);
-      }));
-      function _handleWebScreenCaptureStateUpdated(_x8, _x9) {
-        return _handleWebScreenCaptureStateUpdated2.apply(this, arguments);
-      }
-      return _handleWebScreenCaptureStateUpdated;
-    }()
-  }, {
-    key: "_handleScreenCaptureStateUpdated",
-    value: function () {
-      var _handleScreenCaptureStateUpdated2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee9(sourceId, state) {
-        var _this$_screenTrack7, _this$_screenTrack8, _this$_screenTrack9;
-        return _regenerator["default"].wrap(function _callee9$(_context9) {
-          while (1) switch (_context9.prev = _context9.next) {
-            case 0:
-              if (state === _fcrCore.FcrMediaSourceState.CLOSE) {
-                this._previewDom && ((_this$_screenTrack7 = this._screenTrack) === null || _this$_screenTrack7 === void 0 ? void 0 : _this$_screenTrack7.stopPreview(this._previewDom));
-                (_this$_screenTrack8 = this._screenTrack) === null || _this$_screenTrack8 === void 0 || _this$_screenTrack8.removeObserver(this._observer);
-                this._isReplaceScreen ? (_this$_screenTrack9 = this._screenTrack) === null || _this$_screenTrack9 === void 0 ? void 0 : _this$_screenTrack9.stop() : this.handleStopShare();
-                this._isReplaceScreen = false;
-              }
-              if (!(state === _fcrCore.FcrMediaSourceState.ERROR)) {
-                _context9.next = 6;
-                break;
-              }
-              this.handleStopShare();
-              this.screenSharingState = _fcrCore.FcrMediaSourceState.CLOSE;
-              this._isReplaceScreen = false;
-              return _context9.abrupt("return");
-            case 6:
-              this.screenSharingState = state;
-            case 7:
-            case "end":
-              return _context9.stop();
-          }
-        }, _callee9, this);
-      }));
-      function _handleScreenCaptureStateUpdated(_x10, _x11) {
-        return _handleScreenCaptureStateUpdated2.apply(this, arguments);
-      }
-      return _handleScreenCaptureStateUpdated;
-    }()
   }, {
     key: "_setShareLock",
     value: function _setShareLock(lock) {
-      this._shareLocked = lock;
+      this._screenShareProvider.setShareLock(lock);
     }
   }, {
-    key: "_closeCapture",
-    value: function _closeCapture() {
+    key: "_closeShareScreenComps",
+    value: function _closeShareScreenComps() {
       if ((0, _env.isElectron)()) {
         this._closeControlBar();
         this._closeVideoWindowDialog();
         window.runtime.browserWindow.show();
       }
     }
-  }, {
-    key: "_removeScreenStream",
-    value: function () {
-      var _removeScreenStream2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee10() {
-        var streamId, _this$_streamControl;
-        return _regenerator["default"].wrap(function _callee10$(_context10) {
-          while (1) switch (_context10.prev = _context10.next) {
-            case 0:
-              streamId = this._currentShareStreamId;
-              if (streamId) {
-                _context10.next = 3;
-                break;
-              }
-              return _context10.abrupt("return");
-            case 3:
-              _context10.prev = 3;
-              _context10.next = 6;
-              return (_this$_streamControl = this._streamControl) === null || _this$_streamControl === void 0 ? void 0 : _this$_streamControl.removeScreenStream();
-            case 6:
-              this._currentShareStreamId = '';
-              _context10.next = 13;
-              break;
-            case 9:
-              _context10.prev = 9;
-              _context10.t0 = _context10["catch"](3);
-              this._removeScreenStreamFailed = true;
-              this.logger.error('removeScreenStream error', _context10.t0);
-            case 13:
-            case "end":
-              return _context10.stop();
-          }
-        }, _callee10, this, [[3, 9]]);
-      }));
-      function _removeScreenStream() {
-        return _removeScreenStream2.apply(this, arguments);
-      }
-      return _removeScreenStream;
-    }()
-  }, {
-    key: "_syncShareStreamState",
-    value: function _syncShareStreamState() {
-      var _this$_streamControl$2,
-        _this7 = this;
-      var currentShareStreamId = this._currentShareStreamId || ((_this$_streamControl$2 = this._streamControl.getStreamList().find(function (stream) {
-        return stream.videoSourceType === _type3.AgoraRteVideoSourceType.SCREEN && stream.owner.userId === _this7.localUser.userId;
-      })) === null || _this$_streamControl$2 === void 0 ? void 0 : _this$_streamControl$2.streamId);
-      if (this.screenSharingState !== _fcrCore.FcrMediaSourceState.OPEN && currentShareStreamId) {
-        this.handleStopShare();
-      }
-    }
-  }, {
-    key: "_isStoppedFor",
-    value: function _isStoppedFor(events, reason, ownerIsMe) {
-      var _this8 = this;
-      return events && events.find(function (event) {
-        var _event$cause;
-        var condition = ownerIsMe ? event.modifiedStream.owner.userId === _this8.localUser.userId : event.modifiedStream.owner.userId !== _this8.localUser.userId;
-        return ((_event$cause = event.cause) === null || _event$cause === void 0 || (_event$cause = _event$cause.data) === null || _event$cause === void 0 ? void 0 : _event$cause.reason) === reason && condition;
-      });
-    }
-  }, {
-    key: "_handleStreamUpdate",
-    value: function _handleStreamUpdate(process, events) {
-      var _this$_screenTrack10,
-        _this9 = this;
-      var isClosedByOther = this._isStoppedFor(events, _types.FcrBoardInactiveReason.CLOSE);
-      var isClosed = this._isStoppedFor(events, _types.FcrBoardInactiveReason.CLOSE, false);
-      var isSeizedByOther = this._isStoppedFor(events, _types.FcrBoardInactiveReason.SEIZE);
-      var operatorUser = (isSeizedByOther === null || isSeizedByOther === void 0 ? void 0 : isSeizedByOther.operatorUser) || (isClosedByOther === null || isClosedByOther === void 0 ? void 0 : isClosedByOther.operatorUser);
-      var ownerUser = (isSeizedByOther === null || isSeizedByOther === void 0 ? void 0 : isSeizedByOther.modifiedStream.owner) || (isClosedByOther === null || isClosedByOther === void 0 ? void 0 : isClosedByOther.modifiedStream.owner);
-      var selfOperated = (operatorUser === null || operatorUser === void 0 ? void 0 : operatorUser.userId) === this.localUser.userId;
-      var isMyOwnShare = this.localUser.userId === (ownerUser === null || ownerUser === void 0 ? void 0 : ownerUser.userId);
-      (isSeizedByOther || isClosedByOther) && !selfOperated && ((_this$_screenTrack10 = this._screenTrack) === null || _this$_screenTrack10 === void 0 ? void 0 : _this$_screenTrack10.stop());
-      isClosedByOther && !selfOperated && isMyOwnShare && this._eventProvider.sendEvent(_constant.FcrUIAction.SHOW_TOAST, {
-        message: (0, _i18n.transI18n)('fmt_share_tips_sharingdisabled')
-      });
-      switch (process) {
-        case 'remove':
-          if (events.some(function (event) {
-            return event.modifiedStream.videoSourceType === _type3.AgoraRteVideoSourceType.SCREEN && event.modifiedStream.owner.userId === _this9.localUser.userId;
-          })) {
-            var _this$_screenTrack11;
-            if (!(0, _env.isElectron)() && this._isReplaceScreen) {
-              this._isReplaceScreen = false;
-              return;
-            } // web 下如果是替换的逻辑，不需要关闭分享
-            (_this$_screenTrack11 = this._screenTrack) === null || _this$_screenTrack11 === void 0 || _this$_screenTrack11.stop();
-          }
-          if (isClosed) {
-            this._eventProvider.sendEvent(_constant.FcrUIAction.SHOW_TOAST, {
-              message: (0, _i18n.transI18n)('fmt_screenshare_whiteboard_tips_stopped')
-            });
-          }
-          break;
-      }
-    }
   }, {
     key: "_addEventListeners",
     value: function _addEventListeners() {
@@ -1051,7 +678,6 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
     value: function _handleOnline() {
       this._isOnline = true;
       this.logger.info('ononline');
-      this._syncShareStreamState();
     }
   }, {
     key: "_handleOffline",
@@ -1062,42 +688,40 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "_onUiEvent",
     value: function () {
-      var _onUiEvent2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee11(event, params) {
-        return _regenerator["default"].wrap(function _callee11$(_context11) {
-          while (1) switch (_context11.prev = _context11.next) {
+      var _onUiEvent2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee5(event, params) {
+        return _regenerator["default"].wrap(function _callee5$(_context5) {
+          while (1) switch (_context5.prev = _context5.next) {
             case 0:
-              _context11.t0 = event;
-              _context11.next = _context11.t0 === _constant.FcrUIAction.START_SHARE_SCREEN ? 3 : _context11.t0 === _constant.FcrUIAction.STOP_SCREEN_CAPTURE ? 5 : _context11.t0 === _constant.FcrUIAction.ENGINE_RECONNECTED ? 7 : _context11.t0 === _constant.FcrUIAction.STOP_SHARE_SCREEN ? 9 : _context11.t0 === _constant.FcrUIAction.SET_SHARE_WITH_AUDIO ? 11 : _context11.t0 === _constant.FcrUIAction.OPEN_TOP_VIDEO_WINDOW ? 13 : 15;
+              _context5.t0 = event;
+              _context5.next = _context5.t0 === _constant.FcrUIAction.START_SHARE_SCREEN ? 3 : _context5.t0 === _constant.FcrUIAction.STOP_SCREEN_CAPTURE ? 5 : _context5.t0 === _constant.FcrUIAction.ENGINE_RECONNECTED ? 7 : _context5.t0 === _constant.FcrUIAction.STOP_SHARE_SCREEN ? 9 : _context5.t0 === _constant.FcrUIAction.SET_SHARE_WITH_AUDIO ? 11 : _context5.t0 === _constant.FcrUIAction.OPEN_TOP_VIDEO_WINDOW ? 13 : 15;
               break;
             case 3:
               this.prepareShareScreen();
-              return _context11.abrupt("break", 15);
+              return _context5.abrupt("break", 15);
             case 5:
-              this._closeCapture();
-              // this.handleStopShare();
-              return _context11.abrupt("break", 15);
+              this.handleStopShare();
+              return _context5.abrupt("break", 15);
             case 7:
               if (this._removeScreenStreamFailed) {
-                this._removeScreenStream();
-                this._removeScreenStreamFailed = false;
+                this._removeScreenStreamFailed = !this._screenShareProvider.removeScreenStream();
               }
-              return _context11.abrupt("break", 15);
+              return _context5.abrupt("break", 15);
             case 9:
               this.handleStopShare();
-              return _context11.abrupt("break", 15);
+              return _context5.abrupt("break", 15);
             case 11:
-              this._startLoopback(params.withAudio);
-              return _context11.abrupt("break", 15);
+              this._screenShareProvider.toggleScreenshareWithAudio(params.withAudio);
+              return _context5.abrupt("break", 15);
             case 13:
               this._openVideoWindowDialog();
-              return _context11.abrupt("break", 15);
+              return _context5.abrupt("break", 15);
             case 15:
             case "end":
-              return _context11.stop();
+              return _context5.stop();
           }
-        }, _callee11, this);
+        }, _callee5, this);
       }));
-      function _onUiEvent(_x12, _x13) {
+      function _onUiEvent(_x4, _x5) {
         return _onUiEvent2.apply(this, arguments);
       }
       return _onUiEvent;
@@ -1115,35 +739,35 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "_validateWindow",
     value: function () {
-      var _validateWindow2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee12(id) {
+      var _validateWindow2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee6(id) {
         var windows, window;
-        return _regenerator["default"].wrap(function _callee12$(_context12) {
-          while (1) switch (_context12.prev = _context12.next) {
+        return _regenerator["default"].wrap(function _callee6$(_context6) {
+          while (1) switch (_context6.prev = _context6.next) {
             case 0:
-              _context12.next = 2;
+              _context6.next = 2;
               return this.appWindowList;
             case 2:
-              windows = _context12.sent;
+              windows = _context6.sent;
               window = windows.filter(function (item) {
                 return item.title !== 'AgoraHighLighter' && item.title !== 'Development HTML';
               }).find(function (item) {
                 return item.id === id;
               });
               if (window) {
-                _context12.next = 7;
+                _context6.next = 7;
                 break;
               }
               this._showToast((0, _i18n.transI18n)('fmt_screenshare_tips_faild_reselect'), 'error');
-              return _context12.abrupt("return", false);
+              return _context6.abrupt("return", false);
             case 7:
-              return _context12.abrupt("return", true);
+              return _context6.abrupt("return", true);
             case 8:
             case "end":
-              return _context12.stop();
+              return _context6.stop();
           }
-        }, _callee12, this);
+        }, _callee6, this);
       }));
-      function _validateWindow(_x14) {
+      function _validateWindow(_x6) {
         return _validateWindow2.apply(this, arguments);
       }
       return _validateWindow;
@@ -1151,32 +775,32 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "_validateDisplay",
     value: function () {
-      var _validateDisplay2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee13(id) {
+      var _validateDisplay2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee7(id) {
         var displayList;
-        return _regenerator["default"].wrap(function _callee13$(_context13) {
-          while (1) switch (_context13.prev = _context13.next) {
+        return _regenerator["default"].wrap(function _callee7$(_context7) {
+          while (1) switch (_context7.prev = _context7.next) {
             case 0:
-              _context13.next = 2;
+              _context7.next = 2;
               return this.displayList;
             case 2:
-              displayList = _context13.sent.find(function (item) {
+              displayList = _context7.sent.find(function (item) {
                 return item.id === id;
               });
               if (displayList) {
-                _context13.next = 6;
+                _context7.next = 6;
                 break;
               }
               this._showToast((0, _i18n.transI18n)('fmt_screenshare_tips_faild_screenselect'), 'error');
-              return _context13.abrupt("return", false);
+              return _context7.abrupt("return", false);
             case 6:
-              return _context13.abrupt("return", true);
+              return _context7.abrupt("return", true);
             case 7:
             case "end":
-              return _context13.stop();
+              return _context7.stop();
           }
-        }, _callee13, this);
+        }, _callee7, this);
       }));
-      function _validateDisplay(_x15) {
+      function _validateDisplay(_x7) {
         return _validateDisplay2.apply(this, arguments);
       }
       return _validateDisplay;
@@ -1184,117 +808,66 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "_validateShareStart",
     value: function () {
-      var _validateShareStart2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee14(id, type) {
-        return _regenerator["default"].wrap(function _callee14$(_context14) {
-          while (1) switch (_context14.prev = _context14.next) {
+      var _validateShareStart2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee8(id, type) {
+        return _regenerator["default"].wrap(function _callee8$(_context8) {
+          while (1) switch (_context8.prev = _context8.next) {
             case 0:
-              _context14.t0 = type === _type.AgoraRtcScreenCaptureType.WINDOW;
-              if (!_context14.t0) {
-                _context14.next = 5;
+              _context8.t0 = type === _type.AgoraRtcScreenCaptureType.WINDOW;
+              if (!_context8.t0) {
+                _context8.next = 5;
                 break;
               }
-              _context14.next = 4;
+              _context8.next = 4;
               return this._validateWindow(id);
             case 4:
-              _context14.t0 = !_context14.sent;
+              _context8.t0 = !_context8.sent;
             case 5:
-              if (!_context14.t0) {
-                _context14.next = 7;
+              if (!_context8.t0) {
+                _context8.next = 7;
                 break;
               }
-              return _context14.abrupt("return", false);
+              return _context8.abrupt("return", false);
             case 7:
-              _context14.t1 = type === _type.AgoraRtcScreenCaptureType.SCREEN;
-              if (!_context14.t1) {
-                _context14.next = 12;
+              _context8.t1 = type === _type.AgoraRtcScreenCaptureType.SCREEN;
+              if (!_context8.t1) {
+                _context8.next = 12;
                 break;
               }
-              _context14.next = 11;
+              _context8.next = 11;
               return this._validateDisplay(id);
             case 11:
-              _context14.t1 = !_context14.sent;
+              _context8.t1 = !_context8.sent;
             case 12:
-              if (!_context14.t1) {
-                _context14.next = 14;
+              if (!_context8.t1) {
+                _context8.next = 14;
                 break;
               }
-              return _context14.abrupt("return", false);
+              return _context8.abrupt("return", false);
             case 14:
-              return _context14.abrupt("return", true);
+              return _context8.abrupt("return", true);
             case 15:
             case "end":
-              return _context14.stop();
+              return _context8.stop();
           }
-        }, _callee14, this);
+        }, _callee8, this);
       }));
-      function _validateShareStart(_x16, _x17) {
+      function _validateShareStart(_x8, _x9) {
         return _validateShareStart2.apply(this, arguments);
       }
       return _validateShareStart;
     }()
-  }, {
-    key: "_hasScreenSharePermission",
-    value: function _hasScreenSharePermission() {
-      if (!this._securityStore.hasStartScreenSharePermission()) {
-        this._showToast((0, _i18n.transI18n)('fmt_screenshare_cohost_can_not_share_remind'), 'error');
-        return false;
-      }
-      return true;
-    }
-  }, {
-    key: "_getExcludeWindows",
-    value: function () {
-      var _getExcludeWindows2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee15() {
-        var excludeWindows;
-        return _regenerator["default"].wrap(function _callee15$(_context15) {
-          while (1) switch (_context15.prev = _context15.next) {
-            case 0:
-              excludeWindows = [];
-              _context15.next = 3;
-              return (0, _tools.waitUntil)(function () {
-                var _getControlBarMediaSo, _getVideoWindowMediaS;
-                var windowId = (_getControlBarMediaSo = (0, _rendererEvent.getControlBarMediaSourceId)()) !== null && _getControlBarMediaSo !== void 0 ? _getControlBarMediaSo : '';
-                var _windowId$split = windowId.split(':'),
-                  _windowId$split2 = (0, _slicedToArray2["default"])(_windowId$split, 2),
-                  videoWindowId = _windowId$split2[1];
-                if (videoWindowId && !excludeWindows.includes(videoWindowId)) {
-                  excludeWindows.push(videoWindowId);
-                }
-                windowId = (_getVideoWindowMediaS = (0, _rendererEvent.getVideoWindowMediaSourceId)()) !== null && _getVideoWindowMediaS !== void 0 ? _getVideoWindowMediaS : '';
-                var _windowId$split3 = windowId.split(':'),
-                  _windowId$split4 = (0, _slicedToArray2["default"])(_windowId$split3, 2),
-                  controlBarWindowId = _windowId$split4[1];
-                if (controlBarWindowId && !excludeWindows.includes(controlBarWindowId)) {
-                  excludeWindows.push(controlBarWindowId);
-                }
-                return !!videoWindowId && !!controlBarWindowId;
-              }, 'control bar is open');
-            case 3:
-              this.logger.info('exclude win:', JSON.stringify(excludeWindows));
-              return _context15.abrupt("return", excludeWindows);
-            case 5:
-            case "end":
-              return _context15.stop();
-          }
-        }, _callee15, this);
-      }));
-      function _getExcludeWindows() {
-        return _getExcludeWindows2.apply(this, arguments);
-      }
-      return _getExcludeWindows;
-    }()
   }, {
     key: "_initControlbar",
     value: function () {
-      var _initControlbar2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee16() {
+      var _initControlbar2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee9() {
         var params, mainWindow;
-        return _regenerator["default"].wrap(function _callee16$(_context16) {
-          while (1) switch (_context16.prev = _context16.next) {
+        return _regenerator["default"].wrap(function _callee9$(_context9) {
+          while (1) switch (_context9.prev = _context9.next) {
             case 0:
               params = {
                 currentShareAudioProcessingChannel: _shareAudio.AudioProcessingChannel.MONO,
-                currentShareId: this._currentShareId,
-                currentShareType: this._currentShareType,
+                currentShareId: this.currentShareId,
+                currentShareType: this.currentShareType,
                 shareWithAudio: this.shareWithAudio,
                 currentShareBounds: this.currentSelectionBounds
               };
@@ -1309,28 +882,25 @@ var ShareScreenStore = exports["default"] = /*#__PURE__*/function () {
               }
             case 2:
             case "end":
-              return _context16.stop();
+              return _context9.stop();
           }
-        }, _callee16, this);
+        }, _callee9, this);
       }));
       function _initControlbar() {
         return _initControlbar2.apply(this, arguments);
       }
       return _initControlbar;
     }()
+  }, {
+    key: "handleToggleScreenShareWithAudio",
+    value: function handleToggleScreenShareWithAudio(withAudio) {
+      this._screenShareProvider.toggleScreenshareWithAudio(withAudio);
+    }
   }]);
 }();
 _ShareScreenStore = ShareScreenStore;
-var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_ShareScreenStore, [[_mobx.observable, 1, "screenSharingState"], [_mobx.observable, 1, "applicationCaptureSources"], [_mobx.observable, 1, "screenCaptureSources"], [_mobx.observable, 1, "currentSelection"], [_mobx.observable, 1, "currentSelectionType"], [_mobx.observable, 1, "shareWithAudio"], [_mobx.observable, 1, "boardOwnerUser"], [_mobx.observable, 1, "currentSelectionBounds"], [_mobx.observable, 1, "connectionState"], [_setShareWithAudioStateDecs, 18, "setShareWithAudioState"], [_hasLoopbackDeviceDecs, 18, "hasLoopbackDevice"], [_setShareAudioProcessingChannelDecs, 18, "setShareAudioProcessingChannel"], [_decorator.bound, 2, "handlerBoardShareStop"], [_decorator.bound, 2, "release"], [_openRelaunchTipsDialogDecs, 18, "openRelaunchTipsDialog"], [_startPreviewDecs, 18, "startPreview"], [_handleStopShareDecs, 18, "handleStopShare"], [_handleStartShareDecs, 18, "handleStartShare"], [_startLoopbackDecs, 18, "_startLoopback"], [_handleShareStartWithAudioDecs, 18, "_handleShareStartWithAudio"], [_handleShareStopWithAudioDecs, 18, "_handleShareStopWithAudio"], [_openShareScreenSelectionDecs, 18, "_openShareScreenSelection"], [_closeShareScreenSelectionDecs, 18, "_closeShareScreenSelection"], [_setControlBarWindowIdDecs, 18, "_setControlBarWindowId"], [_openVideoWindowDialogDecs, 18, "_openVideoWindowDialog"], [_closeControlBarDecs, 18, "_closeControlBar"], [_closeVideoWindowDialogDecs, 18, "_closeVideoWindowDialog"], [_setWithAudioStateDecs, 18, "_setWithAudioState"], [_handleReplaceScreenDecs, 18, "_handleReplaceScreen"], [_decorator.bound, 2, "_handleWebScreenCaptureStateUpdated"], [_handleScreenCaptureStateUpdatedDecs, 18, "_handleScreenCaptureStateUpdated"], [_setShareLockDecs, 18, "_setShareLock"], [_decorator.bound, 2, "_syncShareStreamState"], [_handleStreamUpdateDecs, 18, "_handleStreamUpdate"], [_decorator.bound, 2, "_handleOnline"], [_decorator.bound, 2, "_handleOffline"], [_initControlbarDecs, 18, "_initControlbar"], [_handleChooseScreenDecs, 16, "handleChooseScreen"]], []).e, 11);
-_init_screenSharingState = _applyDecs$e[0];
-_init_applicationCaptureSources = _applyDecs$e[1];
-_init_screenCaptureSources = _applyDecs$e[2];
-_init_currentSelection = _applyDecs$e[3];
-_init_currentSelectionType = _applyDecs$e[4];
-_init_shareWithAudio = _applyDecs$e[5];
-_init_boardOwnerUser = _applyDecs$e[6];
-_init_currentSelectionBounds = _applyDecs$e[7];
-_init_connectionState = _applyDecs$e[8];
-_init_handleChooseScreen = _applyDecs$e[9];
-_initProto = _applyDecs$e[10];
+var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_ShareScreenStore, [[_mobx.observable, 1, "boardOwnerUser"], [_setShareWithAudioStateDecs, 18, "setShareWithAudioState"], [_hasLoopbackDeviceDecs, 18, "hasLoopbackDevice"], [_setShareAudioProcessingChannelDecs, 18, "setShareAudioProcessingChannel"], [_decorator.bound, 2, "handlerBoardShareStop"], [_decorator.bound, 2, "release"], [_openRelaunchTipsDialogDecs, 18, "openRelaunchTipsDialog"], [_startRenderSharePreviewDecs, 18, "startRenderSharePreview"], [_stopRenderSharePreviewDecs, 18, "stopRenderSharePreview"], [_handleStopShareDecs, 18, "handleStopShare"], [_handleStartShareDecs, 18, "handleStartShare"], [_openShareScreenSelectionDecs, 18, "_openShareScreenSelection"], [_closeShareScreenSelectionDecs, 18, "_closeShareScreenSelection"], [_setControlBarWindowIdDecs, 18, "_setControlBarWindowId"], [_openVideoWindowDialogDecs, 18, "_openVideoWindowDialog"], [_closeControlBarDecs, 18, "_closeControlBar"], [_closeVideoWindowDialogDecs, 18, "_closeVideoWindowDialog"], [_handleReplaceScreenDecs, 18, "_handleReplaceScreen"], [_decorator.bound, 2, "_handleOnline"], [_decorator.bound, 2, "_handleOffline"], [_initControlbarDecs, 18, "_initControlbar"], [_decorator.bound, 2, "handleToggleScreenShareWithAudio"], [_handleChooseScreenDecs, 16, "handleChooseScreen"]], []).e, 3);
+_init_boardOwnerUser = _applyDecs$e[0];
+_init_handleChooseScreen = _applyDecs$e[1];
+_initProto = _applyDecs$e[2];
 var StoreContext = exports.StoreContext = /*#__PURE__*/(0, _react.createContext)(null);