2.36.4

JiHong88 · Feb 20, 2021 · 37aef4a · 37aef4a
2 parents 6f14a06 + b17e92c
commit 37aef4a
Show file tree

Hide file tree

Showing 14 changed files with 79 additions and 33 deletions.
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "suneditor",
-  "version": "2.36.3",
+  "version": "2.36.4",
   "description": "Pure JavaScript based WYSIWYG web editor",
   "main": "src/suneditor.js",
   "keywords": [

diff --git a/dist/css/suneditor.min.css b/dist/css/suneditor.min.css
diff --git a/dist/suneditor.min.js b/dist/suneditor.min.js
diff --git a/package.json b/package.json
@@ -3,7 +3,7 @@
   "sideEffects": [
     "./src/assets/css/*.css"
   ],
-  "version": "2.36.3",
+  "version": "2.36.4",
   "description": "Pure JavaScript based WYSIWYG web editor",
   "main": "src/suneditor.js",
   "keywords": [

diff --git a/sample/html/out/document-editor.html b/sample/html/out/document-editor.html
@@ -819,6 +819,15 @@ <h5>Parameters:</h5>
             <dl class="details"></dl>
 
 
+            <h4 class="name" id="getGlobalScrollOffset"><span class="type-signature"></span>getGlobalScrollOffset<span class="signature">()</span>
+                <span class="type-signature"> &rarr; {Object}</span></h4>
+            <div class="description">
+                Gets the current editor-relative scroll offset.<br>
+                {top: number, left: number}
+            </div>
+            <dl class="details"></dl>
+
+
             <h4 class="name" id="initMenuTarget"><span class="type-signature"></span>initMenuTarget<span class="signature">(pluginName, target, menu)</span><span
                     class="type-signature"></span></h4>
             <div class="description">
@@ -2305,6 +2314,7 @@ <h3>core</h3>
         <li><b>Methods</b></li>
         <li><a href="document-editor.html#callPlugin">callPlugin</a></li>
         <li><a href="document-editor.html#addModule">addModule</a></li>
+        <li><a href="document-editor.html#getGlobalScrollOffset">getGlobalScrollOffset</a></li>
         <li><a href="document-editor.html#initMenuTarget">initMenuTarget</a></li>
         <li><a href="document-editor.html#submenuOn">submenuOn</a></li>
         <li><a href="document-editor.html#submenuOff">submenuOff</a></li>

diff --git a/src/assets/css/suneditor.css b/src/assets/css/suneditor.css
@@ -85,11 +85,11 @@
 /** --- arrow icon ---------------------------------------------------------- */
 .sun-editor .se-arrow, .sun-editor .se-arrow::after {position:absolute; display:block; width:0; height:0; border:11px solid transparent;}
 /* arrow up */
-.sun-editor .se-arrow.se-arrow-up {top:-11px; left:20px; margin-left:-11px; border-top-width:0; border-bottom-color:rgba(0, 0, 0, .25);}
+.sun-editor .se-arrow.se-arrow-up {top:-11px; left:20px; margin-left:-11px; border-top-width:0; border-bottom-color:#dadada;}
 .sun-editor .se-arrow.se-arrow-up::after {top:1px; margin-left:-11px; content:" "; border-top-width:0; border-bottom-color:#fff;}
 .sun-editor .se-toolbar .se-arrow.se-arrow-up::after {border-bottom-color:#fafafa;}
 /* arrow down */
-.sun-editor .se-arrow.se-arrow-down {top:0px; left:0px; margin-left:-11px; border-bottom-width:0; border-top-color:rgba(0, 0, 0, .25);}
+.sun-editor .se-arrow.se-arrow-down {top:0px; left:0px; margin-left:-11px; border-bottom-width:0; border-top-color:#dadada;}
 .sun-editor .se-arrow.se-arrow-down::after {top:-12px; margin-left:-11px; content:" "; border-bottom-width:0; border-top-color:#fff;}
 .sun-editor .se-toolbar .se-arrow.se-arrow-down::after {border-top-color:#fafafa;}
 
@@ -140,7 +140,7 @@
 .sun-editor .se-toolbar-cover {position:absolute; display:none; font-size:36px; width:100%; height:100%; top:0; left:0; background-color:#fefefe; opacity:.5; filter:alpha(opacity=50); cursor:not-allowed; z-index:4;}
 .sun-editor .se-toolbar-separator-vertical {display:inline-block; height:0px; width:0px; margin:1px; vertical-align:top;}
 /* inline toolbar */
-.sun-editor .se-toolbar.se-toolbar-inline {display:none; position:absolute; z-index:2147483647; box-shadow:0 3px 9px rgba(0,0,0,.5); -webkit-box-shadow:0 3px 9px rgba(0,0,0,.5);}
+.sun-editor .se-toolbar.se-toolbar-inline {display:none; position:absolute; box-shadow:0 3px 9px rgba(0,0,0,.5); -webkit-box-shadow:0 3px 9px rgba(0,0,0,.5);}
 /* balloon toolbar */
 .sun-editor .se-toolbar.se-toolbar-balloon {display:none; position:absolute; z-index:2147483647; width:auto; box-shadow:0 3px 9px rgba(0,0,0,.5); -webkit-box-shadow:0 3px 9px rgba(0,0,0,.5);}
 /* sticky toolbar */
@@ -153,7 +153,7 @@
 .sun-editor .se-btn-module-border {border:1px solid #dadada; border-radius:4px;}
 .sun-editor .se-btn-module-enter {display:block; width:100%; height:1px; margin-bottom:5px; background-color:transparent;}
 /* ---more - layer */
-.sun-editor .se-toolbar-more-layer {margin:0 -3px; background-color:#f3f3f3;}
+.sun-editor .se-toolbar-more-layer {margin:0 -3px; background-color:#fafafa;}
 .sun-editor .se-toolbar-more-layer .se-more-layer {display:none;  border-top:1px solid #dadada;}
 .sun-editor .se-toolbar-more-layer .se-more-layer .se-more-form {display:inline-block; width:100%; height:auto; padding:4px 3px 0 3px;}
 /* ---more - button */

diff --git a/src/lib/constructor.js b/src/lib/constructor.js
@@ -820,7 +820,6 @@ export default {
 
                 if (vertical) {
                     const sv =  separator_vertical.cloneNode(false);
-                    if (align) sv.style.float = align;
                     _buttonTray.appendChild(sv);
                 }
 

diff --git a/src/lib/core.d.ts b/src/lib/core.d.ts
@@ -190,6 +190,11 @@ interface Core {
      */
     addModule(moduleArray: Module[]): void;
 
+    /**
+     * @description Gets the current editor-relative scroll offset.
+     */
+    getGlobalScrollOffset(): {top: number; left: number};
+
     /**
      * @description Method for managing submenu element.
      * You must add the "submenu" element using the this method at custom plugin.

diff --git a/src/lib/core.js b/src/lib/core.js
@@ -505,6 +505,32 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
             }
         },
 
+        /**
+         * @description Gets the current editor-relative scroll offset.
+         * @returns {Object} {top, left}
+         */
+        getGlobalScrollOffset: function () {
+            let t = 0, l = 0;
+            let el = context.element.topArea;
+            while (el) {
+                t += el.scrollTop;
+                l += el.scrollLeft;
+                el = el.parentElement;
+            }
+
+            el = this._shadowRoot ? this._shadowRoot.host : null;
+            while (el) {
+                t += el.scrollTop;
+                l += el.scrollLeft;
+                el = el.parentElement;
+            }
+
+            return {
+                top: t,
+                left: l
+            };
+        },
+
         /**
          * @description Method for managing submenu element.
          * You must add the "submenu" element using the this method at custom plugin.
@@ -649,13 +675,8 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
 
             // set menu position
             const toolbarTop = toolbarOffset.top;
-            let menuHeight = menu.offsetHeight;
-            let el = context.element.topArea;
-            let scrollTop = 0;
-            while (!!el) {
-                scrollTop += el.scrollTop;
-                el = el.parentElement;
-            }
+            const menuHeight = menu.offsetHeight;
+            const scrollTop = this.getGlobalScrollOffset().top;
 
             const menuHeight_bottom = _w.innerHeight - (toolbarTop - scrollTop + bt + element.parentElement.offsetHeight);
             if (menuHeight_bottom < menuHeight) {
@@ -5162,6 +5183,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
             core._variable.isChanged = true;
             if (context.tool.save) context.tool.save.removeAttribute('disabled');
             if (functions.onChange) functions.onChange(this.getContents(true), this);
+            if (context.element.toolbar.style.display === 'block') event._showToolbarBalloon();
         },
 
         /**
@@ -5685,14 +5707,9 @@ export default function (context, pluginCallButtons, plugins, lang, options, _re
             let rects = range.getClientRects();
             rects = rects[isDirTop ? 0 : rects.length - 1];
 
-            let scrollLeft = 0;
-            let scrollTop = 0;
-            let el = topArea;
-            while (!!el) {
-                scrollLeft += el.scrollLeft;
-                scrollTop += el.scrollTop;
-                el = el.parentElement;
-            }
+            const globalScroll = core.getGlobalScrollOffset();
+            let scrollLeft = globalScroll.left;
+            let scrollTop = globalScroll.top;
 
             const editorWidth = topArea.offsetWidth;
             const offsets = event._getEditorOffsets(null);

diff --git a/src/lib/util.js b/src/lib/util.js
@@ -209,8 +209,10 @@ const util = {
                 continue;
             }
 
-            for (let c = 0, cLen = rules.length; c < cLen; c++) {
-                cssText += rules[c].cssText;
+            if (rules) {
+                for (let c = 0, cLen = rules.length; c < cLen; c++) {
+                    cssText += rules[c].cssText;
+                }
             }
         }
 

diff --git a/src/plugins/modules/_anchor.js b/src/plugins/modules/_anchor.js
@@ -190,7 +190,7 @@ export default {
         const value = typeof e === 'string' ? e : e.target.value.trim();
         const reservedProtocol  = /^(mailto\:|https*\:\/\/)/.test(value);
         const sameProtocol = !protocol ? false : this._w.RegExp('^' + value.substr(0, protocol.length)).test(protocol);
-        context.linkValue = preview.textContent = !value ? '' : (protocol && !reservedProtocol && !sameProtocol) ? protocol + value : reservedProtocol ? value : /^www\./.test(value) ? 'http://' + value : this.context.anchor.host + value;
+        context.linkValue = preview.textContent = !value ? '' : (protocol && !reservedProtocol && !sameProtocol) ? protocol + value : reservedProtocol ? value : /^www\./.test(value) ? 'http://' + value : this.context.anchor.host + (/^\//.test(value) ? '' : '/') + value;
 
         if (value.indexOf('#') === 0) {
             context.bookmark.style.display = 'block';

diff --git a/src/plugins/modules/fileManager.js b/src/plugins/modules/fileManager.js
@@ -25,6 +25,15 @@
         name: 'fileManager',
         _xmlHttp: null,
 
+        _checkMediaComponent: function (tag) {
+            if (/IMG/i.test(tag)) {
+                return !/FIGURE/i.test(tag.parentElement.nodeName) || !/FIGURE/i.test(tag.parentElement.parentElement.nodeName);
+            } else if (/VIDEO/i.test(tag)) {
+                return !/FIGURE/i.test(tag.parentElement.nodeName);
+            }
+            return true;
+        },
+
         /**
          * @description Upload the file to the server.
          * @param {String} uploadUrl Upload server url
@@ -92,9 +101,10 @@
                 tags = tags.concat([].slice.call(this.context.element.wysiwyg.getElementsByTagName(tagNames[i])));
             }
 
+            const fileManagerPlugin = this.plugins.fileManager;
             const context = this.context[pluginName];
             const infoList = context._infoList;
-            const setFileInfo = this.plugins.fileManager.setInfo.bind(this);
+            const setFileInfo = fileManagerPlugin.setInfo.bind(this);
 
             if (tags.length === infoList.length) {
                 // reset
@@ -128,7 +138,7 @@
 
             for (let i = 0, len = tags.length, tag; i < len; i++) {
                 tag = tags[i];
-                if (!this.util.getParentElement(tag, this.util.isMediaComponent) || !/FIGURE/i.test(tag.parentElement.nodeName)) {
+                if (!this.util.getParentElement(tag, this.util.isMediaComponent) || !fileManagerPlugin._checkMediaComponent(tag)) {
                     currentTags.push(context._infoIndex);
                     modifyHandler(tag);
                 } else if (!tag.getAttribute('data-index') || infoIndex.indexOf(tag.getAttribute('data-index') * 1) < 0) {

diff --git a/test/dev/suneditor_build_test.html b/test/dev/suneditor_build_test.html
@@ -219,13 +219,14 @@ <h3>The Suneditor is based on pure JavaScript, with no dependencies.</h3>
       <div style="height: 100px; width: 600px; border: 1px red solid;"></div>
       <div id="appi">
         <textarea id="scrolleditor"></textarea>
+        <div id="app">
+
+        </div>
       </div>
       <div style="height: 900px; width: 600px; border: 1px red solid;"></div>
     </div>
 
-    <div id="app">
-
-    </div>
+
 
     <div style="position: relative; top: 50px;">
         <textarea id="cmtest">afda</textarea>

diff --git a/test/dev/suneditor_build_test.js b/test/dev/suneditor_build_test.js
@@ -178,6 +178,7 @@ shadow.appendChild(appStyle);
 shadow.appendChild(appEl);
 suneditor.create(appEl, {
     plugins: plugins,
+    mode: "balloon",
     katex: Katex,
     width: '400px',
     height: 500,
@@ -384,6 +385,7 @@ let ss = window.ss = suneditor.create(document.getElementById('editor1'), {
     stickyToolbar: 50,
     fullScreenOffset: '10px',
     mediaAutoSelect: false,
+    mode: 'balloon',
     // rtl: true,
     // fullPage: true,
     // pasteTagsWhitelist: 'p|a|strong|em|h3|h4|h5|ul|ol|li|blockquote|table|thead|tbody|tfoot|tr|td|sup|sub',