diff options
Diffstat (limited to 'Echo/modules/ui')
27 files changed, 114 insertions, 117 deletions
diff --git a/Echo/modules/ui/mw.echo.ui.ActionMenuPopupWidget.js b/Echo/modules/ui/mw.echo.ui.ActionMenuPopupWidget.js index 9d0a81de..c3e287a5 100644 --- a/Echo/modules/ui/mw.echo.ui.ActionMenuPopupWidget.js +++ b/Echo/modules/ui/mw.echo.ui.ActionMenuPopupWidget.js @@ -1,4 +1,4 @@ -( function ( mw ) { +( function () { /** * Action menu popup widget for echo items. * @@ -18,7 +18,8 @@ * @param {Object} [config] Configuration object * @cfg {jQuery} [$overlay] A jQuery element functioning as an overlay * for popups. - * @cfg {number} [menuWidth=300] The width of the popup menu + * @cfg {Object} [horizontalPosition='auto'] How to position the menu, see OO.ui.FloatableElement. + * By default, 'start' will be tried first, and if that doesn't fit, 'end' will be used. */ mw.echo.ui.ActionMenuPopupWidget = function MwEchoUiActionMenuPopupWidget( config ) { config = config || {}; @@ -28,14 +29,14 @@ this.$overlay = config.$overlay || this.$element; - this.menuWidth = config.menuWidth || 300; - // Menu - this.menu = new OO.ui.MenuSelectWidget( { + this.customMenuPosition = ( config.horizontalPosition || 'auto' ) !== 'auto'; + this.menu = new OO.ui.MenuSelectWidget( $.extend( { $floatableContainer: this.$element, + horizontalPosition: this.customMenuPosition ? config.horizontalPosition : 'start', classes: [ 'mw-echo-ui-actionMenuPopupWidget-menu' ], widget: this - } ); + } ) ); this.$overlay.append( this.menu.$element ); // Events @@ -60,14 +61,14 @@ * @private */ mw.echo.ui.ActionMenuPopupWidget.prototype.onAction = function () { + // HACK: If config.horizontalPosition isn't set, first try 'start', then 'end' + if ( !this.customMenuPosition ) { + this.menu.setHorizontalPosition( 'start' ); + } this.menu.toggle(); - // HACK: The menu is attempting to be the same size as the container, - // which in our case is not the point at all. We need the menu - // to be larger, so force this setting: - this.menu.$element.css( 'width', this.menuWidth ); - // HACK: Prevent ClippableElement from overwriting this width value on scroll - // or window resize - this.menu.toggleClipping( false ); + if ( !this.customMenuPosition && this.menu.isClipped() ) { + this.menu.setHorizontalPosition( 'end' ); + } }; /** @@ -86,4 +87,4 @@ mw.echo.ui.ActionMenuPopupWidget.prototype.getMenu = function () { return this.menu; }; -}( mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.BadgeLinkWidget.js b/Echo/modules/ui/mw.echo.ui.BadgeLinkWidget.js index 9eb67e6e..ed1cf4c5 100644 --- a/Echo/modules/ui/mw.echo.ui.BadgeLinkWidget.js +++ b/Echo/modules/ui/mw.echo.ui.BadgeLinkWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /** * Notification badge button widget for echo popup. * @@ -35,6 +35,13 @@ if ( config.href !== undefined && OO.ui.isSafeUrl( config.href ) ) { this.$element.attr( 'href', config.href ); } + if ( this.type === 'alert' ) { + this.$element + .addClass( 'oo-ui-icon-bell' ); + } else { + this.$element + .addClass( 'oo-ui-icon-tray' ); + } }; OO.inheritClass( mw.echo.ui.BadgeLinkWidget, OO.ui.Widget ); @@ -75,4 +82,4 @@ mw.hook( 'ext.echo.badge.countChange' ).fire( this.type, this.count, convertedNumber ); } }; -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.BundleNotificationItemWidget.js b/Echo/modules/ui/mw.echo.ui.BundleNotificationItemWidget.js index bdd07e06..b3c4c9af 100644 --- a/Echo/modules/ui/mw.echo.ui.BundleNotificationItemWidget.js +++ b/Echo/modules/ui/mw.echo.ui.BundleNotificationItemWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /** * Bundle notification item widget. * This widget is expandable and displays @@ -189,8 +189,11 @@ this.expanded = show !== undefined ? !!show : !this.expanded; if ( show ) { + // FIXME: Use CSS transition + // eslint-disable-next-line no-jquery/no-slide this.getList().$element.slideDown(); } else { + // eslint-disable-next-line no-jquery/no-slide this.getList().$element.slideUp(); } }; @@ -219,4 +222,4 @@ mw.echo.ui.BundleNotificationItemWidget.prototype.getList = function () { return this.listWidget; }; -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.ClonedNotificationItemWidget.js b/Echo/modules/ui/mw.echo.ui.ClonedNotificationItemWidget.js index 37046c7e..057638db 100644 --- a/Echo/modules/ui/mw.echo.ui.ClonedNotificationItemWidget.js +++ b/Echo/modules/ui/mw.echo.ui.ClonedNotificationItemWidget.js @@ -1,4 +1,4 @@ -( function ( mw ) { +( function () { /* global moment:false */ /** * A wrapper widget for a fake, cloned notification. This is used @@ -84,4 +84,4 @@ mw.echo.ui.ClonedNotificationItemWidget.prototype.resetInitiallyUnseen = function () { }; -}( mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.ConfirmationPopupWidget.js b/Echo/modules/ui/mw.echo.ui.ConfirmationPopupWidget.js index e44354a8..6541dae4 100644 --- a/Echo/modules/ui/mw.echo.ui.ConfirmationPopupWidget.js +++ b/Echo/modules/ui/mw.echo.ui.ConfirmationPopupWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /** * Confirmation overlay widget, especially for mobile display. * The behavior of this widget is to appear with a given confirmation @@ -56,6 +56,8 @@ * @private */ mw.echo.ui.ConfirmationPopupWidget.prototype.hide = function () { + // FIXME: Use CSS transition + // eslint-disable-next-line no-jquery/no-fade this.$element.fadeOut(); }; @@ -68,4 +70,4 @@ mw.echo.ui.ConfirmationPopupWidget.prototype.setLabel = function ( label ) { this.labelWidget.setLabel( label ); }; -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.CrossWikiNotificationItemWidget.js b/Echo/modules/ui/mw.echo.ui.CrossWikiNotificationItemWidget.js index d96a5a65..4936780e 100644 --- a/Echo/modules/ui/mw.echo.ui.CrossWikiNotificationItemWidget.js +++ b/Echo/modules/ui/mw.echo.ui.CrossWikiNotificationItemWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /** * Cross-wiki notification item widget. * This widget is expandable and displays groups of @@ -311,8 +311,11 @@ this.$element.toggleClass( 'mw-echo-ui-crossWikiNotificationItemWidget-expanded', this.expanded ); if ( this.expanded ) { + // FIXME: Use CSS transition + // eslint-disable-next-line no-jquery/no-slide this.getList().$element.slideDown(); } else { + // eslint-disable-next-line no-jquery/no-slide this.getList().$element.slideUp(); } }; @@ -327,8 +330,8 @@ this.expanded ? mw.msg( 'notification-link-text-collapse-all' ) : // Messages that appear here are: - // notification-link-text-expand-alert-count - // notification-link-text-expand-notice-count + // * notification-link-text-expand-alert-count + // * notification-link-text-expand-notice-count mw.msg( 'notification-link-text-expand-' + ( type === 'message' ? 'notice' : type ) + @@ -351,4 +354,4 @@ mw.echo.ui.CrossWikiNotificationItemWidget.prototype.getList = function () { return this.listWidget; }; -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.CrossWikiUnreadFilterWidget.js b/Echo/modules/ui/mw.echo.ui.CrossWikiUnreadFilterWidget.js index 02807150..812d8799 100644 --- a/Echo/modules/ui/mw.echo.ui.CrossWikiUnreadFilterWidget.js +++ b/Echo/modules/ui/mw.echo.ui.CrossWikiUnreadFilterWidget.js @@ -1,4 +1,4 @@ -( function ( $, mw ) { +( function () { /** * A filter for cross-wiki unread notifications * @@ -170,4 +170,4 @@ this.setItemSelected( item ); }; -}( jQuery, mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.DatedNotificationsWidget.js b/Echo/modules/ui/mw.echo.ui.DatedNotificationsWidget.js index 09c5c5c9..f7f7627b 100644 --- a/Echo/modules/ui/mw.echo.ui.DatedNotificationsWidget.js +++ b/Echo/modules/ui/mw.echo.ui.DatedNotificationsWidget.js @@ -1,4 +1,4 @@ -( function ( $, mw ) { +( function () { /** * A notifications list organized and separated by dates * @@ -176,4 +176,4 @@ return count; }; -}( jQuery, mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.DatedSubGroupListWidget.js b/Echo/modules/ui/mw.echo.ui.DatedSubGroupListWidget.js index 4cbbc08a..e56e7546 100644 --- a/Echo/modules/ui/mw.echo.ui.DatedSubGroupListWidget.js +++ b/Echo/modules/ui/mw.echo.ui.DatedSubGroupListWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /* global moment:false */ /** * A sub group widget that displays notifications divided by dates. @@ -62,4 +62,4 @@ /* Initialization */ OO.inheritClass( mw.echo.ui.DatedSubGroupListWidget, mw.echo.ui.SubGroupListWidget ); -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.FooterNoticeWidget.js b/Echo/modules/ui/mw.echo.ui.FooterNoticeWidget.js index 185c3aec..812df064 100644 --- a/Echo/modules/ui/mw.echo.ui.FooterNoticeWidget.js +++ b/Echo/modules/ui/mw.echo.ui.FooterNoticeWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /** * Footer notice widget. * @@ -77,4 +77,4 @@ this.toggle( false ); this.emit( 'dismiss' ); }; -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.MenuItemWidget.js b/Echo/modules/ui/mw.echo.ui.MenuItemWidget.js index 2a7785e4..810d8ce4 100644 --- a/Echo/modules/ui/mw.echo.ui.MenuItemWidget.js +++ b/Echo/modules/ui/mw.echo.ui.MenuItemWidget.js @@ -1,4 +1,4 @@ -( function ( mw ) { +( function () { /** * Secondary menu item * @@ -124,4 +124,4 @@ mw.echo.ui.MenuItemWidget.prototype.isDynamicAction = function () { return this.dynamic; }; -}( mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.NotificationBadgeWidget.js b/Echo/modules/ui/mw.echo.ui.NotificationBadgeWidget.js index a07fa118..50067145 100644 --- a/Echo/modules/ui/mw.echo.ui.NotificationBadgeWidget.js +++ b/Echo/modules/ui/mw.echo.ui.NotificationBadgeWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /** * Notification badge button widget for echo popup. * @@ -65,8 +65,8 @@ numItems: this.numItems, flags: buttonFlags, // The following messages can be used here: - // tooltip-pt-notifications-alert - // tooltip-pt-notifications-notice + // * tooltip-pt-notifications-alert + // * tooltip-pt-notifications-notice title: mw.msg( 'tooltip-pt-notifications-' + adjustedTypeString ), href: config.href } ); @@ -89,6 +89,7 @@ href: links.notifications, classes: [ 'mw-echo-ui-notificationBadgeButtonPopupWidget-footer-allnotifs' ] } ); + allNotificationsButton.$element.children().first().removeAttr( 'role' ); preferencesButton = new OO.ui.ButtonWidget( { icon: 'settings', @@ -96,6 +97,7 @@ href: links.preferences, classes: [ 'mw-echo-ui-notificationBadgeButtonPopupWidget-footer-preferences' ] } ); + preferencesButton.$element.children().first().removeAttr( 'role' ); footerButtonGroupWidget = new OO.ui.ButtonGroupWidget( { items: [ allNotificationsButton, preferencesButton ], @@ -119,8 +121,8 @@ $autoCloseIgnore: this.$element.add( this.$menuOverlay ), head: true, // The following messages can be used here: - // echo-notification-alert-text-only - // echo-notification-notice-text-only + // * echo-notification-alert-text-only + // * echo-notification-notice-text-only label: mw.msg( 'echo-notification-' + adjustedTypeString + '-text-only' @@ -165,8 +167,8 @@ this.$element .prop( 'id', 'pt-notifications-' + adjustedTypeString ) // The following classes can be used here: - // mw-echo-ui-notificationBadgeButtonPopupWidget-alert - // mw-echo-ui-notificationBadgeButtonPopupWidget-message + // * mw-echo-ui-notificationBadgeButtonPopupWidget-alert + // * mw-echo-ui-notificationBadgeButtonPopupWidget-message .addClass( 'mw-echo-ui-notificationBadgeButtonPopupWidget ' + 'mw-echo-ui-notificationBadgeButtonPopupWidget-' + adjustedTypeString @@ -240,7 +242,6 @@ unreadCount = this.manager.getUnreadCounter().getCount(); cappedUnreadCount = this.manager.getUnreadCounter().getCappedNotificationCount( unreadCount ); - cappedUnreadCount = mw.language.convertNumber( cappedUnreadCount ); badgeLabel = mw.message( 'echo-badge-count', mw.language.convertNumber( cappedUnreadCount ) ).text(); this.badgeButton.setLabel( badgeLabel ); @@ -345,4 +346,4 @@ } ); this.hasRunFirstTime = true; }; -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.NotificationItemWidget.js b/Echo/modules/ui/mw.echo.ui.NotificationItemWidget.js index fce6fb52..a31f3d46 100644 --- a/Echo/modules/ui/mw.echo.ui.NotificationItemWidget.js +++ b/Echo/modules/ui/mw.echo.ui.NotificationItemWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /* global moment:false */ /** * A base widget for displaying notification items. @@ -47,7 +47,11 @@ if ( this.model.getIconURL() ) { $icon = $( '<div>' ) .addClass( 'mw-echo-ui-notificationItemWidget-icon' ) - .append( $( '<img>' ).attr( 'src', this.model.getIconURL() ) ); + .append( $( '<img>' ).attr( { + src: this.model.getIconURL(), + role: 'presentation', + alt: ' ' + } ) ); } // Content @@ -73,7 +77,8 @@ // Actions menu this.actionsButtonSelectWidget = new OO.ui.ButtonSelectWidget( { - classes: [ 'mw-echo-ui-notificationItemWidget-content-actions-buttons' ] + classes: [ 'mw-echo-ui-notificationItemWidget-content-actions-buttons' ], + tabIndex: -1 } ); // Popup menu @@ -81,7 +86,7 @@ framed: false, icon: 'ellipsis', $overlay: this.$overlay, - menuWidth: 200, + horizontalPosition: this.bundle ? 'end' : 'auto', title: mw.msg( 'echo-notification-more-options-tooltip' ), classes: [ 'mw-echo-ui-notificationItemWidget-content-actions-menu' ] } ); @@ -157,6 +162,7 @@ // Limit to 2 items outside the menu if ( isOutsideMenu ) { this.actionsButtonSelectWidget.addItems( [ linkButton ] ); + this.actionsButtonSelectWidget.setTabIndex( 0 ); outsideMenuItemCounter++; } else { this.menuPopupButtonWidget.getMenu().addItems( [ linkButton ] ); @@ -430,4 +436,4 @@ mw.echo.ui.NotificationItemWidget.prototype.isFake = function () { return false; }; -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.NotificationsInboxWidget.js b/Echo/modules/ui/mw.echo.ui.NotificationsInboxWidget.js index 2c1a93e7..57e08328 100644 --- a/Echo/modules/ui/mw.echo.ui.NotificationsInboxWidget.js +++ b/Echo/modules/ui/mw.echo.ui.NotificationsInboxWidget.js @@ -1,4 +1,4 @@ -( function ( $, mw ) { +( function () { /** * An inbox-type widget that encompases a dated notifications list with pagination * @@ -11,7 +11,6 @@ * @param {mw.echo.dm.ModelManager} manager Model manager * @param {Object} [config] Configuration object * @cfg {number} [limit=25] Limit the number of notifications per page - * @cfg {string} [helpLink] Link to help page * @cfg {string} [prefLink] Link to preferences page * @cfg {jQuery} [$overlay] An overlay for the popup menus */ @@ -68,7 +67,6 @@ this.manager, { framed: true, - helpLink: config.helpLink, prefLink: config.prefLink, $overlay: this.$overlay } @@ -323,4 +321,4 @@ this.datedListWidget.toggle( !displayMessage ); }; -}( jQuery, mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.NotificationsListWidget.js b/Echo/modules/ui/mw.echo.ui.NotificationsListWidget.js index de08252e..c0f4e918 100644 --- a/Echo/modules/ui/mw.echo.ui.NotificationsListWidget.js +++ b/Echo/modules/ui/mw.echo.ui.NotificationsListWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /** * Notifications list widget. * All of its items must be of the mw.echo.ui.NotificationItem type. @@ -243,4 +243,4 @@ itemWidgets[ i ].resetInitiallyUnseen(); } }; -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.NotificationsWrapper.js b/Echo/modules/ui/mw.echo.ui.NotificationsWrapper.js index 45ceaa8d..ebf6b7c0 100644 --- a/Echo/modules/ui/mw.echo.ui.NotificationsWrapper.js +++ b/Echo/modules/ui/mw.echo.ui.NotificationsWrapper.js @@ -1,4 +1,4 @@ -( function ( mw ) { +( function () { /** * Wrapper for the notifications widget, for view outside the popup. * @@ -82,4 +82,4 @@ widget.promiseRunning = false; } ); }; -}( mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.PageFilterWidget.js b/Echo/modules/ui/mw.echo.ui.PageFilterWidget.js index cfe89bea..3d7940eb 100644 --- a/Echo/modules/ui/mw.echo.ui.PageFilterWidget.js +++ b/Echo/modules/ui/mw.echo.ui.PageFilterWidget.js @@ -1,4 +1,4 @@ -( function ( $, mw ) { +( function () { /** * A widget that displays wikis and their pages to choose a filter * @@ -43,7 +43,8 @@ // Initialization this.populateDataFromModel(); this.$element - .addClass( 'mw-echo-ui-pageFilterWidget' ); + .addClass( 'mw-echo-ui-pageFilterWidget' ) + .attr( 'aria-label', mw.message( 'echo-specialpage-pagefilterwidget-aria-label' ).text() ); }; /* Initialization */ @@ -153,4 +154,4 @@ mw.echo.ui.PageFilterWidget.prototype.sortingFunction = function ( item, otherItem ) { return Number( otherItem.getCount() ) - Number( item.getCount() ); }; -}( jQuery, mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.PageNotificationsOptionWidget.js b/Echo/modules/ui/mw.echo.ui.PageNotificationsOptionWidget.js index d87f0106..21116106 100644 --- a/Echo/modules/ui/mw.echo.ui.PageNotificationsOptionWidget.js +++ b/Echo/modules/ui/mw.echo.ui.PageNotificationsOptionWidget.js @@ -1,4 +1,4 @@ -( function ( $, mw ) { +( function () { /** * An option widget for the page filter in PageFilterWidget * @@ -104,4 +104,4 @@ return this; }; -}( jQuery, mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.PaginationWidget.js b/Echo/modules/ui/mw.echo.ui.PaginationWidget.js index fdfedde7..2e498ae4 100644 --- a/Echo/modules/ui/mw.echo.ui.PaginationWidget.js +++ b/Echo/modules/ui/mw.echo.ui.PaginationWidget.js @@ -1,4 +1,4 @@ -( function ( $, mw ) { +( function () { /** * A pagination widget allowing the user to go forward, backwards, * and after a couple of pages, go back to home. @@ -127,7 +127,6 @@ this.labelWidget.toggle( !this.isDisabled() ); }; - // eslint-disable-next-line valid-jsdoc /** * Set the 'disabled' state of the widget. * @@ -176,4 +175,4 @@ this.labelWidget.setLabel( label ); }; -}( jQuery, mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.PlaceholderItemWidget.js b/Echo/modules/ui/mw.echo.ui.PlaceholderItemWidget.js index 31ab206d..9165e4c8 100644 --- a/Echo/modules/ui/mw.echo.ui.PlaceholderItemWidget.js +++ b/Echo/modules/ui/mw.echo.ui.PlaceholderItemWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /** * Placeholder notification option widget for echo popup. * @@ -89,4 +89,4 @@ */ mw.echo.ui.PlaceholderItemWidget.prototype.resetInitiallyUnseen = function () {}; -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.ReadStateButtonSelectWidget.js b/Echo/modules/ui/mw.echo.ui.ReadStateButtonSelectWidget.js index 09a01bff..56a221bd 100644 --- a/Echo/modules/ui/mw.echo.ui.ReadStateButtonSelectWidget.js +++ b/Echo/modules/ui/mw.echo.ui.ReadStateButtonSelectWidget.js @@ -1,4 +1,4 @@ -( function ( $, mw ) { +( function () { /** * A select widget for notification read state: 'all', 'read' or 'unread' * @@ -59,4 +59,4 @@ this.emit( 'filter', data ); } }; -}( jQuery, mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.SingleNotificationItemWidget.js b/Echo/modules/ui/mw.echo.ui.SingleNotificationItemWidget.js index e82ae161..405ccd18 100644 --- a/Echo/modules/ui/mw.echo.ui.SingleNotificationItemWidget.js +++ b/Echo/modules/ui/mw.echo.ui.SingleNotificationItemWidget.js @@ -1,4 +1,4 @@ -( function ( mw ) { +( function () { /** * Single notification item widget for echo popup. * @@ -98,4 +98,4 @@ this.toggleRead( this.model.isRead() ); this.toggleSeen( this.model.isSeen() ); }; -}( mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.SortedListWidget.js b/Echo/modules/ui/mw.echo.ui.SortedListWidget.js index 13a4d808..4f1a5cd5 100644 --- a/Echo/modules/ui/mw.echo.ui.SortedListWidget.js +++ b/Echo/modules/ui/mw.echo.ui.SortedListWidget.js @@ -1,4 +1,4 @@ -( function ( mw ) { +( function () { /** * Sorted list widget. This is a group widget that sorts its items * according to a given sorting callback. @@ -83,10 +83,13 @@ this.addItems( fakeWidget ); // fade out fake + // FIXME: Use CSS transition + // eslint-disable-next-line no-jquery/no-fade fakeWidget.$element.fadeOut( 400, function () { // remove fake widget.removeItems( fakeWidget ); // fade-in real item + // eslint-disable-next-line no-jquery/no-fade item.$element.fadeIn( 400 ); } ); } else { @@ -150,7 +153,6 @@ return null; }; - // eslint-disable-next-line valid-jsdoc /** * Remove items. * @@ -241,7 +243,6 @@ } }; - // eslint-disable-next-line valid-jsdoc /** * Clear all items * @@ -277,4 +278,4 @@ ); }; -}( mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.SpecialHelpMenuWidget.js b/Echo/modules/ui/mw.echo.ui.SpecialHelpMenuWidget.js index d2ae205c..786c0150 100644 --- a/Echo/modules/ui/mw.echo.ui.SpecialHelpMenuWidget.js +++ b/Echo/modules/ui/mw.echo.ui.SpecialHelpMenuWidget.js @@ -1,21 +1,20 @@ -( function ( $, mw ) { +( function () { /** * Widget for the settings menu in the Special:Notifications page * * @param {mw.echo.dm.ModelManager} manager Model manager * @param {Object} config Configuration object - * @cfg {string} [helpLink] Link to help page * @cfg {string} [prefLink] Link to preferences page */ mw.echo.ui.SpecialHelpMenuWidget = function MwEchoUiSpecialHelpMenuWidget( manager, config ) { - var handle; - config = config || {}; // Parent constructor mw.echo.ui.SpecialHelpMenuWidget.super.call( this, $.extend( { - // Icon and indicator set on handle button instead - indicator: '', + icon: 'settings', + label: mw.msg( 'echo-specialpage-special-help-menu-widget-aria-label' ), + indicator: 'down', + invisibleLabel: true, menu: { classes: [ 'mw-echo-ui-specialHelpMenuWidget-menu' ], horizontalPosition: 'end', @@ -23,15 +22,6 @@ } }, config ) ); - // Replace handle with a button widget. Use this.$handle to preserve bindings. - this.$handle.empty().attr( 'class', '' ); - handle = new OO.ui.ButtonWidget( { - $element: this.$handle, - icon: 'settings', - indicator: 'down' - } ); - this.$element.append( handle.$element ); - this.manager = manager; this.markAllReadOption = new OO.ui.MenuOptionWidget( { @@ -55,19 +45,6 @@ ] ); } - if ( config.helpLink ) { - this.menu.addItems( [ - // Help link - new OO.ui.MenuOptionWidget( { - // Use link for accessibility - $element: $( '<a>' ).attr( 'href', config.helpLink ), - icon: 'help', - label: mw.msg( 'echo-learn-more' ), - data: { href: config.helpLink } - } ) - ] ); - } - // Events this.manager.connect( this, { localCountChange: 'onLocalCountChange' @@ -80,7 +57,7 @@ /* Initialization */ - OO.inheritClass( mw.echo.ui.SpecialHelpMenuWidget, OO.ui.DropdownWidget ); + OO.inheritClass( mw.echo.ui.SpecialHelpMenuWidget, OO.ui.ButtonMenuSelectWidget ); /* Events */ @@ -97,7 +74,6 @@ */ mw.echo.ui.SpecialHelpMenuWidget.prototype.onSourcePageUpdate = function () { this.markAllReadOption.setLabel( this.getMarkAllReadOptionLabel() ); - }; /** @@ -110,7 +86,7 @@ }; /** - * Handle dropdown menu choose events + * Handle menu choose events * * @param {OO.ui.MenuOptionWidget} item Chosen item */ @@ -130,8 +106,6 @@ ); this.emit( 'markAllRead' ); } - // Clear selection so handle doesn't change - this.menu.selectItem(); }; /** @@ -149,4 +123,4 @@ mw.msg( 'echo-mark-all-as-read' ); }; -}( jQuery, mediaWiki ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.SubGroupListWidget.js b/Echo/modules/ui/mw.echo.ui.SubGroupListWidget.js index 0f9503ee..3ec51055 100644 --- a/Echo/modules/ui/mw.echo.ui.SubGroupListWidget.js +++ b/Echo/modules/ui/mw.echo.ui.SubGroupListWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /** * Sub group list widget. * This widget contains a list of notifications from a single source @@ -119,8 +119,9 @@ this.listWidget.$element ); + // eslint-disable-next-line no-jquery/no-global-selector this.$pageContentText = $( '#mw-content-text' ); - $( window ).resize( this.resizeHeader.bind( this ) ); + $( window ).on( 'resize', this.resizeHeader.bind( this ) ); // Resize the header after the stack finishes loading // so the widget is attached @@ -320,4 +321,4 @@ mw.echo.ui.SubGroupListWidget.prototype.getId = function () { return this.model.getName(); }; -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.ToggleReadCircleButtonWidget.js b/Echo/modules/ui/mw.echo.ui.ToggleReadCircleButtonWidget.js index 6df684fe..9d32a10c 100644 --- a/Echo/modules/ui/mw.echo.ui.ToggleReadCircleButtonWidget.js +++ b/Echo/modules/ui/mw.echo.ui.ToggleReadCircleButtonWidget.js @@ -1,4 +1,4 @@ -( function ( mw, $ ) { +( function () { /** * A button showing a circle that represents either 'mark as read' or 'mark as unread' states. * @@ -50,4 +50,4 @@ mw.msg( 'echo-notification-markasunread' ) ); }; -}( mediaWiki, jQuery ) ); +}() ); diff --git a/Echo/modules/ui/mw.echo.ui.js b/Echo/modules/ui/mw.echo.ui.js index 12f39607..00f45316 100644 --- a/Echo/modules/ui/mw.echo.ui.js +++ b/Echo/modules/ui/mw.echo.ui.js @@ -1,7 +1,7 @@ -( function ( mw, $ ) { +( function () { mw.echo = mw.echo || {}; mw.echo.ui = { $overlay: $( '<div>' ) .addClass( 'mw-echo-ui-overlay' ) }; -}( mediaWiki, jQuery ) ); +}() ); |