// i deeply apologize for the horrors within...
const ntfyEndpoint = "https://nelle.observer/api/ntfy";
//const ntfyEndpoint = "http://0.0.0.0:7879/api/ntfy";

// text fields and buttons
const ntfyMessage = document.getElementById("ntfy-message");
const ntfyTitle = document.getElementById("ntfy-title");
const ntfyAttach = document.getElementById("ntfy-attach");
const ntfyClickAction = document.getElementById("ntfy-click");
const ntfyButton = document.getElementById("ntfy-button");

// options checkboxes
const optionsCheck = document.getElementById("optionsCheckbox");
const titleCheck = document.getElementById("titleCheckbox");
const attachmentCheck = document.getElementById("attachmentCheckbox");
const clickCheck = document.getElementById("clickCheckbox");

// labels
const titleBoxLabel = document.getElementById("titleBoxLabel");
const attachmentBoxLabel = document.getElementById("attachBoxLabel");
const clickBoxLabel = document.getElementById("clickBoxLabel");

// Options storage variables
const optionsEnabled = sessionStorage.getItem("optionsEnabled");
const titleEnabled = sessionStorage.getItem("optionsEnabled");
const attachmentEnabled = sessionStorage.getItem("optionsEnabled");
const clickEnabled = sessionStorage.getItem("optionsEnabled");

// Prefixs for placeholders
const titlePFX = "title: ";
const msgPFX = "message: ";
const attachPFX = "attachment: ";
const clickPFX = "click-action: ";

// Ctrl + Enter to send
document.addEventListener("keydown", (event) => {
  if (event.ctrlKey && event.key === "Enter") {
    ntfyClick();
  }
});

// Random placeholder
function getPlaceholder() {
  placeholderSelector = Math.floor(Math.random() * 8) + 1;
  switch (placeholderSelector) {
    case 1:
      ntfyTitle.placeholder = `${titlePFX}hey there`;
      ntfyMessage.placeholder = `${msgPFX}hi nelle! (｡>﹏<｡)`;
      break;
    case 2:
      ntfyTitle.placeholder = `${titlePFX}fuck you`;
      ntfyMessage.placeholder = `${msgPFX}(╹◡╹)凸`;
      break;
    case 3:
      ntfyTitle.placeholder = `${titlePFX}confession of sin`;
      ntfyMessage.placeholder = `${msgPFX}I dont like SciAdv`;
      break;
    case 4:
      ntfyTitle.placeholder = `${titlePFX}a funny joke`;
      ntfyMessage.placeholder = `${msgPFX}Knock Knock...`;
      break;
    case 5:
      ntfyTitle.placeholder = `${titlePFX}yes, its me`;
      ntfyMessage.placeholder = `${msgPFX}El. Psy. Kongroo.`;
      break;
    case 6:
      ntfyTitle.placeholder = `${titlePFX}SDXc^73hce1!3&`;
      ntfyMessage.placeholder = `${msgPFX}we're watching you.`;
      break;
    case 7:
      ntfyTitle.placeholder = `${titlePFX}haiiii :3`;
      ntfyMessage.placeholder = `${msgPFX}you wouldnt happen to know where an IBN5100 is, would you?`;
      break;
    case 8:
      ntfyTitle.placeholder = `${titlePFX}an important question`;
      ntfyMessage.placeholder = `${msgPFX}if you had to choose, between: bacon, unlimited bacon, but no games. or. games. unlimited games, but no games. which would you pick?`;
      break;
    case 9:
      ntfyTitle.placeholder = `${titlePFX}query`;
      ntfyMessage.placeholder = `${msgPFX}time travel?`;
      break;
    default:
      ntfyTitle.placeholder = `${titlePFX}title the message for some reason?`;
      ntfyMessage.placeholder = `${msgPFX}type some words and hit send.`;
      ntfyAttach.placeholder = `${attachPFX}https://http.cat/images/100.jpg`;
      ntfyClickAction.placeholder = `${clickPFX}https://www.youtube.com/watch?v=dQw4w9WgXcQ`;
  }
}

function checkBoxes() {
  if (optionsEnabled) {
    optionsCheck.checked = true;
    toggleOptions();
  }
  if (titleEnabled) {
    titleCheck.checked = true;
    toggleTitle();
  }
  if (attachmentEnabled) {
    attachmentCheck.checked = true;
    toggleAttach();
  }
  if (clickEnabled) {
    clickCheck.checked = true;
    toggleClick();
  }
}
function toggleOptions() {
  if (optionsCheck.checked) {
    sessionStorage.setItem("optionsEnabled", 1);
    titleBoxLabel.style.display = "initial";
    attachmentBoxLabel.style.display = "initial";
    clickBoxLabel.style.display = "initial";
    titleCheck.style.display = "initial";
    attachmentCheck.style.display = "initial";
    clickCheck.style.display = "initial";
  }
  if (!optionsCheck.checked) {
    sessionStorage.removeItem("optionsEnabled");
    titleBoxLabel.style.display = "none";
    attachmentBoxLabel.style.display = "none";
    clickBoxLabel.style.display = "none";
    titleCheck.style.display = "none";
    attachmentCheck.style.display = "none";
    clickCheck.style.display = "none";
  }
}
function toggleTitle() {
  if (titleCheck.checked) {
    sessionStorage.setItem("titleEnabled", 1);
    ntfyTitle.style.display = "initial";
  }
  if (!titleCheck.checked) {
    sessionStorage.removeItem("titleEnabled");
    ntfyTitle.style.display = "none";
  }
}
function toggleAttach() {
  if (attachmentCheck.checked) {
    sessionStorage.setItem("attachmentEnabled", 1);
    ntfyAttach.style.display = "initial";
  }
  if (!attachmentCheck.checked) {
    sessionStorage.removeItem("attachmentEnabled");
    ntfyAttach.style.display = "none";
  }
}
function toggleClick() {
  if (clickCheck.checked) {
    sessionStorage.setItem("clickEnabled", 1);
    ntfyClickAction.style.display = "initial";
  }
  if (!clickCheck.checked) {
    sessionStorage.removeItem("clickEnabled");
    ntfyClickAction.style.display = "none";
  }
}

// on send button click
async function ntfyClick() {
  if (!ntfyMessage.value.replace(/\s/g, "").length) {
    ntfyButton.innerHTML = "<span>ಠ﹏ಠ</span>";
    setTimeout(() => {
      ntfyButton.innerHTML = "<span>Send</span>";
      return;
    }, 1000);
  } else {
    ntfyButton.innerHTML = "<span>Sent! ( ꈍᴗꈍ)</span>";
    sendNotification();
    setTimeout(() => {
      ntfyButton.innerHTML = "<span>Send</span>";
    }, 1000);
  }
}

// send all
function sendAll(endpoint, title, message, attachment, click) {
  const xhr = new XMLHttpRequest();
  const formData = new FormData();

  formData.append("Title", title);
  formData.append("Message", message);
  formData.append("Attach", attachment);
  formData.append("Click", click);

  // Submit the data via fetch()
  fetch(endpoint, {
    method: "POST",
    body: formData,
  });
}

// send notification
function sendNotification() {
  sendAll(
    ntfyEndpoint,
    ntfyTitle.value,
    ntfyMessage.value,
    ntfyAttach.value,
    ntfyClickAction.value,
  );
  ntfyTitle.value = "";
  ntfyMessage.value = "";
  ntfyAttach.value = "";
  ntfyClickAction.value = "";
}