2.31.0

JiHong88 · Jul 5, 2020 · b140e10 · b140e10
2 parents 64fbc09 + 64c98fc
commit b140e10
Show file tree

Hide file tree

Showing 13 changed files with 110 additions and 132 deletions.
diff --git a/README.md b/README.md
@@ -327,14 +327,19 @@ plugins: [
 ]
 : Plugins array.     default: null {Array}
 
+// Vaues
+lang            : language object.   default : en {Object}
+value           : Initial value(html string) of the edit area.
+                  If not, the value of the "target textarea".   default: null {String}
+
 // Whitelist--------------------------------------å---------------------------------------------------------
 // _defaultTagsWhitelist : 'br|p|div|pre|blockquote|h[1-6]|ol|ul|li|hr|figure|figcaption|img|iframe|audio|video|table|thead|tbody|tr|th|td|a|b|strong|var|i|em|u|ins|s|span|strike|del|sub|sup'
-addTagsWhitelist      : Add tags to the default tags whitelist of editor. default: '' {String}
+addTagsWhitelist      : Add tags to the default tags whitelist of editor.   default: '' {String}
                         ex) 'mark|canvas|label|select|option|input|//' // "//" This means HTML comments.
 // _editorTagsWhitelist  : _defaultTagsWhitelist + addTagsWhitelist
-pasteTagsWhitelist    : Whitelist of tags when pasting. default: _editorTagsWhitelist {String}
+pasteTagsWhitelist    : Whitelist of tags when pasting.   default: _editorTagsWhitelist {String}
                         ex) 'p|h[1-6]'
-attributesWhitelist   : Add attributes whitelist of tags that should be kept undeleted from the editor.
+attributesWhitelist   : Add attributes whitelist of tags that should be kept undeleted from the editor.   default: null {Object}
                         // -- Fixed whitelist --
                         // Native attributes: 'contenteditable|colspan|rowspan|target|href|src|class|type|controls'
                         // Editor attributes: 'data-format|data-size|data-file-size|data-file-name|data-origin|data-align|data-image-link|data-rotate|data-proportion|data-percentage|origin-size|data-exp|data-font-size'
@@ -343,7 +348,6 @@ attributesWhitelist   : Add attributes whitelist of tags that should be kept und
                             'input': 'checked' // Apply to input tag
                         }
 // Layout-------------------------------------------------------------------------------------------------------
-lang            : language object.   default : en {Object}
 mode            : The mode of the editor ('classic', 'inline', 'balloon', 'balloon-always'). default: 'classic' {String}
 toolbarWidth    : The width of the toolbar. Applies only when the editor mode is 
                   'inline' or 'balloon' mode.     default: 'auto' {Number|String}

diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "suneditor",
-  "version": "2.30.7",
+  "version": "2.31.0",
   "description": "Pure JavaScript based WYSIWYG web editor",
   "main": "src/suneditor.js",
   "keywords": [

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.30.7",
+  "version": "2.31.0",
   "description": "Pure JavaScript based WYSIWYG web editor",
   "main": "src/suneditor.js",
   "keywords": [

diff --git a/sample/html/options.html b/sample/html/options.html
@@ -57,6 +57,10 @@
 <div class="content">
     <article class="markdown-body entry-content">
         <div style="background-color: #f3f3f3; padding: 4px 20px 20px 20px;">
+            <h4 style="color: #b94a48;">--Value</h4>
+            <label><input type="checkbox" id="editor_value">&nbsp;&nbsp;value&nbsp;&nbsp;&nbsp;</label><br>
+            <textarea id="editor_value_value" placeholder="HTML String ('&lt;p&gt;..&lt;/p&gt;')" style="width:320px"></textarea>
+            <br>
             <h4 style="color: #b94a48;">--Whitelist</h4>
             <label><input type="checkbox" id="addTagsWhitelist">&nbsp;&nbsp;addTagsWhitelist&nbsp;&nbsp;&nbsp;</label>
             <input type="text" id="addTagsWhitelist_value" placeholder="String (mark|canvas|label|select|option|input)" style="width:320px">
@@ -439,6 +443,7 @@ <h2 class="sub-title">Applied options</h2>
     imageTable.innerHTML = '';
 
     var options = {
+        value: document.getElementById('editor_value').checked ? document.getElementById('editor_value_value').value : undefined,
         addTagsWhitelist: document.getElementById('addTagsWhitelist').checked ? document.getElementById('addTagsWhitelist_value').value : undefined,
         pasteTagsWhitelist: document.getElementById('pasteTagsWhitelist').checked ? document.getElementById('pasteTagsWhitelist_value').value : undefined,
         attributesWhitelist: !document.getElementById('attributesWhitelist').checked ? undefined : {

diff --git a/src/lib/constructor.js b/src/lib/constructor.js
@@ -375,8 +375,9 @@ export default {
      * @private
      */
     _initOptions: function (element, options) {
-        /** user options */
+        /** Values */
         options.lang = options.lang || _defaultLang;
+        options.value = typeof options.value === 'string' ? options.value : null;
         /** Whitelist */
         options._defaultTagsWhitelist = typeof options._defaultTagsWhitelist === 'string' ? options._defaultTagsWhitelist : 'br|p|div|pre|blockquote|h[1-6]|ol|ul|li|hr|figure|figcaption|img|iframe|audio|video|source|table|thead|tbody|tr|th|td|a|b|strong|var|i|em|u|ins|s|span|strike|del|sub|sup';
         options._editorTagsWhitelist = options._defaultTagsWhitelist + (typeof options.addTagsWhitelist === 'string' && options.addTagsWhitelist.length > 0 ? '|' + options.addTagsWhitelist : '');

diff --git a/src/lib/core.js b/src/lib/core.js
@@ -387,6 +387,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
          * @property {Element} fullScreen fullScreen button element
          * @property {Element} showBlocks showBlocks button element
          * @property {Element} codeView codeView button element
+         * @private
          */
         _styleCommandMap: null,
 
@@ -761,6 +762,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
                         const format = util.createElement('P');
                         const br = util.createElement('BR');
                         format.appendChild(br);
+                        context.element.wysiwyg.appendChild(format);
                         this.setRange(br, 0, br, 0);
                     } else {
                         this.setRange(range.startContainer, range.startOffset, range.endContainer, range.endOffset);
@@ -790,7 +792,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
                 if (!focusEl) this.nativeFocus();
                 else this.setRange(focusEl, focusEl.textContent.length, focusEl, focusEl.textContent.length);
             } else {
-                this.nativeFocus();
+                this.focus();
             }
         },
 
@@ -812,7 +814,9 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
                 range.setStart(startCon, startOff);
                 range.setEnd(endCon, endOff);
             } catch (error) {
+                console.warn('[SUNEDITOR.core.focus.error] ' + error);
                 this.nativeFocus();
+                return;
             }
 
             const selection = this.getSelection();
@@ -934,12 +938,19 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
          * @private
          */
         _createDefaultRange: function () {
-            context.element.wysiwyg.focus();
+            const wysiwyg = context.element.wysiwyg;
+            wysiwyg.focus();
             const range = this._wd.createRange();
-            if (!context.element.wysiwyg.firstChild) this.execCommand('formatBlock', false, 'P');
 
-            range.setStart(context.element.wysiwyg.firstChild, 0);
-            range.setEnd(context.element.wysiwyg.firstChild, 0);
+            let focusEl = wysiwyg.firstElementChild;
+            if (!focusEl) {
+                focusEl = util.createElement('P');
+                focusEl.innerHTML = '<br>';
+                wysiwyg.appendChild(focusEl);
+            }
+
+            range.setStart(focusEl, 0);
+            range.setEnd(focusEl, 0);
 
             return range;
         },
@@ -4572,7 +4583,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
         /**
          * @description Initializ core variable
          * @param {Boolean} reload Is relooad?
-         * @param {String} _initHTML initial html string when "reload" is true
+         * @param {String} _initHTML initial html string
          * @private
          */
         _init: function (reload, _initHTML) {
@@ -4685,24 +4696,14 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
             this.addModule([_notice]);
 
             // Init, validate
-            _w.setTimeout(function () {
-                if (options.iframe) {
-                    this._wd = context.element.wysiwygFrame.contentDocument;
-                    context.element.wysiwyg = this._wd.body;
-                    if (options._editorStyles.editor) context.element.wysiwyg.style.cssText = options._editorStyles.editor;
-                    if (options.height === 'auto') this._iframeAuto = this._wd.body;
-                }
-                this._initWysiwygArea(reload, _initHTML);
-
-                this._checkComponents();
-                this._componentsInfoInit = false;
-                this._componentsInfoReset = false;
-
-                this.history.reset(true);
-                this._resourcesStateChange();
-
-                if (typeof functions.onload === 'function') return functions.onload(this, reload);
-            }.bind(this));
+            if (options.iframe) {
+                this._wd = context.element.wysiwygFrame.contentDocument;
+                context.element.wysiwyg = this._wd.body;
+                if (options._editorStyles.editor) context.element.wysiwyg.style.cssText = options._editorStyles.editor;
+                if (options.height === 'auto') this._iframeAuto = this._wd.body;
+            }
+
+            this._initWysiwygArea(reload, _initHTML);
         },
 
         /**
@@ -4731,17 +4732,13 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
         },
 
         /**
-         * @description Initializ wysiwyg area (Only called from core._init())
+         * @description Initializ wysiwyg area (Only called from core._init)
          * @param {Boolean} reload Is relooad?
-         * @param {String} _initHTML initial html string when "reload" is true
+         * @param {String} _initHTML initial html string
          * @private
          */
         _initWysiwygArea: function (reload, _initHTML) {
-            if (!reload) {
-                context.element.wysiwyg.innerHTML = this.convertContentsForEditor(context.element.originElement.value);
-            } else if (_initHTML) {
-                context.element.wysiwyg.innerHTML = _initHTML;
-            }
+            context.element.wysiwyg.innerHTML = reload ? _initHTML : this.convertContentsForEditor(typeof _initHTML === 'string' ? _initHTML : context.element.originElement.value);
         },
 
         /**
@@ -4795,7 +4792,6 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
 
         /**
          * @description If there is no default format, add a format and move "selection".
-         * Alternative code for - execCommand('formatBlock');
          * @param {String|null} formatName Format tag name (default: 'P')
          * @private
          */
@@ -4882,7 +4878,7 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
         /**
          * @description Initializ editor
          * @param {Boolean} reload Is relooad?
-         * @param {String} _initHTML initial html string when "reload" is true
+         * @param {String} _initHTML initial html string
          * @private
          */
         _editorInit: function (reload, _initHTML) {
@@ -4895,6 +4891,15 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
 
             // toolbar visibility
             context.element.toolbar.style.visibility = '';
+
+            this._checkComponents();
+            this._componentsInfoInit = false;
+            this._componentsInfoReset = false;
+
+            this.history.reset(true);
+            this._resourcesStateChange();
+
+            if (typeof functions.onload === 'function') return functions.onload(this, reload);
         },
 
         /**
@@ -7280,7 +7285,8 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
     if (options.iframe) {
         contextEl.wysiwygFrame.addEventListener('load', function () {
             util._setIframeDocument(this, options);
-            core._editorInit(false, null);
+            core._editorInit(false, options.value);
+            options.value = null;
         });
     }
 
@@ -7296,7 +7302,8 @@ export default function (context, pluginCallButtons, plugins, lang, options, _ic
 
     // init
     if (!options.iframe) {
-        core._editorInit(false, null);
+        core._editorInit(false, options.value);
+        options.value = null;
     }
 
     return functions;

diff --git a/src/options.d.ts b/src/options.d.ts
@@ -3,6 +3,23 @@ import { Plugin } from './plugins/Plugin';
 
 export interface SunEditorOptions {
     plugins: Plugin[] | Record<string, Plugin>;
+    /**
+     * Values
+     * ======
+     */
+    /**
+     * language object
+     */
+    lang?: Lang;
+    /**
+     * Initial value(html string) of the edit area.
+     * If not, the value of the "target textarea".
+     */
+    value?: string;
+    /**
+     * Whitelist
+     * ======
+     */
     /**
      * Add tags to the default tags whitelist of editor.
      */
@@ -19,10 +36,6 @@ export interface SunEditorOptions {
      * Layout
      * ======
      */
-    /**
-     * language object
-     */
-    lang?: Lang;
     /**
      * The mode of the editor (classic, inline, balloon, balloon-always)
      */

diff --git a/src/plugins/dialog/image.js b/src/plugins/dialog/image.js
@@ -509,9 +509,10 @@ export default {
 
     setup_reader: function (files, imgLinkValue, newWindowCheck, width, height, align, filesLen, isUpdate) {
         try {
-            const reader = new FileReader();
+            const wFileReader = this._w.FileReader;
 
-            for (let i = 0, file; i <= filesLen; i++) {
+            for (let i = 0, reader, file; i <= filesLen; i++) {
+                reader = new wFileReader();
                 file = files[i];
 
                 if (isUpdate) {

diff --git a/src/plugins/fileBrowser/imageGallery.js b/src/plugins/fileBrowser/imageGallery.js
@@ -50,14 +50,15 @@ export default {
         const srcName = item.src.split('/').pop();
         return  '<div class="se-file-item-img"><img src="' + item.src + '" alt="' + (item.alt || srcName) + '" data-command="pick">' +
                     '<div class="se-file-img-name se-file-name-back"></div>' +
-                    '<div class="se-file-img-name">' + (item.name || srcName) + '</div>' +
+                    '<div class="se-file-img-name __se__img_name">' + (item.name || srcName) + '</div>' +
                 '</div>';
     },
 
     setImage: function (target) {
         this.callPlugin('image', function () {
+            const file = {name: target.parentNode.querySelector('.__se__img_name').textContent, size: 0};
             this.context.image._altText = target.alt;
-            this.plugins.image.create_image.call(this, target.src, '', false, this.context.image._origin_w, this.context.image._origin_h, 'none', null);
+            this.plugins.image.create_image.call(this, target.src, '', false, this.context.image._origin_w, this.context.image._origin_h, 'none', file);
         }.bind(this), null);
     }
 };
diff --git a/src/plugins/modules/fileManager.js b/src/plugins/modules/fileManager.js
@@ -46,7 +46,7 @@
                     xmlHttp.setRequestHeader(key, uploadHeader[key]);
                 }
             }
-            xmlHttp.send(formData);  
+            xmlHttp.send(formData);
         },
 
         _callBackUpload: function (xmlHttp, callBack, errorCallBack) {

diff --git a/src/plugins/submenu/table.js b/src/plugins/submenu/table.js
@@ -1437,10 +1437,9 @@ export default {
                 this.controllersOff();
 
                 if (emptyDiv !== this.context.element.wysiwyg) this.util.removeItemAllParents(emptyDiv, function (current) { return current.childNodes.length === 0; }, null);
+                this.focus();
         }
 
-        this.focus();
-
         // history stack
         this.history.push(false);
     }