function hide_page() {
  // to unhide the hidden element, we also need to un-ID it
  // to make the CSS rule stop applying
  // janky hack, but it makes it not have 1 frame of showing on load.
  hidden.id = '';
  hidden.style.display = '';
  shown.style.display = 'none';
}

function unhide_page() {
  shown.style.display = '';
  hidden.style.display = 'none';
}

function hide_actually_everything() {
  hidden.style.display = 'none';
}

// get the elements we need to hide
var shown  = document.getElementById("page-content");
var hidden = document.getElementById("page-content-hidden");

// assign functions to buttons
document
  .getElementById("button-hide-page")
  .addEventListener("click", hide_page);
document
  .getElementById("button-unhide-page")
  .addEventListener("click", unhide_page);
document
  .getElementById("button-hide-everything")
  .addEventListener("click", hide_actually_everything);

// check URL params and see if we should hideall
const urlParams = new URLSearchParams(window.location.search);
if (urlParams.has('hideall')) {
  hide_page();
  hide_actually_everything();
}