Commit d556be44 authored by Van's avatar Van

add file upload function

养宝宝不容易啊,终于抽出时间打🐎
parent b3314020
......@@ -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:
......
......@@ -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
......
......@@ -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"/>
......
......@@ -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>
......
......@@ -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",
......
/*******************************************************************************
* 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);
......
......@@ -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>
......
......@@ -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', '');
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment