*
* selector.setSearchType( [ mw.widgets.CategorySelector.SearchType.SubCategories ] );
*
- *
* @class mw.widgets.CategorySelector
* @uses mw.Api
* @extends OO.ui.CapsuleMultiSelectWidget
+ * @mixins OO.ui.mixin.PendingElement
*
* @constructor
* @param {Object} [config] Configuration options
+ * @cfg {mw.Api} [api] Instance of mw.Api (or subclass thereof) to use for queries
* @cfg {number} [limit=10] Maximum number of results to load
* @cfg {mw.widgets.CategorySelector.SearchType[]} [searchTypes=[mw.widgets.CategorySelector.SearchType.OpenSearch]]
* Default search API to use when searching.
allowArbitrary: true
} ) );
+ // Mixin constructors
+ OO.ui.mixin.PendingElement.call( this, $.extend( {}, config, { $pending: this.$handle } ) );
+
// Event handler to call the autocomplete methods
this.$input.on( 'change input cut paste', OO.ui.debounce( this.updateMenuItems.bind( this ), 100 ) );
// Initialize
- this.api = new mw.Api();
-
+ this.api = config.api || new mw.Api();
}
/* Setup */
OO.inheritClass( CategorySelector, OO.ui.CapsuleMultiSelectWidget );
+ OO.mixinClass( CategorySelector, OO.ui.mixin.PendingElement );
CSP = CategorySelector.prototype;
/* Methods */
var existingItems, filteredItems,
menu = this.getMenu();
+ // Never show the menu if the input lost focus in the meantime
+ if ( !this.$input.is( ':focus' ) ) {
+ return;
+ }
+
// Array of strings of the data of OO.ui.MenuOptionsWidgets
existingItems = menu.getItems().map( function ( item ) {
return item.data;
}.bind( this ) );
};
+ /**
+ * @inheritdoc
+ */
+ CSP.clearInput = function () {
+ CategorySelector.parent.prototype.clearInput.call( this );
+ // Abort all pending requests, we won't need their results
+ this.api.abort();
+ };
+
/**
* Searches for categories based on the input.
*
CSP.getNewMenuItems = function ( input ) {
var i,
promises = [],
- deferred = new $.Deferred();
+ deferred = $.Deferred();
+ if ( $.trim( input ) === '' ) {
+ deferred.resolve( [] );
+ return deferred.promise();
+ }
+
+ // Abort all pending requests, we won't need their results
+ this.api.abort();
for ( i = 0; i < this.searchTypes.length; i++ ) {
promises.push( this.searchCategories( input, this.searchTypes[ i ] ) );
}
+ this.pushPending();
+
$.when.apply( $, promises ).done( function () {
var categories, categoryNames,
allData = [],
deferred.resolve( categoryNames );
- } );
+ } ).always( this.popPending.bind( this ) );
return deferred.promise();
};
*/
CSP.createItemWidget = function ( data ) {
return new mw.widgets.CategoryCapsuleItemWidget( {
+ apiUrl: this.api.apiUrl || undefined,
title: mw.Title.newFromText( data, NS_CATEGORY )
} );
};
* @return {jQuery.Promise} Resolves with an array of categories
*/
CSP.searchCategories = function ( input, searchType ) {
- var deferred = new $.Deferred();
+ var deferred = $.Deferred();
switch ( searchType ) {
case CategorySelector.SearchType.OpenSearch:
} ).done( function ( res ) {
var categories = res[ 1 ];
deferred.resolve( categories );
- } );
+ } ).fail( deferred.reject.bind( deferred ) );
break;
case CategorySelector.SearchType.InternalSearch:
return page.title;
} );
deferred.resolve( categories );
- } );
+ } ).fail( deferred.reject.bind( deferred ) );
break;
case CategorySelector.SearchType.Exists:
}
deferred.resolve( categories );
- } );
+ } ).fail( deferred.reject.bind( deferred ) );
break;
case CategorySelector.SearchType.SubCategories:
return category.title;
} );
deferred.resolve( categories );
- } );
+ } ).fail( deferred.reject.bind( deferred ) );
break;
case CategorySelector.SearchType.ParentCategories:
}
deferred.resolve( categories );
- } );
+ } ).fail( deferred.reject.bind( deferred ) );
break;
default: