✨ fixed #12219

gulpfile.js

 /*
  * Symphony - A modern community (forum/SNS/blog) platform written in Java.
- * Copyright (C) 2012-2016,  b3log.org & hacpai.com
+ * Copyright (C) 2012-2017,  b3log.org & hacpai.com
  *
  * This program is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License as published by
@@ -20,7 +20,7 @@
  * @file frontend tool.
  * 
  * @author <a href="mailto:liliyuan@fangstar.net">Liyuan Li</a>
- * @version 1.3.2.0, Nov 9, 2016 
+ * @version 1.4.2.0, Jan 21, 20167
  */
 
 'use strict';
@@ -32,10 +32,10 @@ var cleanCSS = require('gulp-clean-css');
 
 gulp.task('default', function () {
     // min css
-    gulp.src('./src/main/webapp/js/lib/editor/codemirror.css')
+    gulp.src('./src/main/webapp/js/lib/CodeMirrorEditor/codemirror.css')
             .pipe(cleanCSS())
             .pipe(concat('codemirror.min.css'))
-            .pipe(gulp.dest('./src/main/webapp/js/lib/editor/'));
+            .pipe(gulp.dest('./src/main/webapp/js/lib/CodeMirrorEditor/'));
     
     // concat js
     var jsJqueryUpload = ['./src/main/webapp/js/lib/jquery/jquery.min.js',
@@ -45,7 +45,7 @@ gulp.task('default', function () {
         './src/main/webapp/js/lib/jquery/jquery.bowknot.min.js',
         // codemirror
         './src/main/webapp/js/lib/CodeMirrorEditor/codemirror.js',
-        './src/main/webapp/js/lib/editor/placeholder.js',
+        './src/main/webapp/js/lib/CodeMirrorEditor/placeholder.js',
         './src/main/webapp/js/overwrite/codemirror/addon/hint/show-hint.js',
         './src/main/webapp/js/lib/CodeMirrorEditor/editor.js',
         './src/main/webapp/js/lib/to-markdown.js',

src/main/webapp/js/admin/article.js

 /*
- * Copyright (c) 2010-2016, b3log.org & hacpai.com
+ * Copyright (c) 2010-2017, b3log.org & hacpai.com
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -18,7 +18,7 @@
  *
  * @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
  * @author <a href="http://88250.b3log.org">Liang Ding</a>
- * @version 1.3.5.7, Nov 16, 2016
+ * @version 1.4.5.7, Jan 21, 2017
  */
 admin.article = {
     currentEditorType: '',
@@ -34,6 +34,52 @@ admin.article = {
     autoSaveDraftTimer: "",
     // 自动保存间隔
     AUTOSAVETIME: 1000 * 60,
+    /**
+     * 初始化上传组建
+     */
+    initUploadFile: function (id) {
+        var filename = "";
+        $('#' + id).fileupload({
+            multipart: true,
+            url: "https://up.qbox.me",
+            add: function (e, data) {
+                filename = data.files[0].name;
+
+                data.submit();
+
+                $('#' + id + ' span').text('uploading...');
+            },
+            formData: function (form) {
+                var data = form.serializeArray();
+                var ext = filename.substring(filename.lastIndexOf(".") + 1);
+
+                data.push({name: 'key', value: getUUID() + "." + ext});
+                data.push({name: 'token', value: qiniu.qiniuUploadToken});
+
+                return data;
+            },
+            done: function (e, data) {
+                $('#' + id + ' span').text('');
+                var qiniuKey = data.result.key;
+                if (!qiniuKey) {
+                    alert("Upload error, please check Qiniu configurations");
+
+                    return;
+                }
+
+                $('#' + id).after('<div>![' + data.files[0].name + '](http://'
+                        + qiniu.qiniuDomain + qiniuKey + ')</div>');
+            },
+            fail: function (e, data) {
+                $('#' + id + ' span').text("Upload error, please check Qiniu configurations [" + data.errorThrown + "]");
+            }
+        }).on('fileuploadprocessalways', function (e, data) {
+            var currentFile = data.files[data.index];
+            if (data.files.error && currentFile.error) {
+                alert(currentFile.error);
+            }
+        });
+    },
     /**
      * @description 获取文章并把值塞入发布文章页面 
      * @param {String} id 文章 id
@@ -438,50 +484,7 @@ admin.article = {
             }
         });
 
-        // upload
-        var qiniu = window.qiniu;
-
-        var filename = "";
-        $('#articleUpload').fileupload({
-            multipart: true,
-            url: "https://up.qbox.me",
-            add: function (e, data) {
-                filename = data.files[0].name;
-
-                data.submit();
-
-                $('#articleUpload span').text('uploading...');
-            },
-            formData: function (form) {
-                var data = form.serializeArray();
-                var ext = filename.substring(filename.lastIndexOf(".") + 1);
-
-                data.push({name: 'key', value: getUUID() + "." + ext});
-                data.push({name: 'token', value: qiniu.qiniuUploadToken});
-
-                return data;
-            },
-            done: function (e, data) {
-                $('#articleUpload span').text('');
-                var qiniuKey = data.result.key;
-                if (!qiniuKey) {
-                    alert("Upload error, please check Qiniu configurations");
-
-                    return;
-                }
-
-                $('#articleUpload').after('<div>![' + data.files[0].name + '](http://'
-                        + qiniu.qiniuDomain + qiniuKey + ')</div>');
-            },
-            fail: function (e, data) {
-                $('#articleUpload span').text("Upload error, please check Qiniu configurations [" + data.errorThrown + "]");
-            }
-        }).on('fileuploadprocessalways', function (e, data) {
-            var currentFile = data.files[data.index];
-            if (data.files.error && currentFile.error) {
-                alert(currentFile.error);
-            }
-        });
+        this.initUploadFile('articleUpload');
 
         // editor
         admin.editors.articleEditor = new SoloEditor({

src/main/webapp/js/admin/editorCodeMirror.js

 /*
- * Copyright (c) 2010-2016, b3log.org & hacpai.com
+ * Copyright (c) 2010-2017, b3log.org & hacpai.com
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -18,7 +18,7 @@
  *
  * @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
  * @author <a href="http://88250.b3log.org">Liang Ding</a>
- * @version 1.3.1.4, Nov 8, 2016
+ * @version 1.4.1.4, Jan 21, 2017
  */
 
 Util.processClipBoard = function (text, cm) {
@@ -66,6 +66,100 @@ Util.processClipBoard = function (clipboardData, cm) {
     return $.trim(text);
 };
 
+Util.initUploadFile = function (obj) {
+        var isImg = false;
+        $('#' + obj.id).fileupload({
+            multipart: true,
+            pasteZone: obj.pasteZone,
+            dropZone: obj.pasteZone,
+            url: "https://up.qbox.me/",
+            paramName: "file",
+            add: function (e, data) {
+                if (data.files[0].name) {
+                    var processName = data.files[0].name.match(/[a-zA-Z0-9.]/g).join('');
+                    filename = getUUID() + '-' + processName;
+
+                    // 文件名称全为中文时，移除 ‘-’
+                    if (processName.split('.')[0] === '') {
+                        filename = getUUID() + processName;
+                    }
+                } else {
+                    filename = getUUID() + '.' + data.files[0].type.split("/")[1];
+                }
+
+
+                if (window.File && window.FileReader && window.FileList && window.Blob) {
+                    var reader = new FileReader();
+                    reader.readAsArrayBuffer(data.files[0]);
+                    reader.onload = function (evt) {
+                        var fileBuf = new Uint8Array(evt.target.result.slice(0, 11));
+                        isImg = data.files[0].type.indexOf('image') === 0 ? true : false;
+
+                        data.submit();
+                    }
+                } else {
+                    data.submit();
+                }
+            },
+            formData: function (form) {
+                var data = form.serializeArray();
+
+                data.push({name: 'key', value: "file/" + (new Date()).getFullYear() + "/"
+                            + ((new Date()).getMonth() + 1) + '/' + filename});
+
+                data.push({name: 'token', value: obj.qiniuUploadToken});
+
+                return data;
+            },
+            submit: function (e, data) {
+                if (obj.editor.replaceRange) {
+                    var cursor = obj.editor.getCursor();
+                    obj.editor.replaceRange(obj.uploadingLabel, cursor, cursor);
+                } else {
+                    $('#' + obj.id + ' input').prop('disabled', false);
+                }
+            },
+            done: function (e, data) {
+                var qiniuKey = data.result.key;
+                if (!qiniuKey) {
+                    alert("Upload error");
+
+                    return;
+                }
+
+                if (obj.editor.replaceRange) {
+                    var cursor = obj.editor.getCursor();
+
+                    if (isImg) {
+                        obj.editor.replaceRange('![' + filename + '](' + obj.qiniuDomain + '/' + qiniuKey + ') \n\n',
+                                CodeMirror.Pos(cursor.line, cursor.ch - obj.uploadingLabel.length), cursor);
+                    } else {
+                        obj.editor.replaceRange('[' + filename + '](' + obj.qiniuDomain + '/' + qiniuKey + ') \n\n',
+                                CodeMirror.Pos(cursor.line, cursor.ch - obj.uploadingLabel.length), cursor);
+                    }
+                } else {
+                    obj.editor.$it.val('![' + filename + '](' + obj.qiniuDomain + '/' + qiniuKey + ') \n\n');
+                    $('#' + obj.id + ' input').prop('disabled', false);
+                }
+            },
+            fail: function (e, data) {
+                alert("Upload error: " + data.errorThrown);
+                if (obj.editor.replaceRange) {
+                    var cursor = obj.editor.getCursor();
+                    obj.editor.replaceRange('',
+                            CodeMirror.Pos(cursor.line, cursor.ch - obj.uploadingLabel.length), cursor);
+                } else {
+                    $('#' + obj.id + ' input').prop('disabled', false);
+                }
+            }
+        }).on('fileuploadprocessalways', function (e, data) {
+            var currentFile = data.files[data.index];
+            if (data.files.error && currentFile.error) {
+                alert(currentFile.error);
+            }
+        });
+}
+
 admin.editors.CodeMirror = {
     /*
      * @description 初始化编辑器
@@ -136,6 +230,7 @@ admin.editors.CodeMirror = {
                 {name: 'ordered-list'},
                 '|',
                 {name: 'link'},
+                {name: 'image', html: '<form id="' + conf.id + 'fileUpload" method="POST" enctype="multipart/form-data"><label class="icon-upload"><input type="file"/></label></form>'},
                 '|',
                 {name: 'redo'},
                 {name: 'undo'},
@@ -149,6 +244,15 @@ admin.editors.CodeMirror = {
         });
         commentEditor.render();
 
+        Util.initUploadFile({
+            "id": conf.id + 'fileUpload',
+            "pasteZone": $('#' + conf.id).next().next(),
+            "qiniuUploadToken": qiniu.qiniuUploadToken,
+            "editor": commentEditor.codemirror,
+            "uploadingLabel": 'uploading...',
+            "qiniuDomain": '//' + qiniu.qiniuDomain
+        });
+
         this[conf.id] = commentEditor.codemirror;
 
         this[conf.id].on('changes', function (cm) {

src/main/webapp/js/lib/CodeMirrorEditor/codemirror.css

@@ -555,10 +555,11 @@ span.CodeMirror-selectedtext { background: none; }
     width: 21px;
     vertical-align: bottom;
     float: none;
-    overflow: hidden;
 }
+
 .editor-toolbar input {
     height: 1px;
+    margin-top: 8px;
 }
 .editor-toolbar form {
     display: inline;