X-Git-Url: https://git.heureux-cyclage.org/?a=blobdiff_plain;f=resources%2Fsrc%2Fmediawiki.rcfilters%2Fui%2Fmw.rcfilters.ui.FilterItemHighlightButton.js;h=835cec892e39e2332e2402533903e3f8c7a28d8a;hb=fe94275c8fcfc248a5eae857dde7c5772d993ab5;hp=616608e546696f35011d6c4382a677617a2003d7;hpb=2d71bf187d5a56ed808a5ae3845d14e51008f195;p=lhc%2Fweb%2Fwiklou.git

diff --git a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterItemHighlightButton.js b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterItemHighlightButton.js
index 616608e546..f4a40cbbb8 100644
--- a/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterItemHighlightButton.js
+++ b/resources/src/mediawiki.rcfilters/ui/mw.rcfilters.ui.FilterItemHighlightButton.js
@@ -1,4 +1,4 @@
-( function ( mw, $ ) {
+( function () {
 	/**
 	 * A button to configure highlight for a filter item
 	 *
@@ -7,43 +7,31 @@
 	 * @constructor
 	 * @param {mw.rcfilters.Controller} controller RCFilters controller
 	 * @param {mw.rcfilters.dm.FilterItem} model Filter item model
+	 * @param {mw.rcfilters.ui.HighlightPopupWidget} highlightPopup Shared highlight color picker
 	 * @param {Object} [config] Configuration object
 	 */
-	mw.rcfilters.ui.FilterItemHighlightButton = function MwRcfiltersUiFilterItemHighlightButton( controller, model, config ) {
+	mw.rcfilters.ui.FilterItemHighlightButton = function MwRcfiltersUiFilterItemHighlightButton( controller, model, highlightPopup, config ) {
 		config = config || {};
 
-		this.colorPickerWidget = new mw.rcfilters.ui.HighlightColorPickerWidget( controller, model );
-
 		// Parent
 		mw.rcfilters.ui.FilterItemHighlightButton.parent.call( this, $.extend( true, {}, config, {
 			icon: 'highlight',
-			indicator: 'down',
-			popup: {
-				// TODO: There is a bug in non-anchored popups in
-				// OOUI, so we set this popup to "anchored" until
-				// the bug is fixed.
-				// See: https://phabricator.wikimedia.org/T159906
-				anchor: true,
-				padded: true,
-				align: 'backwards',
-				horizontalPosition: 'end',
-				$floatableContainer: this.$element,
-				width: 290,
-				$content: this.colorPickerWidget.$element
-			}
+			indicator: 'down'
 		} ) );
 
 		this.controller = controller;
 		this.model = model;
+		this.popup = highlightPopup;
 
 		// Event
-		this.model.connect( this, { update: 'onModelUpdate' } );
-		this.colorPickerWidget.connect( this, { chooseColor: 'onChooseColor' } );
+		this.model.connect( this, { update: 'updateUiBasedOnModel' } );
 		// This lives inside a MenuOptionWidget, which intercepts mousedown
 		// to select the item. We want to prevent that when we click the highlight
 		// button
 		this.$element.on( 'mousedown', function ( e ) { e.stopPropagation(); } );
 
+		this.updateUiBasedOnModel();
+
 		this.$element
 			.addClass( 'mw-rcfilters-ui-filterItemHighlightButton' );
 	};
@@ -56,16 +44,23 @@
 
 	/**
 	 * @static
-	 * @inheritdoc
 	 */
 	mw.rcfilters.ui.FilterItemHighlightButton.static.cancelButtonMouseDownEvents = true;
 
 	/* Methods */
 
+	mw.rcfilters.ui.FilterItemHighlightButton.prototype.onAction = function () {
+		this.popup.setAssociatedButton( this );
+		this.popup.setFilterItem( this.model );
+
+		// Parent method
+		mw.rcfilters.ui.FilterItemHighlightButton.parent.prototype.onAction.call( this );
+	};
+
 	/**
 	 * Respond to item model update event
 	 */
-	mw.rcfilters.ui.FilterItemHighlightButton.prototype.onModelUpdate = function () {
+	mw.rcfilters.ui.FilterItemHighlightButton.prototype.updateUiBasedOnModel = function () {
 		var currentColor = this.model.getHighlightColor(),
 			widget = this;
 
@@ -82,8 +77,4 @@
 				);
 		} );
 	};
-
-	mw.rcfilters.ui.FilterItemHighlightButton.prototype.onChooseColor = function () {
-		this.popup.toggle( false );
-	};
-}( mediaWiki, jQuery ) );
+}() );