callback on Image is completely uploaded

[ghost]

Dear Uncle Cheese,

I made a silverstripe Module called cropfield. Its adding the functionallity of JCrop to dropzone for uploading (profile)pictures in frontend. In cropfield.js I am using $('#Dropzone').data('dropzoneInterface').backend.on('complete',function(){...} (I also tried success instead of complete). I need to get the size of the original uploaded Image. I do this with:

var pic_real_width = document.querySelector('#cropArea').naturalWidth;
var pic_real_height = document.querySelector('#cropArea').naturalHeight;

But to get the real Values I do have to set a timeout, because when I dont't I allways get 0. I need a callback function that triggers when the Image is completly uploaded and added to Dom so I can get the real Values for width and height and get rid of the timeout.

You can find my code here: [https://github.com/TheTigerDuck/silverstripe-cropfield]

By the Way Thanks for all your awesome work on silverstripe and excuse my bad english.

[unclecheese]

Have you looked at this? http://www.dropzonejs.com/#event-list

Surely one of those events will give you what you need.

[ghost]

No I hanen't. When I use thumbnail I can take the values of width and height from dataURL. Thanks.

$('#Dropzone').data('dropzoneInterface').backend.on('thumbnail',function(dataUrl){ var pic_real_width = dataUrl.width; var pic_real_height = dataUrl.height;