From: Bartosz Dziewoński Date: Thu, 29 Jun 2017 20:04:34 +0000 (+0200) Subject: Make mw.widgets.SearchInputWidget extend OO.ui.SearchInputWidget X-Git-Tag: 1.31.0-rc.0~2660^2~1 X-Git-Url: http://git.cyclocoop.org/%24image?a=commitdiff_plain;h=7882e3b66060f7bbd37e15688baf4dd30954b1b7;p=lhc%2Fweb%2Fwiklou.git Make mw.widgets.SearchInputWidget extend OO.ui.SearchInputWidget Mixin mw.widgets.TitleWidget instead of extending mw.widgets.TitleInputWidget. * Remove code that reimplemented pieces of OO.ui.SearchInputWidget. * Remove code that overrode pieces of mw.widgets.TitleInputWidget. * Copy the code from mw.widgets.TitleInputWidget that we actually want. This should result in no functional changes, other than losing the TitleInputWidget API (some methods and config options) that no one relied on, as far as I can tell. Bug: T169194 Change-Id: Ic1482b4c7cfde7d4cf0b8900654bd3a454776010 --- diff --git a/includes/widget/SearchInputWidget.php b/includes/widget/SearchInputWidget.php index 90792fc195..47d3717b28 100644 --- a/includes/widget/SearchInputWidget.php +++ b/includes/widget/SearchInputWidget.php @@ -10,12 +10,10 @@ namespace MediaWiki\Widget; /** * Search input widget. */ -class SearchInputWidget extends TitleInputWidget { +class SearchInputWidget extends \OOUI\TextInputWidget { protected $pushPending = false; protected $performSearchOnClick = true; - protected $validateTitle = false; - protected $highlightFirst = false; protected $dataLocation = 'header'; /** @@ -30,7 +28,6 @@ class SearchInputWidget extends TitleInputWidget { */ public function __construct( array $config = [] ) { $config = array_merge( [ - 'maxLength' => null, 'icon' => 'search', ], $config ); diff --git a/resources/Resources.php b/resources/Resources.php index ccfe97074a..4176fe6571 100644 --- a/resources/Resources.php +++ b/resources/Resources.php @@ -2538,9 +2538,9 @@ return [ ], 'dependencies' => [ 'mediawiki.searchSuggest', - 'oojs-ui.styles.icons-interactions', - // FIXME: Needs TitleInputWidget only + // FIXME: Needs TitleWidget only 'mediawiki.widgets', + 'oojs-ui-widgets', ], ], 'mediawiki.widgets.SearchInputWidget.styles' => [ diff --git a/resources/src/mediawiki.widgets/mw.widgets.SearchInputWidget.js b/resources/src/mediawiki.widgets/mw.widgets.SearchInputWidget.js index 08997aa444..22e587479c 100644 --- a/resources/src/mediawiki.widgets/mw.widgets.SearchInputWidget.js +++ b/resources/src/mediawiki.widgets/mw.widgets.SearchInputWidget.js @@ -10,7 +10,9 @@ * Creates a mw.widgets.SearchInputWidget object. * * @class - * @extends mw.widgets.TitleInputWidget + * @extends OO.ui.SearchInputWidget + * @mixins mw.widgets.TitleWidget + * @mixins OO.ui.mixin.LookupElement * * @constructor * @param {Object} [config] Configuration options @@ -30,21 +32,25 @@ var $form = config.$input ? config.$input.closest( 'form' ) : $(); config = $.extend( { - icon: 'search', - maxLength: undefined, performSearchOnClick: true, - dataLocation: 'header', - namespace: 0 + dataLocation: 'header' }, config ); // Parent constructor - mw.widgets.SearchInputWidget.parent.call( this, config ); + mw.widgets.SearchInputWidget.parent.call( this, $.extend( {}, config, { + autocomplete: false + } ) ); + + // Mixin constructors + mw.widgets.TitleWidget.call( this, config ); + OO.ui.mixin.LookupElement.call( this, config ); // Initialization this.$element.addClass( 'mw-widget-searchInputWidget' ); this.lookupMenu.$element.addClass( 'mw-widget-searchWidget-menu' ); this.lastLookupItems = []; if ( !config.pushPending ) { + // TODO This actually overrides a method, that's pretty crazy. Surely there's a better way? this.pushPending = false; } if ( config.dataLocation ) { @@ -66,78 +72,28 @@ ) } ); }.bind( this ) ); - - this.$element.addClass( 'oo-ui-textInputWidget-type-search' ); - this.updateSearchIndicator(); - this.connect( this, { - disable: 'onDisable' - } ); }; /* Setup */ - OO.inheritClass( mw.widgets.SearchInputWidget, mw.widgets.TitleInputWidget ); + OO.inheritClass( mw.widgets.SearchInputWidget, OO.ui.SearchInputWidget ); + OO.mixinClass( mw.widgets.SearchInputWidget, mw.widgets.TitleWidget ); + OO.mixinClass( mw.widgets.SearchInputWidget, OO.ui.mixin.LookupElement ); /* Methods */ /** - * @inheritdoc - * @protected - */ - mw.widgets.SearchInputWidget.prototype.getInputElement = function () { - return $( '' ).attr( 'type', 'search' ); - }; - - /** - * @inheritdoc - */ - mw.widgets.SearchInputWidget.prototype.onIndicatorMouseDown = function ( e ) { - if ( e.which === OO.ui.MouseButtons.LEFT ) { - // Clear the text field - this.setValue( '' ); - this.$input[ 0 ].focus(); - return false; - } - }; - - /** - * Update the 'clear' indicator displayed on type: 'search' text - * fields, hiding it when the field is already empty or when it's not - * editable. - */ - mw.widgets.SearchInputWidget.prototype.updateSearchIndicator = function () { - if ( this.getValue() === '' || this.isDisabled() || this.isReadOnly() ) { - this.setIndicator( null ); - } else { - this.setIndicator( 'clear' ); - } - }; - - /** - * @see OO.ui.SearchInputWidget#onChange - */ - mw.widgets.SearchInputWidget.prototype.onChange = function () { - mw.widgets.SearchInputWidget.parent.prototype.onChange.call( this ); - this.updateSearchIndicator(); - }; - - /** - * Handle disable events. - * - * @param {boolean} disabled Element is disabled - * @private + * @inheritdoc mw.widgets.TitleWidget */ - mw.widgets.SearchInputWidget.prototype.onDisable = function () { - this.updateSearchIndicator(); + mw.widgets.SearchInputWidget.prototype.getQueryValue = function () { + return this.getValue(); }; /** - * @inheritdoc + * @inheritdoc OO.ui.mixin.LookupElement */ - mw.widgets.SearchInputWidget.prototype.setReadOnly = function ( state ) { - mw.widgets.SearchInputWidget.parent.prototype.setReadOnly.call( this, state ); - this.updateSearchIndicator(); - return this; + mw.widgets.SearchInputWidget.prototype.getLookupRequest = function () { + return this.getSuggestionsPromise(); }; /** @@ -160,13 +116,11 @@ }; /** - * @inheritdoc mw.widgets.TitleInputWidget + * @inheritdoc OO.ui.mixin.LookupElement */ mw.widgets.SearchInputWidget.prototype.getLookupCacheDataFromResponse = function ( response ) { var resp; - // mw.widgets.TitleInputWidget uses response.query, which doesn't exist for opensearch, - // so return the whole response (titles only, and links) resp = { data: response || {}, metadata: { @@ -230,10 +184,13 @@ }; /** - * @inheritdoc + * @inheritdoc OO.ui.mixin.LookupElement */ - mw.widgets.SearchInputWidget.prototype.onLookupMenuItemChoose = function () { - mw.widgets.SearchInputWidget.parent.prototype.onLookupMenuItemChoose.apply( this, arguments ); + mw.widgets.SearchInputWidget.prototype.onLookupMenuItemChoose = function ( item ) { + this.closeLookupMenu(); + this.setLookupsDisabled( true ); + this.setValue( item.getData() ); + this.setLookupsDisabled( !this.suggestions ); if ( this.performSearchOnClick ) { this.$element.closest( 'form' ).submit(); @@ -241,12 +198,10 @@ }; /** - * @inheritdoc + * @inheritdoc OO.ui.mixin.LookupElement */ - mw.widgets.SearchInputWidget.prototype.getLookupMenuOptionsFromData = function () { - var items = mw.widgets.SearchInputWidget.parent.prototype.getLookupMenuOptionsFromData.apply( - this, arguments - ); + mw.widgets.SearchInputWidget.prototype.getLookupMenuOptionsFromData = function ( response ) { + var items = this.getOptionsFromData( response ); this.lastLookupItems = items.map( function ( item ) { return item.data; @@ -255,4 +210,21 @@ return items; }; + /** + * @inheritdoc + */ + mw.widgets.SearchInputWidget.prototype.focus = function () { + var retval; + + // Prevent programmatic focus from opening the menu + this.setLookupsDisabled( true ); + + // Parent method + retval = mw.widgets.SearchInputWidget.parent.prototype.focus.apply( this, arguments ); + + this.setLookupsDisabled( !this.suggestions ); + + return retval; + }; + }( jQuery, mediaWiki ) );