File Explorer Dropzone
HTML
<script src="https://static-cdn.kloudless.com/p/platform/sdk/kloudless.explorer.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.0.1/dropzone.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.0.1/dropzone.css">
<div class="dropzone dz-clickable" id="myDrop">
<div class="dz-default dz-message" data-dz-message="">
<span>Drag and upload your profile photo</span>
</div>
</div>
JavaScript
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("div#myDrop", {
acceptedFiles: "image/*",
maxFiles:1,
addRemoveLinks: true,
init: function() {
var thisDropzone = this;
var mockFile = { name: 'Name Image', size: 12345, type: 'image/jpeg' };
thisDropzone.emit("addedfile", mockFile);
thisDropzone.emit("success", mockFile);
thisDropzone.emit("thumbnail", mockFile, "https://goo.gl/IltWyB")
this.on("maxfilesexceeded", function(file){
this.removeFile(file);
alert("No more files please!");
});
},
url: "#"
});