avatar upload

This commit is contained in:
lealife
2015-10-12 19:44:43 +08:00
parent 71a2bcc7f0
commit 407b44382c
3 changed files with 125 additions and 6 deletions

View File

@ -139,6 +139,6 @@ define('attachment_upload', ['jquery.ui.widget', 'fileupload'], function(){
}
});
};
initUploader();
});

119
public/js/plugins/avatar.js Normal file
View File

@ -0,0 +1,119 @@
// upload attachment
// 依赖note
var urlPrefix = UrlPrefix;
define('avatar', ['jquery.ui.widget', 'fileupload'], function(){
// Helper function that formats the file sizes
function formatFileSize(bytes) {
if (typeof bytes !== 'number') {
return '';
}
if (bytes >= 1000000000) {
return (bytes / 1000000000).toFixed(2) + ' GB';
}
if (bytes >= 1000000) {
return (bytes / 1000000).toFixed(2) + ' MB';
}
return (bytes / 1000).toFixed(2) + ' KB';
}
function setDropStyle(dropzoneId, formId) {
// drag css
var dropZone = $(dropzoneId);
$(formId).bind('dragover', function (e) {
e.preventDefault();
var timeout = window.dropZoneTimeoutAttach;
if(timeout) {
clearTimeout(timeout);
}
var found = false,
node = e.target;
do {
if (node === dropZone[0]) {
found = true;
break;
}
node = node.parentNode;
} while (node != null);
if (found) {
dropZone.addClass('hover');
} else {
dropZone.removeClass('hover');
}
window.dropZoneTimeoutAttach = setTimeout(function () {
window.dropZoneTimeoutAttach = null;
dropZone.removeClass('in hover');
}, 100);
});
}
setDropStyle("#dropAvatar", "#uploadAvatar");
$('.dropzone .btn-choose-file').click(function() {
$(this).parent().find('input').click();
});
var $msg2 = $('#avatarUploadMsg');
$('#uploadAvatar').fileupload({
dataType: 'json',
dropZone: $('#dropAvatar'),
pasteZone: '',
add: function(e, data) {
var tpl = $('<div class="alert alert-info"><img class="loader" src="/tinymce/plugins/leaui_image/public/images/ajax-loader.gif"> <a class="close" data-dismiss="alert">×</a></div>');
// Append the file name and file size
tpl.append(data.files[0].name + ' <small>[<i>' + formatFileSize(data.files[0].size) + '</i>]</small>');
// Add the HTML to the UL element
$msg2.html(tpl);
data.context = $msg2;
// 检查文件大小
var size = data.files[0].size;
var maxFileSize = +GlobalConfigs["uploadAvatarSize"] || 100;
if(typeof size == 'number' && size > 1024 * 1024 * maxFileSize) {
tpl.find("img").remove();
tpl.removeClass("alert-info").addClass("alert-danger");
tpl.append(" Warning: File size is bigger than " + maxFileSize + "M");
setTimeout((function(tpl) {
return function() {
tpl.remove();
}
})(tpl), 3000);
return;
}
// Automatically upload the file once it is added to the queue
var jqXHR;
setTimeout(function() {
jqXHR = data.submit();
}, 10);
},
done: function(e, data) {
if (data.result.Ok == true) {
data.context.html("");
var re = data.result;
$("#avatar").attr("src", UrlPrefix + "/" + re.Id);
} else {
var re = data.result;
data.context.html("");
var tpl = $('<div class="alert alert-danger"><a class="close" data-dismiss="alert">×</a></div>');
tpl.append('<b>Error:</b> ' + data.files[0].name + ' <small>[<i>' + formatFileSize(data.files[0].size) + '</i>]</small> ' + data.result.Msg);
data.context.html(tpl);
setTimeout((function(tpl) {
return function() {
tpl.remove();
}
})(tpl), 3000);
}
},
fail: function(e, data) {
data.context.html("");
var tpl = $('<div class="alert alert-danger"><a class="close" data-dismiss="alert">×</a></div>');
tpl.append('<b>Error:</b> ' + data.files[0].name + ' <small>[<i>' + formatFileSize(data.files[0].size) + '</i>]</small> ' + data.errorThrown);
data.context.html(tpl);
setTimeout((function(tpl) {
return function() {
tpl.remove();
}
})(tpl), 3000);
}
});
});