@seafile/sdoc-editor 1.0.206-test0.4.1 → 1.0.206-test0.4.2

package/dist/basic-sdk/extension/commons/insert-element-dialog/index.js

@@ -23,6 +23,7 @@ var _index4 = _interopRequireDefault(require("../../../../components/toast/index
 var _index5 = require("../../plugins/video/constants/index.js");
 var _constants3 = require("../../../../basic-sdk/constants");
 var _index6 = _interopRequireDefault(require("../../plugins/ai/ai-module/index.js"));
+var _index7 = _interopRequireDefault(require("../../plugins/video/dialog/add-video-link-dialog/index.js"));
 const InsertElementDialog = _ref => {
   let {
     editor
@@ -185,6 +186,10 @@ const InsertElementDialog = _ref => {
         };
         return /*#__PURE__*/_react.default.createElement(_index.default, videoProps);
       }
+    case _constants2.ELEMENT_TYPE.VIDEO_LINK:
+      {
+        return /*#__PURE__*/_react.default.createElement(_index7.default, props);
+      }
     case _constants2.LOCAL_IMAGE:
       {
         return /*#__PURE__*/_react.default.createElement("input", {

package/dist/basic-sdk/extension/constants/element-type.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.WIKI_LINK = exports.VIDEO = exports.UNORDERED_LIST = exports.TWO_COLUMN = exports.TOP_LEVEL_TYPES = exports.TITLE = exports.THREE_COLUMN = exports.TABLE_ROW = exports.TABLE_CELL = exports.TABLE = exports.SUBTITLE = exports.SEATABLE_TABLE = exports.SEATABLE_COLUMN = exports.SDOC_LINK = exports.QUICK_INSERT = exports.PARAGRAPH = exports.ORDERED_LIST = exports.MULTI_COLUMN = exports.MENTION_TEMP = exports.MENTION = exports.LIST_ITEM = exports.LINK = exports.INLINE_LEVEL_TYPES = exports.IMAGE_BLOCK = exports.IMAGE = exports.HEADER6 = exports.HEADER5 = exports.HEADER4 = exports.HEADER3 = exports.HEADER2 = exports.HEADER1 = exports.HEADER = exports.FOUR_COLUMN = exports.FONT_SIZE_REDUCE = exports.FONT_SIZE_INCREASE = exports.FONT_SIZE = exports.FIVE_COLUMN = exports.FILE_LINK_INSET_INPUT_TEMP = exports.FILE_LINK = exports.COLUMN = exports.CODE_LINE = exports.CODE_BLOCK = exports.CHECK_LIST_ITEM = exports.CALL_OUT = exports.BLOCKQUOTE = exports.ASK_AI = void 0;
+exports.WIKI_LINK = exports.VIDEO_LINK = exports.VIDEO = exports.UNORDERED_LIST = exports.TWO_COLUMN = exports.TOP_LEVEL_TYPES = exports.TITLE = exports.THREE_COLUMN = exports.TABLE_ROW = exports.TABLE_CELL = exports.TABLE = exports.SUBTITLE = exports.SEATABLE_TABLE = exports.SEATABLE_COLUMN = exports.SDOC_LINK = exports.QUICK_INSERT = exports.PARAGRAPH = exports.ORDERED_LIST = exports.MULTI_COLUMN = exports.MENTION_TEMP = exports.MENTION = exports.LIST_ITEM = exports.LINK = exports.INLINE_LEVEL_TYPES = exports.IMAGE_BLOCK = exports.IMAGE = exports.HEADER6 = exports.HEADER5 = exports.HEADER4 = exports.HEADER3 = exports.HEADER2 = exports.HEADER1 = exports.HEADER = exports.FOUR_COLUMN = exports.FONT_SIZE_REDUCE = exports.FONT_SIZE_INCREASE = exports.FONT_SIZE = exports.FIVE_COLUMN = exports.FILE_LINK_INSET_INPUT_TEMP = exports.FILE_LINK = exports.COLUMN = exports.CODE_LINE = exports.CODE_BLOCK = exports.CHECK_LIST_ITEM = exports.CALL_OUT = exports.BLOCKQUOTE = exports.ASK_AI = void 0;
 const BLOCKQUOTE = exports.BLOCKQUOTE = 'blockquote';
 const TITLE = exports.TITLE = 'title';
 const SUBTITLE = exports.SUBTITLE = 'subtitle';
@@ -42,6 +42,7 @@ const MENTION = exports.MENTION = 'mention';
 const MENTION_TEMP = exports.MENTION_TEMP = 'mention_temp';
 const FILE_LINK_INSET_INPUT_TEMP = exports.FILE_LINK_INSET_INPUT_TEMP = 'file_link_insert_input_temp';
 const QUICK_INSERT = exports.QUICK_INSERT = 'quick_insert';
+const VIDEO_LINK = exports.VIDEO_LINK = 'video_link';
 const SEATABLE_COLUMN = exports.SEATABLE_COLUMN = 'seatable_column';
 const SEATABLE_TABLE = exports.SEATABLE_TABLE = 'seatable_table';
 const ASK_AI = exports.ASK_AI = 'ask_ai';

package/dist/basic-sdk/extension/plugins/video/dialog/add-video-link-dialog/index.js

@@ -0,0 +1,101 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactI18next = require("react-i18next");
+var _reactstrap = require("reactstrap");
+var _helpers = require("../../helpers");
+const AddVideoLinkDialog = _ref => {
+  let {
+    editor,
+    className,
+    closeDialog,
+    handleSubmit
+  } = _ref;
+  const {
+    t
+  } = (0, _reactI18next.useTranslation)('sdoc-editor');
+  const [linkErrorMessage, setLinkErrorMessage] = (0, _react.useState)('');
+  const [url, setURL] = (0, _react.useState)('');
+  const isValidVideoLink = link => {
+    const videoRegex = /v\.qq\.com|youtube\.com|v\.youku\.com|bilibili\.com/i;
+    return videoRegex.test(link);
+  };
+  const submit = (0, _react.useCallback)(() => {
+    setLinkErrorMessage('');
+    if (!url) {
+      setLinkErrorMessage(t('The_link_address_is_required'));
+      return;
+    }
+    if (!isValidVideoLink(url)) {
+      setLinkErrorMessage(t('The_link_address_is_invalid'));
+      return;
+    }
+    console.log(url);
+    (0, _helpers.insertVideo)(editor, [{
+      name: url,
+      isEmbeddableLink: true
+    }], [url]);
+    handleSubmit && handleSubmit();
+    closeDialog();
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [editor, url]);
+  const onKeyDown = (0, _react.useCallback)(event => {
+    if (event.keyCode === 13) {
+      event.preventDefault();
+      submit();
+      return;
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [editor, url]);
+  const handleUrlChange = (0, _react.useCallback)(event => {
+    const videoUrl = event.target.videoUrl.trim();
+    if (videoUrl === url) return;
+    console.log(videoUrl);
+    setURL(videoUrl);
+  }, [url]);
+  return /*#__PURE__*/_react.default.createElement(_reactstrap.Modal, {
+    isOpen: true,
+    autoFocus: false,
+    toggle: closeDialog,
+    className: className,
+    zIndex: 1071,
+    returnFocusAfterClose: false
+  }, /*#__PURE__*/_react.default.createElement(_reactstrap.ModalHeader, {
+    toggle: closeDialog
+  }, t('Insert_link')), /*#__PURE__*/_react.default.createElement(_reactstrap.ModalBody, null, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: "form-group"
+  }, /*#__PURE__*/_react.default.createElement(_reactstrap.Label, {
+    for: "addLink"
+  }, t('Link_address')), /*#__PURE__*/_react.default.createElement("input", {
+    onKeyDown: onKeyDown,
+    autoFocus: true,
+    type: "url",
+    className: "form-control",
+    id: "addVideoLink",
+    value: url || '',
+    onChange: handleUrlChange
+  }), linkErrorMessage && /*#__PURE__*/_react.default.createElement(_reactstrap.Alert, {
+    color: "danger",
+    className: "mt-2"
+  }, t(linkErrorMessage))), /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      textAlign: 'center',
+      fontSize: '12px',
+      color: '#787774'
+    }
+  }, t('Support Youtube, Tencent, Bilibili and more')))), /*#__PURE__*/_react.default.createElement(_reactstrap.ModalFooter, null, /*#__PURE__*/_react.default.createElement(_reactstrap.Button, {
+    color: "secondary",
+    onClick: closeDialog
+  }, t('Cancel')), /*#__PURE__*/_react.default.createElement(_reactstrap.Button, {
+    color: "primary",
+    disabled: false,
+    onClick: submit
+  }, t('Add_link'))));
+};
+var _default = exports.default = AddVideoLinkDialog;

package/dist/basic-sdk/extension/plugins/video/helpers.js

@@ -95,15 +95,13 @@ const insertVideo = function (editor, videoFiles, srcList, selection) {
   if (position !== _constants.INSERT_POSITION.AFTER) {
     if (isInsertVideoMenuDisabled(editor)) return;
   }
-  console.log(videoFiles[0]);
   const videoInfo = {
     name: videoFiles[0].name || null,
     size: videoFiles[0].size || null,
     isEmbeddableLink: videoFiles[0].isEmbeddableLink || false
   };
-  console.log(videoInfo);
   let videoNodes;
-  // Return when embedding invalid youtube, tencent or bilibili video url
+  // Return when embedding an invalid youtube, tencent or bilibili video url
   if (videoInfo.isEmbeddableLink) {
     const parsedSrc = parseVideoLink(srcList[0]);
     if (!parsedSrc) return;

package/dist/basic-sdk/extension/plugins/video/menu/index.js

@@ -13,7 +13,6 @@ var _helpers = require("../helpers");
 var _constants = require("../../../constants");
 var _constants2 = require("../../../../constants");
 var _dropdownMenuItem = _interopRequireDefault(require("../../../commons/dropdown-menu-item"));
-var _constants3 = require("../../../../../constants");
 const VideoMenu = _ref => {
   let {
     editor,
@@ -32,14 +31,13 @@ const VideoMenu = _ref => {
       editor
     });
   }, [editor, eventBus]);
-  const addVideoLink = (0, _react.useCallback)(e => {
-    const external_props = {
-      insertVideo: _helpers.insertVideo,
+  const addVideoLink = (0, _react.useCallback)(() => {
+    eventBus.dispatch(_constants2.INTERNAL_EVENT.INSERT_ELEMENT, {
+      type: _constants.ELEMENT_TYPE.VIDEO_LINK,
       editor
-    };
-    eventBus.dispatch(_constants3.EXTERNAL_EVENT.ADD_VIDEO_LINK, {
-      ...external_props
     });
+    toggle && toggle();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [editor, eventBus]);
   const openSelectVideoFileDialog = (0, _react.useCallback)(() => {
     eventBus.dispatch(_constants2.INTERNAL_EVENT.INSERT_ELEMENT, {

package/package.json

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