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)
• 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(group => {
      const buttons = group.querySelectorAll('.mw-tab-btn');

      buttons.forEach(btn => {
        btn.onclick = function () {
          const tabId = this.dataset.tab;

          let container =
            this.closest('.mw-tabs') ||
            this.closest('.mw-tab-content') ||
            document;

          container.querySelectorAll('.mw-tab-content').forEach(c => {
            c.style.display = 'none';
          });

          container.querySelectorAll('.mw-tab-btn').forEach(b => {
            b.classList.remove('active');
          });

          this.classList.add('active');

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

      if (buttons.length) buttons[0].click();
    });

    /* ================= DROPDOWN FIX (THIS WAS MISSING) ================= */

    document.querySelectorAll('.mw-dropdown-ui').forEach(container => {

      try {
        const label = container.dataset.label || "Select";
        const options = JSON.parse(container.dataset.options || "{}");

        const select = document.createElement('select');

        const first = document.createElement('option');
        first.textContent = label;
        first.value = "";
        select.appendChild(first);

        Object.keys(options).forEach(key => {
          const opt = document.createElement('option');
          opt.value = key;
          opt.textContent = options[key].label;
          select.appendChild(opt);
        });

        const output = document.createElement('div');
        output.className = 'mw-dropdown-output';

        select.onchange = function () {
          const selected = options[this.value];
          output.innerHTML = selected ? selected.content : "";
        };

        container.innerHTML = '';
        container.appendChild(select);
        container.appendChild(output);

      } catch (e) {
        console.error("Dropdown error:", e);
      }

    });

  });
});