MediaWiki:Common.js: Difference between revisions

Revision as of 13:59, 21 April 2026

mw.loader.using('mediawiki.util').then(function () {
    $(function () {

        // Rename Discussion → Discord
        const talkTab = document.querySelector('#ca-talk a');
        const talkItem = document.querySelector('#ca-talk');

        if (talkTab) {
            talkTab.textContent = 'Discord';
            talkTab.href = 'https://discord.gg/FZtkXeGeUA';
            talkTab.target = '_blank';
            talkTab.rel = 'noopener noreferrer';

            talkTab.addEventListener('click', function (e) {
                e.preventDefault();
                window.open('https://discord.gg/FZtkXeGeUA', '_blank');
            });
        }

        // Add Road Map BEFORE Discord
        const tabList = document.querySelector('#p-associated-pages .vector-menu-content-list, #p-namespaces .vector-menu-content-list');

        if (tabList && !document.getElementById('ca-roadmap')) {
            const li = document.createElement('li');
            li.id = 'ca-roadmap';
            li.className = talkItem ? talkItem.className.replace(/\bselected\b|\bactive\b/g, '').trim() : 'mw-list-item';

            const a = document.createElement('a');
            a.href = 'https://ohwikiguide.com/index.php/Road_Map';

            const span = document.createElement('span');
            span.textContent = 'Road Map';

            a.appendChild(span);
            li.appendChild(a);

            if (talkItem) {
                tabList.insertBefore(li, talkItem);
            } else {
                tabList.appendChild(li);
            }
        }

    });
});
document.addEventListener("DOMContentLoaded", function () {
  document.querySelectorAll(".mw-dropdown-ui").forEach(container => {

    let data;

    try {
      data = JSON.parse(container.dataset.options || "{}");
    } catch (e) {
      console.error("Dropdown JSON error:", e);
      container.innerHTML = "<span style='color:red;'>Dropdown failed (bad JSON)</span>";
      return;
    }

    // Build dropdown
    let select = document.createElement("select");
    select.style.padding = "6px";

    let defaultOption = document.createElement("option");
    defaultOption.value = "";
    defaultOption.textContent = "Select one";
    select.appendChild(defaultOption);

    Object.keys(data).forEach(key => {
      let opt = document.createElement("option");
      opt.value = key;
      opt.textContent = data[key].label;
      select.appendChild(opt);
    });

    // Output panel
    let output = document.createElement("div");
    output.style.marginLeft = "20px";
    output.style.padding = "12px";
    output.style.border = "1px solid #444";
    output.style.background = "#111";
    output.style.minWidth = "250px";
    output.innerHTML = "Pick something";

    // Layout
    let wrapper = document.createElement("div");
    wrapper.style.display = "flex";
    wrapper.style.gap = "20px";

    wrapper.appendChild(select);
    wrapper.appendChild(output);
    container.appendChild(wrapper);

    // Change event
    select.addEventListener("change", function () {
      let val = this.value;

      if (!val || !data[val]) {
        output.innerHTML = "Pick something";
        return;
      }

      output.innerHTML = `
        <b>${data[val].label}</b><br><br>
        ${data[val].content}
      `;
    });

  });
});
console.log("Dropdown script running");