@seafile/sdoc-editor 1.0.157 → 1.0.159

package/dist/android/constants.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ACTION_TYPES = void 0;
+const ACTION_TYPES = exports.ACTION_TYPES = {
+  GET_OUTLINE: 'sdoc.outline.data.get',
+  SELECT_OUTLINE: 'sdoc.outline.data.select'
+};

package/dist/android/js-bridge.js

@@ -0,0 +1,71 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
+class JSBridge {
+  constructor() {
+    (0, _defineProperty2.default)(this, "init", () => {
+      if (window.WebViewJavascriptBridge && window.WebViewJavascriptBridge.inited) {
+        window.WebViewJavascriptBridge.init();
+      } else {
+        document.addEventListener('WebViewJavascriptBridgeReady', function () {
+          window.WebViewJavascriptBridge.init();
+        }, false);
+      }
+    });
+    (0, _defineProperty2.default)(this, "finishPage", () => {
+      if (!window.WebViewJavascriptBridge) return;
+      window.WebViewJavascriptBridge.callHandler('finishPage');
+    });
+    (0, _defineProperty2.default)(this, "initJSEventHandler", () => {
+      if (!window.WebViewJavascriptBridge) return;
+      window.WebViewJavascriptBridge.registerHandler('callJsFunction', (sData, responseCallback) => {
+        if (!sData) return;
+        let parsedData = null;
+        try {
+          parsedData = JSON.parse(sData);
+        } catch (err) {
+          parsedData = null;
+        }
+        if (!parsedData) return;
+        const {
+          action,
+          data
+        } = parsedData;
+        const eventHandler = this.eventHandlerMap[action];
+        const execActionSucceed = eventHandler(data);
+        if (execActionSucceed) {
+          responseCallback(JSON.stringify({
+            success: true
+          }));
+        }
+      });
+    });
+    (0, _defineProperty2.default)(this, "registerEventHandler", (key, callback) => {
+      if (!key || !callback) {
+        throw new Error('Parameter event type and processing function must exist.');
+      }
+      if (typeof key !== 'string') {
+        throw new Error('Event type must be a string.');
+      }
+      if (typeof key !== 'function') {
+        throw new Error('The handler function must be a function.');
+      }
+      this.eventHandlerMap[key] = callback;
+    });
+    (0, _defineProperty2.default)(this, "callAndroidFunction", dataString => {
+      if (!window.WebViewJavascriptBridge) return false;
+      window.WebViewJavascriptBridge.callHandler('callAndroidFunction', dataString);
+      return true;
+    });
+    this.eventHandlerMap = {};
+    this.init();
+    this.initJSEventHandler();
+  }
+}
+const jsBridge = new JSBridge();
+var _default = exports.default = jsBridge;

package/dist/android/outline-module.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.updateOutlineValue = exports.scrollToOutline = exports.registerOutlineEventHandler = void 0;
+var _constants = require("./constants");
+var _jsBridge = _interopRequireDefault(require("./js-bridge"));
+const updateOutlineValue = value => {
+  if (!value || !Array.isArray(value)) return;
+  const outlines = value === null || value === void 0 ? void 0 : value.filter(item => ['header1', 'header2', 'header3'].includes(item.type));
+  window.seafile['outlines'] = outlines;
+};
+exports.updateOutlineValue = updateOutlineValue;
+const scrollToOutline = item => {
+  const {
+    id
+  } = item;
+  document.getElementById(id).scrollIntoView();
+};
+exports.scrollToOutline = scrollToOutline;
+const registerOutlineEventHandler = () => {
+  _jsBridge.default.registerEventHandler(_constants.ACTION_TYPES.SELECT_OUTLINE, scrollToOutline);
+};
+exports.registerOutlineEventHandler = registerOutlineEventHandler;

package/dist/basic-sdk/constants/index.js

@@ -4,7 +4,7 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWild
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.PAGE_EDIT_AREA_WIDTH = exports.MODIFY_TYPE = exports.LEFT_OUTLINE_WIDTH = exports.INTERNAL_EVENT = exports.HEADER_OUTLINE_WIDTH_MAPPING = exports.FULL_WIDTH_MODE = exports.DOCUMENT_PLUGIN_EDITOR = exports.DIFF_VIEWER = exports.COMMENT_EDITOR_EDIT_AREA_WIDTH = exports.COMMENT_EDITOR = exports.ARTICLE_MIN_WIDTH = exports.ARTICLE_FULL_WIDTH = void 0;
+exports.PAGE_EDIT_AREA_WIDTH = exports.MODIFY_TYPE = exports.LEFT_OUTLINE_WIDTH = exports.INTERNAL_EVENT = exports.HEADER_OUTLINE_WIDTH_MAPPING = exports.FULL_WIDTH_MODE = exports.DOCUMENT_PLUGIN_EDITOR = exports.DIFF_VIEWER = exports.COMMENT_EDITOR_EDIT_AREA_WIDTH = exports.COMMENT_EDITOR = exports.ARTICLE_FULL_WIDTH = exports.ARTICLE_FULL_MIN_WIDTH = exports.ARTICLE_DEFAULT_WIDTH = void 0;
 Object.defineProperty(exports, "PLUGIN_BTN_POSITION", {
   enumerable: true,
   get: function () {
@@ -93,6 +93,8 @@ const SDOC_STORAGE = exports.SDOC_STORAGE = 'sdoc';
 const LEFT_OUTLINE_WIDTH = exports.LEFT_OUTLINE_WIDTH = 280;
 const RIGHT_COMMENT_WIDTH = exports.RIGHT_COMMENT_WIDTH = 314;
 
-// min width and full width
-const ARTICLE_MIN_WIDTH = exports.ARTICLE_MIN_WIDTH = '794px';
-const ARTICLE_FULL_WIDTH = exports.ARTICLE_FULL_WIDTH = 'calc(100% - 50px - 50px)'; // The left and right sides are 50
+// Default mode width
+const ARTICLE_DEFAULT_WIDTH = exports.ARTICLE_DEFAULT_WIDTH = '794px';
+// Width in full width mode
+const ARTICLE_FULL_WIDTH = exports.ARTICLE_FULL_WIDTH = 'calc(100% - 50px - 50px)'; // The left and right sides are 50
+const ARTICLE_FULL_MIN_WIDTH = exports.ARTICLE_FULL_MIN_WIDTH = '400px';

package/dist/basic-sdk/editor/sdoc-editor.js

@@ -24,6 +24,7 @@ var _readonlyArticle = _interopRequireDefault(require("../views/readonly-article
 var _utils = require("../../utils");
 var _basicSdk = require("../../basic-sdk");
 var _constants2 = require("../../constants");
+var _outlineModule = require("../../android/outline-module");
 const SdocEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     editor: propsEditor,
@@ -96,6 +97,13 @@ const SdocEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
+  (0, _react.useEffect)(() => {
+    if (_utils.isMobile) {
+      (0, _outlineModule.registerOutlineEventHandler)();
+      (0, _outlineModule.updateOutlineValue)(document.elements);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
   const onRefreshDocument = (0, _react.useCallback)(() => {
     window.location.reload();
   }, []);
@@ -130,6 +138,9 @@ const SdocEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     const eventBus = _basicSdk.EventBus.getInstance();
     eventBus.dispatch(_constants.INTERNAL_EVENT.UPDATE_SEARCH_REPLACE_HIGHLIGHT, value);
     setSlateValue(value);
+    if (_utils.isMobile) {
+      (0, _outlineModule.updateOutlineValue)(value);
+    }
   };
   const isFreezed = _context.default.getSetting('isFreezed');
   if (isReloading) {

package/dist/basic-sdk/layout/editor-content.js

@@ -12,6 +12,9 @@ var _outline = _interopRequireDefault(require("../outline"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _provider = _interopRequireDefault(require("../comment/provider"));
 var _rightPanel = _interopRequireDefault(require("../right-panel"));
+var _localStorageUtils = _interopRequireDefault(require("../../utils/local-storage-utils"));
+var _fullWidthMode = require("../utils/full-width-mode");
+var _constants = require("../../basic-sdk/constants");
 const EditorContent = _ref => {
   let {
     readonly,
@@ -29,6 +32,20 @@ const EditorContent = _ref => {
     } = event.target;
     setScrollLeft(scrollLeft);
   }, []);
+  const onBodyScroll = (0, _react.useCallback)(() => {
+    const scrollLeft = window.scrollX;
+    setScrollLeft(scrollLeft);
+  }, []);
+  (0, _react.useEffect)(() => {
+    // Modify the outline position even when scrolling the window
+    if (_localStorageUtils.default.getItem(_constants.FULL_WIDTH_MODE)) {
+      document.addEventListener('scroll', onBodyScroll);
+    }
+    return () => {
+      document.removeEventListener('scroll', onBodyScroll);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
   const className = (0, _classnames.default)('sdoc-editor-content', {
     'readonly': readonly,
     'no-outline': !showOutline
@@ -50,7 +67,8 @@ const EditorContent = _ref => {
       scrollRef
     }
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: className
+    className: className,
+    style: (0, _fullWidthMode.getContentStyleByFullModeStyle)()
   }, showOutline && /*#__PURE__*/_react.default.createElement(_outline.default, {
     scrollLeft: scrollLeft,
     doc: docValue

package/dist/basic-sdk/utils/default-mode.js

@@ -14,20 +14,20 @@ const getStyleByDefaultMode = (scrollRef, editor) => {
     isShowComments
   } = sdocStorage;
   const containerStyle = {
-    width: _constants.ARTICLE_MIN_WIDTH
+    width: _constants.ARTICLE_DEFAULT_WIDTH
   };
 
   // Has outline
   if (isShowOutline && editor.editorType !== _constants.WIKI_EDITOR) {
     const rect = scrollRef.current.getBoundingClientRect();
     if (isShowComments) {
-      const outlineRightWidth = Number(_constants.ARTICLE_MIN_WIDTH.slice(0, 3)) + _constants.RIGHT_COMMENT_WIDTH;
+      const outlineRightWidth = Number(_constants.ARTICLE_DEFAULT_WIDTH.slice(0, 3)) + _constants.RIGHT_COMMENT_WIDTH;
       if (rect.width - outlineRightWidth < 280) {
         containerStyle['marginLeft'] = `${_constants.LEFT_OUTLINE_WIDTH}px`;
         return containerStyle;
       }
     }
-    if ((rect.width - Number(_constants.ARTICLE_MIN_WIDTH.slice(0, 3))) / 2 < 280) {
+    if ((rect.width - Number(_constants.ARTICLE_DEFAULT_WIDTH.slice(0, 3))) / 2 < 280) {
       containerStyle['marginLeft'] = `${_constants.LEFT_OUTLINE_WIDTH}px`;
     }
   }

package/dist/basic-sdk/utils/full-width-mode.js

@@ -4,9 +4,8 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getStyleByFullWidthMode = void 0;
+exports.getStyleByFullWidthMode = exports.getContentStyleByFullModeStyle = void 0;
 var _localStorageUtils = _interopRequireDefault(require("../../utils/local-storage-utils"));
-var _defaultMode = require("./default-mode");
 var _constants = require("../constants");
 const getStyleByFullWidthMode = (scrollRef, editor) => {
   const sdocStorage = _localStorageUtils.default.getItem(_constants.SDOC_STORAGE) || {};
@@ -16,23 +15,7 @@ const getStyleByFullWidthMode = (scrollRef, editor) => {
   } = sdocStorage;
   let containerStyle = {};
   containerStyle['width'] = _constants.ARTICLE_FULL_WIDTH;
-
-  // Has outline and comments
-  if (isShowOutline && editor.editorType !== _constants.WIKI_EDITOR && isHasComments) {
-    const rect = scrollRef.current.getBoundingClientRect();
-    const currentMaxWidth = rect.width - 100;
-    const leftWidth = _constants.LEFT_OUTLINE_WIDTH - 50;
-    const rightWidth = _constants.RIGHT_COMMENT_WIDTH - 50;
-    // Enough width to enable widescreen mode
-    if (currentMaxWidth - leftWidth - rightWidth > _constants.ARTICLE_MIN_WIDTH.slice(0, -2)) {
-      containerStyle['marginLeft'] = `${_constants.LEFT_OUTLINE_WIDTH}px`;
-      containerStyle['width'] = containerStyle['width'].slice(0, -1) + ` - ${leftWidth + rightWidth}px`;
-    } else {
-      _localStorageUtils.default.setItem(_constants.FULL_WIDTH_MODE, false);
-      containerStyle = (0, _defaultMode.getStyleByDefaultMode)(scrollRef, editor);
-    }
-    return containerStyle;
-  }
+  containerStyle['minWidth'] = _constants.ARTICLE_FULL_MIN_WIDTH;
 
   // Has outline
   if (isShowOutline && editor.editorType !== _constants.WIKI_EDITOR) {
@@ -40,7 +23,7 @@ const getStyleByFullWidthMode = (scrollRef, editor) => {
     const adjustWidth = ` - ${_constants.LEFT_OUTLINE_WIDTH - 50}px`; // One side is 50
     containerStyle['width'] = containerStyle['width'].slice(0, -1) + adjustWidth;
   }
-  // Has comments
+  // Has comments right list
   if (isHasComments) {
     containerStyle['marginRight'] = `${_constants.RIGHT_COMMENT_WIDTH}px`;
     const adjustWidth = ` - ${_constants.RIGHT_COMMENT_WIDTH - 50}px`; // One side is 50
@@ -48,4 +31,13 @@ const getStyleByFullWidthMode = (scrollRef, editor) => {
   }
   return containerStyle;
 };
-exports.getStyleByFullWidthMode = getStyleByFullWidthMode;
+exports.getStyleByFullWidthMode = getStyleByFullWidthMode;
+const getContentStyleByFullModeStyle = () => {
+  if (_localStorageUtils.default.getItem(_constants.FULL_WIDTH_MODE)) {
+    return {
+      'minWidth': `${Number(_constants.ARTICLE_FULL_MIN_WIDTH.slice(0, -2)) + _constants.RIGHT_COMMENT_WIDTH}px`
+    };
+  }
+  return {};
+};
+exports.getContentStyleByFullModeStyle = getContentStyleByFullModeStyle;

package/dist/basic-sdk/views/sdoc-viewer.js

@@ -15,6 +15,7 @@ var _readonlyArticle = _interopRequireDefault(require("./readonly-article"));
 var _useColorContext = require("../hooks/use-color-context");
 var _hooks = require("../../hooks");
 var _context = _interopRequireDefault(require("../../context"));
+var _outlineModule = require("../../android/outline-module");
 require("../assets/css/sdoc-viewer.css");
 const SDocViewer = _ref => {
   let {
@@ -31,6 +32,13 @@ const SDocViewer = _ref => {
   const validEditor = editor || (0, _nodeId.default)((0, _extension.createDefaultEditor)());
   const slateValue = (document || (0, _utils.generateDefaultDocContent)()).elements;
   const Provider = showComment ? _hooks.CollaboratorsProvider : _react.Fragment;
+  (0, _react.useEffect)(() => {
+    if (_utils.isMobile) {
+      (0, _outlineModule.registerOutlineEventHandler)();
+      (0, _outlineModule.updateOutlineValue)(slateValue);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
   return /*#__PURE__*/_react.default.createElement(Provider, null, /*#__PURE__*/_react.default.createElement(_hooks.PluginsProvider, {
     plugins: plugins,
     showComment: showComment

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "1.0.157",
+  "version": "1.0.159",
   "private": false,
   "description": "This is a sdoc editor",
   "main": "dist/index.js",