Fix folder drag glitch in Firefox

issue:
* drag'n'drop a folder into the files app in Firefox
* the highlight stays there because Firefox doesn't trigger the drop event for folders

solution:
* behave like the drop event if the dragover event isn't fired for 100ms (only applied in Firefox)
This commit is contained in:
Morris Jobke 2016-09-14 13:44:34 +02:00
parent e0dd6768be
commit 78c7ff9acc
No known key found for this signature in database
GPG Key ID: 9CE5ED29E7FCD38A
1 changed files with 16 additions and 6 deletions

View File

@ -667,8 +667,23 @@ OC.Upload = {
OC.Upload._hideProgressBar();
}
});
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 ($.browser['mozilla']) {
disableClassOnFirefox();
}
$('#emptycontent .icon-folder').addClass('icon-filetype-folder-drag-accept');
var filerow = $(e.delegatedEvent.target).closest('tr');
@ -685,12 +700,7 @@ OC.Upload = {
filerow.find('.thumbnail').addClass('icon-filetype-folder-drag-accept');
}
});
fileupload.on('fileuploaddragleave fileuploaddrop', 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');
});
fileupload.on('fileuploaddragleave fileuploaddrop', disableDropState);
} else {
// for all browsers that don't support the progress bar
// IE 8 & 9