Update name stuff and favicon

views/branding/scripts/data_get_member.js

@@ -2,7 +2,7 @@ const characters = document.getElementById("characters");
 
 const CURRENT_CHARACTER = "meowcatheorange/iszac";
 
-fetch(`https://beta.trollcall.xyz/api/troll/${CURRENT_CHARACTER}`)
+fetch_ask(`https://beta.trollcall.xyz/api/troll/${CURRENT_CHARACTER}`)
   .then((x) => x.json())
   .then((char) => {
     var name = char.name

views/domain/scripts/data_get_domain.js

@@ -1,14 +1,18 @@
 const data_get = document.getElementById("data_get");
-fetch("https://blog.abtmtr.link/api/collections/paste/posts/domain")
+fetch_ask("https://blog.abtmtr.link/api/collections/paste/posts/domain")
   .then((x) => x.json())
   .then((paste) => {
     const data = JSON.parse(paste.data.body);
     data_get.innerHTML = data.reduce(
       (html, subdomain) =>
         html +
-        `<h1><a href="${subdomain.url}" target="_blank">${subdomain.name}</a></h1>
+        `<h1><a href="${subdomain.url}" target="_blank">${
+          subdomain.name
+        }</a></h1>
         ${subdomain.description.map((x) => `<p>${x}</p>`).join("")}
-        <img src="${subdomain.src}" alt="${subdomain.name}" title="${subdomain.name}" />`,
+        <img src="${subdomain.src}" alt="${subdomain.name}" title="${
+          subdomain.name
+        }" />`,
       ""
     );
   });

views/links/scripts/data_get_links.js

@@ -1,5 +1,5 @@
 const data_get = document.getElementById("data_get");
-fetch("https://pronouns.cc/api/v1/users/MeowcaTheoRange")
+fetch_ask("https://pronouns.cc/api/v1/users/MeowcaTheoRange")
   .then((x) => x.json())
   .then((user) => {
     data_get.innerHTML = user.links.reduce(

views/projects/item/clock/update.js

@@ -8,14 +8,16 @@ function reqData(start) {
     if (resp != prevSha) {
       window.sessionStorage.setItem("commitsha", resp);
       if (start) return;
-      document.querySelector("#updatesha").innerHTML = `from job v. ${prevSha} to job v. ${resp}`;
+      document.querySelector(
+        "#updatesha"
+      ).innerHTML = `from job v. ${prevSha} to job v. ${resp}`;
       document.querySelector("#updatedialog").classList.add("open");
     }
   };
 
-  fetch("https://ClockCheckGithub.meowcatheorange.repl.co")
+  fetch_ask("https://ClockCheckGithub.meowcatheorange.repl.co")
-  .then(x => x.text())
+    .then((x) => x.text())
-  .then(y => donedata(y));
+    .then((y) => donedata(y));
 }
 
 setInterval(reqData, 60000);

views/projects/scripts/data_get_projects.js

@@ -1,5 +1,5 @@
 const data_get = document.getElementById("data_get");
-fetch("./public/projects.json")
+fetch_ask("./public/projects.json")
   .then((x) => x.json())
   .then((projects) => {
     data_get.innerHTML = projects.items

views/scripts/accessibility.js

@@ -18,13 +18,16 @@ const FONTS = [
   ["OpenDyslexic"],
   // ["Mojangles", "Minecraft"],
   // ["Nintendo DS", "NDS12"],
-  ["System Default", `-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+  [
+    "System Default",
+    `-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
   Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
-  "Segoe UI Symbol"`],
+  "Segoe UI Symbol"`,
+  ],
   ["Sans-serif", "sans-serif"],
   ["Serif", "serif"],
-  ["Mono", "monospace"]
+  ["Mono", "monospace"],
-]
+];
 
 function createAccessibilityNodes() {
   document.querySelector("#accessibility").innerHTML = `<details>
@@ -52,7 +55,10 @@ function createAccessibilityNodes() {
     </label><br />
     <label for="acc-font">Page font:
       <select id="acc-font">
-        ${FONTS.map(([name, value]) => `<option value="${value ?? name}" selected>${name}</option>`)}
+        ${FONTS.map(
+          ([name, value]) =>
+            `<option value="${value ?? name}" selected>${name}</option>`
+        )}
       </select>
     </label><br />
       <label for="acc-hue">Page hue:
@@ -119,22 +125,42 @@ function createAccessibilityNodes() {
 
   accHueOverride.addEventListener("change", function (e) {
     window.localStorage.setItem("acc-hue-over", e.target.checked);
-    changeColor(accHue?.value, accSaturation?.value, e.target.checked, accSaturationOverride?.checked);
+    changeColor(
+      accHue?.value,
+      accSaturation?.value,
+      e.target.checked,
+      accSaturationOverride?.checked
+    );
   });
 
   accHue.addEventListener("input", function (e) {
     window.localStorage.setItem("acc-hue", e.target.value);
-    changeColor(e.target.value, accSaturation?.value, accHueOverride?.checked, accSaturationOverride?.checked);
+    changeColor(
+      e.target.value,
+      accSaturation?.value,
+      accHueOverride?.checked,
+      accSaturationOverride?.checked
+    );
   });
 
   accSaturationOverride.addEventListener("change", function (e) {
     window.localStorage.setItem("acc-sat-over", e.target.checked);
-    changeColor(accHue?.value, accSaturation?.value, accHueOverride?.checked, e.target.checked);
+    changeColor(
+      accHue?.value,
+      accSaturation?.value,
+      accHueOverride?.checked,
+      e.target.checked
+    );
   });
 
   accSaturation.addEventListener("input", function (e) {
     window.localStorage.setItem("acc-sat", e.target.value);
-    changeColor(accHue?.value, e.target.value, accHueOverride?.checked, accSaturationOverride?.checked);
+    changeColor(
+      accHue?.value,
+      e.target.value,
+      accHueOverride?.checked,
+      accSaturationOverride?.checked
+    );
   });
 
   accBase.addEventListener("change", function (e) {
@@ -143,6 +169,20 @@ function createAccessibilityNodes() {
   });
 }
 
+// For metered conenctions
+async function fetch_ask(...args) {
+  // return new Promise(async (resolve, reject) => {
+  //   let canFetch = window.sessionStorage.getItem("canFetch");
+  //   if (canFetch == null) {
+  //     canFetch = confirm("may the site fetch data for this session?");
+  //     window.sessionStorage.setItem("canFetch", canFetch);
+  //   }
+  //   if (canFetch === "true") resolve(await fetch(...args));
+  //   else reject(null);
+  // });
+  return await fetch(...args);
+}
+
 window.addEventListener("DOMContentLoaded", (e) => initializeChanges(e, true));
 
 // on localStorage change
@@ -205,9 +245,11 @@ function initializeChanges(_, loading) {
   if (width != null && accWidth != null) accWidth.value = width;
   if (font != null && accFont != null) accFont.value = font;
 
-  if (hueOver != null && accHueOverride != null) accHueOverride.checked = hueOver === "true";
+  if (hueOver != null && accHueOverride != null)
+    accHueOverride.checked = hueOver === "true";
   if (hue != null && accHue != null) accHue.value = hue;
-  if (satOver != null && accSaturationOverride != null) accSaturationOverride.checked = satOver === "true";
+  if (satOver != null && accSaturationOverride != null)
+    accSaturationOverride.checked = satOver === "true";
   if (sat != null && accSaturation != null) accSaturation.value = sat;
 
   if (base != null && accBase != null) accBase.checked = base === "true";
@@ -225,24 +267,22 @@ function changeFont(font) {
   document.documentElement.style.setProperty("--font-family", font);
 }
 
-
+const baseColor = getComputedStyle(document.documentElement)
-
+  .getPropertyValue("--base-color")
-const baseColor = getComputedStyle(document.documentElement).getPropertyValue("--base-color").split(", ");
+  .split(", ");
 function changeColor(hue, sat, hueOver, satOver) {
   if (accHue != null) accHue.disabled = !hueOver;
   if (accSaturation != null) accSaturation.disabled = !satOver;
 
-  document.documentElement.style.setProperty("--base-color", 
+  document.documentElement.style.setProperty(
-    (hueOver ? hue : baseColor[0])
+    "--base-color",
-    + ", " 
+    (hueOver ? hue : baseColor[0]) + ", " + (satOver ? sat + "%" : baseColor[1])
-    + (satOver ? (sat + "%") : baseColor[1])
   );
 
-  if (propagateStyles != null) propagateStyles(getComputedStyle(document.documentElement));
+  if (propagateStyles != null)
+    propagateStyles(getComputedStyle(document.documentElement));
 }
 
-
-
 function changeBase(base) {
   if (base) document.documentElement.classList.add("base");
   else document.documentElement.classList.remove("base");

views/scripts/data_get_whoami.js

@@ -10,19 +10,19 @@ const fields = document.getElementById("fields");
 
 const URL_REGEXP =
   /(([a-z0-9.-]*)(((:\/\/)([a-z0-9.-]*))((\/)([\w;,\/?:@&=+$\-_.!~*'()#]*))?)|(((mailto|tel):)([\w;,\/?:@&=+$\-_.!~*'()#]*)))/g;
-fetch("https://pronouns.cc/api/v1/users/MeowcaTheoRange")
+fetch_ask("https://pronouns.cc/api/v1/users/MeowcaTheoRange")
   .then((x) => x.json())
   .then((user) => {
     data_whoami.innerHTML = `
 <p>I'm <a href="https://pronouns.cc/@MeowcaTheoRange" target="_blank"><b>${
       user.names[0].value
     }</b></a>, also better known online as <b>${
-      user.name
+      user.display_name
     }</b>. <small>(${user.pronouns
       .filter((pronoun) => pronoun.status == "okay")
       .map((pronoun) => pronoun.pronouns.split("/")[0])
       .join("/")})</small></p>`;
-    about.innerHTML = `<h2>Bio</h2><p>MeowcaTheoRange<br />${user.bio
+    about.innerHTML = `<h2>Bio</h2><p>${user.display_name}<br />${user.bio
       .replace(URL_REGEXP, (m) => `<a href="${m}" target="_blank">${m}</a>`)
       .replaceAll("\n", "<br />")}</p>`;
     const curTime = new Date();
@@ -69,7 +69,7 @@ fetch("https://pronouns.cc/api/v1/users/MeowcaTheoRange")
       .join("");
   });
 
-fetch("https://local.abtmtr.link/api/v1/accounts/stat/statuses")
+fetch_ask("https://local.abtmtr.link/api/v1/accounts/stat/statuses")
   .then((x) => x.json())
   .then((statuses) => {
     console.log(statuses);