JSFiddle - React, Tailwind, and code Playground

by taylorbuley

HTML

<div id="dropzone"></div>

CSS

#dropzone {
width:500px;
height:500px;   
background:#eee;    
border:1px solid #000;
}

JavaScript

if ('undefined' === typeof window.FileReader) {
    console.log('No FileReader')
} else {
   var dropzone = document.getElementById('dropzone');
    if (null !== dropzone) {
        dropzone.ondrop = function(e) {
            var length = e.dataTransfer.items.length;
            for (var i = 0; i < length; i++) {
                var item = e.dataTransfer.items[i];
                if ('file' === item.type) {
                    console.log('FILE', item);
                } else if ('directory' === item.type) {
                    console.log('DIRECTORY', item);
                }
            }
        }
    };
}