fcr-ui-scene 3.7.4-rc.1 → 3.7.5

package/lib/fragments/annotation/store.js

@@ -73,8 +73,6 @@ var _type = require("../../modules/whiteboard/type");
 var _fcrCore = require("fcr-core");
 var _decorator = require("agora-foundation/lib/decorator");
 var _libs = require("./libs");
-var _rendererEvent = require("../../utilities/renderer-event");
-var _constant = require("../../utilities/constant");
 var _asyncRetry = require("agora-foundation/lib/utilities/async-retry");
 var _logger = require("../../utilities/logger");
 var _utils = require("./utils");
@@ -184,6 +182,8 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
             case 1:
               this._openLock = true;
               _context.prev = 2;
+              // TODO: window
+              // @ts-ignore
               visible = window.runtime.browserWindow.isVisible();
               this.logger.info("open method is called, the init bounds is =>, ".concat(JSON.stringify(this.bounds), ", visible ").concat(visible));
               if (!visible) {
@@ -194,6 +194,8 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
             case 3:
               this._cancelCurrentUpdateWindowSizeTimber('send-fragment-close');
               this.currentTool = 'curve';
+              // TODO: window
+              // @ts-ignore
               window.runtime.browserWindow.setAlwaysOnTop(true, 'pop-up-menu');
               this.setIgnore(true);
               this._hasWaitingOpen = !this._engine;
@@ -205,6 +207,8 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
               return _context.abrupt("return");
             case 4:
               this.logger.info('this._engine is initialized, show annotation window');
+              // TODO: window
+              // @ts-ignore
               window.runtime.browserWindow.show();
             case 5:
               if (!this._boardRoom) {
@@ -338,6 +342,8 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
               } catch (e) {
                 this.logger.error('catch error', e);
               } finally {
+                // TODO: window
+                // @ts-ignore
                 window.runtime.browserWindow.hide();
                 this.logger.info('close annotation window');
               }
@@ -355,13 +361,20 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
   }, {
     key: "hide",
     value: function hide() {
+      // TODO: window
+      // @ts-ignore
       window.runtime.browserWindow.hide();
       this.logger.info('hide annotation window');
     }
   }, {
     key: "show",
     value: function show() {
+      // TODO: window
+      // @ts-ignore
       window.runtime.browserWindow.setAlwaysOnTop(true, 'pop-up-menu');
+
+      // TODO: window
+      // @ts-ignore
       window.runtime.browserWindow.show();
       this.logger.info('show annotation window');
     }
@@ -369,6 +382,9 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
     key: "focus",
     value: function focus() {
       this.logger.info('focus annotation window');
+
+      // TODO: window
+      // @ts-ignore
       window.runtime.browserWindow.focus();
     }
   }, {
@@ -376,6 +392,9 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
     value: function setBounds(bounds) {
       this.bounds = bounds;
       this.logger.info("bounds is changed =>, ".concat(JSON.stringify(bounds)));
+
+      // TODO: window
+      // @ts-ignore
       window.runtime.browserWindow.setBounds(bounds);
       this._updateBoardElBySize({
         width: bounds.width,
@@ -429,6 +448,9 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
     key: "setIgnore",
     value: function setIgnore(ignore) {
       this.logger.info("setIgnore method is called, the ignore is => ".concat(ignore));
+
+      // TODO: window
+      // @ts-ignore
       window.runtime.browserWindow.setIgnoreMouseEvents(ignore);
     }
   }, {
@@ -495,17 +517,17 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
       this.logger.info("mount success current tool, ".concat(whiteboard.getCurrentTool(), ", updateViewport width: ").concat(frameWidth, " height: ").concat(frameHeight));
       whiteboard.on('undoStackLength', function (steps) {
         // isWindows() && window.runtime.browserWindow.blur();
-        (0, _rendererEvent.sendEvent)({
-          action: _constant.FcrUIRendererEventAction.SET_ANNOTATION_UNDO,
-          payload: steps > 0
-        });
+        // renderer.sendEvent({
+        //   action: FcrUIRendererEventAction.SET_ANNOTATION_UNDO,
+        //   payload: steps > 0,
+        // });
       });
       whiteboard.on('redoStackLength', function (steps) {
         // isWindows() && window.runtime.browserWindow.blur();
-        (0, _rendererEvent.sendEvent)({
-          action: _constant.FcrUIRendererEventAction.SET_ANNOTATION_REDO,
-          payload: steps > 0
-        });
+        // renderer.sendEvent({
+        //   action: FcrUIRendererEventAction.SET_ANNOTATION_REDO,
+        //   payload: steps > 0,
+        // });
       });
     }
   }, {
@@ -536,10 +558,10 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
               engine.addObserver({
                 onConnectionStateUpdated: function onConnectionStateUpdated(state) {
                   (0, _sharedStorage.setAnnotationEngineState)(state);
-                  (0, _rendererEvent.sendEvent)({
-                    action: _constant.FcrUIRendererEventAction.FRAGMENT_ANNOTATION_ENGINE_STATE,
-                    payload: state
-                  });
+                  // renderer.sendEvent({
+                  //   action: FcrUIRendererEventAction.FRAGMENT_ANNOTATION_ENGINE_STATE,
+                  //   payload: state,
+                  // });
                   if (state === _fcrCore.FcrConnectionState.CONNECTED) {
                     _this4._engine = engine;
                     _this4.logger.info("engine connection state updated => CONNECTED, hasWaitingOpen ".concat(_this4._hasWaitingOpen));
@@ -565,6 +587,9 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
                 }
               });
               engine.login();
+
+              // TODO: window
+              // @ts-ignore
               window.runtime.browserWindow.hide();
             case 1:
             case "end":
@@ -789,10 +814,10 @@ var FragmentAnnotationStore = exports.FragmentAnnotationStore = /*#__PURE__*/fun
     key: "_syncScreenShareOwnerOpenDone",
     value: function _syncScreenShareOwnerOpenDone() {
       this.logger.info('syncScreenShareOwnerOpenDone');
-      (0, _rendererEvent.sendEvent)({
-        action: _constant.FcrUIRendererEventAction.FRAGMENT_ANNOTATION_SYNC_OWNER_OPEN_DONE,
-        payload: null
-      });
+      // renderer.sendEvent({
+      //   action: FcrUIRendererEventAction.FRAGMENT_ANNOTATION_SYNC_OWNER_OPEN_DONE,
+      //   payload: null,
+      // });
     }
   }, {
     key: "_checkForConnect",

package/lib/fragments/annotation/toolbar/store.d.ts

@@ -1,6 +1,8 @@
 import { FcrBoardShape, FcrBoardToolType } from 'fcr-core/lib/room-control/whiteboard-control/enums';
-import { FcrUIPrivilegeProvider } from '../../../providers/privilege-provider';
-import { FcrUISharedConfirmDataSource } from '../../../shared-data-source/confirm-data';
+import { FcrUIObjectManager } from '../../../object-manager';
+type AnnotationToolbarStoreArgs = {
+    objectManager: FcrUIObjectManager;
+};
 export declare class AnnotationToolbarStore {
     protected logger: import("agora-foundation/lib/logger").Logger;
     private _privilegeProvider;
@@ -32,10 +34,7 @@ export declare class AnnotationToolbarStore {
         x: number;
         y: number;
     };
-    constructor({ privilegeProvider, sharedConfirmDataSource, }: {
-        privilegeProvider: FcrUIPrivilegeProvider;
-        sharedConfirmDataSource: FcrUISharedConfirmDataSource;
-    });
+    constructor({ objectManager }: AnnotationToolbarStoreArgs);
     redo(): void;
     undo(): void;
     clean(): void;
@@ -62,3 +61,4 @@ export declare class AnnotationToolbarStore {
     release(): void;
 }
 export declare const AnnotationToolbarContext: import("react").Context<AnnotationToolbarStore>;
+export {};

package/lib/fragments/annotation/toolbar/store.js

@@ -58,9 +58,8 @@ var _react = require("react");
 var _mobx = require("mobx");
 var _enums = require("fcr-core/lib/room-control/whiteboard-control/enums");
 var _decorator = require("agora-foundation/lib/decorator");
-var _type = require("../../../modules/whiteboard/type");
-var _rendererEvent = require("../../../utilities/renderer-event");
 var _logger = require("../../../utilities/logger");
+var _objectManager = require("../../../object-manager");
 var _AnnotationToolbarStore;
 var _initProto, _init_observables, _init_isTipsVisible, _init_popoverVisible, _init_toolbarCoords, _setToolDecs, _setPenDecs, _setShapeDecs, _setStrokeColorDecs, _setStrokeWidthDecs, _setToolbarCoordsDecs, _updatePositionDecs, _onTooltipMountDecs, _onTooltipUnmountDecs, _setPopoverVisibleDecs, _ref;
 function _classPrivateFieldInitSpec(e, t, a) { _checkPrivateRedeclaration(e, t), t.set(e, a); }
@@ -82,8 +81,7 @@ _ref = (_setToolDecs = [_mobx.action, _mobx.action.bound], _setPenDecs = [_mobx.
 var AnnotationToolbarStore = exports.AnnotationToolbarStore = /*#__PURE__*/function () {
   function AnnotationToolbarStore(_ref2) {
     var _this = this;
-    var privilegeProvider = _ref2.privilegeProvider,
-      sharedConfirmDataSource = _ref2.sharedConfirmDataSource;
+    var objectManager = _ref2.objectManager;
     (0, _classCallCheck2["default"])(this, AnnotationToolbarStore);
     (0, _defineProperty2["default"])(this, _ref, (_initProto(this), (0, _logger.createLogger)({
       prefix: 'AnnotationToolbarStore'
@@ -109,7 +107,8 @@ var AnnotationToolbarStore = exports.AnnotationToolbarStore = /*#__PURE__*/funct
       width: 0,
       height: 0
     }));
-    this._sharedConfirmDataSource = sharedConfirmDataSource;
+    this._sharedConfirmDataSource = objectManager.getObject(_objectManager.FcrUIObjectKeys.S_SHARED_CONFIG_DATA_SOURCE);
+    var privilegeProvider = objectManager.getObject(_objectManager.FcrUIObjectKeys.P_PRIVILEGE_PROVIDER);
     this.setStrokeColor(colors[7]);
     this._privilegeProvider = privilegeProvider;
     this._disposer.push((0, _mobx.reaction)(function () {
@@ -170,43 +169,28 @@ var AnnotationToolbarStore = exports.AnnotationToolbarStore = /*#__PURE__*/funct
   }, {
     key: "redo",
     value: function redo() {
-      (0, _rendererEvent.sendEvent)({
-        action: _type.ToolbarEvents.REDO,
-        payload: null
-      });
+      // renderer.sendEvent({ action: ToolbarEvents.REDO, payload: null });
     }
   }, {
     key: "undo",
     value: function undo() {
-      (0, _rendererEvent.sendEvent)({
-        action: _type.ToolbarEvents.UNDO,
-        payload: null
-      });
+      // renderer.sendEvent({ action: ToolbarEvents.UNDO, payload: null });
     }
   }, {
     key: "clean",
     value: function clean() {
-      (0, _rendererEvent.sendEvent)({
-        action: _type.ToolbarEvents.CLEAN,
-        payload: null
-      });
+      // renderer.sendEvent({ action: ToolbarEvents.CLEAN, payload: null });
     }
   }, {
     key: "setTool",
     value: function setTool(tool) {
-      (0, _rendererEvent.sendEvent)({
-        action: _type.ToolbarEvents.SET_TOOL,
-        payload: tool
-      });
+      // renderer.sendEvent({ action: ToolbarEvents.SET_TOOL, payload: tool });
       this.observables.currentTool = tool;
     }
   }, {
     key: "setPen",
     value: function setPen(shape) {
-      (0, _rendererEvent.sendEvent)({
-        action: _type.ToolbarEvents.SET_PEN,
-        payload: shape
-      });
+      // renderer.sendEvent({ action: ToolbarEvents.SET_PEN, payload: shape });
       this.observables.currentShape = shape;
       this.observables.lastPen = _enums.FcrBoardToolType.CURVE;
       this.observables.currentTool = _enums.FcrBoardToolType.CURVE;
@@ -214,10 +198,7 @@ var AnnotationToolbarStore = exports.AnnotationToolbarStore = /*#__PURE__*/funct
   }, {
     key: "setShape",
     value: function setShape(shape) {
-      (0, _rendererEvent.sendEvent)({
-        action: _type.ToolbarEvents.SET_SHAPE,
-        payload: shape
-      });
+      // renderer.sendEvent({ action: ToolbarEvents.SET_SHAPE, payload: shape });
       this.observables.currentShape = shape;
       this.observables.lastShape = shape;
       this.observables.currentTool = _enums.FcrBoardToolType.CURVE;
@@ -225,20 +206,14 @@ var AnnotationToolbarStore = exports.AnnotationToolbarStore = /*#__PURE__*/funct
   }, {
     key: "setStrokeColor",
     value: function setStrokeColor(color) {
-      (0, _rendererEvent.sendEvent)({
-        action: _type.ToolbarEvents.SET_STROKE_COLOR,
-        payload: color
-      });
+      // renderer.sendEvent({ action: ToolbarEvents.SET_STROKE_COLOR, payload: color });
       this.observables.currentColor = color;
     }
   }, {
     key: "setStrokeWidth",
     value: function setStrokeWidth(strokeWidth) {
       this.observables.currentStrokeWidth = strokeWidth;
-      (0, _rendererEvent.sendEvent)({
-        action: _type.ToolbarEvents.SET_STROKE_WIDTH,
-        payload: strokeWidth
-      });
+      // renderer.sendEvent({ action: ToolbarEvents.SET_STROKE_WIDTH, payload: strokeWidth });
     }
   }, {
     key: "setToolbarCoords",
@@ -297,10 +272,7 @@ var AnnotationToolbarStore = exports.AnnotationToolbarStore = /*#__PURE__*/funct
   }, {
     key: "captureScreen",
     value: function captureScreen() {
-      window.runtime.captureScreen({
-        hideWindow: false,
-        alwaysHide: true
-      });
+      // renderer.captureScreen({ hideWindow: false, alwaysHide: true });
     }
   }, {
     key: "setAllowAnnotationWrite",

package/lib/fragments/annotation/toolbar/view.js

@@ -19,38 +19,31 @@ var _enums = require("fcr-core/lib/room-control/whiteboard-control/enums");
 var _tips = require("./components/tips");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 require("./style.css");
-var _useElectron = require("../../../modules/dialog/hooks/useElectron");
 var _annotationMenu = _interopRequireDefault(require("../../../modules/components/annotation-menu"));
-var _renderer = require("../../../utilities/renderer");
-var _rendererEvent = require("../../../utilities/renderer-event");
-var _constant = require("../../../utilities/constant");
+var _platform = require("../../../utilities/platform");
 var _jsxRuntime = require("react/jsx-runtime");
 var AnnotationToolbar = exports.AnnotationToolbar = (0, _mobxReact.observer)(function () {
-  var _useContext = (0, _react.useContext)(_useElectron.DialogInstanceContext),
-    closeDialog = _useContext.closeDialog,
-    browserWindow = _useContext.browserWindow;
   var t = (0, _i18n.useI18n)();
-  var _useContext2 = (0, _react.useContext)(_store.AnnotationToolbarContext),
-    setTool = _useContext2.setTool,
-    _useContext2$observab = _useContext2.observables,
-    currentTool = _useContext2$observab.currentTool,
-    redoSteps = _useContext2$observab.redoSteps,
-    undoSteps = _useContext2$observab.undoSteps,
-    isTipsVisible = _useContext2.isTipsVisible,
-    clean = _useContext2.clean,
-    redo = _useContext2.redo,
-    undo = _useContext2.undo,
-    onTooltipMount = _useContext2.onTooltipMount,
-    onTooltipUnmount = _useContext2.onTooltipUnmount,
-    captureScreen = _useContext2.captureScreen,
-    hasAnnotationAllowWritePermission = _useContext2.hasAnnotationAllowWritePermission,
-    allowAnnotationWriteState = _useContext2.allowAnnotationWriteState,
-    setAllowAnnotationWrite = _useContext2.setAllowAnnotationWrite,
-    setPopoverVisible = _useContext2.setPopoverVisible,
-    popoverVisible = _useContext2.popoverVisible,
-    setToolbarCoords = _useContext2.setToolbarCoords,
-    mousePosition = _useContext2.mousePosition,
-    toolbarCoords = _useContext2.toolbarCoords;
+  var _useContext = (0, _react.useContext)(_store.AnnotationToolbarContext),
+    setTool = _useContext.setTool,
+    _useContext$observabl = _useContext.observables,
+    currentTool = _useContext$observabl.currentTool,
+    redoSteps = _useContext$observabl.redoSteps,
+    undoSteps = _useContext$observabl.undoSteps,
+    isTipsVisible = _useContext.isTipsVisible,
+    clean = _useContext.clean,
+    redo = _useContext.redo,
+    undo = _useContext.undo,
+    onTooltipMount = _useContext.onTooltipMount,
+    onTooltipUnmount = _useContext.onTooltipUnmount,
+    hasAnnotationAllowWritePermission = _useContext.hasAnnotationAllowWritePermission,
+    allowAnnotationWriteState = _useContext.allowAnnotationWriteState,
+    setAllowAnnotationWrite = _useContext.setAllowAnnotationWrite,
+    setPopoverVisible = _useContext.setPopoverVisible,
+    popoverVisible = _useContext.popoverVisible,
+    setToolbarCoords = _useContext.setToolbarCoords,
+    mousePosition = _useContext.mousePosition,
+    toolbarCoords = _useContext.toolbarCoords;
   var handleBlur = function handleBlur() {
     setPopoverVisible(false);
   };
@@ -68,21 +61,23 @@ var AnnotationToolbar = exports.AnnotationToolbar = (0, _mobxReact.observer)(fun
     });
   };
   var handleLeave = function handleLeave() {
-    (0, _rendererEvent.sendEvent)({
-      action: _constant.FcrUIRendererEventAction.SET_ANNOTATION_TO_FOCUS,
-      payload: true
-    });
+    // renderer.sendEvent({
+    //   action: FcrUIRendererEventAction.SET_ANNOTATION_TO_FOCUS,
+    //   payload: true,
+    // });
   };
+  var handleClose = function handleClose() {};
   (0, _react.useEffect)(function () {
-    browserWindow === null || browserWindow === void 0 || browserWindow.on('blur', handleBlur);
+    // TODO:
+    // browserWindow?.on('blur', handleBlur);
     return function () {
-      browserWindow === null || browserWindow === void 0 || browserWindow.off('blur', handleBlur);
+      // browserWindow?.off('blur', handleBlur);
     };
   }, [popoverVisible]);
   (0, _react.useEffect)(function () {
-    if ((0, _renderer.isMac)()) return;
+    if ((0, _platform.isMac)()) return;
     if (mousePosition.x > toolbarCoords.x && mousePosition.y > toolbarCoords.y && mousePosition.x < toolbarCoords.x + toolbarCoords.width && mousePosition.y < toolbarCoords.y + toolbarCoords.height) {
-      browserWindow === null || browserWindow === void 0 || browserWindow.setAlwaysOnTop(true, 'pop-up-menu');
+      // browserWindow?.setAlwaysOnTop(true, 'pop-up-menu');
     }
   }, [mousePosition]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
@@ -139,7 +134,7 @@ var AnnotationToolbar = exports.AnnotationToolbar = (0, _mobxReact.observer)(fun
         title: t('fmt_screenshare_controlbar_button_annotations')
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         className: "close",
-        onClick: closeDialog,
+        onClick: handleClose,
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
           type: _type.FcrIconType.FCR_CLOSE,
           size: 20,

package/lib/fragments/annotation/view.d.ts

@@ -1,4 +1,3 @@
 import './style.css';
-import '../../modules/annotation/board-cursor.css';
 declare const View: () => import("react/jsx-runtime").JSX.Element;
 export default View;

package/lib/fragments/annotation/view.js

@@ -11,11 +11,10 @@ var _mobxReact = require("mobx-react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _store = require("./store");
 require("./style.css");
-require("../../modules/annotation/board-cursor.css");
-var _rendererEvent = require("../../utilities/renderer-event");
-var _constant = require("../../utilities/constant");
-var _renderer = require("../../utilities/renderer");
+var _platform = require("../../utilities/platform");
 var _jsxRuntime = require("react/jsx-runtime");
+// import '../../modules/annotation/board-cursor.css';
+
 var View = (0, _mobxReact.observer)(function () {
   var _useContext = (0, _react.useContext)(_store.FragmentAnnotationStoreContext),
     handleBoardDomLoad = _useContext.handleBoardDomLoad,
@@ -27,13 +26,13 @@ var View = (0, _mobxReact.observer)(function () {
   var handleMouseMove = function handleMouseMove(e) {
     requestIdleCallback(function (idle) {
       if (!drawing && idle.timeRemaining() > 0) {
-        (0, _rendererEvent.sendEvent)({
-          action: _constant.FcrUIRendererEventAction.FRAGMENT_ANNOTATION_MOUSE_MOVE,
-          payload: {
-            x: e.screenX,
-            y: e.screenY
-          }
-        });
+        // renderer.sendEvent({
+        //   action: FcrUIRendererEventAction.FRAGMENT_ANNOTATION_MOUSE_MOVE,
+        //   payload: {
+        //     x: e.screenX,
+        //     y: e.screenY,
+        //   },
+        // });
       }
     }, {
       timeout: 1000
@@ -48,7 +47,7 @@ var View = (0, _mobxReact.observer)(function () {
     //   });
   };
   (0, _react.useEffect)(function () {
-    if ((0, _renderer.isMac)()) return;
+    if ((0, _platform.isMac)()) return;
     drawing ? window.removeEventListener('mousemove', handleMouseMove) : window.addEventListener('mousemove', handleMouseMove);
     return function () {
       window.removeEventListener('mousemove', handleMouseMove);

package/lib/fragments/base.d.ts

@@ -1,6 +1,9 @@
+import { Fragment, RendererCustomEvent, Runtime } from '../runtime';
+import { FcrUIRendererWrapper } from '../utilities/renderer';
 export declare abstract class BaseFragment implements Fragment {
     protected runtime: Runtime;
     protected logger: import("agora-foundation/lib/logger").Logger;
+    protected renderer: FcrUIRendererWrapper;
     constructor(runtime: Runtime);
     abstract get name(): string;
     abstract get component(): JSX.Element;

package/lib/fragments/base.js

@@ -11,11 +11,13 @@ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/creat
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _tools = require("../utilities/tools");
-var _logger = require("agora-foundation/lib/logger");
+var _logger = require("../utilities/logger");
+var _renderer = require("../utilities/renderer");
 var BaseFragment = exports.BaseFragment = /*#__PURE__*/function () {
   function BaseFragment(runtime) {
     (0, _classCallCheck2["default"])(this, BaseFragment);
     (0, _defineProperty2["default"])(this, "logger", (0, _logger.getLogger)());
+    (0, _defineProperty2["default"])(this, "renderer", new _renderer.FcrUIRendererWrapper());
     this.runtime = runtime;
     this._onLoad();
   }

package/lib/fragments/whiteboard/index.d.ts

@@ -1,10 +1,10 @@
 import { BaseFragment } from '../base';
+import { Runtime } from '../../runtime';
 export declare class WhiteboardFragment extends BaseFragment {
     private _fragmentWhiteboardStore;
     get name(): string;
     get component(): import("react/jsx-runtime").JSX.Element;
     constructor(runtime: Runtime);
-    protected onEvent(event: RendererCustomEvent): void;
 }
 export declare const windowOptions: Electron.BrowserWindowConstructorOptions;
 export declare const title = "Whiteboard";

package/lib/fragments/whiteboard/index.js

@@ -48,11 +48,6 @@ var WhiteboardFragment = exports.WhiteboardFragment = /*#__PURE__*/function (_Ba
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_view["default"], {})
       });
     }
-  }, {
-    key: "onEvent",
-    value: function onEvent(event) {
-      switch (event.action) {}
-    }
   }]);
 }(_base.BaseFragment);
 var windowOptions = exports.windowOptions = {
@@ -82,7 +77,9 @@ var title = exports.title = 'Whiteboard';
 var webPreferences = exports.webPreferences = {
   nodeIntegration: true
 };
-var $$fragment = new WhiteboardFragment(window.runtime);
+var $$fragment = new WhiteboardFragment(
+// @ts-ignore
+window.runtime);
 var App = function App() {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react["default"].Fragment, {
     children: $$fragment.component

package/lib/fragments/whiteboard/store.d.ts

@@ -16,6 +16,7 @@ export declare class FragmentWhiteboardStore {
     accessor currentTool: FcrBoardToolType | FcrBoardShape;
     get boardDom(): HTMLDivElement | undefined;
     get sharingType(): "whiteboard" | "annotation";
+    get mainWindowRenderer(): any;
     constructor();
     handleBoardDomLoad(dom: HTMLDivElement): void;
     unload(): void;

package/lib/fragments/whiteboard/store.js

@@ -114,13 +114,11 @@ var FragmentWhiteboardStore = exports.FragmentWhiteboardStore = /*#__PURE__*/fun
     (0, _defineProperty2["default"])(this, "_boardMainWindowObserver", {
       onUndoStateUpdated: function onUndoStateUpdated(enable) {
         _this.logger.info("[whiteboard-fragment]: undo state updated, enable ".concat(enable));
-        // @ts-ignore
-        window.parent.FcrUIMainWindowRenderer.notifyObservers('onRedoStepsUpdated', enable);
+        _this.mainWindowRenderer.notifyObservers('onRedoStepsUpdated', enable);
       },
       onRedoStateUpdated: function onRedoStateUpdated(enable) {
         _this.logger.info("[whiteboard-fragment]: redo state updated, enable ".concat(enable));
-        // @ts-ignore
-        window.parent.FcrUIMainWindowRenderer.notifyObservers('onUndoStepsUpdated', enable);
+        _this.mainWindowRenderer.notifyObservers('onUndoStepsUpdated', enable);
       }
     });
     (0, _defineProperty2["default"])(this, "_mainWindowObserver", {
@@ -190,8 +188,7 @@ var FragmentWhiteboardStore = exports.FragmentWhiteboardStore = /*#__PURE__*/fun
               case 1:
                 image = _context.sent;
                 _this.logger.info("[whiteboard-fragment]: save draft image");
-                // @ts-ignore
-                window.parent.FcrUIMainWindowRenderer.notifyObservers('onDraftSaved', image);
+                _this.mainWindowRenderer.notifyObservers('onDraftSaved', image);
               case 2:
               case "end":
                 return _context.stop();
@@ -208,8 +205,6 @@ var FragmentWhiteboardStore = exports.FragmentWhiteboardStore = /*#__PURE__*/fun
     _classPrivateFieldInitSpec(this, _A, _init_currentTool(this, _enums.FcrBoardToolType.NONE));
     var urlParams = new URLSearchParams(window.location.search);
     var type = urlParams.get('type');
-    // @ts-ignore
-    window.parent.FcrUIMainWindowRenderer.addObserver(this._mainWindowObserver);
     window.require = parent.window.require;
     var appId = _tools.storage.get('annotation_rtm_app_id') || '';
     var boardOptions = _tools.storage.get(STORAGE_KEY_WHITEBOARD_OPTIONS);
@@ -263,6 +258,17 @@ var FragmentWhiteboardStore = exports.FragmentWhiteboardStore = /*#__PURE__*/fun
     get: function get() {
       return this._sharingType;
     }
+  }, {
+    key: "mainWindowRenderer",
+    get: function get() {
+      // @ts-ignore
+      var mainWindowRenderer = window.parent.FcrUIMainWindowRenderer;
+      if (!mainWindowRenderer) {
+        console.log(window.parent);
+        throw new Error('main window renderer is not found');
+      }
+      return mainWindowRenderer;
+    }
   }, {
     key: "handleBoardDomLoad",
     value: function handleBoardDomLoad(dom) {
@@ -395,6 +401,7 @@ var FragmentWhiteboardStore = exports.FragmentWhiteboardStore = /*#__PURE__*/fun
               // @ts-ignore
               this._engine._rteEngine._rtmClient._client).createForSubProcess(config);
               this.logger.info("[whiteboard-fragment]: whiteboard sub process created, the control is ".concat(this._whiteboardControl));
+              this.mainWindowRenderer.addObserver(this._mainWindowObserver);
               this._whiteboardControl.addObserver(this._boardObserver);
               _context3.next = 1;
               return this._whiteboardControl.open();

package/lib/global.css

@@ -1,9 +1,3 @@
-/* 为所有独立窗口设置透明底色 */
-html,
-body {
-  background: transparent;
-}
-
 .fcr-scene-scope {
   font-family:
     ui-sans-serif,
@@ -23,15 +17,16 @@ body {
   font-size: 14px;
 }
 
+/* TODO: 不允许在全局加这种样式！ */
+/* 
 .fcr-scene-scope * {
   pointer-events: initial;
-}
+} */
 
-.fcr-scene-scope *::before,
+/* .fcr-scene-scope *::before,
 .fcr-scene-scope *::after {
-  /* border: transparent; */
   margin: 0px;
-}
+} */
 
 .fcr-connecting-loading {
   position: absolute;
@@ -48,3 +43,20 @@ body {
   top: 0;
   left: 0;
 }
+
+.fcr-ui-global-container-node {
+  position: absolute;
+  top: 0;
+  width: 100%;
+}
+
+.fcr-meeting-ended {
+  width: 100vw;
+  height: 100vh;
+  background-color: transparent;
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}