mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git
synced 2024-11-23 23:33:54 +00:00
967965b260
This copies the Vector 2022 hook approach and applies it to legacy Vector. Bug: T342814 Change-Id: I382bfa3b25f4814fbf627856fa5957f7e50bf8a8
73 lines
1.7 KiB
JavaScript
73 lines
1.7 KiB
JavaScript
/**
|
|
* An object containing the data to help create a portlet.
|
|
*
|
|
* @typedef {Object} Hint
|
|
* @property {string} type
|
|
*/
|
|
|
|
/**
|
|
* Creates default portlet.
|
|
*
|
|
* @param {Element} portlet
|
|
* @return {Element}
|
|
*/
|
|
function addDefaultPortlet( portlet ) {
|
|
const ul = portlet.querySelector( 'ul' );
|
|
if ( !ul ) {
|
|
return portlet;
|
|
}
|
|
ul.classList.add( 'vector-menu-content-list' );
|
|
const label = portlet.querySelector( 'label' );
|
|
if ( label ) {
|
|
const labelDiv = document.createElement( 'div' );
|
|
labelDiv.classList.add( 'vector-menu-heading' );
|
|
labelDiv.innerHTML = label.innerText;
|
|
portlet.insertBefore( labelDiv, label );
|
|
label.remove();
|
|
}
|
|
let wrapper = portlet.querySelector( 'div:last-child' );
|
|
if ( wrapper ) {
|
|
ul.remove();
|
|
wrapper.appendChild( ul );
|
|
wrapper.classList.add( 'vector-menu-content' );
|
|
} else {
|
|
wrapper = document.createElement( 'div' );
|
|
wrapper.classList.add( 'vector-menu-content' );
|
|
ul.remove();
|
|
wrapper.appendChild( ul );
|
|
portlet.appendChild( wrapper );
|
|
}
|
|
portlet.classList.add( 'vector-menu', 'vector-menu-portal' );
|
|
|
|
return portlet;
|
|
}
|
|
|
|
/**
|
|
* A hook handler for util.addPortlet hook.
|
|
* It creates a portlet based on the hint, and adabt it to vector skin.
|
|
*
|
|
* @param {Element} portlet
|
|
* @return {Element}
|
|
*/
|
|
function addPortletHandler( portlet ) {
|
|
portlet.classList.remove( 'mw-portlet-js' );
|
|
return addDefaultPortlet( portlet );
|
|
}
|
|
|
|
/**
|
|
*
|
|
* @return {{addPortletHandler: (function(Element): Element)}}
|
|
*/
|
|
function main() {
|
|
mw.hook( 'util.addPortlet' ).add( addPortletHandler );
|
|
// Update any portlets that were created prior to the hook being registered.
|
|
document.querySelectorAll( '.mw-portlet-js' ).forEach( addPortletHandler );
|
|
return {
|
|
addPortletHandler
|
|
};
|
|
}
|
|
|
|
module.exports = {
|
|
main, addPortletHandler
|
|
};
|