mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/DiscussionTools
synced 2024-12-18 11:02:57 +00:00
042c0a1a40
This greatly increases the size of the click target for exanding a section, which is the most common action to be taken. Bug: T380896 Change-Id: Ib88e90f6eeee03f7559c78c0ef3dde3956cfd125
50 lines
1.9 KiB
JavaScript
50 lines
1.9 KiB
JavaScript
/**
|
|
* Build an overflow menu button and items for display adjacent to heading and comment thread items.
|
|
*
|
|
* @param {jQuery} $container
|
|
* @param {ThreadItemSet} pageThreads
|
|
*/
|
|
function init( $container, pageThreads ) {
|
|
mw.loader.using( [ 'oojs-ui-widgets', 'oojs-ui.styles.icons-editing-core' ] ).then( () => {
|
|
$container.find( '.ext-discussiontools-init-section-overflowMenuButton' ).each( ( i, button ) => {
|
|
// Comment ellipsis
|
|
let $threadMarker = $( button ).closest( '[data-mw-thread-id]' );
|
|
if ( !$threadMarker.length ) {
|
|
// Heading ellipsis
|
|
$threadMarker = $( button ).closest( '.ext-discussiontools-init-section' ).find( '[data-mw-thread-id]' );
|
|
}
|
|
const threadItem = pageThreads.findCommentById( $threadMarker.data( 'mw-thread-id' ) );
|
|
|
|
const buttonMenu = OO.ui.infuse( button, {
|
|
$overlay: true,
|
|
menu: {
|
|
classes: [ 'ext-discussiontools-init-section-overflowMenu' ],
|
|
horizontalPosition: threadItem.type === 'heading' ? 'end' : 'start'
|
|
}
|
|
} );
|
|
|
|
mw.loader.using( buttonMenu.getData().resourceLoaderModules || [] ).then( () => {
|
|
const itemConfigs = buttonMenu.getData().itemConfigs;
|
|
if ( !itemConfigs ) {
|
|
// We should never have missing itemConfigs, but if this happens, hide the empty menu
|
|
buttonMenu.toggle( false );
|
|
return;
|
|
}
|
|
const overflowMenuItemWidgets = itemConfigs.map( ( itemConfig ) => new OO.ui.MenuOptionWidget( itemConfig ) );
|
|
buttonMenu.getMenu().addItems( overflowMenuItemWidgets );
|
|
buttonMenu.getMenu().items.forEach( ( menuItem ) => {
|
|
mw.hook( 'discussionToolsOverflowMenuOnAddItem' ).fire( menuItem.getData().id, menuItem, threadItem );
|
|
} );
|
|
} );
|
|
|
|
buttonMenu.getMenu().on( 'choose', ( menuItem ) => {
|
|
mw.hook( 'discussionToolsOverflowMenuOnChoose' ).fire( menuItem.getData().id, menuItem, threadItem );
|
|
} );
|
|
} );
|
|
} );
|
|
}
|
|
|
|
module.exports = {
|
|
init: init
|
|
};
|