Trevor Parscal has uploaded a new change for review.
https://gerrit.wikimedia.org/r/111340
Change subject: Only populate lookup widget menus asynchronously
......................................................................
Only populate lookup widget menus asynchronously
Problems:
* The previous design was to clear the menu while waiting for data from the
server, so we would "populate" immediately while there were no matching items,
and then again when the data came back. This cause the menu to flash open and
closed as you typed, which was really annoying and buggy looking.
Solutions:
* Return a deferred object when getting menu items instead of an array, and
always resolve it asynchronously, event in cases where the result can be pulled
from cache.
Change-Id: Ic94fb1c1a888c99a4376504abffb0ac0f3aa7791
---
M src/widgets/OO.ui.LookupInputWidget.js
1 file changed, 30 insertions(+), 17 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/oojs/ui refs/changes/40/111340/1
diff --git a/src/widgets/OO.ui.LookupInputWidget.js
b/src/widgets/OO.ui.LookupInputWidget.js
index d77deb8..5a4486a 100644
--- a/src/widgets/OO.ui.LookupInputWidget.js
+++ b/src/widgets/OO.ui.LookupInputWidget.js
@@ -100,6 +100,7 @@
this.lookupMenu.show();
}
} else {
+ this.lookupMenu.clearItems();
this.lookupMenu.hide();
}
@@ -113,17 +114,21 @@
* @chainable
*/
OO.ui.LookupInputWidget.prototype.populateLookupMenu = function () {
- var items = this.getLookupMenuItems();
-
- this.lookupMenu.clearItems();
-
- if ( items.length ) {
- this.lookupMenu.show();
- this.lookupMenu.addItems( items );
- this.initializeLookupMenuSelection();
- } else {
- this.lookupMenu.hide();
- }
+ this.getLookupMenuItems()
+ .done( OO.ui.bind( function ( items ) {
+ this.lookupMenu.clearItems();
+ if ( items.length ) {
+ this.lookupMenu.show();
+ this.lookupMenu.addItems( items );
+ this.initializeLookupMenuSelection();
+ this.openLookupMenu();
+ } else {
+ this.lookupMenu.hide();
+ }
+ }, this ) )
+ .fail( OO.ui.bind( function () {
+ this.lookupMenu.clearItems();
+ }, this ) );
return this;
};
@@ -145,10 +150,15 @@
* Get lookup menu items for the current query.
*
* @method
- * @returns {OO.ui.MenuItemWidget[]} Menu items
+ * @returns {jQuery.Promise} Promise object which will be passed menu items as
the first argument
+ * of the done event
*/
OO.ui.LookupInputWidget.prototype.getLookupMenuItems = function () {
- var value = this.lookupInput.getValue();
+ var value = this.lookupInput.getValue(),
+ deferred = $.Deferred(),
+ done = OO.ui.bind( function () {
+ deferred.resolve( this.getLookupMenuItemsFromData(
this.lookupCache[value] ) );
+ }, this );
if ( value && value !== this.lookupQuery ) {
// Abort current request if query has changed
@@ -158,7 +168,7 @@
this.lookupRequest = null;
}
if ( value in this.lookupCache ) {
- return this.getLookupMenuItemsFromData(
this.lookupCache[value] );
+ setTimeout( done );
} else {
this.lookupQuery = value;
this.lookupRequest = this.getLookupRequest()
@@ -168,15 +178,18 @@
}, this ) )
.done( OO.ui.bind( function ( data ) {
this.lookupCache[value] =
this.getLookupCacheItemFromData( data );
- this.openLookupMenu();
- }, this ) );
+ done();
+ }, this ) )
+ .fail( function () {
+ deferred.reject();
+ } );
this.pushPending();
this.lookupRequest.always( OO.ui.bind( function () {
this.popPending();
}, this ) );
}
}
- return [];
+ return deferred.promise();
};
/**
--
To view, visit https://gerrit.wikimedia.org/r/111340
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Ic94fb1c1a888c99a4376504abffb0ac0f3aa7791
Gerrit-PatchSet: 1
Gerrit-Project: oojs/ui
Gerrit-Branch: master
Gerrit-Owner: Trevor Parscal <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
