add file upload function

养宝宝不容易啊，终于抽出时间打🐎了

war/src/main/resources/lang_en_US.properties

@@ -16,12 +16,13 @@
 
 #
 # Description: Solo language configurations(en_US).
-# Version: 2.4.2.3, Sep 12, 2015
+# Version: 2.5.2.3, Sep 16, 2015
 # Author: Liang Ding
 # Author: Liyuan Li
 # Author: Dongxu Wang
 #
 
+uploadFileLabel=Upload()\uff08Please add the QiNiu link to the reference\uff09
 accessKey1Label=Access Key: 
 secretKey1Label=Secret Key: 
 domain1Label=\u57df\u540d: 

war/src/main/resources/lang_zh_CN.properties

@@ -16,12 +16,13 @@
 
 #
 # Description: Solo default language configurations(zh_CN).
-# Version: 2.4.4.11, Sep 12, 2015
+# Version: 2.5.4.11, Sep 16, 2015
 # Author: Liang Ding
 # Author: Liyuan Li
 # Author: Dongxu Wang
 #
 
+uploadFileLabel=\u6587\u4ef6\u4e0a\u4f20\uff08\u8bf7\u5c06\u751f\u6210\u7684\u4e03\u725b\u94fe\u63a5\u6dfb\u52a0\u5230\u5f15\u7528\u5904\uff09
 accessKey1Label=Access Key\uff1a
 secretKey1Label=Secret Key\uff1a
 domain1Label=\u57df\u540d\uff1a

war/src/main/webapp/admin-article.ftl

@@ -10,6 +10,12 @@
         <textarea id="articleContent" name="articleContent"
                   style="height: 500px;width:100%;"></textarea>
     </div>
+    <div>
+        <label>${uploadFileLabel}</label>
+        <form id="articleUpload" method="POST" enctype="multipart/form-data">
+            <input type="file" name="file" multiple=""/>
+        </form>
+    </div>
     <div>
         <label>${tags1WithTips1Label}</label>
         <input id="tag" type="text"/>

war/src/main/webapp/admin-index.ftl

@@ -130,6 +130,9 @@
             </div>
         </div>
         <script src="${staticServePath}/js/lib/jquery/jquery.min.js"></script>
+        <script src="${staticServePath}/js/lib/jquery/file-upload-9.10.1/vendor/jquery.ui.widget.js"></script>
+        <script src="${staticServePath}/js/lib/jquery/file-upload-9.10.1/jquery.iframe-transport.js"></script>
+        <script src="${staticServePath}/js/lib/jquery/file-upload-9.10.1/jquery.fileupload.js"></script>
         <script src="${staticServePath}/js/lib/jquery/jquery.bowknot.min.js?${staticResourceVersion}"></script>
         <script src="${servePath}/js/lib/tiny_mce/tiny_mce.js"></script>
         <script src="${staticServePath}/js/lib/KindEditor/kindeditor-min.js"></script>

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

@@ -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.1.3.3, May 30, 2015
+ * @version 1.2.3.3, Sep 16, 2015
  */
 admin.article = {
     currentEditorType: '',
@@ -439,6 +439,39 @@ admin.article = {
             }
         });
 
+        // upload
+        var qiniu = window.qiniu;
+
+        $('#articleUpload').fileupload({
+             multipart: true,
+            url: "http://upload.qiniu.com/",
+            formData: function (form) {
+                var data = form.serializeArray();
+                data.push({name: 'token', value: qiniu.qiniuUploadToken});
+                return data;
+            }, 
+            done: function (e, data) {
+                var qiniuKey = data.result.key;
+                if (!qiniuKey) {
+                    alert("Upload error");
+                    return;
+                }
+                
+                var t = new Date().getTime();
+                    $('#articleUpload').after('<div><a target="_blank" href="http://' + qiniu.qiniuDomain + qiniuKey + '?' + t
+                            + '">[' + data.files[0].name + ']</a> http://' 
+                            + qiniu.qiniuDomain + qiniuKey + '?' + t + '</div>');
+            },
+            fail: function (e, data) {
+                alert("Upload error: " + data.errorThrown);
+            }
+        }).on('fileuploadprocessalways', function (e, data) {
+            var currentFile = data.files[data.index];
+            if (data.files.error && currentFile.error) {
+                alert(currentFile.error);
+            }
+        });
+        
         // editor
         admin.editors.articleEditor = new Editor({
             id: "articleContent",

war/src/main/webapp/js/lib/KindEditor/plugins/image/image.js

 /*******************************************************************************
- * KindEditor - WYSIWYG HTML Editor for Internet
- * Copyright (C) 2006-2011 kindsoft.net
- *
- * @author Roddy <luolonghao@gmail.com>
- * @site http://www.kindsoft.net/
- * @licence http://www.kindsoft.net/license.php
- *******************************************************************************/
+* KindEditor - WYSIWYG HTML Editor for Internet
+* Copyright (C) 2006-2011 kindsoft.net
+*
+* @author Roddy <luolonghao@gmail.com>
+* @site http://www.kindsoft.net/
+* @licence http://www.kindsoft.net/license.php
+*******************************************************************************/
 
-KindEditor.plugin('image', function (K) {
+KindEditor.plugin('image', function(K) {
 	var self = this, name = 'image',
 		allowImageUpload = K.undef(self.allowImageUpload, true),
-            allowImageRemote = K.undef(self.allowImageRemote, true),
 		formatUploadUrl = K.undef(self.formatUploadUrl, true),
 		allowFileManager = K.undef(self.allowFileManager, false),
 		uploadJson = K.undef(self.uploadJson, self.basePath + 'php/upload_json.php'),
@@ -21,7 +20,7 @@ KindEditor.plugin('image', function (K) {
 		fillDescAfterUploadImage = K.undef(self.fillDescAfterUploadImage, false),
 		lang = self.lang(name + '.');
 
-    self.plugin.imageDialog = function (options) {
+	self.plugin.imageDialog = function(options) {
 		var imageUrl = options.imageUrl,
 			imageWidth = K.undef(options.imageWidth, ''),
 			imageHeight = K.undef(options.imageHeight, ''),
@@ -33,7 +32,7 @@ KindEditor.plugin('image', function (K) {
 			clickFn = options.clickFn;
 		var target = 'kindeditor_upload_iframe_' + new Date().getTime();
 		var hiddenElements = [];
-        for (var k in extraParams) {
+		for(var k in extraParams){
 			hiddenElements.push('<input type="hidden" name="' + k + '" value="' + extraParams[k] + '" />');
 		}
 		var html = [
@@ -72,8 +71,8 @@ KindEditor.plugin('image', function (K) {
 			'</div>',
 			//remote image - end
 			//local upload - start
-            '<div class="tab2" style="display:none;">',
-            '<iframe name="' + target + '" style="display:none;"></iframe>',
+			'<div class="tab2">',
+			'<iframe name="' + target + '"></iframe>',
 			'<form class="ke-upload-area ke-form" method="post" enctype="multipart/form-data" target="' + target + '" action="' + K.addParam(uploadJson, 'dir=image') + '">',
 			//file
 			'<div class="ke-dialog-row">',
@@ -90,14 +89,14 @@ KindEditor.plugin('image', function (K) {
 		var dialogWidth = showLocal || allowFileManager ? 450 : 400,
 			dialogHeight = showLocal && showRemote ? 300 : 250;
 		var dialog = self.createDialog({
-            name: name,
-            width: dialogWidth,
-            height: dialogHeight,
-            title: self.lang(name),
-            body: html,
-            yesBtn: {
-                name: self.lang('yes'),
-                click: function (e) {
+			name : name,
+			width : dialogWidth,
+			height : dialogHeight,
+			title : self.lang(name),
+			body : html,
+			yesBtn : {
+				name : self.lang('yes'),
+				click : function(e) {
 					// Bugfix: http://code.google.com/p/kindeditor/issues/detail?id=319
 					if (dialog.isLoading) {
 						return;
@@ -119,7 +118,7 @@ KindEditor.plugin('image', function (K) {
 						height = heightBox.val(),
 						title = titleBox.val(),
 						align = '';
-                    alignBox.each(function () {
+					alignBox.each(function() {
 						if (this.checked) {
 							align = this.value;
 							return false;
@@ -143,7 +142,7 @@ KindEditor.plugin('image', function (K) {
 					clickFn.call(self, url, title, width, height, 0, align);
 				}
 			},
-            beforeRemove: function () {
+			beforeRemove : function() {
 				viewServerBtn.unbind();
 				widthBox.unbind();
 				heightBox.unbind();
@@ -164,17 +163,17 @@ KindEditor.plugin('image', function (K) {
 		var tabs;
 		if (showRemote && showLocal) {
 			tabs = K.tabs({
-                src: K('.tabs', div),
-                afterSelect: function (i) {}
+				src : K('.tabs', div),
+				afterSelect : function(i) {}
 			});
 			tabs.add({
-                title: lang.remoteImage,
-                panel: K('.tab1', div)
-            });
-            tabs.add({
-                title: lang.localImage,
-                panel: K('.tab2', div)
+				title : lang.remoteImage,
+				panel : K('.tab1', div)
 			});
+//			tabs.add({
+//				title : lang.localImage,
+//				panel : K('.tab2', div)
+//			});
 			tabs.select(tabIndex);
 		} else if (showRemote) {
 			K('.tab1', div).show();
@@ -183,12 +182,13 @@ KindEditor.plugin('image', function (K) {
 		}
 
 		var uploadbutton = K.uploadbutton({
-            button: K('.ke-upload-button', div)[0],
-            fieldName: filePostName,
-            form: K('.ke-form', div),
-            target: target,
+			button : K('.ke-upload-button', div)[0],
+			fieldName : filePostName,
+			url : K.addParam(uploadJson, 'dir=image'),
+			form : K('.ke-form', div),
+			target : target,
 			width: 60,
-            afterUpload: function (data) {
+			afterUpload : function(data) {
 				dialog.hideLoading();
 				if (data.error === 0) {
 					var url = data.url;
@@ -209,21 +209,21 @@ KindEditor.plugin('image', function (K) {
 					alert(data.message);
 				}
 			},
-            afterError: function (html) {
+			afterError : function(html) {
 				dialog.hideLoading();
 				self.errorDialog(html);
 			}
 		});
-        uploadbutton.fileBox.change(function (e) {
+		uploadbutton.fileBox.change(function(e) {
 			localUrlBox.val(uploadbutton.fileBox.val());
 		});
 		if (allowFileManager) {
-            viewServerBtn.click(function (e) {
-                self.loadPlugin('filemanager', function () {
+			viewServerBtn.click(function(e) {
+				self.loadPlugin('filemanager', function() {
 					self.plugin.filemanagerDialog({
-                        viewType: 'VIEW',
-                        dirName: 'image',
-                        clickFn: function (url, title) {
+						viewType : 'VIEW',
+						dirName : 'image',
+						clickFn : function(url, title) {
 							if (self.dialogs.length > 1) {
 								K('[name="url"]', div).val(url);
 								if (self.afterSelectFile) {
@@ -245,25 +245,25 @@ KindEditor.plugin('image', function (K) {
 			originalWidth = width;
 			originalHeight = height;
 		}
-        refreshBtn.click(function (e) {
+		refreshBtn.click(function(e) {
 			var tempImg = K('<img src="' + urlBox.val() + '" />', document).css({
-                position: 'absolute',
-                visibility: 'hidden',
-                top: 0,
-                left: '-1000px'
+				position : 'absolute',
+				visibility : 'hidden',
+				top : 0,
+				left : '-1000px'
 			});
-            tempImg.bind('load', function () {
+			tempImg.bind('load', function() {
 				setSize(tempImg.width(), tempImg.height());
 				tempImg.remove();
 			});
 			K(document.body).append(tempImg);
 		});
-        widthBox.change(function (e) {
+		widthBox.change(function(e) {
 			if (originalWidth > 0) {
 				heightBox.val(Math.round(originalHeight / originalWidth * parseInt(this.value, 10)));
 			}
 		});
-        heightBox.change(function (e) {
+		heightBox.change(function(e) {
 			if (originalHeight > 0) {
 				widthBox.val(Math.round(originalWidth / originalHeight * parseInt(this.value, 10)));
 			}
@@ -271,57 +271,45 @@ KindEditor.plugin('image', function (K) {
 		urlBox.val(options.imageUrl);
 		setSize(options.imageWidth, options.imageHeight);
 		titleBox.val(options.imageTitle);
-        alignBox.each(function () {
+		alignBox.each(function() {
 			if (this.value === options.imageAlign) {
 				this.checked = true;
 				return false;
 			}
 		});
-        if (showRemote && tabIndex === 0) {
+		if (tabIndex === 0) {
 			urlBox[0].focus();
 			urlBox[0].select();
 		}
 		return dialog;
 	};
 	self.plugin.image = {
-        edit: function () {
+		edit : function() {
 			var img = self.plugin.getSelectedImage();
 			self.plugin.imageDialog({
-                imageUrl: img ? img.attr('data-ke-src') : 'http://',
-                imageWidth: img ? img.width() : '',
-                imageHeight: img ? img.height() : '',
-                imageTitle: img ? img.attr('title') : '',
-                imageAlign: img ? img.attr('align') : '',
-                showRemote: allowImageRemote,
-                showLocal: allowImageUpload,
+				imageUrl : img ? img.attr('data-ke-src') : 'http://',
+				imageWidth : img ? img.width() : '',
+				imageHeight : img ? img.height() : '',
+				imageTitle : img ? img.attr('title') : '',
+				imageAlign : img ? img.attr('align') : '',
+				showRemote : true,
+				showLocal : allowImageUpload,
 				tabIndex: img ? 0 : imageTabIndex,
-                clickFn: function (url, title, width, height, border, align) {
-                    if (img) {
-                        img.attr('src', url);
-                        img.attr('data-ke-src', url);
-                        img.attr('width', width);
-                        img.attr('height', height);
-                        img.attr('title', title);
-                        img.attr('align', align);
-                        img.attr('alt', title);
-                    } else {
+				clickFn : function(url, title, width, height, border, align) {
 					self.exec('insertimage', url, title, width, height, border, align);
-                    }
 					// Bugfix: [Firefox] 上传图片后，总是出现正在加载的样式，需要延迟执行hideDialog
-                    setTimeout(function () {
+					setTimeout(function() {
 						self.hideDialog().focus();
 					}, 0);
 				}
 			});
 		},
-        'delete': function () {
+		'delete' : function() {
 			var target = self.plugin.getSelectedImage();
 			if (target.parent().name == 'a') {
 				target = target.parent();
 			}
 			target.remove();
-            // [IE] 删除图片后立即点击图片按钮出错
-            self.addBookmark();
 		}
 	};
 	self.clickToolbar(name, self.plugin.image.edit);

war/src/main/webapp/js/lib/tiny_mce/plugins/advimage/image.htm

@@ -2,11 +2,6 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
         <title>{#advimage_dlg.dialog_title}</title>
-        <script type="text/javascript" src="../../../jquery/jquery.min.js"></script>
-        <script type="text/javascript" src="../../../jquery/file-upload-9.10.1/vendor/jquery.ui.widget.js"></script>
-        <script type="text/javascript" src="../../../jquery/file-upload-9.10.1/jquery.iframe-transport.js"></script>
-        <script type="text/javascript" src="../../../jquery/file-upload-9.10.1/jquery.fileupload.js"></script>
-        <script type="text/javascript" src="../../../jquery/file-upload-9.10.1/jquery.fileupload-process.js"></script>
         <script type="text/javascript" src="../../tiny_mce_popup.js"></script>
         <script type="text/javascript" src="../../utils/mctabs.js"></script>
         <script type="text/javascript" src="../../utils/form_utils.js"></script>
@@ -35,7 +30,7 @@
                         <table role="presentation" class="properties">
                             <tr>
                                 <td class="column1"><label id="srclabel" for="src">{#advimage_dlg.src}</label></td>
-                                <td>
+                                <td colspan="2">
                                     <table role="presentation" border="0" cellspacing="0" cellpadding="0">
                                         <tr> 
                                             <td><input name="src" type="text" id="src" value="" class="mceFocus" onchange="ImageDialog.showPreviewImage(this.value);" aria-required="true" /></td> 
@@ -43,13 +38,6 @@
                                         </tr>
                                     </table>
                                 </td>
-                                <td>
-                                    <label>
-                                        Upload
-                                        <input type="file" style="width: 1px;opacity: .001;" id="imageUpload"
-                                               accept="image/gif, image/jpeg, image/png" />
-                                    </label>
-                                </td> 
                             </tr>
                             <tr>
                                 <td><label for="src_list">{#advimage_dlg.image_list}</label></td>

war/src/main/webapp/js/lib/tiny_mce/plugins/advimage/js/image.js

@@ -6,8 +6,6 @@ var ImageDialog = {
 
         if (url = tinyMCEPopup.getParam("external_image_list_url"))
             document.write('<script language="javascript" type="text/javascript" src="' + tinyMCEPopup.editor.documentBaseURI.toAbsolute(url) + '"></script>');
-
-        ImageDialog.uploadImage();
     },
     init: function (ed) {
         var f = document.forms[0], nl = f.elements, ed = tinyMCEPopup.editor, dom = ed.dom, n = ed.selection.getNode(), fl = tinyMCEPopup.getParam('external_image_list', 'tinyMCEImageList');
@@ -476,49 +474,6 @@ var ImageDialog = {
     },
     changeMouseMove: function () {
     },
-    uploadImage: function () {
-        $(function () {
-            var qiniu = window.parent.qiniu;
-
-            console.log(qiniu);
-
-            $('#imageUpload').fileupload({
-                multipart: true,
-                pasteZone: null,
-                dropZone: null,
-                url: "http://upload.qiniu.com/",
-                formData: function (form) {
-                    var data = form.serializeArray();
-
-                    data.push({name: 'token', value: qiniu.qiniuUploadToken});
-
-                    return data;
-                },
-                submit: function (e, data) {
-                },
-                done: function (e, data) {
-                    // console.log(data.result)
-                    var qiniuKey = data.result.key;
-                    if (!qiniuKey) {
-                        alert("Upload error");
-                        return;
-                    }
-
-                    var t = new Date().getTime();
-                    $('#src').val(qiniu.qiniuDomain + qiniuKey + '?' + t);
-                    ImageDialog.showPreviewImage(qiniu.qiniuDomain + qiniuKey + '?' + t);
-                },
-                fail: function (e, data) {
-                    alert("Upload error: " + data.errorThrown);
-                }
-            }).on('fileuploadprocessalways', function (e, data) {
-                var currentFile = data.files[data.index];
-                if (data.files.error && currentFile.error) {
-                    alert(currentFile.error);
-                }
-            });
-        });
-    },
     showPreviewImage: function (u, st) {
         if (!u) {
             tinyMCEPopup.dom.setHTML('prev', '');