mediawiki-skins-Vector/resources/skins.vector.js/popupNotification.js
Jon Robson 87dd101a69 Consolidate and fix eslint errors, dropping ts-ignores
* Upgrade @wikimedia/types-wikimedia to allow us to drop several
@ts-ignores
* Merges eslint rules now that ES6 is default everywhere
* Runs autofix command
* Fixes various prefer-const errors

Change-Id: Iee5bcb93f10a76d80dbeec813f6387c13438263e
2023-04-11 16:56:31 -07:00

64 lines
1.5 KiB
JavaScript

/**
* Adds and show a popup to the user to point them to the new location of the element
*
* @param {Element} container
* @param {string} message
* @param {string[]} [classes]
* @param {number} [timeout]
* @param {boolean} [autoClose]
*/
function add( container, message, classes = [], timeout = 4000, autoClose = true ) {
/**
* @type {any}
*/
let popupWidget;
// load oojs-ui if it's not already loaded
mw.loader.using( 'oojs-ui-core' ).then( () => {
popupWidget = new OO.ui.PopupWidget( {
$content: $( '<p>' ).text( message ),
autoClose,
padded: true,
anchor: true,
align: 'center',
position: 'below',
classes: [ 'vector-popup-notification' ].concat( classes ),
container
} );
popupWidget.$element.appendTo( container );
show( popupWidget, timeout );
} );
}
/**
* Toggle the popup widget
*
* @param {any} popupWidget popupWidget from oojs-ui
* cannot use type because it's not loaded yet
* @param {number} [timeout]
*/
function show( popupWidget, timeout = 4000 ) {
popupWidget.toggle( true );
popupWidget.toggleClipping( true );
// hide the popup after timeout ms
setTimeout( () => {
popupWidget.toggle( false );
popupWidget.$element.remove();
}, timeout );
}
/**
* Remove all popups
*
* @param {string} [selector]
*/
function removeAll( selector = '.vector-popup-notification' ) {
document.querySelectorAll( selector ).forEach( ( element ) => {
element.remove();
} );
}
module.exports = {
add,
removeAll
};