57 lines
1.7 KiB
JavaScript
57 lines
1.7 KiB
JavaScript
/** @type {CheckboxHack} */ var checkboxHack =
|
|
require( /** @type {string} */ ( 'mediawiki.page.ready' ) ).checkboxHack;
|
|
var collapsibleTabs = require( '../skins.vector.legacy.js/collapsibleTabs.js' );
|
|
var vector = require( '../skins.vector.legacy.js/vector.js' );
|
|
|
|
/**
|
|
* Update the state of the menu icon to be an expanded or collapsed icon.
|
|
* @param {HTMLInputElement} checkbox
|
|
* @param {HTMLElement} button
|
|
* @return {void}
|
|
*/
|
|
function updateMenuIcon( checkbox, button ) {
|
|
button.classList.remove(
|
|
checkbox.checked ?
|
|
'mw-ui-icon-wikimedia-menu-base20' :
|
|
'mw-ui-icon-wikimedia-collapseHorizontal-base20'
|
|
);
|
|
button.classList.add(
|
|
checkbox.checked ?
|
|
'mw-ui-icon-wikimedia-collapseHorizontal-base20' :
|
|
'mw-ui-icon-wikimedia-menu-base20'
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Improve the interactivity of the sidebar panel by binding optional checkbox hack enhancements
|
|
* for focus and `aria-expanded`. Also, flip the icon image on click.
|
|
* @param {Document} document
|
|
* @return {void}
|
|
*/
|
|
function initSidebar( document ) {
|
|
var checkbox = document.getElementById( 'mw-sidebar-checkbox' );
|
|
var button = document.getElementById( 'mw-sidebar-button' );
|
|
if ( checkbox instanceof HTMLInputElement && button ) {
|
|
checkboxHack.bindToggleOnClick( checkbox, button );
|
|
checkboxHack.bindUpdateAriaExpandedOnInput( checkbox );
|
|
|
|
button.addEventListener( 'click', updateMenuIcon.bind( undefined, checkbox, button ) );
|
|
checkbox.addEventListener( 'input', updateMenuIcon.bind( undefined, checkbox, button ) );
|
|
|
|
checkboxHack.updateAriaExpanded( checkbox );
|
|
updateMenuIcon( checkbox, button );
|
|
}
|
|
}
|
|
|
|
/**
|
|
* @param {Window} window
|
|
* @return {void}
|
|
*/
|
|
function main( window ) {
|
|
collapsibleTabs.init();
|
|
$( vector.init );
|
|
initSidebar( window.document );
|
|
}
|
|
|
|
main( window );
|