php - Dropzone js - Drag n Drop file from same page -

i using dropzone plugin multiple files drag n drop functionality. drag n drop works fine when uploading pictures laptop / desktop.

my question - how can drag n drop images dropzone same page. lets have dropzone div , having div having multiple images. want drag n drop images dropzone.

this.on("drop", function(event) {   var imageurl = event.datatransfer.getdata('url');   var filename = imageurl.split('/').pop();    // set effectallowed drag item   event.datatransfer.effectallowed = 'copy';    function getdatauri(url, callback) {     var image = new image();      image.onload = function() {       var canvas = document.createelement('canvas');       canvas.width = this.naturalwidth; // or 'width' if want special/scaled size       canvas.height = this.naturalheight; // or 'height' if want special/scaled size        canvas.getcontext('2d').drawimage(this, 0, 0);        // raw image data       // callback(canvas.todataurl('image/png').replace(/^data:image\/(png|jpg);base64,/, ''));        // ... or data uri       callback(canvas.todataurl('image/jpeg'));     };      image.setattribute('crossorigin', 'anonymous');     image.src = url;   }    function datauritoblob(datauri) {     var bytestring,         mimestring      if (datauri.split(',')[0].indexof('base64') !== -1) {       bytestring = atob(datauri.split(',')[1])     } else {       bytestring = decodeuri(datauri.split(',')[1])     }      mimestring = datauri.split(',')[0].split(':')[1].split(';')[0]      var content = new array();     (var = 0; < bytestring.length; i++) {       content[i] = bytestring.charcodeat(i)     }      return new blob([new uint8array(content)], {       type: mimestring     });   }    getdatauri(imageurl, function(datauri) {     var blob = datauritoblob(datauri);     blob.name = filename;     mydropzone.addfile(blob);   }); }); 

http://codepen.io/bartsitek/pen/zemgjv


here’s solution problem. data conversion functions found on internet. 
and here’s little explanation of what’s happening:

• during “drop” event grab url of image dragging

• convert url data uri format

• convert data uri blob
• add blob dropzone form