Merge pull request #1749 from pierotofy/drop

Drag & Drop improvements, recursive folder drop support

app/static/app/js/components/ProjectListItem.jsx

@@ -227,6 +227,10 @@ class ProjectListItem extends React.Component {
             const retry = () => {
                 const MAX_RETRIES = 20;
 
+                if (!file.accepted){
+                  throw new Error(interpolate(_('%(filename)s is not a valid file'), {filename: file.name }));
+                }
+
                 if (file.retries < MAX_RETRIES){
                     // Update progress
                     const totalBytesSent = this.state.upload.totalBytesSent - file.trackedBytesSent;

app/static/app/js/vendor/dropzone.js

@@ -1632,17 +1632,23 @@ var Dropzone = function (_Emitter) {
 
       var files = e.dataTransfer.files;
 
-      this.emit("addedfiles", files);
-
       // Even if it's a folder, files.length will contain the folders.
       if (files.length) {
         var items = e.dataTransfer.items;
-
+        
         if (items && items.length && items[0].webkitGetAsEntry != null) {
           // The browser supports dropping of folders, so handle items instead of files
-          this._addFilesFromItems(items);
+          var self = this;
+          this._addFilesFromItems(items, function(files){
+            let acceptedFiles = [];
+            for (var i = 0; i < files.length; i++){
+              if (files[i].accepted) acceptedFiles.push(files[i]);
+            }
+            self.emit("addedfiles", acceptedFiles);
+          });
         } else {
           this.handleFiles(files);
+          this.emit("addedfiles", files);
         }
       }
     }
@@ -1668,9 +1674,9 @@ var Dropzone = function (_Emitter) {
     value: function handleFiles(files) {
       var _this5 = this;
 
-      return files.map(function (file) {
-        return _this5.addFile(file);
-      });
+      for (var i = 0; i < files.length; i++){
+        return _this5.addFile(files[i]);
+      }
     }
 
     // When a folder is dropped (or files are pasted), items must be handled
@@ -1678,7 +1684,7 @@ var Dropzone = function (_Emitter) {
 
   }, {
     key: "_addFilesFromItems",
-    value: function _addFilesFromItems(items) {
+    value: function _addFilesFromItems(items, done) {
       var _this6 = this;
 
       return function () {
@@ -1698,18 +1704,32 @@ var Dropzone = function (_Emitter) {
           var item = _ref13;
 
           var entry;
+          var readingDirs = 0;
+
           if (item.webkitGetAsEntry != null && (entry = item.webkitGetAsEntry())) {
             if (entry.isFile) {
-              result.push(_this6.addFile(item.getAsFile()));
+              var f = item.getAsFile();
+              _this6.addFile(f);
+              result.push(f);
             } else if (entry.isDirectory) {
+              readingDirs++;
               // Append all files from that directory to files
-              result.push(_this6._addFilesFromDirectory(entry, entry.name));
+              _this6._addFilesFromDirectory(entry, entry.name, function(added){
+                for (var i = 0; i < added.length; i++){
+                  result.push(added[i]);
+                }
+                setTimeout(function(){
+                  if (--readingDirs === 0) done(result);
+                }, 0);
+              });
             } else {
               result.push(undefined);
             }
           } else if (item.getAsFile != null) {
             if (item.kind == null || item.kind === "file") {
-              result.push(_this6.addFile(item.getAsFile()));
+              var f = item.getAsFile();
+              _this6.addFile(f);
+              result.push(f);
             } else {
               result.push(undefined);
             }
@@ -1717,6 +1737,7 @@ var Dropzone = function (_Emitter) {
             result.push(undefined);
           }
         }
+        if (readingDirs === 0) done(result);
         return result;
       }();
     }
@@ -1725,18 +1746,23 @@ var Dropzone = function (_Emitter) {
 
   }, {
     key: "_addFilesFromDirectory",
-    value: function _addFilesFromDirectory(directory, path) {
+    value: function _addFilesFromDirectory(directory, path, done) {
       var _this7 = this;
 
       var dirReader = directory.createReader();
+      var added = [];
+      var readingDirs = 0;
+      var readingFiles = 0;
 
       var errorHandler = function errorHandler(error) {
         return __guardMethod__(console, 'log', function (o) {
           return o.log(error);
         });
       };
+      
+      var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') !== -1;
 
-      var readEntries = function readEntries() {
+      var readEntries = function () {
         return dirReader.readEntries(function (entries) {
           if (entries.length > 0) {
             for (var _iterator15 = entries, _isArray15 = true, _i16 = 0, _iterator15 = _isArray15 ? _iterator15 : _iterator15[Symbol.iterator]();;) {
@@ -1754,15 +1780,32 @@ var Dropzone = function (_Emitter) {
               var entry = _ref14;
 
               if (entry.isFile) {
+                readingFiles++;
                 entry.file(function (file) {
                   if (_this7.options.ignoreHiddenFiles && file.name.substring(0, 1) === '.') {
+                    if (readingDirs === 0 && --readingFiles === 0) done(added, true);
                     return;
                   }
                   file.fullPath = path + "/" + file.name;
-                  return _this7.addFile(file);
+                  added.push(file);
+                  var f = _this7.addFile(file);
+                  if (readingDirs === 0 && --readingFiles === 0) done(added, true);
+                    
+                  return f;
                 });
               } else if (entry.isDirectory) {
-                _this7._addFilesFromDirectory(entry, path + "/" + entry.name);
+                readingDirs++;
+                _this7._addFilesFromDirectory(entry, path + "/" + entry.name, function(entries, skipPush){
+                  for (var i = 0; i < entries.length; i++){
+                    if (isFirefox){
+                      if (!skipPush) added.push(entries[i]);
+                    }else added.push(entries[i]);
+                  }
+
+                  setTimeout(function(){
+                    if (--readingDirs === 0 && readingFiles === 0) done(added);
+                  }, 0);
+                });
               }
             }
 
@@ -1770,7 +1813,8 @@ var Dropzone = function (_Emitter) {
             // the first 100 entries.
             // See: https://developer.mozilla.org/en-US/docs/Web/API/DirectoryReader#readEntries
             readEntries();
-          }
+          }else if (readingDirs === 0 && readingFiles === 0) done(added);
+
           return null;
         }, errorHandler);
       };