{
  const ta = document.getElementById("babycode-content");
  
  for (let button of document.querySelectorAll(".reply-button")) {
    button.addEventListener("click", (e) => {
      ta.value += button.value;
      ta.scrollIntoView()
      ta.focus();
    })
  }
  
  const deleteDialog = document.getElementById("delete-dialog");
  const deleteDialogCloseButton = document.getElementById("post-delete-dialog-close");
  let deletionTargetPostContainer;
  
  function closeDeleteDialog() {
    deletionTargetPostContainer.style.removeProperty("background-color");
    deleteDialog.close();
  }
  
  deleteDialogCloseButton.addEventListener("click", (e) => {
    closeDeleteDialog();
  })
  deleteDialog.addEventListener("click", (e) => {
    if (e.target === deleteDialog) {
      closeDeleteDialog();
    }
  })
  for (let button of document.querySelectorAll(".post-delete-button")) {
    button.addEventListener("click", (e) => {
      deleteDialog.showModal();
      const postId = button.value;
      deletionTargetPostContainer = document.getElementById("post-" + postId).querySelector(".post-content-container");
      deletionTargetPostContainer.style.setProperty("background-color", "#fff");
      const form = document.getElementById("post-delete-form");
      form.action = `/post/${postId}/delete`
    })
  }
  
  const threadEndpoint = document.getElementById("thread-subscribe-endpoint").value;
  let now = Math.floor(new Date() / 1000);
  function hideNotification() {
    const notification = document.getElementById('new-post-notification');
    notification.classList.add('hidden');
  }
  
  function showNewPostNotification(url) {
    const notification = document.getElementById("new-post-notification");
    
    notification.classList.remove("hidden");
    
    document.getElementById("dismiss-new-post-button").onclick = () => {
      now = Math.floor(new Date() / 1000);
      hideNotification();
      tryFetchUpdate();
    }
    
    document.getElementById("go-to-new-post-button").href = url;
    
    document.getElementById("unsub-new-post-button").onclick = () => {
      hideNotification();
    }
  }

  function tryFetchUpdate() {
    if (!threadEndpoint) return;
    const body = JSON.stringify({since: now});
    fetch(threadEndpoint, {method: "POST", headers: {"Content-Type": "application/json"}, body: body})
      .then(res => res.json())
      .then(json => {
        if (json.status === "none") {
          setTimeout(tryFetchUpdate, 5000);
        } else if (json.status === "new_post") {
          showNewPostNotification(json.url);
        }
      })
      .catch(error => console.log(error))
  }
  tryFetchUpdate();
}