Last active
August 29, 2015 14:27
-
-
Save fronteer-kr/a92b3a5d8abb1ccb05f3 to your computer and use it in GitHub Desktop.
jquery.uploadfile.js 에 frtrSecretMode 옵션 추가
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// 원본 - https://github.com/hayageek/jquery-upload-file/ | |
/*! | |
* jQuery Upload File Plugin | |
* version: 4.0.2 | |
* @requires jQuery v1.5 or later & form plugin | |
* Copyright (c) 2013 Ravishanker Kusuma | |
* http://hayageek.com/ | |
*/ | |
(function ($) { | |
if($.fn.ajaxForm == undefined) { | |
$.getScript(("https:" == document.location.protocol ? "https://" : "http://") + "malsup.github.io/jquery.form.js"); | |
} | |
var feature = {}; | |
feature.fileapi = $("<input type='file'/>").get(0).files !== undefined; | |
feature.formdata = window.FormData !== undefined; | |
$.fn.uploadFile = function (options) { | |
// This is the easiest way to have default options. | |
var s = $.extend({ | |
// These are the defaults. | |
url: "", | |
method: "POST", | |
enctype: "multipart/form-data", | |
returnType: null, | |
allowDuplicates: true, | |
duplicateStrict: false, | |
allowedTypes: "*", | |
//For list of acceptFiles | |
// http://stackoverflow.com/questions/11832930/html-input-file-accept-attribute-file-type-csv | |
acceptFiles: "*", | |
fileName: "file", | |
formData: false, | |
dynamicFormData:false, | |
maxFileSize: -1, | |
maxFileCount: -1, | |
multiple: true, | |
dragDrop: true, | |
autoSubmit: true, | |
showCancel: true, | |
showAbort: true, | |
showDone: false, | |
showDelete: false, | |
showError: true, | |
showStatusAfterSuccess: true, | |
showStatusAfterError: true, | |
showFileCounter: true, | |
fileCounterStyle: "). ", | |
showFileSize: true, | |
showProgress: false, | |
nestedForms: true, | |
showDownload: false, | |
onLoad: function (obj) {}, | |
onSelect: function (files) { | |
return true; | |
}, | |
onSubmit: function (files, xhr) {}, | |
onSuccess: function (files, response, xhr, pd) {}, | |
onError: function (files, status, message, pd) {}, | |
onCancel: function (files, pd) {}, | |
downloadCallback: false, | |
deleteCallback: false, | |
afterUploadAll: false, | |
serialize:true, | |
sequential:false, | |
sequentialCount:2, | |
customProgressBar: false, | |
abortButtonClass: "ajax-file-upload-abort", | |
cancelButtonClass: "ajax-file-upload-cancel", | |
dragDropContainerClass: "ajax-upload-dragdrop", | |
dragDropHoverClass: "state-hover", | |
errorClass: "ajax-file-upload-error", | |
uploadButtonClass: "ajax-file-upload", | |
dragDropStr: "<span><b>Drag & Drop Files</b></span>", | |
uploadStr:"파일업로드", | |
abortStr: "중지", | |
cancelStr: "취소", | |
deletelStr: "삭제", | |
doneStr: "완료", | |
multiDragErrorStr: "여러개 파일을 Drag & Drop 할 수 없습니다.", | |
extErrorStr: "파일 종류를 확인해 주십시오.<br/>허용된 파일 확장자: ", | |
duplicateErrorStr: "에러! 파일이 이미 존재합니다.", | |
sizeErrorStr: "파일 크기를 획인해 주십시오.<br/>허용된 최대 파일 크기: ", | |
uploadErrorStr: "파일 업로드 할 수 없습니다.", | |
maxFileCountErrorStr: " 파일이 너무 많습니다.<br/>허용된 최대 파일 갯수:", | |
downloadStr: "다운로드", | |
customErrorKeyStr: "jquery-upload-file-error", | |
showQueueDiv: false, | |
statusBarWidth: 400, | |
dragdropWidth: 400, | |
showPreview: false, | |
previewHeight: "auto", | |
previewWidth: "100%", | |
extraHTML:false, | |
fxSecretMode: false | |
}, options); | |
this.fileCounter = 1; | |
this.selectedFiles = 0; | |
var formGroup = "ajax-file-upload-" + (new Date().getTime()); | |
this.formGroup = formGroup; | |
this.errorLog = $("<div></div>"); //Writing errors | |
this.responses = []; | |
this.existingFileNames = []; | |
if(!feature.formdata) //check drag drop enabled. | |
{ | |
s.dragDrop = false; | |
} | |
if(!feature.formdata) { | |
s.multiple = false; | |
} | |
$(this).html(""); | |
var obj = this; | |
var uploadLabel = $('<div>' + s.uploadStr + '</div>'); | |
$(uploadLabel).addClass(s.uploadButtonClass); | |
// wait form ajax Form plugin and initialize | |
(function checkAjaxFormLoaded() { | |
if($.fn.ajaxForm) { | |
if(s.dragDrop) { | |
var dragDrop = $('<div class="' + s.dragDropContainerClass + '" style="vertical-align:top;"></div>').width(s.dragdropWidth); | |
$(obj).append(dragDrop); | |
$(dragDrop).append(uploadLabel); | |
$(dragDrop).append($(s.dragDropStr)); | |
setDragDropHandlers(obj, s, dragDrop); | |
} else { | |
$(obj).append(uploadLabel); | |
} | |
$(obj).append(obj.errorLog); | |
if(s.showQueueDiv) | |
obj.container =$("#"+s.showQueueDiv); | |
else | |
obj.container = $("<div class='ajax-file-upload-container'></div>").insertAfter($(obj)); | |
//------------------------------------------------------ | |
// fxSecretMode 에서는 진행상황 보여주지 않음 | |
if(s.fxSecretMode) obj.container.hide(); | |
//------------------------------------------------------ | |
s.onLoad.call(this, obj); | |
createCutomInputFile(obj, formGroup, s, uploadLabel); | |
} else window.setTimeout(checkAjaxFormLoaded, 10); | |
})(); | |
this.startUpload = function () { | |
$("form ." + this.formGroup).each(function (i, items) { | |
mainQ.push($(this)); | |
}); | |
submitPendingUploads(); | |
} | |
this.getFileCount = function () { | |
return obj.selectedFiles; | |
} | |
this.stopUpload = function () { | |
$("." + s.abortButtonClass).each(function (i, items) { | |
if($(this).hasClass(obj.formGroup)) $(this).click(); | |
}); | |
$("." + s.cancelButtonClass).each(function (i, items) { | |
if($(this).hasClass(obj.formGroup)) $(this).click(); | |
}); | |
} | |
this.cancelAll = function () { | |
$("." + s.cancelButtonClass).each(function (i, items) { | |
if($(this).hasClass(obj.formGroup)) $(this).click(); | |
}); | |
} | |
this.update = function (settings) { | |
//update new settings | |
s = $.extend(s, settings); | |
} | |
this.reset = function (removeStatusBars) { | |
obj.fileCounter = 1; | |
obj.selectedFiles = 0; | |
obj.errorLog.html(""); | |
//remove all the status bars. | |
if(removeStatusBars != false) | |
{ | |
obj.container.html(""); | |
} | |
} | |
this.remove = function() | |
{ | |
obj.container.html(""); | |
$(obj).remove(); | |
} | |
//This is for showing Old files to user. | |
this.createProgress = function (filename,filepath,filesize) { | |
var pd = new createProgressDiv(this, s); | |
pd.progressDiv.show(); | |
pd.progressbar.width('100%'); | |
var fileNameStr = ""; | |
if(s.showFileCounter) | |
fileNameStr = obj.fileCounter + s.fileCounterStyle + filename; | |
else fileNameStr = filename; | |
if(s.showFileSize) | |
fileNameStr += " ("+getSizeStr(filesize)+")"; | |
pd.filename.html(fileNameStr); | |
obj.fileCounter++; | |
obj.selectedFiles++; | |
if(s.showPreview) | |
{ | |
pd.preview.attr('src',filepath); | |
pd.preview.show(); | |
} | |
if(s.showDownload) { | |
pd.download.show(); | |
pd.download.click(function () { | |
if(s.downloadCallback) s.downloadCallback.call(obj, [filename]); | |
}); | |
} | |
if(s.showDelete) | |
{ | |
pd.del.show(); | |
pd.del.click(function () { | |
pd.statusbar.hide().remove(); | |
var arr = [filename]; | |
if(s.deleteCallback) s.deleteCallback.call(this, arr, pd); | |
obj.selectedFiles -= 1; | |
updateFileCounter(s, obj); | |
}); | |
} | |
} | |
this.getResponses = function () { | |
return this.responses; | |
} | |
var mainQ=[]; | |
var progressQ=[] | |
var running = false; | |
function submitPendingUploads() { | |
if(running) return; | |
running = true; | |
(function checkPendingForms() { | |
//if not sequential upload all files | |
if(!s.sequential) s.sequentialCount=99999; | |
if(mainQ.length == 0 && progressQ.length == 0) | |
{ | |
if(s.afterUploadAll) s.afterUploadAll(obj); | |
running= false; | |
} | |
else | |
{ | |
if( progressQ.length < s.sequentialCount) | |
{ | |
var frm = mainQ.shift(); | |
if(frm != undefined) | |
{ | |
progressQ.push(frm); | |
frm.submit(); | |
} | |
} | |
window.setTimeout(checkPendingForms, 100); | |
} | |
})(); | |
} | |
function setDragDropHandlers(obj, s, ddObj) { | |
ddObj.on('dragenter', function (e) { | |
e.stopPropagation(); | |
e.preventDefault(); | |
$(this).addClass(s.dragDropHoverClass); | |
}); | |
ddObj.on('dragover', function (e) { | |
e.stopPropagation(); | |
e.preventDefault(); | |
var that = $(this); | |
if (that.hasClass(s.dragDropContainerClass) && !that.hasClass(s.dragDropHoverClass)) { | |
that.addClass(s.dragDropHoverClass); | |
} | |
}); | |
ddObj.on('drop', function (e) { | |
e.preventDefault(); | |
$(this).removeClass(s.dragDropHoverClass); | |
obj.errorLog.html(""); | |
var files = e.originalEvent.dataTransfer.files; | |
if(!s.multiple && files.length > 1) { | |
if(s.showError) { | |
if(s.fxSecretMode) { | |
fx.cmn.alert(s.multiDragErrorStr); | |
} | |
else { | |
$("<div class='" + s.errorClass + "'>" + s.multiDragErrorStr + "</div>").appendTo(obj.errorLog); | |
} | |
} | |
return; | |
} | |
if(s.onSelect(files) == false) return; | |
serializeAndUploadFiles(s, obj, files); | |
}); | |
ddObj.on('dragleave', function (e) { | |
$(this).removeClass(s.dragDropHoverClass); | |
}); | |
$(document).on('dragenter', function (e) { | |
e.stopPropagation(); | |
e.preventDefault(); | |
}); | |
$(document).on('dragover', function (e) { | |
e.stopPropagation(); | |
e.preventDefault(); | |
var that = $(this); | |
if (!that.hasClass(s.dragDropContainerClass)) { | |
that.removeClass(s.dragDropHoverClass); | |
} | |
}); | |
$(document).on('drop', function (e) { | |
e.stopPropagation(); | |
e.preventDefault(); | |
$(this).removeClass(s.dragDropHoverClass); | |
}); | |
} | |
function getSizeStr(size) { | |
var sizeStr = ""; | |
var sizeKB = size / 1024; | |
if(parseInt(sizeKB) > 1024) { | |
var sizeMB = sizeKB / 1024; | |
sizeStr = sizeMB.toFixed(2) + " MB"; | |
} else { | |
sizeStr = sizeKB.toFixed(2) + " KB"; | |
} | |
return sizeStr; | |
} | |
function serializeData(extraData) { | |
var serialized = []; | |
if(jQuery.type(extraData) == "string") { | |
serialized = extraData.split('&'); | |
} else { | |
serialized = $.param(extraData).split('&'); | |
} | |
var len = serialized.length; | |
var result = []; | |
var i, part; | |
for(i = 0; i < len; i++) { | |
serialized[i] = serialized[i].replace(/\+/g, ' '); | |
part = serialized[i].split('='); | |
result.push([decodeURIComponent(part[0]), decodeURIComponent(part[1])]); | |
} | |
return result; | |
} | |
function noserializeAndUploadFiles(s, obj, files) { | |
var ts = s; | |
var fd = new FormData(); | |
var fileArray = []; | |
var fileName = s.fileName.replace("[]", ""); | |
var fileListStr=""; | |
for (var i = 0; i < files.length; i++) { | |
if (!isFileTypeAllowed(obj, s, files[i].name)) { | |
if(s.showError) { | |
if(s.fxSecretMode) { | |
fx.cmn.alert("[" + files[i].name + "] " + s.extErrorStr + s.allowedTypes); | |
} | |
else { | |
$("<div><font color='red'><b>" + files[i].name + "</b> " + s.extErrorStr + s.allowedTypes + "</font></div>").appendTo(obj.errorLog); | |
} | |
} | |
continue; | |
} | |
if (s.maxFileSize != -1 && files[i].size > s.maxFileSize) { | |
if(s.showError) { | |
if(s.fxSecretMode) { | |
fx.cmn.alert("[" + files[i].name + "] " + s.sizeErrorStr + getSizeStr(s.maxFileSize)); | |
} | |
else { | |
$("<div><font color='red'><b>" + files[i].name + "</b> " + s.sizeErrorStr + getSizeStr(s.maxFileSize) + "</font></div>").appendTo(obj.errorLog); | |
} | |
} | |
continue; | |
} | |
fd.append(fileName+"[]", files[i]); | |
fileArray.push(files[i].name); | |
fileListStr += obj.fileCounter + "). " + files[i].name+"<br>"; | |
obj.fileCounter++; | |
} | |
if(fileArray.length ==0 ) return; | |
var extraData = s.formData; | |
if (extraData) { | |
var sData = serializeData(extraData); | |
for (var j = 0; j < sData.length; j++) { | |
if (sData[j]) { | |
fd.append(sData[j][0], sData[j][1]); | |
} | |
} | |
} | |
ts.fileData = fd; | |
var pd = new createProgressDiv(obj, s); | |
pd.filename.html(fileListStr); | |
var form = $("<form style='display:block; position:absolute;left: 150px;' class='" + obj.formGroup + "' method='" + s.method + "' action='" + s.url + "' enctype='" + s.enctype + "'></form>"); | |
form.appendTo('body'); | |
ajaxFormSubmit(form, ts, pd, fileArray, obj); | |
} | |
function serializeAndUploadFiles(s, obj, files) { | |
for(var i = 0; i < files.length; i++) { | |
if(!isFileTypeAllowed(obj, s, files[i].name)) { | |
if(s.showError) { | |
if(s.fxSecretMode) { | |
fx.cmn.alert("[" + files[i].name + "] " + s.extErrorStr + s.allowedTypes); | |
} | |
else { | |
$("<div class='" + s.errorClass + "'><b>" + files[i].name + "</b> " + s.extErrorStr + s.allowedTypes + "</div>").appendTo(obj.errorLog); | |
} | |
} | |
continue; | |
} | |
if(!s.allowDuplicates && isFileDuplicate(obj, files[i].name)) { | |
if(s.showError) { | |
if(s.fxSecretMode) { | |
fx.cmn.alert("[" + files[i].name + "] " + s.duplicateErrorStr); | |
} | |
else { | |
$("<div class='" + s.errorClass + "'><b>" + files[i].name + "</b> " + s.duplicateErrorStr + "</div>").appendTo(obj.errorLog); | |
} | |
} | |
continue; | |
} | |
if(s.maxFileSize != -1 && files[i].size > s.maxFileSize) { | |
if(s.showError) { | |
if(s.fxSecretMode) { | |
fx.cmn.alert("[" + files[i].name + "] " + s.sizeErrorStr + getSizeStr(s.maxFileSize)); | |
} | |
else { | |
$("<div class='" + s.errorClass + "'><b>" + files[i].name + "</b> " + s.sizeErrorStr + getSizeStr(s.maxFileSize) + "</div>").appendTo(obj.errorLog); | |
} | |
} | |
continue; | |
} | |
if(s.maxFileCount != -1 && obj.selectedFiles >= s.maxFileCount) { | |
if(s.showError) { | |
if(s.fxSecretMode) { | |
fx.cmn.alert("[" + files[i].name + "] " + s.maxFileCountErrorStr + s.maxFileCount); | |
} | |
else { | |
$("<div class='" + s.errorClass + "'><b>" + files[i].name + "</b> " + s.maxFileCountErrorStr + s.maxFileCount + "</div>").appendTo(obj.errorLog); | |
} | |
} | |
continue; | |
} | |
obj.selectedFiles++; | |
obj.existingFileNames.push(files[i].name); | |
var ts = s; | |
var fd = new FormData(); | |
var fileName = s.fileName.replace("[]", ""); | |
fd.append(fileName, files[i]); | |
var extraData = s.formData; | |
if(extraData) { | |
var sData = serializeData(extraData); | |
for(var j = 0; j < sData.length; j++) { | |
if(sData[j]) { | |
fd.append(sData[j][0], sData[j][1]); | |
} | |
} | |
} | |
ts.fileData = fd; | |
var pd = new createProgressDiv(obj, s); | |
var fileNameStr = ""; | |
if(s.showFileCounter) fileNameStr = obj.fileCounter + s.fileCounterStyle + files[i].name | |
else fileNameStr = files[i].name; | |
if(s.showFileSize) | |
fileNameStr += " ("+getSizeStr(files[i].size)+")"; | |
pd.filename.html(fileNameStr); | |
var form = $("<form style='display:block; position:absolute;left: 150px;' class='" + obj.formGroup + "' method='" + s.method + "' action='" + | |
s.url + "' enctype='" + s.enctype + "'></form>"); | |
form.appendTo('body'); | |
var fileArray = []; | |
fileArray.push(files[i].name); | |
ajaxFormSubmit(form, ts, pd, fileArray, obj, files[i]); | |
obj.fileCounter++; | |
} | |
} | |
function isFileTypeAllowed(obj, s, fileName) { | |
var fileExtensions = s.allowedTypes.toLowerCase().split(","); | |
var ext = fileName.split('.').pop().toLowerCase(); | |
if(s.allowedTypes != "*" && jQuery.inArray(ext, fileExtensions) < 0) { | |
return false; | |
} | |
return true; | |
} | |
function isFileDuplicate(obj, filename) { | |
var duplicate = false; | |
if (obj.existingFileNames.length) { | |
for (var x=0; x<obj.existingFileNames.length; x++) { | |
if (obj.existingFileNames[x] == filename | |
|| s.duplicateStrict && obj.existingFileNames[x].toLowerCase() == filename.toLowerCase() | |
) { | |
duplicate = true; | |
} | |
} | |
} | |
return duplicate; | |
} | |
function removeExistingFileName(obj, fileArr) { | |
if (obj.existingFileNames.length) { | |
for (var x=0; x<fileArr.length; x++) { | |
var pos = obj.existingFileNames.indexOf(fileArr[x]); | |
if (pos != -1) { | |
obj.existingFileNames.splice(pos, 1); | |
} | |
} | |
} | |
} | |
function getSrcToPreview(file, obj) { | |
if(file) { | |
obj.show(); | |
var reader = new FileReader(); | |
reader.onload = function (e) { | |
obj.attr('src', e.target.result); | |
}; | |
reader.readAsDataURL(file); | |
} | |
} | |
function updateFileCounter(s, obj) { | |
if(s.showFileCounter) { | |
var count = $(obj.container).find(".ajax-file-upload-filename").length; | |
obj.fileCounter = count + 1; | |
$(obj.container).find(".ajax-file-upload-filename").each(function (i, items) { | |
var arr = $(this).html().split(s.fileCounterStyle); | |
var fileNum = parseInt(arr[0]) - 1; //decrement; | |
var name = count + s.fileCounterStyle + arr[1]; | |
$(this).html(name); | |
count--; | |
}); | |
} | |
} | |
function createCutomInputFile(obj, group, s, uploadLabel) { | |
var fileUploadId = "ajax-upload-id-" + (new Date().getTime()); | |
var form = $("<form method='" + s.method + "' action='" + s.url + "' enctype='" + s.enctype + "'></form>"); | |
var fileInputStr = "<input type='file' id='" + fileUploadId + "' name='" + s.fileName + "' accept='" + s.acceptFiles + "'/>"; | |
if(s.multiple) { | |
if(s.fileName.indexOf("[]") != s.fileName.length - 2) // if it does not endwith | |
{ | |
s.fileName += "[]"; | |
} | |
fileInputStr = "<input type='file' id='" + fileUploadId + "' name='" + s.fileName + "' accept='" + s.acceptFiles + "' multiple/>"; | |
} | |
var fileInput = $(fileInputStr).appendTo(form); | |
fileInput.change(function () { | |
obj.errorLog.html(""); | |
var fileExtensions = s.allowedTypes.toLowerCase().split(","); | |
var fileArray = []; | |
if(this.files) //support reading files | |
{ | |
for(i = 0; i < this.files.length; i++) { | |
fileArray.push(this.files[i].name); | |
} | |
if(s.onSelect(this.files) == false) return; | |
} else { | |
var filenameStr = $(this).val(); | |
var flist = []; | |
fileArray.push(filenameStr); | |
if(!isFileTypeAllowed(obj, s, filenameStr)) { | |
if(s.showError) { | |
if(s.fxSecretMode) { | |
fx.cmn.alert("[" + filenameStr + "] " + s.extErrorStr + s.allowedTypes); | |
} | |
else { | |
$("<div class='" + s.errorClass + "'><b>" + filenameStr + "</b> " + s.extErrorStr + s.allowedTypes + "</div>").appendTo(obj.errorLog); | |
} | |
} | |
return; | |
} | |
//fallback for browser without FileAPI | |
flist.push({ | |
name: filenameStr, | |
size: 'NA' | |
}); | |
if(s.onSelect(flist) == false) return; | |
} | |
updateFileCounter(s, obj); | |
uploadLabel.unbind("click"); | |
form.hide(); | |
createCutomInputFile(obj, group, s, uploadLabel); | |
form.addClass(group); | |
if(s.serialize && feature.fileapi && feature.formdata) //use HTML5 support and split file submission | |
{ | |
form.removeClass(group); //Stop Submitting when. | |
var files = this.files; | |
form.remove(); | |
serializeAndUploadFiles(s, obj, files); | |
} else { | |
var fileList = ""; | |
for(var i = 0; i < fileArray.length; i++) { | |
if(s.showFileCounter) fileList += obj.fileCounter + s.fileCounterStyle + fileArray[i] + "<br>"; | |
else fileList += fileArray[i] + "<br>";; | |
obj.fileCounter++; | |
} | |
if(s.maxFileCount != -1 && (obj.selectedFiles + fileArray.length) > s.maxFileCount) { | |
if(s.showError) { | |
if(s.fxSecretMode) { | |
fx.cmn.alert("[" + fileList + "] " + s.maxFileCountErrorStr + s.maxFileCount); | |
} | |
else { | |
$("<div class='" + s.errorClass + "'><b>" + fileList + "</b> " + s.maxFileCountErrorStr + s.maxFileCount + "</div>").appendTo(obj.errorLog); | |
} | |
} | |
return; | |
} | |
obj.selectedFiles += fileArray.length; | |
var pd = new createProgressDiv(obj, s); | |
pd.filename.html(fileList); | |
ajaxFormSubmit(form, s, pd, fileArray, obj, null); | |
} | |
}); | |
if(s.nestedForms) { | |
form.css({ | |
'margin': 0, | |
'padding': 0 | |
}); | |
uploadLabel.css({ | |
position: 'relative', | |
overflow: 'hidden', | |
cursor: 'default' | |
}); | |
fileInput.css({ | |
position: 'absolute', | |
'cursor': 'pointer', | |
'top': '0px', | |
'width': '100%', | |
'height': '100%', | |
'left': '0px', | |
'z-index': '100', | |
'opacity': '0.0', | |
'filter': 'alpha(opacity=0)', | |
'-ms-filter': "alpha(opacity=0)", | |
'-khtml-opacity': '0.0', | |
'-moz-opacity': '0.0' | |
}); | |
form.appendTo(uploadLabel); | |
} else { | |
form.appendTo($('body')); | |
form.css({ | |
margin: 0, | |
padding: 0, | |
display: 'block', | |
position: 'absolute', | |
left: '-250px' | |
}); | |
if(navigator.appVersion.indexOf("MSIE ") != -1) //IE Browser | |
{ | |
uploadLabel.attr('for', fileUploadId); | |
} else { | |
uploadLabel.click(function () { | |
fileInput.click(); | |
}); | |
} | |
} | |
} | |
function defaultProgressBar(obj,s) | |
{ | |
this.statusbar = $("<div class='ajax-file-upload-statusbar'></div>").width(s.statusBarWidth); | |
this.preview = $("<img class='ajax-file-upload-preview' />").width(s.previewWidth).height(s.previewHeight).appendTo(this.statusbar).hide(); | |
this.filename = $("<div class='ajax-file-upload-filename'></div>").appendTo(this.statusbar); | |
this.progressDiv = $("<div class='ajax-file-upload-progress'>").appendTo(this.statusbar).hide(); | |
this.progressbar = $("<div class='ajax-file-upload-bar'></div>").appendTo(this.progressDiv); | |
this.abort = $("<div>" + s.abortStr + "</div>").appendTo(this.statusbar).hide(); | |
this.cancel = $("<div>" + s.cancelStr + "</div>").appendTo(this.statusbar).hide(); | |
this.done = $("<div>" + s.doneStr + "</div>").appendTo(this.statusbar).hide(); | |
this.download = $("<div>" + s.downloadStr + "</div>").appendTo(this.statusbar).hide(); | |
this.del = $("<div>" + s.deletelStr + "</div>").appendTo(this.statusbar).hide(); | |
this.abort.addClass("ajax-file-upload-red"); | |
this.done.addClass("ajax-file-upload-green"); | |
this.download.addClass("ajax-file-upload-green"); | |
this.cancel.addClass("ajax-file-upload-red"); | |
this.del.addClass("ajax-file-upload-red"); | |
return this; | |
} | |
function createProgressDiv(obj, s) { | |
var bar = null; | |
if(s.customProgressBar) | |
bar = new s.customProgressBar(obj,s); | |
else | |
bar = new defaultProgressBar(obj,s); | |
bar.abort.addClass(obj.formGroup); | |
bar.abort.addClass(s.abortButtonClass); | |
bar.cancel.addClass(obj.formGroup); | |
bar.cancel.addClass(s.cancelButtonClass); | |
if(s.extraHTML) | |
bar.extraHTML = $("<div class='extrahtml'>"+s.extraHTML()+"</div>").insertAfter(bar.filename); | |
$(obj.container).prepend(bar.statusbar); | |
return bar; | |
} | |
function ajaxFormSubmit(form, s, pd, fileArray, obj, file) { | |
var spinner = null; | |
var currentXHR = null; | |
var options = { | |
cache: false, | |
contentType: false, | |
processData: false, | |
forceSync: false, | |
type: s.method, | |
data: s.formData, | |
formData: s.fileData, | |
dataType: s.returnType, | |
beforeSubmit: function (formData, $form, options) { | |
if(s.onSubmit.call(this, fileArray) != false) { | |
if(s.dynamicFormData) | |
{ | |
var sData = serializeData(s.dynamicFormData()); | |
if(sData) { | |
for(var j = 0; j < sData.length; j++) { | |
if(sData[j]) { | |
if(s.fileData != undefined) options.formData.append(sData[j][0], sData[j][1]); | |
else options.data[sData[j][0]] = sData[j][1]; | |
} | |
} | |
} | |
} | |
if(s.extraHTML) | |
{ | |
$(pd.extraHTML).find("input,select,textarea").each(function(i,items) | |
{ | |
if(s.fileData != undefined) options.formData.append($(this).attr('name'),$(this).val()); | |
else options.data[$(this).attr('name')] = $(this).val(); | |
}); | |
} | |
return true; | |
} | |
pd.statusbar.append("<div class='" + s.errorClass + "'>" + s.uploadErrorStr + "</div>"); | |
pd.cancel.show() | |
form.remove(); | |
pd.cancel.click(function () { | |
mainQ.pop(); | |
removeExistingFileName(obj, fileArray); | |
pd.statusbar.remove(); | |
s.onCancel.call(obj, fileArray, pd); | |
obj.selectedFiles -= fileArray.length; //reduce selected File count | |
updateFileCounter(s, obj); | |
}); | |
return false; | |
}, | |
beforeSend: function (xhr, o) { | |
if(s.fxSecretMode) { | |
spinner = fx.cmn.spin(); // SPINNER 생성 | |
} | |
pd.progressDiv.show(); | |
pd.cancel.hide(); | |
pd.done.hide(); | |
if(s.showAbort) { | |
pd.abort.show(); | |
pd.abort.click(function () { | |
removeExistingFileName(obj, fileArray); | |
xhr.abort(); | |
obj.selectedFiles -= fileArray.length; //reduce selected File count | |
}); | |
} | |
if(!feature.formdata) //For iframe based push | |
{ | |
pd.progressbar.width('5%'); | |
} else pd.progressbar.width('1%'); //Fix for small files | |
}, | |
uploadProgress: function (event, position, total, percentComplete) { | |
if(s.fxSecretMode) { | |
return; | |
} | |
//Fix for smaller file uploads in MAC | |
if(percentComplete > 98) percentComplete = 98; | |
var percentVal = percentComplete + '%'; | |
if(percentComplete > 1) pd.progressbar.width(percentVal) | |
if(s.showProgress) { | |
pd.progressbar.html(percentVal); | |
pd.progressbar.css('text-align', 'center'); | |
} | |
}, | |
success: function (data, message, xhr) { | |
if(s.fxSecretMode) { | |
if (spinner) spinner.stop(); | |
} | |
pd.cancel.remove(); | |
progressQ.pop(); | |
//For custom errors. | |
if(s.returnType == "json" && $.type(data) == "object" && data.hasOwnProperty(s.customErrorKeyStr)) { | |
pd.abort.hide(); | |
var msg = data[s.customErrorKeyStr]; | |
s.onError.call(this, fileArray, 200, msg, pd); | |
if(s.showStatusAfterError) { | |
pd.progressDiv.hide(); | |
pd.statusbar.append("<span class='" + s.errorClass + "'>ERROR: " + msg + "</span>"); | |
} else { | |
pd.statusbar.hide(); | |
pd.statusbar.remove(); | |
} | |
obj.selectedFiles -= fileArray.length; //reduce selected File count | |
form.remove(); | |
return; | |
} | |
obj.responses.push(data); | |
pd.progressbar.width('100%') | |
if(s.showProgress) { | |
pd.progressbar.html('100%'); | |
pd.progressbar.css('text-align', 'center'); | |
} | |
pd.abort.hide(); | |
s.onSuccess.call(this, fileArray, data, xhr, pd); | |
if(s.showStatusAfterSuccess) { | |
if(s.showDone) { | |
pd.done.show(); | |
pd.done.click(function () { | |
pd.statusbar.hide("slow"); | |
pd.statusbar.remove(); | |
}); | |
} else { | |
pd.done.hide(); | |
} | |
if(s.showDelete) { | |
pd.del.show(); | |
pd.del.click(function () { | |
pd.statusbar.hide().remove(); | |
if(s.deleteCallback) s.deleteCallback.call(this, data, pd); | |
obj.selectedFiles -= fileArray.length; //reduce selected File count | |
updateFileCounter(s, obj); | |
}); | |
} else { | |
pd.del.hide(); | |
} | |
} else { | |
pd.statusbar.hide("slow"); | |
pd.statusbar.remove(); | |
} | |
if(s.showDownload) { | |
pd.download.show(); | |
pd.download.click(function () { | |
if(s.downloadCallback) s.downloadCallback(data); | |
}); | |
} | |
form.remove(); | |
}, | |
error: function (xhr, status, errMsg) { | |
if(s.fxSecretMode) { | |
if (spinner) spinner.stop(); | |
} | |
pd.cancel.remove(); | |
progressQ.pop(); | |
pd.abort.hide(); | |
if(xhr.statusText == "abort") //we aborted it | |
{ | |
pd.statusbar.hide("slow").remove(); | |
updateFileCounter(s, obj); | |
} else { | |
s.onError.call(this, fileArray, status, errMsg, pd); | |
if(s.showStatusAfterError) { | |
pd.progressDiv.hide(); | |
pd.statusbar.append("<span class='" + s.errorClass + "'>ERROR: " + errMsg + "</span>"); | |
} else { | |
pd.statusbar.hide(); | |
pd.statusbar.remove(); | |
} | |
obj.selectedFiles -= fileArray.length; //reduce selected File count | |
} | |
form.remove(); | |
} | |
}; | |
if(s.showPreview && file != null) { | |
if(file.type.toLowerCase().split("/").shift() == "image") getSrcToPreview(file, pd.preview); | |
} | |
if(s.autoSubmit) { | |
form.ajaxForm(options); | |
mainQ.push(form); | |
submitPendingUploads(); | |
} else { | |
if(s.showCancel) { | |
pd.cancel.show(); | |
pd.cancel.click(function () { | |
mainQ.pop(); | |
removeExistingFileName(obj, fileArray); | |
form.remove(); | |
pd.statusbar.remove(); | |
s.onCancel.call(obj, fileArray, pd); | |
obj.selectedFiles -= fileArray.length; //reduce selected File count | |
updateFileCounter(s, obj); | |
}); | |
} | |
form.ajaxForm(options); | |
mainQ.push(form); | |
} | |
} | |
return this; | |
} | |
}(jQuery)); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment