const btn = document.getElementById("theme-switcher");

// toggle light/dark theme for selected elements
const setTheme = () => {

  document.body.classList.toggle("dark-body");
  document.getElementById("header").classList.toggle("dark-header");
  document.getElementById("html").classList.toggle("dark-html");
  document.getElementById("forgotPwLog").classList.toggle("dark-loginBox");
  document.getElementById("licenceNum").style.color = "black";

  // config
  let configDiv = document.getElementsByClassName("configDiv");
  for (let i = 0; i < configDiv.length; i++) {
    configDiv[i].classList.toggle("darkConfigDiv");
  }
  // details
  let details = document.getElementsByClassName("details");
  for (let i = 0; i < details.length; i++) {
    details[i].classList.toggle("dark-details");
  }
  let detailDash = document.getElementsByClassName("detailsDash");
  for (let i = 0; i < detailDash.length; i++) {
    detailDash[i].classList.toggle("darkConfigDiv");
  }
  // sections
  let sections = document.getElementsByClassName("section");
  for (let i = 0; i < sections.length; i++) {
    sections[i].classList.toggle("dark-section");
  }

  // hr
  let hr = document.getElementsByTagName("hr");
  for (let i = 0; i < hr.length; i++) {
    hr[i].classList.toggle("dark-hr");
  }
  let info = document.getElementsByClassName("info");
  for (let i = 0; i < info.length; i++) {
    info[i].classList.toggle("darkInfo");
  }
};

// enable/disable dark mode on button press and save enabled/disabled to local Storage
btn.addEventListener("click", function () {
  setTheme();
  if (document.body.classList.contains("dark-body")) {
    localStorage.setItem("darkMode", "enabled");
  } else {
    localStorage.setItem("darkMode", "disabled");
  }
  location.reload();
});

// Set login page dark mode if enabled
if (localStorage.getItem("darkMode") === "enabled") {
  document.getElementById("login").classList.toggle("dark-login");
  document.getElementById("loginBox").classList.toggle("dark-loginBox");
  document.getElementById("loginForCol").classList.toggle("dark-login");
  document.getElementById("loginForColF").classList.toggle("dark-login");
  document.getElementById("loginBoxLogo").src =
    "./img/Tiger_TMS_Logo Orange282828.png";
  document.getElementById("resetLoginLogo").src =
    "./img/Tiger_TMS_Logo Orange282828.png";
} else {
  document.getElementById("loginBoxLogo").src = "./img/setera-guest-login-logo.png";
  document.getElementById("resetLoginLogo").src = "./img/setera-guest-login-logo.png";
}
// set content manager dark mode if enabled
if (localStorage.getItem("darkMode") === "enabled") {
  setTheme();
}