function isHideable(div_obj) {
  // Ignore for TOC since it is handled differently
  if (div_obj.id === "text-table-of-contents") return false;
  if (div_obj.id === "table-of-contents") return false;
  // No point in hiding top level
  if (div_obj.classList.contains("outline-2")) return false;
  if (div_obj.classList.contains("outline-text-2")) return false;
  return true;
}

function orgjqHide(div_obj) {
  if (!isHideable(div_obj)) return;
  const parent = div_obj.parentElement;
  parent.classList.remove("orgjq-expanded");
  parent.classList.add("orgjq-contracted");
}

function orgjqShow(div_obj) {
  const parent = div_obj.parentElement;
  parent.classList.remove("orgjq-contracted");
  parent.classList.add("orgjq-expanded");
}

function orgjqToggle(div_obj) {
  const parent = div_obj.parentElement;
  if (parent.classList.contains("orgjq-expanded")) {
    orgjqHide(div_obj);
  } else {
    orgjqShow(div_obj);
  }
}

function orgjqEnable() {
  // Called once e.g. the first time the page is loaded
  // handle the click event for each header
  for (let i = 2; i <= 7; ++i) {
    const headers = document.querySelectorAll(`h${i}`);
    headers.forEach(header => {
      header.style.cursor = "pointer";
      header.addEventListener('click', function() {
        // Get the first div sibling after the header
        const parent = this.parentElement;
        const divs = parent.querySelectorAll(':scope > div');
        if (divs.length > 0) {
          orgjqToggle(divs[0]);
        }
      });
    });
  }

  // Mark everything as open...
  for (let i = 2; i <= 7; ++i) {
    const headers = document.querySelectorAll(`h${i}`);
    headers.forEach(header => {
      const parent = header.parentElement;
      parent.classList.remove("orgjq-contracted");
      parent.classList.add("orgjq-expanded");
    });
  }

  // ... except TOC ...
  const toc = document.querySelector("div#table-of-contents");
  if (toc) {
    toc.classList.remove("orgjq-expanded");
    toc.classList.add("orgjq-contracted");
  }
  // ... and autocollapse.
  const autocollapse = document.querySelectorAll(".autocollapse");
  autocollapse.forEach(element => {
    const grandparent = element.parentElement?.parentElement;
    if (grandparent) {
      orgjqHide(grandparent);
    }
  });
}

// Run when DOM is loaded
if (document.readyState === 'loading') {
  document.addEventListener('DOMContentLoaded', orgjqEnable);
} else {
  orgjqEnable();
}