suneditor - npm Package Compare versions

Comparing version 2.0.11 to 2.0.13

bower.json

 {
   "name": "suneditor",
-  "version": "2.0.11",
+  "version": "2.0.13",
   "description": "Pure JavaScript based WYSIWYG web editor",
@@ -9,8 +9,11 @@ "main": "src/suneditor.js",
     "editor",
-    "javascript",
+    "wysiwyg editor",
+    "rich text",
+    "rich editor",
+    "rich text editor",
+    "web",
+    "html",
+    "contenteditable",
     "suneditor",
-    "wysiwyg-eidtor",
-    "rich-text-editor",
-    "html-editor",
-    "contenteditable"
+    "javascript"
   ],
@@ -17,0 +20,0 @@ "author": "JiHong.Lee",

package.json

@@ -6,3 +6,3 @@ {
   ],
-  "version": "2.0.11",
+  "version": "2.0.13",
   "description": "Pure JavaScript based WYSIWYG web editor",
@@ -13,8 +13,11 @@ "main": "src/suneditor.js",
     "editor",
-    "javascript",
+    "wysiwyg editor",
+    "rich text",
+    "rich editor",
+    "rich text editor",
+    "web",
+    "html",
+    "contenteditable",
     "suneditor",
-    "wysiwyg-editor",
-    "rich-text-editor",
-    "html-editor",
-    "contenteditable"
+    "javascript"
   ],
@@ -21,0 +24,0 @@ "author": "JiHong.Lee",

README.md

@@ -8,8 +8,9 @@ # Suneditor
 
-![GitHub](https://img.shields.io/github/license/mashape/apistatus.svg)
-![GitHub release](https://img.shields.io/github/release/qubyte/rubidium.svg)
-![Npm](https://img.shields.io/npm/v/npm.svg)
-![npm bundle size (minified)](https://img.shields.io/bundlephobia/min/react.svg)
-![Github All Releases](https://img.shields.io/github/downloads/atom/atom/total.svg)
+[![GitHub](https://img.shields.io/github/license/jihong88/suneditor.svg)](https://github.com/JiHong88/SunEditor/blob/master/LICENSE.txt)
+[![GitHub release](https://img.shields.io/github/release/jihong88/suneditor.svg)](https://github.com/JiHong88/SunEditor/releases)
+[![npm](https://img.shields.io/npm/dt/suneditor.svg)](https://www.npmjs.com/package/suneditor)
+[![GitHub stars](https://img.shields.io/github/stars/JiHong88/SunEditor.svg)](https://github.com/JiHong88/SunEditor/stargazers)
+[![David](https://img.shields.io/david/dev/jihong88/suneditor.svg)](https://david-dm.org/jihong88/suneditor?type=dev)
 
+
 ```properties
@@ -20,3 +21,3 @@ The Suneditor is based on pure JavaScript
 Supported Browser -
-Chrome, Safari, Opera, Firefox, Edge, IE 11, Mobile web
+Chrome, Opera, Firefox, Edge, IE 11, Safari(macOS, IOS), Mobile web
 ```
@@ -142,3 +143,3 @@
         ['removeFormat'],
-        '/', Line break
+        '/', // Line break
         ['fontColor', 'hiliteColor'],
@@ -238,3 +239,2 @@ ['indent', 'outdent'],
 ```javascript
-// Plugins
 plugins: [
@@ -253,4 +253,3 @@ font,
     video
-],
-// User Options
+]               : Plugins array                                     default : null
 fontSize        : Change default font-size List                     default : null
@@ -257,0 +256,0 @@ font            : Change default font-family List                   default : null

src/plugins/dialog/image.js

@@ -10,2 +10,3 @@ /*
 import dialog from '../modules/dialog'
+import resizing from '../modules/resizing'
 
@@ -15,3 +16,3 @@ export default {
     add: function (_this) {
-        _this._addModule(dialog);
+        _this.addModule([dialog, resizing]);
         
@@ -18,0 +19,0 @@ const context = _this.context;

src/plugins/dialog/link.js

@@ -14,3 +14,3 @@ /*
     add: function (_this) {
-        _this._addModule(dialog);
+        _this.addModule([dialog]);
 
@@ -17,0 +17,0 @@ const context = _this.context;

src/plugins/dialog/video.js

@@ -10,2 +10,3 @@ /*
 import dialog from '../modules/dialog'
+import resizing from '../modules/resizing'
 
@@ -15,3 +16,3 @@ export default {
     add: function (_this) {
-        _this._addModule(dialog);
+        _this.addModule([dialog, resizing]);
 
@@ -37,3 +38,3 @@ const context = _this.context;
             const pNode = e.target.parentNode;
-            const size = _this.plugins.dialog.call_controller_resize.call(_this, pNode, 'video');
+            const size = _this.plugins.resizing.call_controller_resize.call(_this, pNode, 'video');
             _this.plugins.video.onModifyMode.call(_this, pNode.children[0], size);
@@ -40,0 +41,0 @@ });

src/plugins/modules/dialog.js

@@ -14,10 +14,3 @@ /*
         const context = _this.context;
-        context.dialog = {
-            _resizeClientX: 0,
-            _resizeClientY: 0,
-            _resize_plugin: '',
-            _resize_w: 0,
-            _resize_h: 0,
-            _resize_direction: ''
-        };
+        context.dialog = {};
 
@@ -43,34 +36,10 @@ /** dialog */
 
-        /** resize controller, button */
-        let resize_div_container = eval(this.setController_resize());
-        context.dialog.resizeContainer = resize_div_container;
-
-        context.dialog.resizeDiv = resize_div_container.getElementsByClassName('modal-resize')[0];
-        context.dialog.resizeDot = resize_div_container.getElementsByClassName('resize-dot')[0];
-        context.dialog.resizeDisplay = resize_div_container.getElementsByClassName('resize-display')[0];
-
-        let resize_button = eval(this.setController_button(_this.lang));;
-        context.dialog.resizeButton = resize_button;
-
-        let resize_handles = resize_div_container.getElementsByClassName('sun-editor-name-resize-handle');
-
         /** add event listeners */
         context.dialog.modal.addEventListener('click', this.onClick_dialog.bind(_this));
+        
+        /** append html */
         context.element.topArea.getElementsByClassName('sun-editor-container')[0].appendChild(dialog_div);
-        resize_handles[0].addEventListener('mousedown', this.onMouseDown_resize_handle.bind(_this));
-        resize_handles[1].addEventListener('mousedown', this.onMouseDown_resize_handle.bind(_this));
-        resize_handles[2].addEventListener('mousedown', this.onMouseDown_resize_handle.bind(_this));
-        resize_handles[3].addEventListener('mousedown', this.onMouseDown_resize_handle.bind(_this));
-        resize_handles[4].addEventListener('mousedown', this.onMouseDown_resize_handle.bind(_this));
-        resize_handles[5].addEventListener('mousedown', this.onMouseDown_resize_handle.bind(_this));
-        resize_handles[6].addEventListener('mousedown', this.onMouseDown_resize_handle.bind(_this));
-        resize_handles[7].addEventListener('mousedown', this.onMouseDown_resize_handle.bind(_this));
-        resize_button.addEventListener('click', this.onClick_resizeButton.bind(_this));
-
-        /** append html */
-        context.element.relative.appendChild(resize_div_container);
-        context.element.relative.appendChild(resize_button);
-
+        
         /** empty memory */
-        dialog_div = null, dialog_back = null, dialog_area = null, resize_div_container = null, resize_button = null, resize_handles = null;
+        dialog_div = null, dialog_back = null, dialog_area = null;
     },
@@ -116,182 +85,3 @@
         this.plugins[this.context.dialog.kind].init.call(this);
-    },
-
-    /** resize controller, button (image, iframe) */
-    setController_resize: function () {
-        const resize_container = document.createElement('DIV');
-        resize_container.className = 'modal-resize-container';
-        resize_container.style.display = 'none';
-        resize_container.innerHTML = '' +
-            '<div class="modal-resize">' +
-            '   <div class="resize-display"></div>' +
-            '</div>' +
-            '<div class="resize-dot">' +
-            '   <div class="tl sun-editor-name-resize-handle"></div>' +
-            '   <div class="tr sun-editor-name-resize-handle"></div>' +
-            '   <div class="bl sun-editor-name-resize-handle"></div>' +
-            '   <div class="br sun-editor-name-resize-handle"></div>' +
-            '   <div class="lw sun-editor-name-resize-handle"></div>' +
-            '   <div class="th sun-editor-name-resize-handle"></div>' +
-            '   <div class="rw sun-editor-name-resize-handle"></div>' +
-            '   <div class="bh sun-editor-name-resize-handle"></div>' +
-            '</div>';
-
-        return resize_container;
-    },
-
-    setController_button: function (lang) {
-        const resize_button = document.createElement("DIV");
-        resize_button.className = "resize-btn";
-        resize_button.style.display = "none";
-        resize_button.innerHTML = '' +
-            '<div class="btn-group">' +
-            '   <button type="button" data-command="100" title="' + lang.dialogBox.resize100 + '"><span class="note-fontsize-10">100%</span></button>' +
-            '   <button type="button" data-command="75" title="' + lang.dialogBox.resize75 + '"><span class="note-fontsize-10">75%</span></button>' +
-            '   <button type="button" data-command="50" title="' + lang.dialogBox.resize50 + '"><span class="note-fontsize-10">50%</span></button>' +
-            '   <button type="button" data-command="25" title="' + lang.dialogBox.resize25 + '"><span class="note-fontsize-10">25%</span></button>' +
-            '   <button type="button" data-command="update" title="' + lang.toolbar.image + '"><div class="icon-modify"></div></button>' +
-            '</div>' +
-            '<div class="btn-group remove">' +
-            '   <button type="button" data-command="delete" title="' + lang.dialogBox.remove + '"><div aria-hidden="true" class="icon-cancel"></div></button>' +
-            '</div>';
-
-        return resize_button;
-    },
-
-    call_controller_resize: function (targetElement, plugin) {
-        this.context.dialog._resize_plugin = plugin;
-        targetElement.setAttribute('unselectable', 'on');
-        targetElement.contentEditable = false;
-
-        const resizeContainer = this.context.dialog.resizeContainer;
-        const resizeDiv = this.context.dialog.resizeDiv;
-
-        const w = targetElement.offsetWidth;
-        const h = targetElement.offsetHeight;
-        const t = (targetElement.offsetTop - this.context.element.wysiwyg.scrollTop);
-        const l = (targetElement.offsetLeft);
-
-        resizeContainer.style.top = t + 'px';
-        resizeContainer.style.left = l + 'px';
-        resizeContainer.style.width = w + 'px';
-        resizeContainer.style.height = h + 'px';
-
-        resizeDiv.style.top = '0px';
-        resizeDiv.style.left = '0px';
-        resizeDiv.style.width =  w + 'px';
-        resizeDiv.style.height =  h + 'px';
-
-        this.context.dialog.resizeButton.style.top = (h + t) + 'px';
-        this.context.dialog.resizeButton.style.left = l + 'px';
-
-        this.util.changeTxt(this.context.dialog.resizeDisplay, w + ' x ' + h);
-
-        this.context.dialog.resizeContainer.style.display = 'block';
-        this.context.dialog.resizeButton.style.display = 'block';
-        this.context.dialog.resizeDot.style.display = 'block';
-
-        this.context.dialog._resize_w = w;
-        this.context.dialog._resize_h = h;
-
-        this.controllerArray = [this.context.dialog.resizeContainer, this.context.dialog.resizeButton];
-
-        return {
-            w: w,
-            h: h,
-            t: t,
-            l: l
-        };
-    },
-
-    cancel_controller_resize: function () {
-        this.context[this.context.dialog._resize_plugin]._resize_element.style.width = this.context.dialog._resize_w + 'px';
-        this.context[this.context.dialog._resize_plugin]._resize_element.style.height =this.context.dialog._resize_h + 'px';
-
-        this.context.element.resizeBackground.style.display = 'none';
-        this.context.dialog.resizeContainer.style.display = 'none';
-        this.context.dialog.resizeButton.style.display = 'none';
-        this.plugins[this.context.dialog._resize_plugin].init.call(this);
-    },
-
-    onClick_resizeButton: function (e) {
-        e.stopPropagation();
-
-        const command = e.target.getAttribute('data-command') || e.target.parentNode.getAttribute('data-command');
-        if (!command) return;
-
-        e.preventDefault();
-
-        if (/^\d+$/.test(command)) {
-            this.plugins[this.context.dialog._resize_plugin].setSize.call(this, command + '%', '');
-        }
-        else if (/update/.test(command)) {
-            this.plugins[this.context.dialog._resize_plugin].openModify.call(this);
-        }
-        else if (/delete/.test(command)) {
-            this.plugins[this.context.dialog._resize_plugin].destroy.call(this);
-        }
-
-        this.submenuOff();
-        this.focus();
-    },
-
-    onMouseDown_resize_handle: function (e) {
-        const direction = this.context.dialog._resize_direction = e.target.classList[0];
-        e.stopPropagation();
-        e.preventDefault();
-
-        this.context.dialog.resizeDot.style.display = 'none';
-        this.context.dialog._resizeClientX = e.clientX;
-        this.context.dialog._resizeClientY = e.clientY;
-        this.context.element.resizeBackground.style.display = 'block';
-        this.context.dialog.resizeButton.style.display = 'none';
-        this.context.dialog.resizeDiv.style.float = /l/.test(direction) ? 'right' : /r/.test(direction) ? 'left' : 'none';
-
-        function closureFunc() {
-            this.plugins.dialog.cancel_controller_resize.call(this);
-            document.removeEventListener('mousemove', resizing_element_bind);
-            document.removeEventListener('mouseup', closureFunc_bind);
-        }
-
-        const resizing_element_bind = this.plugins.dialog.resizing_element.bind(this);
-        const closureFunc_bind = closureFunc.bind(this);
-
-        document.addEventListener('mousemove', resizing_element_bind);
-        document.addEventListener('mouseup', closureFunc_bind);
-    },
-
-    resizing_element: function (e) {
-        const direction = this.context.dialog._resize_direction;
-        const clientX = e.clientX;
-        const clientY = e.clientY;
-        const plugin = this.context[this.context.dialog._resize_plugin];
-
-        let resultW = plugin._element_w;
-        let resultH = plugin._element_h;
-
-        const w = plugin._element_w + (/r/.test(direction) ? clientX - this.context.dialog._resizeClientX : this.context.dialog._resizeClientX - clientX);
-        const h = plugin._element_h + (/b/.test(direction) ? clientY - this.context.dialog._resizeClientY : this.context.dialog._resizeClientY - clientY);
-        const wh = ((plugin._element_h / plugin._element_w) * w);
-
-        if (/t/.test(direction)) this.context.dialog.resizeDiv.style.top = (plugin._element_h - (/h/.test(direction) ? h : wh)) + 'px';
-        if (/l/.test(direction)) this.context.dialog.resizeDiv.style.left = (plugin._element_w - w) + 'px';
-
-        if (/r|l/.test(direction)) {
-            this.context.dialog.resizeDiv.style.width = w + 'px';
-            resultW =w;
-        }
-
-        if (/^(?:t|b)[^h]$/.test(direction)) {
-            this.context.dialog.resizeDiv.style.height = wh + 'px';
-            resultH = wh;
-        }
-        else if (/^(?:t|b)h$/.test(direction)) {
-            this.context.dialog.resizeDiv.style.height = h + 'px';
-            resultH = h;
-        }
-
-        this.context.dialog._resize_w = resultW;
-        this.context.dialog._resize_h = resultH;
-        this.util.changeTxt(this.context.dialog.resizeDisplay, Math.round(resultW) + ' x ' + Math.round(resultH));
     }
 };

Fixed alerts

Deprecated

Maintenance

The maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2564366

increased by0.08%

Number of package files

77

increased by1.32%

Lines of code

35961

increased by0.08%

Number of medium maintenance alerts

0

decreased by-100%

Worsened metrics

Number of lines in readme file

300

decreased by-0.33%

No dependency changes