Jump to content

MediaWiki:Common.js

From Once Human Guide
Revision as of 21:50, 21 April 2026 by Bones (talk | contribs)

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)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
mw.loader.using(['mediawiki.util']).then(function () {
  $(function () {

    /* ================= TAB SYSTEM ================= */

    document.querySelectorAll('.mw-tab-buttons').forEach(tabGroup => {

      const buttons = tabGroup.querySelectorAll('.mw-tab-btn');

      buttons.forEach(btn => {
        btn.addEventListener('click', function () {

          const tabId = this.getAttribute('data-tab');

          // deactivate buttons in this group only
          buttons.forEach(b => b.classList.remove('active'));
          this.classList.add('active');

          // find container
          const container = tabGroup.parentElement;

          // hide direct tab contents
          container.querySelectorAll(':scope > .mw-tab-content').forEach(c => {
            c.classList.remove('active');
          });

          // show selected
          const target = container.querySelector('#' + tabId);
          if (target) target.classList.add('active');

        });
      });

    });


    /* ================= DROPDOWN SYSTEM ================= */

    document.querySelectorAll('.mw-dropdown-ui').forEach(container => {
      const select = container.querySelector('select');
      const sections = container.querySelectorAll('.dropdown-section');

      if (!select) return;

      select.addEventListener('change', function () {
        sections.forEach(s => s.style.display = 'none');

        const target = container.querySelector('#' + this.value);
        if (target) target.style.display = 'block';
      });
    });


    /* ================= INITIAL TAB LOAD ================= */

    document.querySelectorAll('.mw-tab-buttons').forEach(group => {
      const first = group.querySelector('.mw-tab-btn');
      if (first) first.click();
    });

  });
});