npm - fcr-ui-scene - Versions diffs - 3.6.4 → 3.7.0 - Mend

fcr-ui-scene 3.6.4 → 3.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (468) hide show

package/lib/modules/annotation/store.js CHANGED Viewed

@@ -2,16 +2,11 @@
 require("core-js/modules/es.symbol.js");
 require("core-js/modules/es.symbol.description.js");
-require("core-js/modules/es.symbol.iterator.js");
 require("core-js/modules/es.symbol.to-primitive.js");
 require("core-js/modules/es.error.cause.js");
 require("core-js/modules/es.error.to-string.js");
-require("core-js/modules/es.array.from.js");
 require("core-js/modules/es.array.is-array.js");
-require("core-js/modules/es.array.slice.js");
 require("core-js/modules/es.date.to-primitive.js");
-require("core-js/modules/es.date.to-string.js");
-require("core-js/modules/es.function.bind.js");
 require("core-js/modules/es.function.name.js");
 require("core-js/modules/es.map.js");
 require("core-js/modules/es.number.constructor.js");
@@ -42,13 +37,17 @@ Object.defineProperty(exports, "__esModule", {
 exports.AnnotationStoreContext = exports.AnnotationStore = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 require("core-js/modules/es.array.concat.js");
+require("core-js/modules/es.array.filter.js");
 require("core-js/modules/es.array.find.js");
 require("core-js/modules/es.array.for-each.js");
 require("core-js/modules/es.array.includes.js");
 require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.array.map.js");
 require("core-js/modules/es.array.push.js");
 require("core-js/modules/es.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.keys.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/es.promise.js");
 require("core-js/modules/es.regexp.constructor.js");
@@ -60,8 +59,10 @@ require("core-js/modules/es.regexp.to-string.js");
 require("core-js/modules/es.string.iterator.js");
 require("core-js/modules/es.weak-map.js");
 require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
 require("core-js/modules/esnext.iterator.find.js");
 require("core-js/modules/esnext.iterator.for-each.js");
+require("core-js/modules/esnext.iterator.map.js");
 require("core-js/modules/esnext.weak-map.delete-all.js");
 require("core-js/modules/esnext.weak-map.emplace.js");
 require("core-js/modules/web.dom-collections.for-each.js");
@@ -81,17 +82,15 @@ var _annotationProvider = require("../../providers/annotation-provider");
 var _mobx = require("mobx");
 var _fcrCore = require("fcr-core");
 var _type2 = require("fcr-core/lib/room-control/sharing-control/type");
-var _store = require("../whiteboard/components/toolbar/store");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _logger = require("../../utilities/logger");
 var _isNumber = _interopRequireDefault(require("lodash/isNumber"));
 var _env = require("agora-foundation/lib/utilities/env");
 var _type3 = require("../whiteboard/type");
+var _type4 = require("fcr-core/lib/type");
+var _annotationToolbarStore = require("./annotation-toolbar-store");
 var _AnnotationStore;
-var _initProto, _init_resetToolbarStore, _init_isShowToolbar, _setToolsShowDecs, _zoomInDecs, _zoomOutDecs, _fullContainerDecs, _setOriginScalcDecs, _drawReceiverBoardDecs, _handleBoardDomLoadDecs, _handleBoardContainerDomLoadDecs, _annotationEndedDecs, _mountDecs, _unmountDecs, _ref;
-function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+var _initProto, _init_receiverAllOpenStateReady, _handleReceiverBoardDecs, _handleBoardDomLoadDecs, _handleBoardContainerDomLoadDecs, _annotationaEndEffectThenCloseBoardDecs, _mountDecs, _unmountDecs, _annotationStartTriggerEffectDecs, _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; }
@@ -103,13 +102,11 @@ 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();
-_ref = (_setToolsShowDecs = [_mobx.action, _mobx.action.bound], _zoomInDecs = [_mobx.action, _mobx.action.bound], _zoomOutDecs = [_mobx.action, _mobx.action.bound], _fullContainerDecs = [_mobx.action, _mobx.action.bound], _setOriginScalcDecs = [_mobx.action, _mobx.action.bound], _drawReceiverBoardDecs = [_mobx.action, _mobx.action.bound], _handleBoardDomLoadDecs = [_mobx.action, _mobx.action.bound], _handleBoardContainerDomLoadDecs = [_mobx.action, _mobx.action.bound], _annotationEndedDecs = [_mobx.action, _mobx.action.bound], _mountDecs = [_mobx.action, _mobx.action.bound], _unmountDecs = [_mobx.action, _mobx.action.bound], "logger");
+_ref = (_handleReceiverBoardDecs = [_mobx.action, _mobx.action.bound], _handleBoardDomLoadDecs = [_mobx.action, _mobx.action.bound], _handleBoardContainerDomLoadDecs = [_mobx.action, _mobx.action.bound], _annotationaEndEffectThenCloseBoardDecs = [_mobx.action, _mobx.action.bound], _mountDecs = [_mobx.action, _mobx.action.bound], _unmountDecs = [_mobx.action, _mobx.action.bound], _annotationStartTriggerEffectDecs = [_mobx.action, _mobx.action.bound], "logger");
 var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
   function AnnotationStore(_ref2) {
     var _this = this;
     var dialogProvider = _ref2.dialogProvider,
-      deviceProvider = _ref2.deviceProvider,
       annotationProvider = _ref2.annotationProvider,
       sharingProvider = _ref2.sharingProvider,
       memberDataSource = _ref2.memberDataSource,
@@ -120,7 +117,8 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
       messageProvider = _ref2.messageProvider,
       localStorageProvider = _ref2.localStorageProvider,
       eventProvider = _ref2.eventProvider,
-      abilityProvider = _ref2.abilityProvider;
+      abilityProvider = _ref2.abilityProvider,
+      sharedAnnotationDataSource = _ref2.sharedAnnotationDataSource;
     (0, _classCallCheck2["default"])(this, AnnotationStore);
     (0, _defineProperty2["default"])(this, _ref, (_initProto(this), (0, _logger.createLogger)({
       prefix: 'AnnotationStore'
@@ -128,6 +126,7 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
     (0, _defineProperty2["default"])(this, "_disposers", []);
     (0, _defineProperty2["default"])(this, "_annotationControl", undefined);
     (0, _defineProperty2["default"])(this, "_resizeWatcherTimer", null);
+    (0, _defineProperty2["default"])(this, "_shareScreenOwnerId", '');
     (0, _defineProperty2["default"])(this, "_currentShareInfo", {
       id: '',
       type: _type.AgoraRtcScreenCaptureType.SCREEN,
@@ -148,39 +147,34 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
         }
       }
     });
-    _classPrivateFieldInitSpec(this, _A, _init_resetToolbarStore(this, false));
-    _classPrivateFieldInitSpec(this, _B, _init_isShowToolbar(this, false));
+    (0, _defineProperty2["default"])(this, "_sharingObserver", {
+      onScreenSharingUpdated: this._handleOnScreenSharingUpdated
+    });
+    (0, _defineProperty2["default"])(this, "_annotationObserver", {
+      onConnectionStateUpdated: this._handleOnAnnotationConnectionStateUpdated
+    });
+    // 接收端是否全部的前提工作都做完了，做完了，放出承载节点
+    // 在承载节点的handleDomLoaded后，挂载白板
+    _classPrivateFieldInitSpec(this, _A, _init_receiverAllOpenStateReady(this, false));
     (0, _defineProperty2["default"])(this, "_toolbarStore", undefined);
     (0, _defineProperty2["default"])(this, "_boardOriginWidth", 0);
+    (0, _defineProperty2["default"])(this, "_prevSetLocalVideoSize", {
+      width: 0,
+      height: 0
+    });
     (0, _defineProperty2["default"])(this, "_mounted", false);
-    (0, _defineProperty2["default"])(this, "_boardContainerObserver", new ResizeObserver(function (entries) {
-      var _iterator = _createForOfIteratorHelper(entries),
-        _step;
-      try {
-        for (_iterator.s(); !(_step = _iterator.n()).done;) {
-          var entry = _step.value;
-          var height = entry.contentRect.height;
-          // 大小变化后的处理逻辑
-          if (height > 0 && _this._memberDataSource.shareScreenVideoRatio > 0 && _this._boardDom) {
-            var ratio = _this._memberDataSource.shareScreenVideoRatio;
-            var newWidth = height * ratio;
-            _this._boardOriginWidth = newWidth;
-            _this._boardDom.style.width = "".concat(newWidth, "px");
-          }
-        }
-      } catch (err) {
-        _iterator.e(err);
-      } finally {
-        _iterator.f();
-      }
-    }));
+    (0, _defineProperty2["default"])(this, "_streamObserver", {
+      onLocalVideoStatsUpdated: this._handleOnLocalVideoStatsUpdated.bind(this)
+    });
+    (0, _defineProperty2["default"])(this, "_annotationEndLock", null);
     localStorageProvider.write('annotation_nickname', memberDataSource.localUser.userName);
     this._dialogProvider = dialogProvider;
-    this._deviceProvider = deviceProvider;
     this._annotationProvider = annotationProvider;
     this._sharingProvider = sharingProvider;
     this._memberDataSource = memberDataSource;
     this._roomControl = roomControl;
+    this._streamControl = this._roomControl.getStreamControl();
+    this._streamControl.addObserver(this._streamObserver);
     this._sharedSecuritySharedDataSource = sharedSecuritySharedDataSource;
     this._sharedScreenSharedDataSource = sharedScreenSharedDataSource;
     this._dialogProvider.addObserver(this._dialogObserver);
@@ -188,130 +182,90 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
     this._messageProvider = messageProvider;
     this._eventProvider = eventProvider;
     this._abilityProvider = abilityProvider;
-    this._disposers.push((0, _mobx.reaction)(function () {
-      return _this.annotating;
-    }, function (annotating) {
-      if (_this._isLocalUserSharingOwner) {
-        if (annotating) {
-          _this._removeWindowResizeListenner();
-        } else {
-          _this._addWindowResizeListenner();
-        }
-      }
-    }), (0, _mobx.reaction)(function () {
-      return _this.isSeizeStream;
-    }, function (state) {
-      _this.logger.info('[Annotation]: isSeizeStream changed to ', state);
-      if (state) {
-        _this._sharedScreenSharedDataSource.setIsSeizeStream(false);
-        if (_this._isLocalUserSharingOwner) {
-          _this._annotationProvider.hideAnnotationWindow();
-          _this._removeWindowResizeListenner();
-        } else {
-          _this._annotationEnded();
-        }
-      }
-    }), (0, _mobx.reaction)(function () {
-      return _this._memberDataSource.shareScreenVideoRatio;
-    }, function (ratio) {
-      if (ratio > 0) {
-        _this.drawReceiverBoard(ratio);
+    this._sharedAnnotationDataSource = sharedAnnotationDataSource;
+    this._sharingControl = this._sharingProvider.getSharingControl();
+    this._sharingControl.addObserver(this._sharingObserver);
+    this._getCurrentAnnotationControl();
+    var exitScreenShareOwner = this._sharedScreenSharedDataSource.screenSharingOwner;
+    if (exitScreenShareOwner) {
+      this._shareScreenOwnerId = exitScreenShareOwner.userId;
+      if (this._sharingControl.getScreenSharingState() === _type2.FcrScreenSharingState.START_WHIT_ANNOTATION) {
+        this._annotationReceiverMainStart();
       }
-    }),
+    }
+    this._disposers.push(
+    //   reaction(
+    //     () => this.annotating,
+    //     (annotating) => {
+    //       if (this._isLocalUserSharingOwner) {
+    //         if (annotating) {
+    //           this._removeWindowResizeListenner();
+    //         } else {
+    //           this._addWindowResizeListenner();
+    //         }
+    //       }
+    //     },
+    //   ),
     // reaction(
-    //   () => this._memberDataSource.shareScreenVideoSize,
-    //   (size) => {
-    //     if (size && this._boardDom) {
-    //       this.logger.info('annotation shareScreenVideoSize: ', size);
-    //       calcAnnotationAreaSize(this._boardDom, size.width, size.height);
+    //   () => this._sharedScreenSharedDataSource.screenShareVideoRatio,
+    //   (ratio) => {
+    //     if (ratio > 0) {
+    //       this.handleReceiverBoard(ratio);
     //     }
     //   },
     // ),
     (0, _mobx.reaction)(function () {
-      return _this.isScreenSharing;
-    }, function (sharing) {
-      _this.logger.info("[Annotation]: screen sharing reaction sharing changed to ".concat(sharing, ", isReplaceScreen is ").concat(_this.isReplaceScreen, ", isSeizeStream is ").concat(_this.isSeizeStream));
-      // web 开启屏幕共享时不需要走这个逻辑
-      if (_this.isReplaceScreen || _this.isSeizeStream || !(0, _env.isElectron)()) return;
-      if (_this._isLocalUserSharingOwner) {
-        if (sharing) {
-          _this.screenSharingStarted();
-        } else {
-          _this._removeWindowResizeListenner();
-        }
+      return _this.sharingInReplace;
+    }, function (sharingInReplace) {
+      // web 被替换时不需要走这个逻辑
+      if (sharingInReplace && (0, _env.isElectron)() && _this._isLocalUserSharingOwner) {
+        // await new Promise((resolve) => {
+        //   // 延迟两秒，等待标注内容清理，清理方法在 sdk 中虽然看起来是同步的，但是实际上会有无法清理的情况出现
+        //   sendEvent({ action: ToolbarEvents.CLEAN, payload: null });
+        //   setTimeout(() => resolve(true), 1000);
+        // });
+        (0, _rendererEvent.sendEvent)({
+          action: _type3.ToolbarEvents.CLEAN,
+          payload: null
+        });
+        _this.logger.info("[Annotation]: sharingInReplace changed to ".concat(sharingInReplace, ", currentShareInfo is ").concat(JSON.stringify(_this._currentShareInfo)));
+        _this._removeWindowResizeListenner();
+        _this._annotationProvider.hideAnnotationWindow();
+        _this._annotationProvider.setBoundsToAnnotationWindow();
+        setTimeout(function () {
+          return _this.screenSharingStarted(true);
+        }, 200);
       }
     }), (0, _mobx.reaction)(function () {
-      return _this.isReplaceScreen;
-    }, /*#__PURE__*/function () {
-      var _ref3 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(isReplaceScreen) {
-        return _regenerator["default"].wrap(function (_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              if (!(isReplaceScreen && (0, _env.isElectron)())) {
-                _context.next = 2;
-                break;
-              }
-              _context.next = 1;
-              return new Promise(function (resolve) {
-                // 延迟两秒，等待标注内容清理，清理方法在 sdk 中虽然看起来是同步的，但是实际上会有无法清理的情况出现
-                (0, _rendererEvent.sendEvent)({
-                  action: _type3.ToolbarEvents.CLEAN,
-                  payload: null
-                });
-                setTimeout(function () {
-                  return resolve(true);
-                }, 2000);
-              });
-            case 1:
-              _this.logger.info("[Annotation]: isReplaceScreen changed to ".concat(isReplaceScreen, ", currentShareInfo is ").concat(JSON.stringify(_this._currentShareInfo)));
-              _this._removeWindowResizeListenner();
-              _this._annotationProvider.hideAnnotationWindow();
-              _this._annotationProvider.setBoundsToAnnotationWindow();
-              setTimeout(_this.screenSharingStarted);
-              _this._sharedScreenSharedDataSource.setIsReplaceScreen(false);
-            case 2:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee);
-      }));
-      return function (_x) {
-        return _ref3.apply(this, arguments);
-      };
-    }()), (0, _mobx.reaction)(function () {
-      return _this._annotationProvider.annotationState;
-    }, function (state) {
-      _this.logger.info('annotation transaction state: ', state);
-      if (state === _annotationProvider.FcrAnnotationState.START) {
-        _this.logger.info('annotation transaction start');
-        _this._annotationControl = _this._annotationProvider.annotationControl;
-        _this._toolbarStore = new _store.ToolbarStore(_this._annotationControl, _this._roomControl, _this._annotationProvider, eventProvider);
-        _this.resetToolbarStore = true;
-      } else {
-        _this._annotationEnded();
+      return _this.annotationHasStart;
+    }, function (hasStart) {
+      if (hasStart && !_this._isLocalUserSharingOwner) {
+        /** 不是发起端并且annotation白板变为了连接状态 */
+        _this.logger.info('[Annotation] start step2 ===> annotation board has connected, then we trigger effect');
+        _this._annotationStartTriggerEffect();
       }
     }), (0, _mobx.reaction)(function () {
-      return _this._sharedScreenSharedDataSource.screenSharingState;
+      return _this._sharedScreenSharedDataSource.localUserScreenSharingState;
     }, function (state) {
       if (state === _fcrCore.FcrMediaSourceState.CLOSE && _this._isLocalUserSharingOwner) {
-        _this.logger.info('[Annotation]: screenSharingState is close, isReplaceScreen is ', _this.isReplaceScreen);
-        if (!_this.isReplaceScreen && (0, _env.isElectron)()) {
-          _this._annotationProvider.hideAnnotationWindow();
+        _this.logger.info('[Annotation]: localUserScreenSharingState is close, isReplaceScreen is ', _this.sharingInReplace);
+        if (!_this.sharingInReplace && (0, _env.isElectron)()) {
+          _this._annotationProvider.closeAnnotationWindow();
           _this._removeWindowResizeListenner();
         }
       }
     }), (0, _mobx.reaction)(function () {
       return _this.allowAnnotationWriteState;
     }, function (canWrite) {
-      if (!_this._isLocalUserSharingOwner) {
-        var toastText = canWrite ? (0, _i18n.transI18n)('fmt_screenshare_toast_host_enabled_annotations') : (0, _i18n.transI18n)('fmt_screenshare_toast_host_disabled_annotations');
+      if (!_this._isLocalUserSharingOwner && !canWrite) {
+        var toastText = (0, _i18n.transI18n)('fmt_screenshare_toast_host_disabled_annotations');
         _this._messageProvider.showToast({
           type: 'info',
           message: toastText
         });
       }
       if (!canWrite) {
-        _this.isShowToolbar = false;
+        _this._setIsShowToolbar(false);
       }
     }), (0, _mobx.reaction)(function () {
       return _this.isShowToolbar;
@@ -321,7 +275,7 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
     }));
   }
   return (0, _createClass2["default"])(AnnotationStore, [{
-    key: "resetToolbarStore",
+    key: "receiverAllOpenStateReady",
     get: function get() {
       return _classPrivateFieldGet(_A, this);
     },
@@ -329,12 +283,9 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
       _classPrivateFieldSet(_A, this, v);
     }
   }, {
-    key: "isShowToolbar",
+    key: "screenShareVideoRatio",
     get: function get() {
-      return _classPrivateFieldGet(_B, this);
-    },
-    set: function set(v) {
-      _classPrivateFieldSet(_B, this, v);
+      return this._sharedScreenSharedDataSource.screenShareVideoRatio;
     }
   }, {
     key: "hasAnnotationWritePermission",
@@ -356,6 +307,11 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
     get: function get() {
       return this._annotationProvider.screenShareWindowData;
     }
+  }, {
+    key: "isShowToolbar",
+    get: function get() {
+      return this._annotationProvider.isShowToolbar;
+    }
   }, {
     key: "isScreenSharing",
     get: function get() {
@@ -381,15 +337,20 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
     get: function get() {
       return this._memberDataSource.localUser;
     }
+  }, {
+    key: "sharingInReplace",
+    get: function get() {
+      return this._sharedScreenSharedDataSource.sharingInReplace;
+    }
   }, {
     key: "scalcValue",
     get: function get() {
-      return this._annotationProvider.scalcValue;
+      return this._sharedScreenSharedDataSource.screenShareScalcValue;
     }
   }, {
     key: "annotationHasStart",
     get: function get() {
-      return this._annotationProvider.annotationHasStart;
+      return this._sharedAnnotationDataSource.annotationHasStart;
     }
   }, {
     key: "annotating",
@@ -407,11 +368,6 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
       var _this$screenSharingOw;
       return this._privilegeProvider.allowAnnotationWriteState() || this.isLocalUserHost || ((_this$screenSharingOw = this.screenSharingOwner) === null || _this$screenSharingOw === void 0 ? void 0 : _this$screenSharingOw.userId) === this.localUser.userId;
     }
-  }, {
-    key: "isReplaceScreen",
-    get: function get() {
-      return this._sharedScreenSharedDataSource.isReplaceScreen;
-    }
   }, {
     key: "isSeizeStream",
     get: function get() {
@@ -434,55 +390,26 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
       return (_this$_toolbarStore2 = this._toolbarStore) === null || _this$_toolbarStore2 === void 0 ? void 0 : _this$_toolbarStore2.observables.currentTool;
     }
   }, {
-    key: "setToolsShow",
-    value: function setToolsShow() {
-      this.logger.info('setToolsShow ', this.allowAnnotationWriteState);
-      if (this.allowAnnotationWriteState) {
-        var currentFlag = this.isShowToolbar;
-        this.isShowToolbar = !currentFlag;
-      }
-    }
-  }, {
-    key: "zoomIn",
-    value: function zoomIn() {
-      this._annotationProvider.zoomIn();
-    }
-  }, {
-    key: "zoomOut",
-    value: function zoomOut() {
-      this._annotationProvider.zoomOut();
+    key: "boardMainWindow",
+    get: function get() {
+      return this._sharedAnnotationDataSource.boardMainWindow;
     }
   }, {
-    key: "fullContainer",
-    value: function fullContainer() {
-      var ratio = this._memberDataSource.shareScreenVideoRatio;
-      if (ratio > 0 && this._boardContainerDom) {
+    key: "handleReceiverBoard",
+    value: function handleReceiverBoard(paramRatio) {
+      if (this._boardContainerDom && this._boardDom) {
+        var _this$boardMainWindow;
         var _this$_boardContainer = this._boardContainerDom.getBoundingClientRect(),
-          width = _this$_boardContainer.width,
           height = _this$_boardContainer.height;
-        var _getBoundingClientRec = this._boardDom.getBoundingClientRect(),
-          boardWidth = _getBoundingClientRec.width,
-          boardHeight = _getBoundingClientRec.height;
-        var scalc = width / boardWidth;
-        this._annotationProvider.fullContainer(scalc);
-      }
-    }
-  }, {
-    key: "setOriginScalc",
-    value: function setOriginScalc() {
-      this._annotationProvider.setOriginScalc();
-    }
-  }, {
-    key: "drawReceiverBoard",
-    value: function drawReceiverBoard(paramRatio) {
-      if (this._boardContainerDom && this._boardDom) {
-        var _this$_boardContainer2 = this._boardContainerDom.getBoundingClientRect(),
-          height = _this$_boardContainer2.height;
-        var ratio = (0, _isNumber["default"])(paramRatio) ? paramRatio : this._memberDataSource.shareScreenVideoRatio;
+        var ratio = (0, _isNumber["default"])(paramRatio) ? paramRatio : this._sharedScreenSharedDataSource.screenShareVideoRatio;
         var newWidth = height * ratio;
         this._boardOriginWidth = newWidth;
         this._boardDom.style.width = "".concat(newWidth, "px");
         this._boardDom.style.height = "".concat(height, "px");
+        (_this$boardMainWindow = this.boardMainWindow) === null || _this$boardMainWindow === void 0 || _this$boardMainWindow.updateWindowSize({
+          width: newWidth,
+          height: height
+        });
         this.logger.info("[Annotation] [drawReceiverBoard] ratio: ".concat(ratio, ", width: ").concat(newWidth, " , height: ").concat(height));
       }
     }
@@ -491,12 +418,17 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
     value: function handleBoardDomLoad(ref) {
       this._boardDom = ref;
       if (this._boardDom) {
-        var _this$_boardDom$getBo = this._boardDom.getBoundingClientRect(),
-          height = _this$_boardDom$getBo.height;
-        this._boardOriginWidth = height * this._memberDataSource.shareScreenVideoRatio;
+        // const { height } = this._boardDom.getBoundingClientRect();
+        // const haveCanUseBackup = this._checkSharingwindowBackupSize();
+        // if (this._boardOriginWidth === 0 && haveCanUseBackup) {
+        //   this._setBoardDomWithBackupWindowSize(height);
+        // } else {
+        //   this._boardOriginWidth = height * this._sharedScreenSharedDataSource.screenShareVideoRatio;
+        // }
         this._mount();
       } else {
         this._mounted = false;
+        this._boardOriginWidth = 0;
       }
     }
   }, {
@@ -504,74 +436,179 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
     value: function handleBoardContainerDomLoad(ref) {
       if (ref) {
         this._boardContainerDom = ref;
-        this._boardContainerObserver.observe(ref);
       }
     }
   }, {
     key: "screenSharingStarted",
-    value: function screenSharingStarted() {
+    value: function screenSharingStarted(isReplaceScreen) {
       this._currentShareInfo = this._annotationProvider.currentShareInfo;
       this.logger.info("[Annotation]: screenSharingStarting with currentShareInfo: ".concat(JSON.stringify(this._currentShareInfo)));
       this._annotationProvider.setBoundsToAnnotationWindow();
-      (0, _rendererEvent.sendEvent)({
-        action: _constant.FcrUIRendererEventAction.SET_ANNOTATION_TO_SHOW,
-        payload: true
-      });
-      this.logger.info('[Annotation]: screenSharingStarted will add window resize listenner');
+      this._removeWindowResizeListenner();
+      if (isReplaceScreen) {
+        this._annotationProvider.showAnnotationWindow();
+      } else {
+        this._annotationProvider.openAnnotationWindow();
+        this.logger.info('[Annotation]: screenSharingStarted will add window resize listenner');
+      }
       this._addWindowResizeListenner();
     }
   }, {
     key: "release",
     value: function release() {
+      this._annotationaEndEffectThenCloseBoard();
       this._disposers.forEach(function (disposer) {
         return disposer();
       });
       this._dialogProvider.removeObserver(this._dialogObserver);
+      this._streamControl.removeObserver(this._streamObserver);
+      this._sharingControl.removeObserver(this._sharingObserver);
+      this._clearCurrentAnnotationControl();
       this._removeWindowResizeListenner();
-      this._unmount();
-      this._boardContainerObserver.disconnect();
     }
   }, {
-    key: "_annotationEnded",
-    value: function _annotationEnded() {
-      var _this$_annotationProv, _this$_toolbarStore3;
-      this.logger.info('[Annotation]: annotation transaction end');
-      this._messageProvider.showToast({
-        message: (0, _i18n.transI18n)('fmt_screenshare_toast_annotation_controls_screen_sharing_disabled'),
-        type: 'info'
+    key: "_clearCurrentAnnotationControl",
+    value: function _clearCurrentAnnotationControl() {
+      if (this._annotationControl) {
+        this._annotationControl.removeObserver(this._annotationObserver);
+        this._annotationControl = undefined;
+      }
+    }
+  }, {
+    key: "_getCurrentAnnotationControl",
+    value: function _getCurrentAnnotationControl() {
+      this._clearCurrentAnnotationControl();
+      var newAnnotationControl = this._sharingProvider.getSharingControl().getAnnotationControl();
+      this._annotationControl = newAnnotationControl;
+      newAnnotationControl === null || newAnnotationControl === void 0 || newAnnotationControl.addObserver(this._annotationObserver);
+      return this._annotationControl;
+    }
+    /**
+     * 根据 发起屏幕共享状态，是startOnlyScreen，且自己本人是发起端
+     * 则发起端: 同步bounds与updateViewPort并进行打开fragment
+     */
+  }, {
+    key: "_annotationSenderMainStart",
+    value: (function () {
+      var _annotationSenderMainStart2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {
+        return _regenerator["default"].wrap(function (_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              this.logger.info('annotation sender main start');
+              if (!this._isLocalUserSharingOwner) {
+                _context.next = 2;
+                break;
+              }
+              if (!this._annotationEndLock) {
+                _context.next = 1;
+                break;
+              }
+              this.logger.info('annotation sender main start in await lock');
+              _context.next = 1;
+              return this._annotationEndLock;
+            case 1:
+              this.logger.info('annotation sender main start in sender branch');
+              this.screenSharingStarted(false);
+            case 2:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee, this);
+      }));
+      function _annotationSenderMainStart() {
+        return _annotationSenderMainStart2.apply(this, arguments);
+      }
+      return _annotationSenderMainStart;
+    }()
+    /**
+     * 根据 发起屏幕共享状态中包含startWithAnnotation,
+     * 则接收端:1.去进行 step1 连接白板 2.在连接完成的状态后并拿到boardMainWindow后，进行 step2 后置的 工具栏初始化 + 白板尺寸修正(过期)
+     */
+    )
+  }, {
+    key: "_annotationReceiverMainStart",
+    value: (function () {
+      var _annotationReceiverMainStart2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee2() {
+        return _regenerator["default"].wrap(function (_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              this.logger.info('[Annotation] receiver main start');
+              if (this._isLocalUserSharingOwner) {
+                _context2.next = 2;
+                break;
+              }
+              if (!this._annotationEndLock) {
+                _context2.next = 1;
+                break;
+              }
+              this.logger.info('[Annotation] receiver main start in await lock');
+              _context2.next = 1;
+              return this._annotationEndLock;
+            case 1:
+              this.logger.info('[Annotation] receiver main start in receiver branch');
+              this._connectAnnotaionBoard(this._shareScreenOwnerId);
+            case 2:
+            case "end":
+              return _context2.stop();
+          }
+        }, _callee2, this);
+      }));
+      function _annotationReceiverMainStart() {
+        return _annotationReceiverMainStart2.apply(this, arguments);
+      }
+      return _annotationReceiverMainStart;
+    }()
+    /**
+     * 根据 1.白板的连接状态变为未连接状态 2.屏幕共享结束后
+     * 进行后置的 工具栏，画布清理和toast提示 + 关闭白板卸载节点的操作
+     */
+    )
+  }, {
+    key: "_annotationaEndEffectThenCloseBoard",
+    value: function _annotationaEndEffectThenCloseBoard() {
+      var _this2 = this;
+      this._annotationEndLock = new Promise(function (resolve) {
+        try {
+          var _this2$_toolbarStore;
+          (_this2$_toolbarStore = _this2._toolbarStore) === null || _this2$_toolbarStore === void 0 || _this2$_toolbarStore.resetToolbarVars();
+          _this2._messageProvider.showToast({
+            message: (0, _i18n.transI18n)('fmt_screenshare_toast_annotation_controls_screen_sharing_disabled'),
+            type: 'info'
+          });
+          _this2._setIsShowToolbar(false);
+          _this2._clearAnnotationWhiteboardToolbar();
+          _this2._sharedAnnotationDataSource.setAnnotationState(_annotationProvider.FcrAnnotationState.END);
+          _this2._unmount();
+        } catch (e) {} finally {
+          console.log('[Annotation]: annotation receiver end resolve');
+          resolve();
+        }
       });
-      (_this$_annotationProv = this._annotationProvider.boardMainWindow) === null || _this$_annotationProv === void 0 || _this$_annotationProv.clean();
-      (_this$_toolbarStore3 = this._toolbarStore) === null || _this$_toolbarStore3 === void 0 || _this$_toolbarStore3.resetToolbarVars();
-      this.resetToolbarStore = false;
-      this._boardContainerObserver.disconnect();
-      this.isShowToolbar = false;
-      this._toolbarStore = undefined;
-      this._unmount();
+    }
+  }, {
+    key: "_setIsShowToolbar",
+    value: function _setIsShowToolbar(isShow) {
+      this._annotationProvider.setIsShowToolbar(isShow);
     }
   }, {
     key: "_mount",
     value: function _mount() {
-      this.logger.info('annotation mount boardMainWindow: ', this._annotationProvider.boardMainWindow);
-      this.logger.info('annotation mount boardDom: ', this._boardDom);
-      if (this._annotationProvider.boardMainWindow && this._boardDom && !this._mounted) {
-        var _this$_toolbarStore4;
-        this.logger.info('annotation mount start: ', this._boardDom);
+      if (this.boardMainWindow && this._boardDom && !this._mounted) {
+        var _this$_toolbarStore3;
         this._mounted = true;
-        var view = this._annotationProvider.boardMainWindow.getContentView();
+        var view = this.boardMainWindow.getContentView();
         this._boardDom.appendChild(view);
-        this.logger.info('annotation mount boardMainWindow contentView append: ', view);
-        this.logger.info('annotation mount success');
-        (_this$_toolbarStore4 = this._toolbarStore) === null || _this$_toolbarStore4 === void 0 || _this$_toolbarStore4.resetToolbarVars();
+        (_this$_toolbarStore3 = this._toolbarStore) === null || _this$_toolbarStore3 === void 0 || _this$_toolbarStore3.resetToolbarVars();
       }
     }
   }, {
     key: "_unmount",
     value: function _unmount() {
-      this.logger.info('annotation unmount ');
-      if (this._mounted && this._annotationProvider.boardMainWindow) {
-        var _this$_boardDom;
-        (_this$_boardDom = this._boardDom) === null || _this$_boardDom === void 0 || _this$_boardDom.removeChild(this._annotationProvider.boardMainWindow.getContentView());
-        this.logger.info('annotation unmount remove mainWindow contentView');
+      this.logger.info('[Annotation] unmount ');
+      if (this._mounted && this.boardMainWindow) {
+        this._deleteBoardDomContent();
+        this.logger.info('[Annotation] unmount remove mainWindow contentView');
         this._close();
       }
       this._mounted = false;
@@ -580,8 +617,27 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
     key: "_close",
     value: function _close() {
       if (this._annotationControl) {
+        this.logger.info('[Annotation] core close');
         this._annotationControl.close();
-        this.logger.info('annotation close');
+      }
+    }
+  }, {
+    key: "_handleOnLocalVideoStatsUpdated",
+    value: function _handleOnLocalVideoStatsUpdated(roomId, streamId, stats) {
+      var dimensions = stats.dimensions;
+      var width = dimensions.width,
+        height = dimensions.height;
+      if (!width || !height) {
+        return;
+      }
+      var stream = this._streamControl.getStreamByStreamId(streamId);
+      var isScreenShareStream = (stream === null || stream === void 0 ? void 0 : stream.videoSourceType) === _fcrCore.FcrVideoSourceType.SCREEN;
+      if (isScreenShareStream) {
+        if (width !== this._prevSetLocalVideoSize.width || height !== this._prevSetLocalVideoSize.height) {
+          this._prevSetLocalVideoSize.width = width;
+          this._prevSetLocalVideoSize.height = height;
+          this._annotationProvider.updateWindowSize(width, height);
+        }
       }
     }
   }, {
@@ -599,10 +655,10 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
   }, {
     key: "_updateBoundsByActiveWindow",
     value: function _updateBoundsByActiveWindow() {
-      var _this2 = this;
+      var _this3 = this;
       var windows = window.runtime.getWindows();
       var activeWindow = windows.find(function (win) {
-        return win.id === +_this2._currentShareInfo.id;
+        return win.id === +_this3._currentShareInfo.id;
       });
       var _this$_currentShareIn = this._currentShareInfo,
         id = _this$_currentShareIn.id,
@@ -613,53 +669,237 @@ var AnnotationStore = exports.AnnotationStore = /*#__PURE__*/function () {
         y = bounds.y;
       var activeBounds = activeWindow === null || activeWindow === void 0 ? void 0 : activeWindow.getBounds();
       var isSharingWindow = activeWindow && activeWindow.id === +id;
-      var _ref4 = (activeWindow === null || activeWindow === void 0 ? void 0 : activeWindow.getBounds()) || {},
-        aw = _ref4.width,
-        ah = _ref4.height,
-        ax = _ref4.x,
-        ay = _ref4.y;
+      var _ref3 = (activeWindow === null || activeWindow === void 0 ? void 0 : activeWindow.getBounds()) || {},
+        aw = _ref3.width,
+        ah = _ref3.height,
+        ax = _ref3.x,
+        ay = _ref3.y;
       var isNewBounds = aw !== width || ah !== height || ax !== x || ay !== y;
-      this.logger.info("updateBoundsByActiveWindow ".concat(JSON.stringify({
-        activeBounds: activeBounds,
-        width: width,
-        height: height,
-        isSharingWindow: isSharingWindow,
-        isNewBounds: isNewBounds,
-        activeWindow: activeWindow,
-        id: id
-      })));
+      // this.logger.info(
+      //   `updateBoundsByActiveWindow ${JSON.stringify({
+      //     activeBounds,
+      //     width,
+      //     height,
+      //     isSharingWindow,
+      //     isNewBounds,
+      //     activeWindow,
+      //     id,
+      //   })}`,
+      // );
       if (isSharingWindow && isNewBounds) {
         this._updateAnnotationBounds(activeBounds);
-        this.logger.info('The window bounds is the different as the current share bounds');
+        // this.logger.info('The window bounds is the different as the current share bounds');
       }
     }
   }, {
     key: "_addWindowResizeListenner",
     value: function _addWindowResizeListenner() {
-      var _this3 = this;
-      var isDisplay = this._currentShareInfo.type === _type.AgoraRtcScreenCaptureType.SCREEN;
-      this.logger.info("current sharing type is screen: ".concat(isDisplay, ", has watch resize timer: ").concat(!!this._resizeWatcherTimer));
-      if (isDisplay) return;
-      if (!this._resizeWatcherTimer) {
+      var _this4 = this;
+      if (!this._resizeWatcherTimer && (0, _env.isElectron)()) {
         this._resizeWatcherTimer = setInterval(function () {
-          _this3.logger.info("addWindowResizeListenner interval ".concat(_this3._currentShareInfo));
-          _this3._updateBoundsByActiveWindow();
-        }, 3000);
+          // this.logger.info(`addWindowResizeListenner interval ${this._currentShareInfo}`);
+          _this4._updateBoundsByActiveWindow();
+        }, 2000);
       }
     }
   }, {
     key: "_removeWindowResizeListenner",
     value: function _removeWindowResizeListenner() {
-      if (this._resizeWatcherTimer) {
+      if (this._resizeWatcherTimer && (0, _env.isElectron)()) {
         clearInterval(this._resizeWatcherTimer);
         this._resizeWatcherTimer = null;
       }
     }
+  }, {
+    key: "_checkSharingwindowBackupSize",
+    value: function _checkSharingwindowBackupSize() {
+      var size = this._sharingProvider.getSharingControl().getSharingWindowSize();
+      this.logger.info('[Annotation][checkSharingwindowBackupSize] default size: ', size);
+      return !!(size && size.width > 0 && size.height > 0);
+    }
+  }, {
+    key: "_setBoardDomWithBackupWindowSize",
+    value: function _setBoardDomWithBackupWindowSize(containerHeight) {
+      var size = this._sharingProvider.getSharingControl().getSharingWindowSize();
+      var getWidth = size.width;
+      var getHeight = size.height;
+      var ratio = getWidth / getHeight;
+      var newWidth = containerHeight * ratio;
+      this._boardOriginWidth = newWidth;
+      if (this._boardDom) {
+        var _this$boardMainWindow2;
+        this._boardDom.style.width = "".concat(newWidth, "px");
+        this._boardDom.style.height = "".concat(containerHeight, "px");
+        (_this$boardMainWindow2 = this.boardMainWindow) === null || _this$boardMainWindow2 === void 0 || _this$boardMainWindow2.updateWindowSize({
+          width: newWidth,
+          height: containerHeight
+        });
+      }
+    }
+  }, {
+    key: "_renewAnnotationWhiteboardToolbar",
+    value: function _renewAnnotationWhiteboardToolbar() {
+      this._toolbarStore = new _annotationToolbarStore.AnnotationReceiverToolbarStore(this._annotationControl, this._roomControl, this._annotationProvider, this._eventProvider, this._sharedAnnotationDataSource);
+      this.logger.info('[Annotation][renewAnnotationWhiteboardToolbar] is done');
+      this.receiverAllOpenStateReady = true;
+    }
+  }, {
+    key: "_clearAnnotationWhiteboardToolbar",
+    value: function _clearAnnotationWhiteboardToolbar() {
+      this._toolbarStore = undefined;
+      this.logger.info('[Annotation][clearAnnotationWhiteboardToolbar] is done');
+      this.receiverAllOpenStateReady = false;
+    }
+  }, {
+    key: "_participantShareCanWeAnnotation",
+    value: function _participantShareCanWeAnnotation() {
+      var streams = this._streamControl.getStreams();
+      var _notSupportPlatform = [_type4.FcrPlatform.WEB_DESKTOP, _type4.FcrPlatform.WEB_MOBILE, _type4.FcrPlatform.IOS];
+      var streamLists = Object.keys(streams).map(function (key) {
+        return streams[key];
+      });
+      var screenShareStreams = streamLists.map(function (streamList) {
+        return streamList.find(function (streamInfo) {
+          return streamInfo.videoSourceType === _fcrCore.FcrVideoSourceType.SCREEN;
+        });
+      }).filter(Boolean);
+      if (screenShareStreams.length > 0) {
+        var screenShareOwnerInfo = screenShareStreams[0];
+        var _participantPlatform = screenShareOwnerInfo === null || screenShareOwnerInfo === void 0 ? void 0 : screenShareOwnerInfo.owner.platform;
+        this.logger.info("[Annotation] current share participant platform: ".concat(_participantPlatform));
+        if (typeof _participantPlatform !== 'undefined' && !_notSupportPlatform.includes(_participantPlatform)) {
+          return true;
+        } else {
+          return false;
+        }
+      }
+      return false;
+    }
+    /**
+     * 接收端step1
+     * 判断状态，打开批注(core: 进入房间，初始化白板APP)
+     */
+  }, {
+    key: "_connectAnnotaionBoard",
+    value: function _connectAnnotaionBoard(screenShareOwnerId) {
+      if (this._participantShareCanWeAnnotation()) {
+        this.logger.info('[Annotation] we can receive annotation from share platform');
+        this._getCurrentAnnotationControl();
+        if (this._annotationControl) {
+          if (screenShareOwnerId !== this._memberDataSource.localUser.userId) {
+            this._deleteBoardDomContent();
+            this.logger.info('[Annotation] start step1 == > receiver enter core open');
+            this._annotationControl.open();
+          }
+        }
+      }
+    }
+    /**
+     * 接收端step2
+     * 白板连接成功,进行后置副作用操作
+     */
+  }, {
+    key: "_annotationStartTriggerEffect",
+    value: (function () {
+      var _annotationStartTriggerEffect2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee3() {
+        return _regenerator["default"].wrap(function (_context3) {
+          while (1) switch (_context3.prev = _context3.next) {
+            case 0:
+              if (!this._annotationEndLock) {
+                _context3.next = 1;
+                break;
+              }
+              this.logger.info('annotation start in await lock');
+              _context3.next = 1;
+              return this._annotationEndLock;
+            case 1:
+              this.logger.info('annotation start after await lock');
+              this._renewAnnotationWhiteboardToolbar();
+            case 2:
+            case "end":
+              return _context3.stop();
+          }
+        }, _callee3, this);
+      }));
+      function _annotationStartTriggerEffect() {
+        return _annotationStartTriggerEffect2.apply(this, arguments);
+      }
+      return _annotationStartTriggerEffect;
+    }())
+  }, {
+    key: "_handleOnScreenSharingUpdated",
+    value: function _handleOnScreenSharingUpdated(ownerStream, state) {
+      this._shareScreenOwnerId = (ownerStream === null || ownerStream === void 0 ? void 0 : ownerStream.owner.userId) || '';
+      // if (state === FcrScreenSharingState.START_WHIT_ANNOTATION) {
+      //   this.logger.info('[Annotation] transaction main start');
+      //   this._annotationMainStart();
+      // } else {
+      //   this.logger.info('[Annotation] main end , because current sharing not with annotation');
+      //   if (this._isLocalUserSharingOwner) {
+      //     /** 屏幕共享的状态没有包含批注，当前是发起者,则关闭fragment */
+      //     this._annotationProvider.closeAnnotationWindow();
+      //   } else {
+      //     /** 屏幕共享的状态没有包含批注，接收端进行总体的关闭 */
+      //     this._annotationaEndEffectThenCloseBoard();
+      //   }
+      // }
+      if (state === _type2.FcrScreenSharingState.START_ONLY_SCREEN) {
+        this.logger.info('[Annotation] sender transaction main start');
+        this._annotationSenderMainStart();
+      } else if (state === _type2.FcrScreenSharingState.START_WHIT_ANNOTATION) {
+        this.logger.info('[Annotation] receiver transaction main start');
+        this._annotationReceiverMainStart();
+      } else if (state === _type2.FcrScreenSharingState.END) {
+        this.logger.info('[Annotation] main end , because current sharing not with annotation');
+        if (this._isLocalUserSharingOwner) {
+          /** 屏幕共享的状态没有包含批注，当前是发起者,则关闭fragment */
+          this._annotationProvider.closeAnnotationWindow();
+        } else {
+          /** 屏幕共享的状态没有包含批注，接收端进行总体的关闭 */
+          this._annotationaEndEffectThenCloseBoard();
+        }
+      }
+    }
+  }, {
+    key: "_handleOnAnnotationConnectionStateUpdated",
+    value: function _handleOnAnnotationConnectionStateUpdated(state) {
+      if (state === _fcrCore.FcrConnectionState.CONNECTED) {
+        var _this$_annotationCont;
+        var mainWindow = (_this$_annotationCont = this._annotationControl) === null || _this$_annotationCont === void 0 ? void 0 : _this$_annotationCont.getMainWindow();
+        this.logger.info("[Annotation] annotation board connected, we get boardMainWindow in callback!");
+        this._sharedAnnotationDataSource.setBoardMainWindow(mainWindow);
+        this._sharedAnnotationDataSource.setAnnotationState(_annotationProvider.FcrAnnotationState.START);
+      } else {
+        if (state === _fcrCore.FcrConnectionState.DISCONNECTED || state === _fcrCore.FcrConnectionState.ABORTED) {
+          this.logger.info('[Annotation] main end because annotation board not connected');
+          /** 批注白板的连接状态没有连接成功，进行总体的关闭 */
+          this._annotationaEndEffectThenCloseBoard();
+        }
+        this._sharedAnnotationDataSource.setAnnotationState(_annotationProvider.FcrAnnotationState.END);
+      }
+    }
+  }, {
+    key: "_deleteBoardDomContent",
+    value: function _deleteBoardDomContent() {
+      if (this._boardDom && this.boardMainWindow) {
+        this.logger.info('[Annotation] delete old boardMainWindow');
+        this._boardDom.removeChild(this.boardMainWindow.getContentView());
+        this._sharedAnnotationDataSource.setBoardMainWindow(null);
+      }
+    }
+  }, {
+    key: "syncScreenShareOwnerOpenDone",
+    value: function syncScreenShareOwnerOpenDone() {
+      var _this$_annotationCont2;
+      this.logger.info('[Annotation] syncScreenShareOwnerOpenDone');
+      (_this$_annotationCont2 = this._annotationControl) === null || _this$_annotationCont2 === void 0 || _this$_annotationCont2.syncScreenShareOwnerAnnotationOpenDone();
+    }
   }]);
 }();
 _AnnotationStore = AnnotationStore;
-var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_AnnotationStore, [[_mobx.observable, 1, "resetToolbarStore"], [_mobx.observable, 1, "isShowToolbar"], [_mobx.computed, 3, "scalcValue"], [_mobx.computed, 3, "annotating"], [_decorator.bound, 2, "isAnnotationSupported"], [_decorator.bound, 2, "getToolbarStore"], [_setToolsShowDecs, 18, "setToolsShow"], [_zoomInDecs, 18, "zoomIn"], [_zoomOutDecs, 18, "zoomOut"], [_fullContainerDecs, 18, "fullContainer"], [_setOriginScalcDecs, 18, "setOriginScalc"], [_drawReceiverBoardDecs, 18, "drawReceiverBoard"], [_handleBoardDomLoadDecs, 18, "handleBoardDomLoad"], [_handleBoardContainerDomLoadDecs, 18, "handleBoardContainerDomLoad"], [_decorator.bound, 2, "screenSharingStarted"], [_decorator.bound, 2, "release"], [_annotationEndedDecs, 18, "_annotationEnded"], [_mountDecs, 18, "_mount"], [_unmountDecs, 18, "_unmount"], [_decorator.bound, 2, "_close"], [_decorator.bound, 2, "_updateAnnotationBounds"], [_decorator.bound, 2, "_updateBoundsByActiveWindow"], [_decorator.bound, 2, "_addWindowResizeListenner"], [_decorator.bound, 2, "_removeWindowResizeListenner"]], []).e, 3);
-_init_resetToolbarStore = _applyDecs$e[0];
-_init_isShowToolbar = _applyDecs$e[1];
-_initProto = _applyDecs$e[2];
+var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_AnnotationStore, [[_mobx.observable, 1, "receiverAllOpenStateReady"], [_mobx.computed, 3, "scalcValue"], [_mobx.computed, 3, "annotating"], [_decorator.bound, 2, "isAnnotationSupported"], [_decorator.bound, 2, "getToolbarStore"], [_handleReceiverBoardDecs, 18, "handleReceiverBoard"], [_handleBoardDomLoadDecs, 18, "handleBoardDomLoad"], [_handleBoardContainerDomLoadDecs, 18, "handleBoardContainerDomLoad"], [_decorator.bound, 2, "screenSharingStarted"], [_decorator.bound, 2, "release"], [_decorator.bound, 2, "_clearCurrentAnnotationControl"], [_decorator.bound, 2, "_getCurrentAnnotationControl"], [_decorator.bound, 2, "_annotationSenderMainStart"], [_decorator.bound, 2, "_annotationReceiverMainStart"], [_annotationaEndEffectThenCloseBoardDecs, 18, "_annotationaEndEffectThenCloseBoard"], [_mountDecs, 18, "_mount"], [_unmountDecs, 18, "_unmount"], [_decorator.bound, 2, "_close"], [_decorator.bound, 2, "_handleOnLocalVideoStatsUpdated"], [_decorator.bound, 2, "_updateAnnotationBounds"], [_decorator.bound, 2, "_updateBoundsByActiveWindow"], [_decorator.bound, 2, "_addWindowResizeListenner"], [_decorator.bound, 2, "_removeWindowResizeListenner"], [_decorator.bound, 2, "_checkSharingwindowBackupSize"], [_decorator.bound, 2, "_setBoardDomWithBackupWindowSize"], [_decorator.bound, 2, "_renewAnnotationWhiteboardToolbar"], [_decorator.bound, 2, "_clearAnnotationWhiteboardToolbar"], [_decorator.bound, 2, "_participantShareCanWeAnnotation"], [_decorator.bound, 2, "_connectAnnotaionBoard"], [_annotationStartTriggerEffectDecs, 18, "_annotationStartTriggerEffect"], [_decorator.bound, 2, "_handleOnScreenSharingUpdated"], [_decorator.bound, 2, "_handleOnAnnotationConnectionStateUpdated"], [_decorator.bound, 2, "_deleteBoardDomContent"], [_decorator.bound, 2, "syncScreenShareOwnerOpenDone"]], []).e, 2);
+_init_receiverAllOpenStateReady = _applyDecs$e[0];
+_initProto = _applyDecs$e[1];
 var AnnotationStoreContext = exports.AnnotationStoreContext = /*#__PURE__*/(0, _react.createContext)({});