@ -2,210 +2,217 @@
Copyright ( C ) 2006 - 2013 Jean - Philippe Lang
Copyright ( C ) 2006 - 2013 Jean - Philippe Lang
Modified by Jianfeng Tao , to upload one avatar for user * /
Modified by Jianfeng Tao , to upload one avatar for user * /
function addFile ( inputEl , file , eagerUpload ) {
var fileSpan = $ ( '#avatar_file' ) ; ( function ( ) {
//fileSpan.append(
function addFile ( inputEl , file , eagerUpload ) {
// $('<input>', { type: 'text', 'class': 'filename readonly', name: 'avatar[filename]', readonly: 'readonly'} ).val(file.name),
// $('<a> </a>').attr({ href: "#", 'class': 'remove-upload' }).click(removeFile).toggle(!eagerUpload)
//).appendTo('#avatar_fields');
if ( eagerUpload ) {
var fileSpan = $ ( '#avatar_file' ) ;
ajaxUpload ( file , fileSpan , inputEl ) ;
//fileSpan.append(
// $('<input>', { type: 'text', 'class': 'filename readonly', name: 'avatar[filename]', readonly: 'readonly'} ).val(file.name),
// $('<a> </a>').attr({ href: "#", 'class': 'remove-upload' }).click(removeFile).toggle(!eagerUpload)
//).appendTo('#avatar_fields');
if ( eagerUpload ) {
ajaxUpload ( file , fileSpan , inputEl ) ;
}
return 1 ;
}
}
return 1 ;
function ajaxUpload ( file , fileSpan , inputEl ) {
}
function onLoadstart ( e ) {
fileSpan . removeClass ( 'ajax-waiting' ) ;
fileSpan . addClass ( 'ajax-loading' ) ;
$ ( 'input:submit' , $ ( this ) . parents ( 'form' ) ) . attr ( 'disabled' , 'disabled' ) ;
}
function onProgress ( e ) {
if ( e . lengthComputable ) {
this . progressbar ( 'value' , e . loaded * 100 / e . total ) ;
}
}
function actualUpload ( file , fileSpan , inputEl ) {
ajaxUpload . uploading ++ ;
uploadBlob ( file , $ ( inputEl ) . data ( 'upload-path' ) , $ ( inputEl ) . data ( 'source-type' ) , $ ( inputEl ) . data ( 'source-id' ) , {
loadstartEventHandler : onLoadstart . bind ( progressSpan ) ,
progressEventHandler : onProgress . bind ( progressSpan )
} )
. done ( function ( result ) {
progressSpan . progressbar ( 'value' , 100 ) ;
progressSpan . progressbar ( 'destroy' ) ;
fileSpan . find ( 'input.description, a' ) . css ( 'display' , 'inline-block' ) ;
} )
. fail ( function ( result ) {
progressSpan . text ( result . statusText ) ;
} ) . always ( function ( ) {
ajaxUpload . uploading -- ;
fileSpan . removeClass ( 'ajax-loading' ) ;
var form = fileSpan . parents ( 'form' ) ;
// if (form.queue('upload').length == 0 && ajaxUpload.uploading == 0) {
// $('input:submit', form).removeAttr('disabled');
// }
// form.dequeue('upload');
} ) ;
}
var progressSpan = $ ( '#upload_progressbar' ) ;
progressSpan . progressbar ( ) ;
fileSpan . addClass ( 'ajax-waiting' ) ;
var maxSyncUpload = $ ( inputEl ) . data ( 'max-concurrent-uploads' ) ;
if ( maxSyncUpload == null || maxSyncUpload <= 0 || ajaxUpload . uploading < maxSyncUpload )
actualUpload ( file , fileSpan , inputEl ) ;
else
$ ( inputEl ) . parents ( 'form' ) . queue ( 'upload' , actualUpload . bind ( this , file , fileSpan , inputEl ) ) ;
}
function ajaxUpload ( file , fileSpan , inputEl ) { ajaxUpload . uploading = 0 ;
function onLoadstart ( e ) {
function removeFile ( ) {
fileSpan . removeClass ( 'ajax-waiting' ) ;
$ ( this ) . parent ( 'span' ) . remove ( ) ;
fileSpan . addClass ( 'ajax-loading' ) ;
return false ;
$ ( 'input:submit' , $ ( this ) . parents ( 'form' ) ) . attr ( 'disabled' , 'disabled' ) ;
}
}
function onProgress ( e ) {
function uploadBlob ( blob , uploadUrl , source _type , source _id , options ) {
if ( e . lengthComputable ) {
this . progressbar ( 'value' , e . loaded * 100 / e . total ) ;
var actualOptions = $ . extend ( {
loadstartEventHandler : $ . noop ,
progressEventHandler : $ . noop
} , options ) ;
uploadUrl = uploadUrl + '?source_type=' + source _type + '&source_id=' + source _id ;
if ( blob instanceof window . File ) {
uploadUrl += '&filename=' + encodeURIComponent ( blob . name ) ;
}
return $ . ajax ( uploadUrl , {
type : 'POST' ,
contentType : 'application/octet-stream' ,
beforeSend : function ( jqXhr ) {
jqXhr . setRequestHeader ( 'Accept' , 'application/js' ) ;
} ,
xhr : function ( ) {
var xhr = $ . ajaxSettings . xhr ( ) ;
xhr . upload . onloadstart = actualOptions . loadstartEventHandler ;
xhr . upload . onprogress = actualOptions . progressEventHandler ;
return xhr ;
} ,
data : blob ,
cache : false ,
processData : false
} ) ;
}
}
}
window . addInputAvatar = function ( inputEl ) {
function actualUpload ( file , fileSpan , inputEl ) {
ajaxUpload . uploading ++ ;
uploadBlob ( file , $ ( inputEl ) . data ( 'upload-path' ) , $ ( inputEl ) . data ( 'source-type' ) , $ ( inputEl ) . data ( 'source-id' ) , {
loadstartEventHandler : onLoadstart . bind ( progressSpan ) ,
progressEventHandler : onProgress . bind ( progressSpan )
} )
. done ( function ( result ) {
progressSpan . progressbar ( 'value' , 100 ) ;
progressSpan . progressbar ( 'destroy' ) ;
fileSpan . find ( 'input.description, a' ) . css ( 'display' , 'inline-block' ) ;
} )
. fail ( function ( result ) {
progressSpan . text ( result . statusText ) ;
} ) . always ( function ( ) {
ajaxUpload . uploading -- ;
fileSpan . removeClass ( 'ajax-loading' ) ;
var form = fileSpan . parents ( 'form' ) ;
// if (form.queue('upload').length == 0 && ajaxUpload.uploading == 0) {
// $('input:submit', form).removeAttr('disabled');
// }
// form.dequeue('upload');
} ) ;
}
var progressSpan = $ ( '#upload_progressbar' ) ;
progressSpan . progressbar ( ) ;
fileSpan . addClass ( 'ajax-waiting' ) ;
var maxSyncUpload = $ ( inputEl ) . data ( 'max-concurrent-uploads' ) ;
if ( maxSyncUpload == null || maxSyncUpload <= 0 || ajaxUpload . uploading < maxSyncUpload )
actualUpload ( file , fileSpan , inputEl ) ;
else
$ ( inputEl ) . parents ( 'form' ) . queue ( 'upload' , actualUpload . bind ( this , file , fileSpan , inputEl ) ) ;
}
ajaxUpload . uploading = 0 ;
function removeFile ( ) {
$ ( this ) . parent ( 'span' ) . remove ( ) ;
return false ;
}
function uploadBlob ( blob , uploadUrl , source _type , source _id , options ) {
var actualOptions = $ . extend ( {
loadstartEventHandler : $ . noop ,
progressEventHandler : $ . noop
} , options ) ;
uploadUrl = uploadUrl + '?source_type=' + source _type + '&source_id=' + source _id ;
if ( blob instanceof window . File ) {
uploadUrl += '&filename=' + encodeURIComponent ( blob . name ) ;
}
return $ . ajax ( uploadUrl , {
type : 'POST' ,
contentType : 'application/octet-stream' ,
beforeSend : function ( jqXhr ) {
jqXhr . setRequestHeader ( 'Accept' , 'application/js' ) ;
} ,
xhr : function ( ) {
var xhr = $ . ajaxSettings . xhr ( ) ;
xhr . upload . onloadstart = actualOptions . loadstartEventHandler ;
xhr . upload . onprogress = actualOptions . progressEventHandler ;
return xhr ;
} ,
data : blob ,
cache : false ,
processData : false
} ) ;
}
function addInputAvatar ( inputEl ) {
// var clearedFileInput = $(inputEl).clone().val('');
// var clearedFileInput = $(inputEl).clone().val('');
if ( inputEl . files ) {
if ( inputEl . files ) {
// upload files using ajax
// upload files using ajax
uploadAndAttachFiles ( inputEl . files , inputEl ) ;
uploadAndAttachFiles ( inputEl . files , inputEl ) ;
// $(inputEl).remove();
// $(inputEl).remove();
} else {
} else {
// browser not supporting the file API, upload on form submission
// browser not supporting the file API, upload on form submission
var avatarId ;
var avatarId ;
var aFilename = inputEl . value . split ( /\/|\\/ ) ;
var aFilename = inputEl . value . split ( /\/|\\/ ) ;
avatarId = addFile ( inputEl , { name : aFilename [ aFilename . length - 1 ] } , false ) ;
avatarId = addFile ( inputEl , { name : aFilename [ aFilename . length - 1 ] } , false ) ;
if ( avatarId ) {
if ( avatarId ) {
$ ( inputEl ) . attr ( { name : 'avatar[file]' , style : 'display:none;' } ) . appendTo ( '#avatar_image' ) ;
$ ( inputEl ) . attr ( { name : 'avatar[file]' , style : 'display:none;' } ) . appendTo ( '#avatar_image' ) ;
}
}
//clearedFileInput.insertAfter('#avatars_fields');
}
}
}
//clearedFileInput.insertAfter('#avatars_fields');
function uploadAndAttachFiles ( files , inputEl ) {
}
var maxFileSize = $ ( inputEl ) . data ( 'max-file-size' ) ;
var maxFileSizeExceeded = $ ( inputEl ) . data ( 'max-file-size-message' ) ;
var sizeExceeded = false ;
$ . each ( files , function ( ) {
if ( this . size && maxFileSize && this . size > parseInt ( maxFileSize ) ) { sizeExceeded = true ; }
} ) ;
if ( sizeExceeded ) {
window . alert ( maxFileSizeExceeded ) ;
} else {
uploadAndTypeFiles ( files , inputEl ) ;
//$.each(files, function() {addFile(inputEl, this, true);});
}
}
function uploadAndTypeFiles ( files , inputEl ) {
var enableType = $ ( inputEl ) . data ( 'file-type' ) ;
var typeSupportrdMessage = $ ( inputEl ) . data ( 'type-support-message' ) ;
if ( enableType == null || enableType . trim ( ) == "" )
{
$ . each ( files , function ( ) { addFile ( inputEl , this , true ) ; } ) ;
return ;
}
var typeSupported = false ;
$ . each ( files , function ( ) {
var a = this . name . split ( '.' ) ;
var type = a [ a . length - 1 ] ;
var rs = enableType . indexOf ( type ) ;
if ( rs >= 0 ) { typeSupported = true }
} ) ;
if ( typeSupported ) {
$ . each ( files , function ( ) { addFile ( inputEl , this , true ) ; } ) ;
} else {
window . alert ( typeSupportrdMessage + enableType ) ;
}
}
function uploadAndAttachFiles ( files , inputEl ) {
var maxFileSize = $ ( inputEl ) . data ( 'max-file-size' ) ;
var maxFileSizeExceeded = $ ( inputEl ) . data ( 'max-file-size-message' ) ;
var sizeExceeded = false ;
$ . each ( files , function ( ) {
if ( this . size && maxFileSize && this . size > parseInt ( maxFileSize ) ) { sizeExceeded = true ; }
} ) ;
if ( sizeExceeded ) {
window . alert ( maxFileSizeExceeded ) ;
} else {
uploadAndTypeFiles ( files , inputEl ) ;
//$.each(files, function() {addFile(inputEl, this, true);});
}
}
function uploadAndTypeFiles ( files , inputEl ) { function handleFileDropEvent ( e ) {
$ ( this ) . removeClass ( 'fileover' ) ;
blockEventPropagation ( e ) ;
var enableType = $ ( inputEl ) . data ( 'file-type' ) ;
if ( $ . inArray ( 'Files' , e . dataTransfer . types ) > - 1 ) {
var typeSupportrdMessage = $ ( inputEl ) . data ( 'type-support-message' ) ;
uploadAndAttachFiles ( e . dataTransfer . files , $ ( 'input:file.file_selector' ) ) ;
if ( enableType == null || enableType . trim ( ) == "" )
}
{
$ . each ( files , function ( ) { addFile ( inputEl , this , true ) ; } ) ;
return ;
}
}
var typeSupported = false ;
$ . each ( files , function ( ) {
function dragOverHandler ( e ) {
var a = this . name . split ( '.' ) ;
$ ( this ) . addClass ( 'fileover' ) ;
var type = a [ a . length - 1 ] ;
blockEventPropagation ( e ) ;
var rs = enableType . indexOf ( type ) ;
}
if ( rs >= 0 ) { typeSupported = true }
} ) ;
function dragOutHandler ( e ) {
if ( typeSupported ) {
$ ( this ) . removeClass ( 'fileover' ) ;
$ . each ( files , function ( ) { addFile ( inputEl , this , true ) ; } ) ;
blockEventPropagation ( e ) ;
} else {
window . alert ( typeSupportrdMessage + enableType ) ;
}
}
}
function setupFileDrop ( ) {
function handleFileDropEvent ( e ) { console . log ( "setupFileDrop" ) ;
$ ( '#avatar_image' ) . on ( 'click' , function ( ) {
$ ( this ) . removeClass ( 'fileover' ) ;
console . log ( "click" ) ;
blockEventPropagation ( e ) ;
} ) ;
if ( window . File && window . FileList && window . ProgressEvent && window . FormData ) {
if ( $ . inArray ( 'Files' , e . dataTransfer . types ) > - 1 ) {
uploadAndAttachFiles ( e . dataTransfer . files , $ ( 'input:file.file_selector' ) ) ;
$ . event . fixHooks . drop = { props : [ 'dataTransfer' ] } ;
}
} $ ( 'form div.box' ) . has ( 'input:file' ) . each ( function ( ) {
$ ( this ) . on ( {
function dragOverHandler ( e ) { dragover : dragOverHandler ,
$ ( this ) . addClass ( 'fileover' ) ;
dragleave : dragOutHandler ,
blockEventPropagation ( e ) ;
drop : handleFileDropEvent
} } ) ;
} ) ;
function dragOutHandler ( e ) { }
$ ( this ) . removeClass ( 'fileover' ) ;
}
blockEventPropagation ( e ) ;
} $ ( document ) . ready ( setupFileDrop ) ;
} ) ( ) ;
function setupFileDrop ( ) {
$ ( '#avatar_image' ) . on ( 'click' , function ( ) {
console . log ( "click" ) ;
} ) ;
if ( window . File && window . FileList && window . ProgressEvent && window . FormData ) {
$ . event . fixHooks . drop = { props : [ 'dataTransfer' ] } ;
$ ( 'form div.box' ) . has ( 'input:file' ) . each ( function ( ) {
$ ( this ) . on ( {
dragover : dragOverHandler ,
dragleave : dragOutHandler ,
drop : handleFileDropEvent
} ) ;
} ) ;
}
}
$ ( document ) . ready ( setupFileDrop ) ;
