I'm trying to use dropzone.js for uploading images to the browser only (as blob), not to the server.
And it works for dragging 1 or 2 files at a time, but when I drag 3 or more files, only the first 2 are processed.
So in my code the transformFile function is executed only for the first 2 files even though I dragged 3.
this is my code, html:
<div id="picDropZone" style="background: gainsboro;">
<h2>Drop zone</h2>
</div>
<div id="pictures">
</div>
and the js:
var picsPrev = $('#pictures');
var pics = [];
function updatePics(){
picsPrev.empty();
pics.forEach(function (pic) {
var image = new Image(150);
image.src = pic;
picsPrev.append(image);
});
}
var myDropzone = new Dropzone("#picDropZone",
{
url: '...', // not used, error when not set
maxFiles: 10,
transformFile: function (file, done) {
var image = new Image();
var imgurl = URL.createObjectURL(file);
image.src = imgurl;
pics.push(imgurl);
updatePics();
myDropzone.removeAllFiles(true);
}
});