mbk-lab
/
nextcloud
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #9807 from nextcloud/fix-highlighting-of-the-upload-drop-zone 

Fix highlighting of the upload drop zone
This commit is contained in:
John Molakvoæ 2018-06-11 09:17:48 +02:00 committed by GitHub
parent 51d867c5d7 4eafae4178
commit a1496d7cc1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 36 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
apps/files/js/file-upload.js
View File

@ -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) {

12
apps/files/js/jquery.fileupload.js vendored
View File

@ -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})
);
}
},