Dropzone

An open source library that provides drag and drop file uploads with image previews.

// Css
<link rel="stylesheet" href="css/vendor/dropzone.min.css" />

// Javascript
<script src="js/vendor/dropzone.min.js"></script>
<script src="js/cs/dropzone.templates.js"></script>

var dropzone = new Dropzone('#dropzoneImage', {
  url: 'https://httpbin.org/pos',
  init: function () {
    this.on('success', function (file, responseText) {
      console.log(responseText);
    });
  },
  acceptedFiles: 'image/*',
  thumbnailWidth: 160,
  previewTemplate: DropzoneTemplates.previewTemplate,
});

<form>
  <div class="dropzone" id="dropzoneImage"></div>
</form>

You may find more examples in Interface.Forms.Controls.Dropzone.html file which is initialized by js/forms/controls.dropzone.js.