mediawiki-skins-Citizen/resources/skins.citizen.scripts/sections.js
alistair3149 685a3ad1c4
refactor(core): ♻️ reduce the number of RL modules
It will improve the performance in module registration and also caching
2022-12-09 14:48:17 -05:00

37 lines
1.1 KiB
JavaScript

/**
* @return {void}
*/
function initCollapsibleSections() {
const prefix = 'section-',
headings = document.querySelectorAll( '.' + prefix + 'heading' ),
sections = document.querySelectorAll( '.' + prefix + 'collapsible' );
for ( let i = 0; i < headings.length; i++ ) {
const j = i + 1,
collapsibleID = prefix + 'collapsible-' + j,
/* T13555 */
headline = headings[ i ].querySelector( '.mw-headline' ) ?? headings[ i ].querySelector( '.mw-heading' );
// Set up ARIA
headline.setAttribute( 'tabindex', 0 );
headline.setAttribute( 'role', 'button' );
headline.setAttribute( 'aria-controls', collapsibleID );
headline.setAttribute( 'aria-expanded', true );
// TODO: Need a keyboard handler
headings[ i ].addEventListener( 'click', function () {
// .section-heading--collapsed
this.classList.toggle( prefix + 'heading--collapsed' );
// .section-collapsible--collapsed
sections[ j ].classList.toggle( prefix + 'collapsible--collapsed' );
headline.setAttribute( 'aria-expanded', headline.getAttribute( 'aria-expanded' ) === 'true' ? 'false' : 'true' );
} );
}
}
module.exports = {
init: initCollapsibleSections
};