Update name stuff and favicon

This commit is contained in:
MeowcaTheoRange 2024-01-19 10:28:16 -06:00
parent b7a98508b2
commit db77ca5ccd
8 changed files with 82 additions and 36 deletions

View file

@ -2,7 +2,7 @@ const characters = document.getElementById("characters");
const CURRENT_CHARACTER = "meowcatheorange/iszac"; 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((x) => x.json())
.then((char) => { .then((char) => {
var name = char.name var name = char.name

View file

@ -1,14 +1,18 @@
const data_get = document.getElementById("data_get"); 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((x) => x.json())
.then((paste) => { .then((paste) => {
const data = JSON.parse(paste.data.body); const data = JSON.parse(paste.data.body);
data_get.innerHTML = data.reduce( data_get.innerHTML = data.reduce(
(html, subdomain) => (html, subdomain) =>
html + 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("")} ${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
}" />`,
"" ""
); );
}); });

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 7.8 KiB

View file

@ -1,5 +1,5 @@
const data_get = document.getElementById("data_get"); 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((x) => x.json())
.then((user) => { .then((user) => {
data_get.innerHTML = user.links.reduce( data_get.innerHTML = user.links.reduce(

View file

@ -8,14 +8,16 @@ function reqData(start) {
if (resp != prevSha) { if (resp != prevSha) {
window.sessionStorage.setItem("commitsha", resp); window.sessionStorage.setItem("commitsha", resp);
if (start) return; 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"); 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); setInterval(reqData, 60000);

View file

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

View file

@ -18,13 +18,16 @@ const FONTS = [
["OpenDyslexic"], ["OpenDyslexic"],
// ["Mojangles", "Minecraft"], // ["Mojangles", "Minecraft"],
// ["Nintendo DS", "NDS12"], // ["Nintendo DS", "NDS12"],
["System Default", `-apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto, [
"System Default",
`-apple-system, BlinkMacSystemFont, &quot;Segoe UI&quot;, Roboto,
Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, Helvetica, Arial, sans-serif, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;,
&quot;Segoe UI Symbol&quot;`], &quot;Segoe UI Symbol&quot;`,
],
["Sans-serif", "sans-serif"], ["Sans-serif", "sans-serif"],
["Serif", "serif"], ["Serif", "serif"],
["Mono", "monospace"] ["Mono", "monospace"],
] ];
function createAccessibilityNodes() { function createAccessibilityNodes() {
document.querySelector("#accessibility").innerHTML = `<details> document.querySelector("#accessibility").innerHTML = `<details>
@ -52,7 +55,10 @@ function createAccessibilityNodes() {
</label><br /> </label><br />
<label for="acc-font">Page font: <label for="acc-font">Page font:
<select id="acc-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> </select>
</label><br /> </label><br />
<label for="acc-hue">Page hue: <label for="acc-hue">Page hue:
@ -119,22 +125,42 @@ function createAccessibilityNodes() {
accHueOverride.addEventListener("change", function (e) { accHueOverride.addEventListener("change", function (e) {
window.localStorage.setItem("acc-hue-over", e.target.checked); 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) { accHue.addEventListener("input", function (e) {
window.localStorage.setItem("acc-hue", e.target.value); 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) { accSaturationOverride.addEventListener("change", function (e) {
window.localStorage.setItem("acc-sat-over", e.target.checked); 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) { accSaturation.addEventListener("input", function (e) {
window.localStorage.setItem("acc-sat", e.target.value); 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) { 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)); window.addEventListener("DOMContentLoaded", (e) => initializeChanges(e, true));
// on localStorage change // on localStorage change
@ -205,9 +245,11 @@ function initializeChanges(_, loading) {
if (width != null && accWidth != null) accWidth.value = width; if (width != null && accWidth != null) accWidth.value = width;
if (font != null && accFont != null) accFont.value = font; 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 (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 (sat != null && accSaturation != null) accSaturation.value = sat;
if (base != null && accBase != null) accBase.checked = base === "true"; if (base != null && accBase != null) accBase.checked = base === "true";
@ -225,24 +267,22 @@ function changeFont(font) {
document.documentElement.style.setProperty("--font-family", 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) { function changeColor(hue, sat, hueOver, satOver) {
if (accHue != null) accHue.disabled = !hueOver; if (accHue != null) accHue.disabled = !hueOver;
if (accSaturation != null) accSaturation.disabled = !satOver; 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) { function changeBase(base) {
if (base) document.documentElement.classList.add("base"); if (base) document.documentElement.classList.add("base");
else document.documentElement.classList.remove("base"); else document.documentElement.classList.remove("base");

View file

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