Insert One Or More Files Dropped on an Element

Install the raix:ui-dropped-event package. It adds the dropped event to the Meteor templates.

Note the FS.Utility.eachFile utility function - it supports files from both <input> and dropped files.

Template

<div id="dropzone" class="dropzone">
  <div style="text-align: center; color: gray;">Drop file to upload</div>
</div>

Javascript

Template.hello.events({
  // Catch the dropped event
  'dropped #dropzone': function(event, temp) {
    console.log('files dropped');
    FS.Utility.eachFile(event, function(file) {
      Images.insert(file, function (err, fileObj) {
        //If !err, we have inserted new doc with ID fileObj._id, and
        //kicked off the data upload using HTTP
      });
    });
  }
});