/**
 * Initializes the burger menu navigation
 * @param {Object} options - Configuration options
 * @param {boolean} options.includeHome - Whether to include Home menu item
 * @param {boolean} options.includeFeedings - Whether to include Feedings menu item
 * @param {boolean} options.includeDiapers - Whether to include Diapers menu item
 * @param {boolean} options.includeSleep - Whether to include Sleep menu item
 * @param {boolean} options.includeSettings - Whether to include Settings menu item
 */
function initBurgerMenu(options = {}) {
  const {
    includeHome = true,
    includeFeedings = true,
    includeDiapers = true,
    includeSleep = true,
    includeSettings = true,
  } = options;

  // Create burger menu HTML
  const burgerMenuHTML = `
    <div class="burger-menu" id="burgerMenu">
      <div></div>
      <div></div>
      <div></div>
    </div>

    <div class="menu-backdrop" id="menuBackdrop"></div>

    <div class="menu-overlay" id="menuOverlay">
      ${includeHome ? '<div class="menu-item" id="menuHome">🏠 Home</div>' : ""}
      ${includeDiapers ? '<div class="menu-item" id="menuDiapers">🧷 Diapers</div>' : ""}
      ${includeFeedings ? '<div class="menu-item" id="menuFeedings">🍼 Feedings</div>' : ""}
      ${includeSleep ? '<div class="menu-item" id="menuSleep">😴 Sleep</div>' : ""}
      ${includeSettings ? '<div class="menu-item" id="menuSettings">⚙️ Settings</div>' : ""}
      <div class="menu-item logout" id="menuLogout">🚪 Logout</div>
    </div>
  `;

  // Insert menu at the beginning of body
  document.body.insertAdjacentHTML("afterbegin", burgerMenuHTML);

  // Get elements
  const burgerMenu = document.getElementById("burgerMenu");
  const menuOverlay = document.getElementById("menuOverlay");
  const menuBackdrop = document.getElementById("menuBackdrop");

  // Toggle menu function
  function toggleMenu() {
    menuOverlay.classList.toggle("open");
    menuBackdrop.classList.toggle("open");
  }

  // Close menu function
  function closeMenu() {
    menuOverlay.classList.remove("open");
    menuBackdrop.classList.remove("open");
  }

  // Event listeners for menu toggle
  burgerMenu.addEventListener("click", toggleMenu);
  menuBackdrop.addEventListener("click", closeMenu);

  // Navigation event listeners
  if (includeHome) {
    document.getElementById("menuHome")?.addEventListener("click", () => {
      window.location.href = "/";
    });
  }

  if (includeFeedings) {
    document.getElementById("menuFeedings")?.addEventListener("click", () => {
      window.location.href = "/feedings.html";
    });
  }

  if (includeDiapers) {
    document.getElementById("menuDiapers")?.addEventListener("click", () => {
      window.location.href = "/diapers.html";
    });
  }

  if (includeSleep) {
    document.getElementById("menuSleep")?.addEventListener("click", () => {
      window.location.href = "/sleep.html";
    });
  }

  if (includeSettings) {
    document.getElementById("menuSettings")?.addEventListener("click", () => {
      window.location.href = "/settings.html";
    });
  }

  document.getElementById("menuLogout").addEventListener("click", () => {
    closeMenu();
    // Call the page's logout function if it exists, otherwise use default
    if (typeof logout === "function") {
      logout();
    } else {
      defaultLogout();
    }
  });

  // Default logout function
  function defaultLogout() {
    localStorage.removeItem("access_token");
    localStorage.removeItem("username");
    window.location.href = "/login.html";
  }
}