356 lines
9.5 KiB
JavaScript
356 lines
9.5 KiB
JavaScript
const meowEndpoint = "https://nelle.observer/api/meow";
|
|
const beepEndpoint = "https://nelle.observer/api/beep";
|
|
const kaomojiEndpoint = "https://nelle.observer/api/kaomoji";
|
|
var colorBool = Math.random() < 0.5;
|
|
var is_root = location.pathname == "/";
|
|
|
|
// loads all the functions to be loaded on load, pretty simple, it loads shit on load.
|
|
function onLoad() {
|
|
jsEnabled();
|
|
checkThemeStorage();
|
|
getSGAState();
|
|
redirect();
|
|
checkBoxes();
|
|
getPlaceholder();
|
|
getMeowTimeout(meowEndpoint);
|
|
getBeepTimeout(beepEndpoint);
|
|
getKaomojiTimeout(beepEndpoint);
|
|
}
|
|
|
|
// if javascript is enabled, this script will load, enabling all site elements that use javascript, by default these are all hidden.
|
|
function jsEnabled() {
|
|
// if on main page, activate widgets
|
|
if (is_root) {
|
|
const lastFmWidget = document.getElementById("lastfm-widget");
|
|
const ntfyWidgetContainer = document.getElementById("ntfyWidgetContainer");
|
|
|
|
|
|
lastFmWidget.style.display = "initial";
|
|
ntfyWidgetContainer.style.display = "initial";
|
|
}
|
|
// Get JS required element ids
|
|
const sgaButton = document.getElementById("sgaButton");
|
|
const incrementButton = document.getElementById("incrementButton");
|
|
|
|
// enable js required element ids
|
|
sgaButton.style.display = "initial";
|
|
incrementButton.style.display = "initial";
|
|
}
|
|
|
|
// LastFM stuff
|
|
const user = "limepotato";
|
|
const url = `https://lastfm-last-played.biancarosa.com.br/${user}/latest-song`;
|
|
const song = document.querySelector("#song");
|
|
fetch(url)
|
|
.then((response) => response.json())
|
|
.then((json) => {
|
|
song.innerHTML = `${json.track.name} - ${json.track.artist["#text"]}`;
|
|
});
|
|
|
|
// Chrome Redirect
|
|
function redirect() {
|
|
const chromium = /Chrome|Chromium|OPR|Opera|Edge|UC|QQ/.test(
|
|
navigator.userAgent,
|
|
);
|
|
|
|
if (navigator.brave) {
|
|
window.location.replace("https://www.youtube.com/watch?v=dQw4w9WgXcQ");
|
|
}
|
|
if (!navigator.brave) {
|
|
if (!localStorage.getItem("disclaimerAccepted")) {
|
|
if (chromium && screen.width >= 699) {
|
|
window.location.replace("/bsod");
|
|
}
|
|
if (chromium && screen.width <= 699) {
|
|
window.location.replace("/mobile-warn");
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// meow
|
|
const meowButton = document.getElementById("meow-button");
|
|
const beepButton = document.getElementById("beep-button");
|
|
const kaomojiButton = document.getElementById("kaomoji-button");
|
|
|
|
// on send meow button click
|
|
async function meowClick() {
|
|
meowButton.disabled = true;
|
|
meowButton.innerHTML = "<span>sleeping...</span>";
|
|
sendMeow(meowEndpoint);
|
|
}
|
|
|
|
// on send beep button click
|
|
async function beepClick() {
|
|
beepButton.disabled = true;
|
|
beepButton.innerHTML = "<span>sleeping...</span>";
|
|
sendMeow(beepEndpoint);
|
|
}
|
|
|
|
// on send kaomoji button click
|
|
async function kaomojiClick() {
|
|
kaomojiButton.disabled = true;
|
|
kaomojiButton.innerHTML = "<span>sleeping...</span>";
|
|
sendMeow(kaomojiEndpoint);
|
|
}
|
|
|
|
// Show/Hide Info Boxes
|
|
const posterInfoButton = document.getElementById("poster-info-button");
|
|
const posterInfo = document.getElementById("poster-info");
|
|
let isPosterInfoHidden = true;
|
|
|
|
const ntfyInfoButton = document.getElementById("ntfy-info-button");
|
|
const ntfyInfo = document.getElementById("ntfy-info");
|
|
let isNtfyInfoHidden = true;
|
|
|
|
function showPosterInfo() {
|
|
if (isPosterInfoHidden) {
|
|
posterInfo.style.display = "initial";
|
|
posterInfoButton.innerHTML = "[hide more info]";
|
|
isPosterInfoHidden = false;
|
|
} else {
|
|
posterInfo.style.display = "none";
|
|
posterInfoButton.innerHTML = "[show more info]";
|
|
isPosterInfoHidden = true;
|
|
}
|
|
}
|
|
|
|
function showNtfyInfo() {
|
|
if (isNtfyInfoHidden) {
|
|
ntfyInfo.style.display = "initial";
|
|
ntfyInfoButton.innerHTML = "[hide more info]";
|
|
isNtfyInfoHidden = false;
|
|
} else {
|
|
ntfyInfo.style.display = "none";
|
|
ntfyInfoButton.innerHTML = "[show more info]";
|
|
isNtfyInfoHidden = true;
|
|
}
|
|
}
|
|
|
|
//// color scheme change
|
|
const headTag = document.getElementsByTagName("head")[0];
|
|
const styleTag = document.createElement("style");
|
|
|
|
function checkThemeStorage() {
|
|
if (sessionStorage.getItem("themeGreen")) {
|
|
setGreen();
|
|
}
|
|
if (sessionStorage.getItem("themeOrange")) {
|
|
setOrange();
|
|
}
|
|
if (
|
|
!sessionStorage.getItem("themeOrange") &&
|
|
!sessionStorage.getItem("themeGreen")
|
|
) {
|
|
getTheme();
|
|
}
|
|
}
|
|
|
|
function setGreen() {
|
|
styleTag.innerHTML = `
|
|
:root {
|
|
--text: #e7eeea;
|
|
--background: #060d09;
|
|
--primary: #9ae2b9;
|
|
--secondary: #14904a;
|
|
--accent: #47e48a;
|
|
|
|
--content-gradient: linear-gradient(to bottom right, var(--secondary-800), var(--primary-900));
|
|
--accent-gradient: linear-gradient(to bottom right, var(--accent), var(--accent-200) 30%, var(--text) 60%);
|
|
|
|
--link: var(--accent-300);
|
|
--visited: var(--accent-400);
|
|
--hover: var(--accent-500);
|
|
|
|
--text-50: #f0f4f2;
|
|
--text-100: #e1eae5;
|
|
--text-200: #c3d5cb;
|
|
--text-300: #a5c0b1;
|
|
--text-400: #88aa97;
|
|
--text-500: #6a957d;
|
|
--text-600: #557764;
|
|
--text-700: #3f5a4b;
|
|
--text-800: #2a3c32;
|
|
--text-900: #151e19;
|
|
--text-950: #0b0f0c;
|
|
|
|
--background-50: #eef7f2;
|
|
--background-100: #dcefe4;
|
|
--background-200: #b9dfc9;
|
|
--background-300: #96cfaf;
|
|
--background-400: #73bf94;
|
|
--background-500: #50af79;
|
|
--background-600: #408c61;
|
|
--background-700: #306949;
|
|
--background-800: #204630;
|
|
--background-900: #102318;
|
|
--background-950: #08110c;
|
|
|
|
--primary-50: #ebf9f1;
|
|
--primary-100: #d7f4e4;
|
|
--primary-200: #b0e8c8;
|
|
--primary-300: #88ddad;
|
|
--primary-400: #61d192;
|
|
--primary-500: #39c676;
|
|
--primary-600: #2e9e5f;
|
|
--primary-700: #227747;
|
|
--primary-800: #174f2f;
|
|
--primary-900: #0b2818;
|
|
--primary-950: #06140c;
|
|
|
|
--secondary-50: #e9fcf1;
|
|
--secondary-100: #d2f9e3;
|
|
--secondary-200: #a5f3c7;
|
|
--secondary-300: #78edab;
|
|
--secondary-400: #4be78f;
|
|
--secondary-500: #1fe073;
|
|
--secondary-600: #18b45c;
|
|
--secondary-700: #128745;
|
|
--secondary-800: #0c5a2e;
|
|
--secondary-900: #062d17;
|
|
--secondary-950: #03160b;
|
|
|
|
--accent-50: #e9fcf1;
|
|
--accent-100: #d3f8e3;
|
|
--accent-200: #a6f2c7;
|
|
--accent-300: #7aebab;
|
|
--accent-400: #4ee48f;
|
|
--accent-500: #21de73;
|
|
--accent-600: #1bb15c;
|
|
--accent-700: #148545;
|
|
--accent-800: #0d592e;
|
|
--accent-900: #072c17;
|
|
--accent-950: #03160b;
|
|
|
|
--alt-accent: #fbb055;
|
|
|
|
/* TODO: Alter This */
|
|
--glitch-1: var(--alt-accent-400);
|
|
--glitch-2: var(--alt-accent-500);
|
|
--glitch-3: var(--alt-accent-600);
|
|
|
|
--alt-accent-50: #fef3e7;
|
|
--alt-accent-100: #fce8cf;
|
|
--alt-accent-200: #fad19e;
|
|
--alt-accent-300: #f7b96e;
|
|
--alt-accent-400: #f5a23d;
|
|
--alt-accent-500: #f28b0d;
|
|
--alt-accent-600: #c26f0a;
|
|
--alt-accent-700: #915308;
|
|
--alt-accent-800: #613805;
|
|
--alt-accent-900: #301c03;
|
|
--alt-accent-950: #180e01;
|
|
}
|
|
`;
|
|
headTag.appendChild(styleTag);
|
|
sessionStorage.setItem("themeGreen", 1);
|
|
}
|
|
|
|
function setOrange() {
|
|
styleTag.innerHTML = `
|
|
:root {
|
|
--text: #f2ede7;
|
|
--background: var(--background-950);
|
|
--primary: #d7bfa2;
|
|
--secondary: #76552e;
|
|
--accent: #ffa941;
|
|
|
|
--content-gradient: linear-gradient(to bottom right, var(--secondary-800), var(--primary-900));
|
|
--accent-gradient: linear-gradient(to bottom right, var(--accent), var(--accent-200) 30%, var(--text) 60%);
|
|
|
|
--link: var(--accent-300);
|
|
--visited: var(--accent-400);
|
|
--hover: var(--accent-500);
|
|
|
|
--text-50: #f6f3ee;
|
|
--text-100: #ede6de;
|
|
--text-200: #dbcebd;
|
|
--text-300: #c9b59c;
|
|
--text-400: #b89c7a;
|
|
--text-500: #a68359;
|
|
--text-600: #856947;
|
|
--text-700: #634f36;
|
|
--text-800: #423524;
|
|
--text-900: #211a12;
|
|
--text-950: #110d09;
|
|
|
|
--background-50: #f7f3ee;
|
|
--background-100: #efe7dc;
|
|
--background-200: #dfcfb9;
|
|
--background-300: #cfb696;
|
|
--background-400: #bf9e73;
|
|
--background-500: #af8650;
|
|
--background-600: #8c6b40;
|
|
--background-700: #695030;
|
|
--background-800: #463620;
|
|
--background-900: #231b10;
|
|
--background-950: #110d08;
|
|
|
|
--primary-50: #f7f3ed;
|
|
--primary-100: #f0e7db;
|
|
--primary-200: #e0ceb8;
|
|
--primary-300: #d1b694;
|
|
--primary-400: #c29d70;
|
|
--primary-500: #b3854d;
|
|
--primary-600: #8f6a3d;
|
|
--primary-700: #6b502e;
|
|
--primary-800: #47351f;
|
|
--primary-900: #241b0f;
|
|
--primary-950: #120d08;
|
|
|
|
--secondary-50: #f8f3ed;
|
|
--secondary-100: #f1e7da;
|
|
--secondary-200: #e2ceb6;
|
|
--secondary-300: #d4b691;
|
|
--secondary-400: #c69d6c;
|
|
--secondary-500: #b88547;
|
|
--secondary-600: #936a39;
|
|
--secondary-700: #6e502b;
|
|
--secondary-800: #49351d;
|
|
--secondary-900: #251b0e;
|
|
--secondary-950: #120d07;
|
|
|
|
--accent-50: #fff4e5;
|
|
--accent-100: #ffe8cc;
|
|
--accent-200: #ffd199;
|
|
--accent-300: #ffba66;
|
|
--accent-400: #ffa333;
|
|
--accent-500: #ff8c00;
|
|
--accent-600: #cc7000;
|
|
--accent-700: #995400;
|
|
--accent-800: #663800;
|
|
--accent-900: #331c00;
|
|
--accent-950: #1a0e00;
|
|
|
|
--alt-accent: #60fe35;
|
|
|
|
--glitch-1: var(--alt-accent-600);
|
|
--glitch-2: var(--alt-accent-700);
|
|
--glitch-3: var(--alt-accent-800);
|
|
|
|
--alt-accent-50: #ebffe6;
|
|
--alt-accent-100: #d7ffcc;
|
|
--alt-accent-200: #affe9a;
|
|
--alt-accent-300: #88fe67;
|
|
--alt-accent-400: #60fe34;
|
|
--alt-accent-500: #38fe01;
|
|
--alt-accent-600: #2dcb01;
|
|
--alt-accent-700: #229801;
|
|
--alt-accent-800: #166501;
|
|
--alt-accent-900: #0b3300;
|
|
--alt-accent-950: #061900;
|
|
}
|
|
`;
|
|
headTag.appendChild(styleTag);
|
|
sessionStorage.setItem("themeOrange", 1);
|
|
}
|
|
|
|
function getTheme() {
|
|
if (colorBool) {
|
|
// if true: green
|
|
setGreen();
|
|
} else {
|
|
// if false: orange
|
|
setOrange();
|
|
}
|
|
}
|