diff --git a/apps/files/js/file-upload.js b/apps/files/js/file-upload.js index 824f6a1fd5..fac086c3da 100644 --- a/apps/files/js/file-upload.js +++ b/apps/files/js/file-upload.js @@ -1041,6 +1041,8 @@ OC.Uploader.prototype = _.extend({ //remaining time var lastUpdate, lastSize, bufferSize, buffer, bufferIndex, bufferIndex2, bufferTotal; + var dragging = false; + // add progress handlers fileupload.on('fileuploadadd', function(e, data) { self.log('progress handle fileuploadadd', e, data); @@ -1131,23 +1133,8 @@ OC.Uploader.prototype = _.extend({ self.log('progress handle fileuploadfail', e, data); self.trigger('fail', e, data); }); - var disableDropState = function() { - $('#app-content').removeClass('file-drag'); - $('.dropping-to-dir').removeClass('dropping-to-dir'); - $('.dir-drop').removeClass('dir-drop'); - $('.icon-filetype-folder-drag-accept').removeClass('icon-filetype-folder-drag-accept'); - }; - var disableClassOnFirefox = _.debounce(function() { - disableDropState(); - }, 100); fileupload.on('fileuploaddragover', function(e){ $('#app-content').addClass('file-drag'); - // dropping a folder in firefox doesn't cause a drop event - // this is simulated by simply invoke disabling all classes - // once no dragover event isn't noticed anymore - if (/Firefox/i.test(navigator.userAgent)) { - disableClassOnFirefox(); - } $('#emptycontent .icon-folder').addClass('icon-filetype-folder-drag-accept'); var filerow = $(e.delegatedEvent.target).closest('tr'); @@ -1163,12 +1150,33 @@ OC.Uploader.prototype = _.extend({ filerow.addClass('dropping-to-dir'); filerow.find('.thumbnail').addClass('icon-filetype-folder-drag-accept'); } + + dragging = true; }); - fileupload.on('fileuploaddragleave fileuploaddrop', function (){ + + var disableDropState = function() { $('#app-content').removeClass('file-drag'); $('.dropping-to-dir').removeClass('dropping-to-dir'); $('.dir-drop').removeClass('dir-drop'); $('.icon-filetype-folder-drag-accept').removeClass('icon-filetype-folder-drag-accept'); + + dragging = false; + }; + + fileupload.on('fileuploaddragleave fileuploaddrop', disableDropState); + + // In some browsers the "drop" event can be triggered with no + // files even if the "dragover" event seemed to suggest that a + // file was being dragged (and thus caused "fileuploaddragover" + // to be triggered). + fileupload.on('fileuploaddropnofiles', function() { + if (!dragging) { + return; + } + + disableDropState(); + + OC.Notification.show(t('files', 'Uploading that item is not supported'), {type: 'error'}); }); fileupload.on('fileuploadchunksend', function(e, data) { diff --git a/apps/files/js/jquery.fileupload.js b/apps/files/js/jquery.fileupload.js index 622161ede9..ea8529f322 100644 --- a/apps/files/js/jquery.fileupload.js +++ b/apps/files/js/jquery.fileupload.js @@ -258,6 +258,9 @@ // Callback for drop events of the dropZone(s): // drop: function (e, data) {}, // .bind('fileuploaddrop', func); + // Callback for drop events of the dropZone(s) when there are no files: + // dropnofiles: function (e) {}, // .bind('fileuploaddropnofiles', func); + // Callback for dragover events of the dropZone(s): // dragover: function (e) {}, // .bind('fileuploaddragover', func); @@ -1275,6 +1278,15 @@ that._onAdd(e, data); } }); + } else { + // "dropnofiles" is triggered to allow proper cleanup of the + // drag and drop operation, as some browsers trigger "drop" + // events that have no files even if the "DataTransfer.types" of + // the "dragover" event included a "Files" item. + this._trigger( + 'dropnofiles', + $.Event('drop', {delegatedEvent: e}) + ); } },