Keep showing the working icon while there are pending operations
Before, whenever a pending operation (getting the suggestions, confirming a share or selecting a recipient) finished the working icon was hidden and the confirm button was shown again, even if there were other pending operations (the most common case is typing slowly on the input field, as several operations to get the suggestions could pile if the server response is not received fast enough). Now, the working icon is not hidden until the last pending operation finishes. Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
This commit is contained in:
parent
a2c52cd6a5
commit
203bf51543
2 changed files with 94 additions and 17 deletions
|
@ -68,6 +68,9 @@
|
|||
/** @type {object} **/
|
||||
_lastSuggestions: undefined,
|
||||
|
||||
/** @type {int} **/
|
||||
_pendingOperationsCount: 0,
|
||||
|
||||
events: {
|
||||
'focus .shareWithField': 'onShareWithFieldFocus',
|
||||
'input .shareWithField': 'onShareWithFieldChanged',
|
||||
|
@ -339,6 +342,7 @@
|
|||
$loading.removeClass('hidden');
|
||||
$loading.addClass('inlineblock');
|
||||
$confirm.addClass('hidden');
|
||||
this._pendingOperationsCount++;
|
||||
|
||||
$shareWithField.removeClass('error')
|
||||
.tooltip('hide');
|
||||
|
@ -349,9 +353,12 @@
|
|||
perPage,
|
||||
view.model
|
||||
).done(function(suggestions) {
|
||||
$loading.addClass('hidden');
|
||||
$loading.removeClass('inlineblock');
|
||||
$confirm.removeClass('hidden');
|
||||
view._pendingOperationsCount--;
|
||||
if (view._pendingOperationsCount === 0) {
|
||||
$loading.addClass('hidden');
|
||||
$loading.removeClass('inlineblock');
|
||||
$confirm.removeClass('hidden');
|
||||
}
|
||||
|
||||
if (suggestions.length > 0) {
|
||||
$shareWithField
|
||||
|
@ -386,9 +393,12 @@
|
|||
response();
|
||||
}
|
||||
}).fail(function(message) {
|
||||
$loading.addClass('hidden');
|
||||
$loading.removeClass('inlineblock');
|
||||
$confirm.removeClass('hidden');
|
||||
view._pendingOperationsCount--;
|
||||
if (view._pendingOperationsCount === 0) {
|
||||
$loading.addClass('hidden');
|
||||
$loading.removeClass('inlineblock');
|
||||
$confirm.removeClass('hidden');
|
||||
}
|
||||
|
||||
if (message) {
|
||||
OC.Notification.showTemporary(t('core', 'An error occurred ("{message}"). Please try again', { message: message }));
|
||||
|
@ -431,6 +441,8 @@
|
|||
},
|
||||
|
||||
_onSelectRecipient: function(e, s) {
|
||||
var self = this;
|
||||
|
||||
e.preventDefault();
|
||||
// Ensure that the keydown handler for the input field is not
|
||||
// called; otherwise it would try to add the recipient again, which
|
||||
|
@ -438,11 +450,14 @@
|
|||
e.stopImmediatePropagation();
|
||||
$(e.target).attr('disabled', true)
|
||||
.val(s.item.label);
|
||||
|
||||
var $loading = this.$el.find('.shareWithLoading');
|
||||
$loading.removeClass('hidden')
|
||||
.addClass('inlineblock');
|
||||
var $confirm = this.$el.find('.shareWithConfirm');
|
||||
|
||||
$loading.removeClass('hidden');
|
||||
$loading.addClass('inlineblock');
|
||||
$confirm.addClass('hidden');
|
||||
this._pendingOperationsCount++;
|
||||
|
||||
this.model.addShare(s.item.value, {success: function() {
|
||||
// Adding a share changes the suggestions.
|
||||
|
@ -450,16 +465,24 @@
|
|||
|
||||
$(e.target).val('')
|
||||
.attr('disabled', false);
|
||||
$loading.addClass('hidden')
|
||||
.removeClass('inlineblock');
|
||||
$confirm.removeClass('hidden');
|
||||
|
||||
self._pendingOperationsCount--;
|
||||
if (self._pendingOperationsCount === 0) {
|
||||
$loading.addClass('hidden');
|
||||
$loading.removeClass('inlineblock');
|
||||
$confirm.removeClass('hidden');
|
||||
}
|
||||
}, error: function(obj, msg) {
|
||||
OC.Notification.showTemporary(msg);
|
||||
$(e.target).attr('disabled', false)
|
||||
.autocomplete('search', $(e.target).val());
|
||||
$loading.addClass('hidden')
|
||||
.removeClass('inlineblock');
|
||||
$confirm.removeClass('hidden');
|
||||
|
||||
self._pendingOperationsCount--;
|
||||
if (self._pendingOperationsCount === 0) {
|
||||
$loading.addClass('hidden');
|
||||
$loading.removeClass('inlineblock');
|
||||
$confirm.removeClass('hidden');
|
||||
}
|
||||
}});
|
||||
},
|
||||
|
||||
|
@ -472,6 +495,7 @@
|
|||
$loading.removeClass('hidden');
|
||||
$loading.addClass('inlineblock');
|
||||
$confirm.addClass('hidden');
|
||||
this._pendingOperationsCount++;
|
||||
|
||||
$shareWithField.prop('disabled', true);
|
||||
|
||||
|
@ -485,9 +509,12 @@
|
|||
$shareWithField.autocomplete('disable');
|
||||
|
||||
var restoreUI = function() {
|
||||
$loading.addClass('hidden');
|
||||
$loading.removeClass('inlineblock');
|
||||
$confirm.removeClass('hidden');
|
||||
self._pendingOperationsCount--;
|
||||
if (self._pendingOperationsCount === 0) {
|
||||
$loading.addClass('hidden');
|
||||
$loading.removeClass('inlineblock');
|
||||
$confirm.removeClass('hidden');
|
||||
}
|
||||
|
||||
$shareWithField.prop('disabled', false);
|
||||
$shareWithField.focus();
|
||||
|
|
|
@ -2009,6 +2009,56 @@ describe('OC.Share.ShareDialogView', function() {
|
|||
|
||||
addShareStub.restore();
|
||||
});
|
||||
|
||||
it('hides the loading icon when all the pending operations finish', function() {
|
||||
dialog.render();
|
||||
|
||||
expect(dialog.$el.find('.shareWithLoading').hasClass('hidden')).toEqual(true);
|
||||
expect(dialog.$el.find('.shareWithConfirm').hasClass('hidden')).toEqual(false);
|
||||
|
||||
var response = sinon.stub();
|
||||
dialog.autocompleteHandler({term: 'bob'}, response);
|
||||
dialog.autocompleteHandler({term: 'bobby'}, response);
|
||||
|
||||
var jsonData = JSON.stringify({
|
||||
'ocs': {
|
||||
'meta': {
|
||||
'status': 'success',
|
||||
'statuscode': 100,
|
||||
'message': null
|
||||
},
|
||||
'data': {
|
||||
'exact': {
|
||||
'users': [],
|
||||
'groups': [],
|
||||
'remotes': []
|
||||
},
|
||||
'users': [],
|
||||
'groups': [],
|
||||
'remotes': [],
|
||||
'lookup': []
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
fakeServer.requests[0].respond(
|
||||
200,
|
||||
{'Content-Type': 'application/json'},
|
||||
jsonData
|
||||
);
|
||||
|
||||
expect(dialog.$el.find('.shareWithLoading').hasClass('hidden')).toEqual(false);
|
||||
expect(dialog.$el.find('.shareWithConfirm').hasClass('hidden')).toEqual(true);
|
||||
|
||||
fakeServer.requests[1].respond(
|
||||
200,
|
||||
{'Content-Type': 'application/json'},
|
||||
jsonData
|
||||
);
|
||||
|
||||
expect(dialog.$el.find('.shareWithLoading').hasClass('hidden')).toEqual(true);
|
||||
expect(dialog.$el.find('.shareWithConfirm').hasClass('hidden')).toEqual(false);
|
||||
});
|
||||
});
|
||||
describe('confirm share', function() {
|
||||
var addShareStub;
|
||||
|
|
Loading…
Reference in a new issue