ghostty/dist/doxygen/mobile-nav.js

/**
 * Mobile navigation toggle for Doxygen documentation
 */

(function () {
  // Only run on mobile devices
  function isMobile() {
    return window.innerWidth <= 767;
  }

  function initMobileNav() {
    if (!isMobile()) return;

    const pageNav = document.getElementById("page-nav");
    if (!pageNav) return;

    // Create toggle button
    const toggleBtn = document.createElement("button");
    toggleBtn.id = "page-nav-toggle";
    toggleBtn.setAttribute("aria-label", "Toggle page navigation");
    toggleBtn.innerHTML = "<span></span><span></span><span></span>";
    document.body.appendChild(toggleBtn);

    // Create backdrop
    const backdrop = document.createElement("div");
    backdrop.id = "page-nav-backdrop";
    document.body.appendChild(backdrop);

    // Toggle function
    function toggleNav() {
      const isOpen = pageNav.classList.toggle("mobile-open");
      backdrop.classList.toggle("active", isOpen);
      document.body.style.overflow = isOpen ? "hidden" : "";
    }

    // Event listeners
    toggleBtn.addEventListener("click", toggleNav);
    backdrop.addEventListener("click", toggleNav);

    // Close on escape key
    document.addEventListener("keydown", function (e) {
      if (e.key === "Escape" && pageNav.classList.contains("mobile-open")) {
        toggleNav();
      }
    });
  }

  // Initialize on load and resize
  if (document.readyState === "loading") {
    document.addEventListener("DOMContentLoaded", initMobileNav);
  } else {
    initMobileNav();
  }

  window.addEventListener("resize", function () {
    const pageNav = document.getElementById("page-nav");
    const backdrop = document.getElementById("page-nav-backdrop");

    if (!isMobile() && pageNav) {
      pageNav.classList.remove("mobile-open");
      if (backdrop) backdrop.classList.remove("active");
      document.body.style.overflow = "";
    }
  });
})();