MediaWiki:Timeless.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.

/* Timeless sidebar collapsible groups for AnarchyMU */
(function () {
  function initAnarchySidebar() {
    if (typeof mw === "undefined" || mw.config.get("skin") !== "timeless") {
      return;
    }

    var nav = document.querySelector("#site-navigation");
    if (!nav) {
      return;
    }

    var isMobile = window.matchMedia("(max-width: 850px)").matches;
    var portlets = nav.querySelectorAll(".mw-portlet");

    portlets.forEach(function (portlet, index) {
      var heading = portlet.querySelector("h3");
      var body = portlet.querySelector(".mw-portlet-body");

      if (!heading || !body) {
        return;
      }

      var key = "anarchymu.sidebar." + (portlet.id || "section_" + index);

      heading.setAttribute("role", "button");
      heading.setAttribute("tabindex", "0");
      heading.setAttribute("aria-expanded", "false");

      function setOpen(open) {
        if (open) {
          body.style.display = "";
          portlet.classList.add("amu-open");
          heading.setAttribute("aria-expanded", "true");
          localStorage.setItem(key, "1");
        } else {
          body.style.display = "none";
          portlet.classList.remove("amu-open");
          heading.setAttribute("aria-expanded", "false");
          localStorage.setItem(key, "0");
        }
      }

      if (isMobile) {
        setOpen(true);
      } else {
        var saved = localStorage.getItem(key);
        var openByDefault = index === 0;
        setOpen(saved === null ? openByDefault : saved === "1");
      }

      heading.addEventListener("click", function () {
        var isOpen = body.style.display !== "none";
        setOpen(!isOpen);
      });

      heading.addEventListener("keydown", function (event) {
        if (event.key === "Enter" || event.key === " ") {
          event.preventDefault();
          var isOpen = body.style.display !== "none";
          setOpen(!isOpen);
        }
      });
    });
  }

  if (document.readyState === "loading") {
    document.addEventListener("DOMContentLoaded", initAnarchySidebar);
  } else {
    initAnarchySidebar();
  }
})();