---
---

if ("{{ site.safeui }}"==="true") {
  document.addEventListener("DOMContentLoaded", function () {
    var safuiAlert = document.querySelector("#safeui-alert");
    if (safuiAlert) {
      setTimeout(function () {
        safuiAlert.style.transition = "1s";
        safuiAlert.style.height = "0";
        safuiAlert.style.paddingTop = "0";
        safuiAlert.style.paddingBottom = "0";
        safuiAlert.style.marginTop = "0";
        safuiAlert.style.marginBottom = "0";
        setTimeout(function () {
          safuiAlert.parentNode.removeChild(safuiAlert);
        }, 1000);
      }, 10000);
    }
  });
}
const hamburger = document.querySelector("#hamburger");
const appscmsToolbar = document.querySelector(".appscms-toolbar");
const appscmsToolbarListItems = document.querySelectorAll(
  ".appscms-toolbar-list-item-span"
);
hamburger.addEventListener("click", () => {
  if (hamburger.dataset.open === "1") {
    hamburger.dataset.open = "0";
    appscmsToolbar.style.right = "-272px";
    appscmsToolbar.style.display = "none";
    hamburger.innerHTML = ` <svg
        style="font-size:25px"
          stroke="currentColor"
          fill="currentColor"
          stroke-width="0"
          viewBox="0 0 512 512"
          aria-hidden="true"
          focusable="false"
          height="50px"
          width="1em"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            fill="none"
            stroke-linecap="round"
            stroke-miterlimit="10"
            stroke-width="48"
            d="M88 152h336M88 256h336M88 360h336"
          ></path>
        </svg>`;
  } else {
    hamburger.dataset.open = "1";
    appscmsToolbar.style.right = "0px";
    appscmsToolbar.style.display = "block";
    hamburger.innerHTML = `<svg  height="50px"
        width="1em"  style="font-size:25px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" stroke="#ffffff"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <g clip-path="url(#clip0_429_11083)"> <path d="M7 7.00006L17 17.0001M7 17.0001L17 7.00006" stroke="#ffffff" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"></path> </g> <defs> <clipPath id="clip0_429_11083"> <rect width="24" height="24" fill="white"></rect> </clipPath> </defs> </g></svg>`;
  }
});
Array.from(appscmsToolbarListItems).map((item) => {
  item.addEventListener("click", (e) => {
    e.preventDefault();
    var style = window.getComputedStyle(item.nextElementSibling);
    var maxHeight = style.getPropertyValue("max-height");

    if (maxHeight && maxHeight !== "0px") {
      // If the item is expanded, collapse it
      item.nextElementSibling.style.maxHeight = "0";
      item.nextElementSibling.style.opacity = "0";
      item.nextElementSibling.style.height = "0";
    } else {
      // If the item is collapsed, expand it
      item.nextElementSibling.style.maxHeight =
        item.nextElementSibling.scrollHeight + "px";
      item.nextElementSibling.style.opacity = "1";
      item.nextElementSibling.style.height = "auto";
    }
  });
});

if ("{{ site.removeBootstrapJs }}" === "true") {
  const languagesModal = document.querySelector("#staticBackdrop");
  const intModalBtn = document.querySelector("#int-modal-btn");
  const closeBtn = document.querySelector("#close-modal");

  if (intModalBtn) {
    intModalBtn.addEventListener("click", () => {
      languagesModal.style.display = "block";
      languagesModal.classList.add("show");
      let modal = document.createElement("div");
      modal.classList.add("modal-backdrop", "show");
      document.body.appendChild(modal);
    });
    closeBtn.addEventListener("click", () => {
      languagesModal.style.display = "none";
      languagesModal.classList.remove("show");
      let modal = document.querySelector(".modal-backdrop");
      document.body.removeChild(modal);
    });
  }
}