* refactor kindeditor: finish task #014, task #013, task #012.

src/js/kindeditor/plugins/paste-image.js

+/* ========================================================================
+ * ZUI: Kindeditor plugin - paste-image
+ * http://zui.sexy
+ * ========================================================================
+ * Copyright (c) 2019-2019 cnezsoft.com; Licensed MIT
+ * ======================================================================== */
+
+KindEditor.plugin('pasteimage', function(K) {
+    var self = this;
+    var allLangs = {
+        zh_cn: {
+            notSupportMsg: '您的浏览器不支持粘贴图片！',
+            placeholder: '可以在编辑器直接贴图。',
+            failMsg: '贴图失败，请稍后重试。',
+            uploadingHint: '正在上传图片，请稍后...',
+        },
+        zh_tw: {
+            notSupportMsg: '您的瀏覽器不支持粘貼圖片！',
+            placeholder: '可以在編輯器直接貼圖。',
+            failMsg: '貼圖失敗，請稍後重試。',
+            uploadingHint: '正在上傳圖片，請稍後...',
+        },
+        en: {
+            notSupportMsg: 'Image is not allowed to paste in your browser!',
+            placeholder: 'Paste images here.',
+            failMsg: 'Pasting image failed. Try again later.',
+            uploadingHint: 'Uploading...',
+        }
+    };
+    var lang = $.extend({}, allLangs[($.clientLang || $.zui.clientLang)()]);
+    self.afterCreate(function() {
+        var edit    = self.edit;
+        var doc     = edit.doc;
+        var uuid    = self.uuid;
+        var options = self.options.pasteImage;
+        if (!options) {
+            return;
+        }
+        if (typeof options === 'string') {
+            options = {url: options};
+        }
+        $.extend({
+            placeholder: placeholder
+        }, options);
+        if(!K.WEBKIT && !K.GECKO)
+        {
+            $(doc.body).on('keyup.ke' + uuid, function(ev)
+            {
+                if(ev.keyCode == 86 && ev.ctrlKey) alert(lang.notSupportMsg);
+            });
+        }
+
+        if(self.setPlaceholder)
+        {
+            var placeholder = options.placeholder;
+            if (placeholder === true) placeholder = lang.placeholder;
+            if (placeholder) {
+                var oldPlaceholder = self.getPlaceholder();
+                if (!oldPlaceholder) oldPlaceholder = placeholder;
+                else if (oldPlaceholder.indexOf(placeholder) < 0) placeholder = oldPlaceholder + '\n' + placeholder;
+            }
+        }
+
+        var pasteBegin = function() {
+            // if ($.enableForm) {
+            //     $.enableForm(false, 0, 1);
+            //     $('body').one('click.ke' + uuid, function(){$.enableForm(true);});
+            // }
+            if (options.beforePaste) {
+                options.beforePaste();
+            }
+            var imageLoadingEle = '<div class="image-loading-ele small" style="padding: 5px; background: #FFF3E0; width: 300px; border-radius: 2px; border: 1px solid #FF9800; color: #ff5d5d; margin: 10px 0;"><i class="icon icon-spin icon-spinner-indicator muted"></i> ' + lang.uploadingHint + '</div>';
+            edit.cmd.inserthtml(imageLoadingEle);
+            self.readonly(true);
+        };
+
+        var pasteEnd = function(error) {
+            if(error) {
+                if (options.onError) {
+                    options.onError(error);
+                } else {
+                    if(error === true) error = lang.failMsg;
+                    if ($.zui && $.zui.messager) {
+                        $.zui.messager.danger(error, {placement: 'center'});
+                    }
+                }
+            }
+            // if ($.enableForm) {
+            //     $.enableForm(true, 0, 1);
+            // }
+            // $('body').off('.ke' + uuid);
+            if (options.afterPaste) {
+                options.afterPaste();
+            }
+            $(doc.body).find('.image-loading-ele').remove();
+            self.readonly(false);
+        };
+
+        var pasteUrl = options.postUrl;
+        $(doc.body).on('paste', function(ev) {
+            if (K.WEBKIT) {
+                /* Paste in chrome.*/
+                /* Code reference from http://www.foliotek.com/devblog/copy-images-from-clipboard-in-javascript/. */
+                var original = ev.originalEvent;
+                var clipboardItems = original.clipboardData && original.clipboardData.items;
+                var clipboardItem = null;
+                if(clipboardItems) {
+                    var IMAGE_MIME_REGEX = /^image\/(p?jpeg|gif|png)$/i;
+                    for (var i = 0; i < clipboardItems.length; i++)
+                    {
+                        if (IMAGE_MIME_REGEX.test(clipboardItems[i].type))
+                        {
+                            clipboardItem = clipboardItems[i];
+                            break;
+                        }
+                    }
+                }
+                var file = clipboardItem && clipboardItem.getAsFile();
+                if (!file) return;
+                original.preventDefault();
+                pasteBegin();
+
+                var reader = new FileReader();
+                reader.onload = function(evt) {
+                    var result = evt.target.result;
+                    // var arr    = result.split(",");
+                    // var data   = arr[1]; // raw base64
+                    // var contentType = arr[0].split(";")[0].split(":")[1];
+
+                    html = '<img src="' + result + '" alt="" />';
+                    $.post(pasteUrl, {editor: html}, function(data)
+                    {
+                        if (data) {
+                            edit.cmd.inserthtml(data);
+                        } else {
+                            edit.cmd.inserthtml(html);
+                        }
+                        pasteEnd();
+                    }).error(function()
+                    {
+                        pasteEnd(true);
+                    });
+                };
+                reader.readAsDataURL(file);
+            } else {
+                /* Paste in firefox and other browsers. */
+                setTimeout(function() {
+                    var html = K(doc.body).html();
+                    if(html.search(/<img src="data:.+;base64,/) > -1) {
+                        pasteBegin();
+                        $.post(pasteUrl, {editor: html}, function(data) {
+                            if(data.indexOf('<img') === 0) data = '<p>' + data + '</p>';
+                            edit.html(data);
+                            pasteEnd();
+                        }).error(function()
+                        {
+                            pasteEnd(true);
+                        });
+                    }
+                }, 80);
+            }
+        });
+
+        self.beforeRemove(function() {
+            $(doc.body).off('.ke' + uuid);
+        });
+    });
+});
\ No newline at end of file

src/js/kindeditor/plugins/placeholder.js

+/* ========================================================================
+ * ZUI: Kindeditor plugin - placeholder
+ * http://zui.sexy
+ * ========================================================================
+ * Copyright (c) 2019-2019 cnezsoft.com; Licensed MIT
+ * ======================================================================== */
+
+KindEditor.EditorClass.prototype.setPlaceholder = function(placeholder, asHtml) {
+    var self = this;
+    var options = self.options;
+    var edit = self.edit;
+    var $doc = $(edit.doc);
+    var $placeholder = $doc.find('.kindeditor-ph');
+    if (!$placeholder.length) {
+        $placeholder = $('<div class="kindeditor-ph" style="width:100%; color:#888; padding: 8px; background:none; position:absolute;z-index:10;top:0;border:0;overflow:auto;resize:none; pointer-events:none; white-space: pre-wrap;"></div>');
+        if (options.placeholderStyle) {
+            $placeholder.css(options.placeholderStyle);
+        }
+        $doc.find('body').after($placeholder);
+    }
+    if ($.trim(self.html()) !== '') {
+        $placeholder.hide();
+    }
+    $placeholder[asHtml ? 'html' : 'text'](placeholder);
+};
+
+KindEditor.EditorClass.prototype.getPlaceholder = function(asHtml) {
+    return $(this.edit.doc).find('.kindeditor-ph')[asHtml ? 'html' : 'text']();
+};
+
+KindEditor.plugin('placeholder', function(K) {
+    var self = this;
+
+    self.afterBlur(function() {
+        if ($.trim(self.html()) === '') {
+            $(self.edit.doc).find('.kindeditor-ph').show();
+        }
+    });
+
+    self.afterFocus(function() {
+        $(self.edit.doc).find('.kindeditor-ph').hide();
+    });
+
+    self.afterCreate(function() {
+        var options = self.options;
+        if (options.placeholderHtml) {
+            self.setPlaceholder(options.placeholderHtml, true);
+        } else if (options.placeholder) {
+            self.setPlaceholder(options.placeholder);
+        }
+        console.log('afterSetHtml');
+    });
+});
\ No newline at end of file

src/js/kindeditor/plugins/zui.js

+/* ========================================================================
+ * ZUI: Kindeditor plugin - zui
+ * http://zui.sexy
+ * ========================================================================
+ * Copyright (c) 2019-2019 cnezsoft.com; Licensed MIT
+ * ======================================================================== */
+
+ $.each(['afterBlur', 'afterFocus', 'afterChange', 'afterTab'], function(_index, name) {
+    KindEditor.EditorClass.prototype[name] = function(fn) {
+        return this.handler(name, fn);
+    };
+});
+
+KindEditor.plugin('zui', function(K) {
+    var self = this;
+    var options = self.options;
+    self.uuid = $.zui.uuid();
+
+    var spellcheck = options.spellcheck;
+    if (spellcheck !== undefined) {
+        self.edit.doc.documentElement.setAttribute('spellcheck', spellcheck);
+    }
+
+    self.afterBlur(function() {
+        if (options.syncAfterBlur) {
+            self.sync();
+        }
+        self.container.removeClass('focus');
+    });
+
+    self.afterFocus(function() {
+        self.container.addClass('focus');
+    });
+
+    self.afterChange(function() {
+        self.edit.srcElement.change().hide();
+    });
+
+    self.afterCreate(function() {
+        $(self.edit.srcElement[0]).data('keditor', self);
+    });
+
+    var nextFormControl = 'input:not([type="hidden"]), textarea:not(.ke-edit-textarea), button[type="submit"], select';
+    self.afterTab(function() {
+        var $editor = $(self.edit.srcElement[0]);
+        var $next = $editor.next(nextFormControl);
+        if(!$next.length) $next = $editor.parent().next().find(nextFormControl);
+        if(!$next.length) $next = $editor.parent().parent().next().find(nextFormControl);
+        $next = $next.first();
+        var keditor = $next.data('keditor');
+        if(keditor) keditor.focus(); else $next.focus();
+    });
+});
\ No newline at end of file