yay :3

astro/.vscode/settings.json

@@ -2,5 +2,6 @@
     "cSpell.words": [
         "bsod",
         "kanban"
-    ]
+    ],
+    "compile-hero.disable-compile-files-on-did-save-code": true
 }

astro/public/scripts/ntfy.js

@@ -1,13 +1,48 @@
+// i deeply apologize for the horrors within...
+const ntfyEndpoint = "https://ntfy.ouroboros.group/beep"
+
 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");
 
-const msgPFX = "message: "
+const optionsCheck = document.getElementById("optionsCheckbox");
+const titleCheck = document.getElementById("titleCheckbox");
+const attachmentCheck = document.getElementById("attachmentCheckbox");
+const clickCheck = document.getElementById("clickCheckbox");
+
+const titleBoxLabel = document.getElementById("titleBoxLabel");
+const attachmentBoxLabel = document.getElementById("attachBoxLabel");
+const clickBoxLabel = document.getElementById("clickBoxLabel");
+
+const optionsEnabled = sessionStorage.getItem("optionsEnabled");
+const titleEnabled = sessionStorage.getItem("optionsEnabled");
+const attachmentEnabled = sessionStorage.getItem("optionsEnabled");
+const clickEnabled = sessionStorage.getItem("optionsEnabled");
+
+const msgPFX = "message: ";
+
+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();
+  }
+}
 
 // Random placeholder
-
 function getPlaceholder() {
   placeholderSelector = Math.floor(Math.random() * 8) + 1;
   switch (placeholderSelector) {
@@ -30,12 +65,10 @@ function getPlaceholder() {
       ntfyMessage.placeholder = `${msgPFX}the organization is after you.`;
       break;
     case 7:
-      ntfyMessage.placeholder =
-        `${msgPFX}you wouldnt happen to know where an IBN5100 is, would you?`;
+      ntfyMessage.placeholder = `${msgPFX}you wouldnt happen to know where an IBN5100 is, would you?`;
       break;
     case 8:
-      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?`;
+      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:
       ntfyMessage.placeholder = `${msgPFX}time travel?`;
@@ -45,26 +78,139 @@ function getPlaceholder() {
   }
 }
 
-// send function
-function send(message, title, attachment, click) {
+// send functions
+
+// only message
+function sendNone(message) {
   const r = new XMLHttpRequest();
-  r.open("POST", "https://ntfy.ouroboros.group/beep", true);
-  r.setRequestHeader("Content-Type", "text/plain");/*
+  r.open("POST", ntfyEndpoint, true);
+  r.setRequestHeader("Content-Type", "text/plain");
+  r.send(message);
+}
+
+// send all
+function sendAll(title, message, attachment, click) {
+  const r = new XMLHttpRequest();
+  r.open("POST", ntfyEndpoint, true);
+  r.setRequestHeader("Content-Type", "text/plain");
   r.setRequestHeader("Title", title);
   r.setRequestHeader("Attach", attachment);
-  r.setRequestHeader("Click", click);*/
+  r.setRequestHeader("Click", click);
+  r.send(message);
+}
+
+// send title only
+function sendTitle(title, message) {
+  const r = new XMLHttpRequest();
+  r.open("POST", ntfyEndpoint, true);
+  r.setRequestHeader("Content-Type", "text/plain");
+  r.setRequestHeader("Title", title);
+  r.send(message);
+}
+
+// send attachment only
+function sendAttach(message, attachment) {
+  const r = new XMLHttpRequest();
+  r.open("POST", ntfyEndpoint, true);
+  r.setRequestHeader("Content-Type", "text/plain");
+  r.setRequestHeader("Attach", attachment);
+  r.send(message);
+}
+
+// send click only
+function sendClick(message, click) {
+  const r = new XMLHttpRequest();
+  r.open("POST", ntfyEndpoint, true);
+  r.setRequestHeader("Content-Type", "text/plain");
+  r.setRequestHeader("Click", click);
+  r.send(message);
+}
+
+// send Title & Attachment
+function sendTitleAttach(title, message, attachment) {
+  const r = new XMLHttpRequest();
+  r.open("POST", ntfyEndpoint, true);
+  r.setRequestHeader("Content-Type", "text/plain");
+  r.setRequestHeader("Title", title);
+  r.setRequestHeader("Attach", attachment);
+  r.send(message);
+}
+
+// send Title & Click
+function sendTitleClick(title, message, click) {
+  const r = new XMLHttpRequest();
+  r.open("POST", ntfyEndpoint, true);
+  r.setRequestHeader("Content-Type", "text/plain");
+  r.setRequestHeader("Title", title);
+  r.setRequestHeader("Click", click);
+  r.send(message);
+}
+
+// send Attach & Click
+function sendAttachClick(message, attachment, click) {
+  const r = new XMLHttpRequest();
+  r.open("POST", ntfyEndpoint, true);
+  r.setRequestHeader("Content-Type", "text/plain");
+  r.setRequestHeader("Attach", attachment);
+  r.setRequestHeader("Click", click);
   r.send(message);
 }
 
 // send notification
-function sendNotification() {/*
-  send(ntfyTitle.value, ntfyMessage.value, ntfyAttach.value, ntfyClickAction.value);
+function sendNotification() {
+  // title only
+  if (titleEnabled && !attachmentEnabled && !clickEnabled) {
+    sendTitle(ntfyTitle.value, ntfyMessage.value);
     ntfyTitle.value = "";
-  ntfyAttach.value = "";
-  ntfyClickAction.value = "";*/
-  send(ntfyMessage.value);
     ntfyMessage.value = "";
   }
+  // attachment only
+  if (!titleEnabled && attachmentEnabled && !clickEnabled) {
+    sendAttach(ntfyMessage.value, ntfyAttach.value);
+    ntfyMessage.value = "";
+    ntfyAttach.value = "";
+  }
+  // click only
+  if (!titleEnabled && !attachmentEnabled && clickEnabled) {
+    sendClick(ntfyMessage.value, ntfyClickAction.value);
+    ntfyMessage.value = "";
+    ntfyClickAction.value = "";
+  }
+  // title & attachment
+  if (titleEnabled && attachmentEnabled && !clickEnabled) {
+    sendTitleAttach(ntfyTitle.value, ntfyMessage.value, ntfyAttach.value);
+    ntfyTitle.value = "";
+    ntfyMessage.value = "";
+    ntfyAttach.value = "";
+  }
+  // title & click
+  if (titleEnabled && !attachmentEnabled && clickEnabled) {
+    sendTitleClick(ntfyTitle.value, ntfyMessage.value, ntfyClickAction.value);
+    ntfyTitle.value = "";
+    ntfyMessage.value = "";
+    ntfyClickAction.value = "";
+  }
+  // attachment & click
+  if (!titleEnabled && attachmentEnabled && clickEnabled) {
+    sendAttachClick(ntfyMessage.value, ntfyAttach.value, ntfyClickAction.value);
+    ntfyAttach.value = "";
+    ntfyMessage.value = "";
+    ntfyClickAction.value = "";
+  }
+  // all three
+  if (titleEnabled && attachmentEnabled && clickEnabled) {
+    sendAll(ntfyTitle.value, ntfyMessage.value, ntfyAttach.value, ntfyClickAction.value);
+    ntfyTitle.value = "";
+    ntfyMessage.value = "";
+    ntfyAttach.value = "";
+    ntfyClickAction.value = "";
+  }
+  // none
+  else {
+    sendNone(ntfyMessage.value);
+    ntfyMessage.value = "";
+  }
+}
 
 // on send button click
 async function ntfyClick() {
@@ -83,29 +229,56 @@ async function ntfyClick() {
   }
 }
 
-function toggleTitle() {
-  if (ntfyTitle.style.display === "none") {
-    ntfyTitle.style.display = "internal"
+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 (ntfyTitle.style.display === "internal") {
-    ntfyTitle.style.display = "none"
+  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 (ntfyAttach.style.display === "none") {
-    ntfyAttach.style.display = "internal"
+  if (attachmentCheck.checked) {
+    sessionStorage.setItem("attachmentEnabled", 1);
+    ntfyAttach.style.display = "initial";
   }
-  if (ntfyAttach.style.display === "internal") {
-    ntfyAttach.style.display = "none"
+  if (!attachmentCheck.checked) {
+    sessionStorage.removeItem("attachmentEnabled");
+    ntfyAttach.style.display = "none";
   }
 }
 
 function toggleClick() {
-  if (ntfyClickAction.style.display === "none") {
-    ntfyClickAction.style.display = "internal"
+  if (clickCheck.checked) {
+    sessionStorage.setItem("clickEnabled", 1);
+    ntfyClickAction.style.display = "initial";
   }
-  if (ntfyAttach.style.display === "internal") {
-    ntfyAttach.style.display = "none"
+  if (!clickCheck.checked) {
+    sessionStorage.removeItem("clickEnabled");
+    ntfyClickAction.style.display = "none";
   }
 }

astro/public/scripts/sga.js

@@ -1,32 +1,19 @@
-// IF YOU EDIT ANYTHING IN HERE DONT FORGET TO EDIT THE SCRIPT IN LAYOUT.ASTRO BECAUSE FUCK ME
-function onload() {
+function getSGAState() {
   if (sessionStorage.getItem("sgaEnabled")) {
     enableSGA();
   }
 }
 
-/*
-    // IF YOU EDIT ANYTHING IN HERE DONT FORGET TO EDIT THE SCRIPT IN SGA.JS BECAUSE FUCK ME
-      if (sessionStorage.getItem("sgaEnabled")) {
-        document.getElementById("body").style.fontFamily =
-          "standardGalactic, system-ui";
-        sessionStorage.setItem("sgaEnabled", 1);
-        console.debug(sessionStorage.getItem("sgaEnabled"));
-      }
-*/
-
 function enableSGA() {
   document.getElementById("body").style.fontFamily =
     "standardGalactic, system-ui";
   sessionStorage.setItem("sgaEnabled", 1);
-  console.debug(sessionStorage.getItem("sgaEnabled"));
 }
 
 function disableSGA() {
   document.getElementById("body").style.fontFamily =
     "departure-mono, system-ui";
   sessionStorage.removeItem("sgaEnabled");
-  console.debug(sessionStorage.getItem("sgaEnabled"));
 }
 
 function toggleTheme() {

astro/public/styles/css/mobile.css

@@ -17,5 +17,4 @@
     .btn-1 {
         margin-bottom: 5px;
     }
-
 }

astro/src/components/main-page/silly-widgets.astro

@@ -1,54 +1,10 @@
+---
+import LastFM from "./widgets/lastfm.astro";
+import NTFY from "./widgets/ntfy.astro";
+---
+
 <section class="content center">
-    <div id="lastfm-widget">
-    <div id="widget">
-      <a href="https://www.last.fm/user/LimePotato"><span style="color: var(--alt-accent-600);"><i class="nf nf-md-music"></i></span> - <span id="song">&#8987</span></a>
-    </div>
-    <div>
-      <span style="font-size: small;"
-        >latest played song on <a href="http://last.fm" target="_blank"
-          >last.fm</a
-        ></span
-      >
-    </div>
-    <hr> <!-- NTFY BOX -->
-    <div class="ntfy-box">
-      <h4 style="margin-bottom: 0px;">send me a notification! type words and press send</h4>
-      <small style="font-size: 15px;">music recs, questions, jokes, confessions of your sins, etc, welcome, I respond to all or most as vagueposts on the fediverse.</small>
-      <br>
-      <small style="font-size: 12px; color: rgb(252, 76, 76);">
-        DESTROYED ON SIGHT: slurs, flirting, lewd or sexual comments/jokes without previous explicit permission.
-      </small>
-      <br>
-      <br>
-      <fieldset style="margin-left: 35%; margin-right: 35%; margin-bottom: 2%; display: none;">
-      <div>
-        <input type="checkbox" id="title" name="title" onchange="toggleTitle()" />
-        <label for="title">Add Title?</label>
-      </div>
-        <div>
-          <input type="checkbox" id="attachment" name="attachment" onchange="toggleAttach()" />
-          <label for="attachment">Add Attachment?</label>
-        </div>
-        <div>
-          <input type="checkbox" id="click" name="click" onchange="toggleClick()" />
-          <label for="click">Add Click Action?</label>
-        </div>
-      </fieldset>
-      <textarea id="ntfy-title" placeholder="title" rows=1 style="resize: none; display: none;"></textarea>
-      <textarea id="ntfy-message" placeholder="message" rows=2></textarea>
-      <textarea id="ntfy-attach" placeholder="attachment link" rows=1 style="resize: none;display: none;"></textarea>
-      <textarea id="ntfy-click" placeholder="click link" rows=1 style="resize: none; display: none;"></textarea>
-      <br>
-      <br>
-    <button
-    class="custom-btn btn-1"
-    style="width: 42%;"
-    onclick="ntfyClick()"
-    id="ntfy-button">
-    <span>Send</span>
-    </button>
-    <br>
-    <br>s
-    <small>if it doesnt seem to be working, or you have javascript disabled, <br>you can POST to <span class="glitch">https://ntfy.ouroboros.group/beep</span>.</small>
-    </div>
+  <LastFM />
+  <hr />
+  <NTFY />
 </section>

astro/src/components/main-page/widgets/lastfm.astro

@@ -0,0 +1,18 @@
+<div id="lastfm-widget">
+  <div id="widget">
+    <a href="https://www.last.fm/user/LimePotato"
+      ><span style="color: var(--alt-accent-600);"
+        ><i class="nf nf-md-music"></i></span
+      > - <span id="song">&#8987</span></a
+    >
+  </div>
+  <div>
+    <span style="font-size: small;"
+      >latest played song on <a
+        href="http://last.fm"
+        target="_blank"
+        >last.fm</a
+      ></span
+    >
+  </div>
+</div>

astro/src/components/main-page/widgets/ntfy.astro

@@ -0,0 +1,48 @@
+<div class="ntfy-box">
+  <!-- DISCLAIMER/INFO -->
+    <h4 style="margin-bottom: 0px;">send me a notification! type words and press send</h4>
+    <small style="font-size: 15px;">music recs, questions, jokes, confessions of your sins, etc, welcome, I respond to all or most as vagueposts on the fediverse.</small>
+    <br>
+    <small style="font-size: 12px; color: rgb(252, 76, 76);">
+      DESTROYED ON SIGHT: slurs, flirting, lewd or sexual comments/jokes without previous explicit permission.
+    </small>
+    <br>
+    <br>
+  <!-- TEXT AREAS -->
+    <div>
+    <textarea id="ntfy-title" placeholder="title: Title" rows=1 style="resize: none; display: none;"></textarea>
+    <textarea id="ntfy-message" placeholder="message: hello!" rows=2></textarea>
+    <textarea id="ntfy-attach" placeholder="attachment: https://http.cat/images/100.jpg" rows=1 style="resize: none;display: none;"></textarea>
+    <textarea id="ntfy-click" placeholder="click: https://www.youtube.com/watch?v=dQw4w9WgXcQ" rows=1 style="resize: none; display: none;"></textarea>
+  </div>
+  <button
+  class="custom-btn btn-1"
+  style="width: 42%; margin-top: 2%"
+  onclick="ntfyClick()"
+  id="ntfy-button">
+  <span>Send</span>
+  </button>
+    <!-- OPTIONS BOXES -->
+    <fieldset style="margin-left: 35%; margin-right: 35%; margin-bottom: -4%; margin-top: 2%;">
+        <div>
+          <input type="checkbox" id="optionsCheckbox" name="optionsCheckbox" onchange="toggleOptions()"/>
+          <label for="optionsCheckbox">More Options</label>
+        </div>
+      <div>
+        <input type="checkbox" id="titleCheckbox" name="titleCheckbox" onchange="toggleTitle()" style="display: none;"/>
+        <label  id="titleBoxLabel" style="display: none;" for="titleCheckbox">Add Title?</label>
+      </div>
+        <div>
+          <input type="checkbox" id="attachmentCheckbox" name="attachmentCheckbox" onchange="toggleAttach()" style="display: none;"/>
+          <label id="attachBoxLabel" style="display: none;" for="attachmentCheckbox">Add Attachment?</label>
+        </div>
+        <div>
+          <input type="checkbox" id="clickCheckbox" name="clickCheckbox" onchange="toggleClick()" style="display: none;"/>
+          <label id="clickBoxLabel" style="display: none;" for="clickCheckbox">Add Click Action?</label>
+        </div>
+      </fieldset>
+  <br>
+  <br>
+  <!-- DISCLAIMER/INFO -->
+  <small>if it doesnt seem to be working, or you have javascript disabled, <br>you can POST to <span class="glitch">https://ntfy.ouroboros.group/beep</span>.</small>
+  </div>

astro/src/layouts/Layout.astro

@@ -16,7 +16,7 @@ const { title } = Astro.props;
   <head>
     <Head title={title} />
   </head>
-  <body onload="onload(), redirect(), getPlaceholder()" id="body">
+  <body onload="checkBoxes(), getSGAState(), redirect(), getPlaceholder()" id="body">
     <Header />
     <section class="content center">
       <h1 class="title">{title}</h1>