MediaWiki:Common.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
• Opera: Press Ctrl-F5.

/* Any JavaScript here will be loaded for all users on every page load. */
$(document).ready(function() {
    // Function to collapse all sections
    function collapseAll() {
        $('#mw-navigation .mw-portlet .mw-portlet-body').hide();
        $('#mw-navigation .mw-portlet .collapsible-arrow').text('▶');
    }

    // Function to expand all sections
    function expandAll() {
        $('#mw-navigation .mw-portlet .mw-portlet-body').show();
        $('#mw-navigation .mw-portlet .collapsible-arrow').text('▼');
    }

    // Add a "Close All" button
    var $closeAllButton = $('<button>', {
        text: 'Close All',
        id: 'close-all-button',
        click: function() {
            collapseAll();
            $(this).text('Open All').off('click').on('click', function() {
                expandAll();
                $(this).text('Close All').off('click').on('click', function() {
                    collapseAll();
                    $(this).text('Open All');
                });
            });
        }
    });

    // Insert the button below the logo
    $('#mw-navigation .mw-wiki-navigation-logo').after($closeAllButton);

    // Add collapsible arrows to section labels
    $('#mw-navigation .mw-portlet a.nav-link.disabled').each(function() {
        var $label = $(this);
        var $body = $label.next('.mw-portlet-body');

        // Add a collapsible arrow if it doesn't already exist
        if (!$label.find('.collapsible-arrow').length) {
            $label.append('<span class="collapsible-arrow">▼</span>');
        }

        // Collapse/expand on click
        $label.on('click', function(e) {
            e.preventDefault();
            $body.toggle();
            $label.find('.collapsible-arrow').text(function(_, text) {
                return text === '▼' ? '▶' : '▼';
            });
        });
    });
});