Uso de jquery fileupload con coffeescript: cambio de tamaño de la imagen cuando se usa agregar devolución de llamada
RESUELTO Resulta que el orden de los js que se cargan en la aplicación. Js estaban equivocados:
original:
//= require jquery-fileupload/jquery.fileupload-process
//= require jquery-fileupload/jquery.fileupload-image
//= require jquery-fileupload/jquery.fileupload-validate
correct version:
//= require jquery-fileupload/jquery.fileupload-process
//= require jquery-fileupload/jquery.fileupload-validate
//= require jquery-fileupload/jquery.fileupload-image
Estoy tratando de usar el cargador de archivos jquery de BlueImp y he logrado que todo funcione, excepto el cambio de tamaño.
Estoy tratando de cambiar el tamaño de las imágenes en la devolución de llamada de agregar y luego enviar para evitar cualquier procesamiento del lado del servidor.
Sé que el uso de la devolución de llamada de agregar hace que se omita la función de proceso, pero lo llamé manualmente en la devolución de llamada de agregar y debería funcionar, pero no funciona.
Aquí está mi código:
$('.jquery-fileupload').fileupload
dataType: "script"
imageMaxWidth: 480
imageMaxHeight: 360
disableImageResize: false
autoUpload: false
process:[
{
action: 'load',
fileTypes: /^image\/(gif|jpeg|png)$/,
maxFileSize: 20000000
},
{
action: 'resize',
maxWidth: 480, // the images are to be loaded into a pdf later so they have to be skept small
maxHeight: 360,
minWidth: 480,
minHeight: 360
},
{
action: 'save'
}
]
progress: (e, data) ->
progress = parseInt(data.loaded / data.total * 100, 10);
$('#progress_'+data.formData.token+' .bar').css('width', progress+'%')
add: (e, data) ->
unique_token = token();
if (data.files && data.files[0])
if(data.files[0].size < 200000000)
if(data.files[0].type.substr(0, data.files[0].type.indexOf('/')) != 'image')
alert("Please upload a file with the correct format")
else
current_data = $(this)
data.process(->
return current_data.fileupload('process', data); //call the process function
).done(->
data.formData = {token: unique_token};
data.context = $('.preview:last');
data.context.find('.abort').click(abortUpload);
xhr = data.submit();
data.context.data('data',{jqXHR: xhr});
)
else
alert("one of your files is over 200MB")
done: (e, data) ->
console.log(data);
Cualquier ayuda sobre esto sería muy apreciada, ya que he estado golpeando mi cabeza sobre la mesa durante 2 días seguidos.
editar olvidé mencionar, aquí están mis archivos js:
//= require jquery-fileupload/vendor/jquery.ui.widget
//= require jquery-fileupload/vendor/load-image
//= require jquery-fileupload/vendor/canvas-to-blob
//= require jquery-fileupload/jquery.iframe-transport
//= require jquery-fileupload/jquery.fileupload
//= require jquery-fileupload/jquery.fileupload-ui
//= require jquery-fileupload/jquery.fileupload-process
//= require jquery-fileupload/jquery.fileupload-image
//= require jquery-fileupload/jquery.fileupload-validate
//= require jquery-fileupload/vendor/tmpl
//= require jquery-fileupload/locale