mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/Echo
synced 2024-12-01 10:56:44 +00:00
3937857bd8
This makes the actions more consistent, and also allows for separating
the two behaviors: The one where we need a link to a destination
(User page, diff, etc) and one where we have an action the code needs
to take care of ("Mark as read" or, in the future, volume control, etc)
Also, this allows for adding descriptions to the secondary links in
the dotdotdot menu.
It also fixes the bug where the links did not work.
Bug: T125160
Change-Id: I0ebf3fc62425f86e2e7f1e96b67f8dc34db83efb
77 lines
2.1 KiB
JavaScript
77 lines
2.1 KiB
JavaScript
( function ( mw, $ ) {
|
|
/**
|
|
* Secondary menu item
|
|
*
|
|
* @class
|
|
* @extends OO.ui.Widget
|
|
*
|
|
* @constructor
|
|
* @param {Object} [config] Configuration object
|
|
* @cfg {string} [description] An optional description for the item
|
|
* @cfg {string} [icon] An optional icon for the item
|
|
* @cfg {boolean} [prioritized] The item is prioritized outside the
|
|
* popup menu.
|
|
*/
|
|
mw.echo.ui.MenuItemWidget = function MwEchoUiMenuItemWidget( config ) {
|
|
config = config || {};
|
|
|
|
// Parent constructor
|
|
mw.echo.ui.MenuItemWidget.parent.call( this, config );
|
|
|
|
// Mixin constructors
|
|
OO.ui.mixin.IconElement.call( this, config );
|
|
|
|
this.prioritized = !!config.prioritized;
|
|
|
|
// Optional description
|
|
this.descriptionLabel = new OO.ui.LabelWidget( {
|
|
classes: [ 'mw-echo-ui-menuItemWidget-content-description' ],
|
|
label: config.description || ''
|
|
} );
|
|
this.descriptionLabel.toggle( !this.prioritized );
|
|
|
|
// Build the option
|
|
this.$element
|
|
.addClass( 'mw-echo-ui-menuItemWidget' )
|
|
.toggleClass( 'mw-echo-ui-menuItemWidget-prioritized', this.prioritized )
|
|
.append(
|
|
this.$icon
|
|
.addClass( 'mw-echo-ui-menuItemWidget-icon' ),
|
|
$( '<div>' )
|
|
.addClass( 'mw-echo-ui-menuItemWidget-content' )
|
|
.append(
|
|
this.$label
|
|
.addClass( 'mw-echo-ui-menuItemWidget-content-label' ),
|
|
this.descriptionLabel.$element
|
|
)
|
|
);
|
|
|
|
if ( config.url ) {
|
|
this.$element.contents()
|
|
.wrapAll(
|
|
// HACK: Wrap the entire item with a link that takes
|
|
// the user to the primary url. This is not perfect,
|
|
// but it makes the behavior native to the browser rather
|
|
// than us listening to click events and opening new
|
|
// windows.
|
|
$( '<a>' )
|
|
.addClass( 'mw-echo-ui-menuItemWidget-linkWrapper' )
|
|
.attr( 'href', config.url )
|
|
);
|
|
}
|
|
};
|
|
|
|
/* Initialization */
|
|
|
|
OO.inheritClass( mw.echo.ui.MenuItemWidget, OO.ui.OptionWidget );
|
|
OO.mixinClass( mw.echo.ui.MenuItemWidget, OO.ui.mixin.IconElement );
|
|
|
|
/* Static Properties */
|
|
|
|
mw.echo.ui.MenuItemWidget.static.selectable = false;
|
|
mw.echo.ui.MenuItemWidget.static.highlightable = false;
|
|
mw.echo.ui.MenuItemWidget.static.pressable = false;
|
|
|
|
} )( mediaWiki, jQuery );
|
|
|