felt/static/util.js

141 lines
No EOL
3.9 KiB
JavaScript

const defaultTheme = [ "#000000cc", "#ccccccff", "#1f9b92ff", "#002b36ff", "#DC143Cff" ];
const saveData = {
username: "",
theme: defaultTheme,
}
function $(id) {
return document.getElementById(id);
}
function setErr(x) {
const errDiv = $("err_div");
const errWrapper = $("err_wrapper");
if (errDiv) {
errDiv.innerHTML = x;
}
if (errWrapper) {
errWrapper.style.display = "block";
}
}
function closeErr() {
const errWrapper = $("err_wrapper");
if (errWrapper) {
errWrapper.style.display = "none";
}
}
function loadStorage() {
saveData.username = localStorage.getItem("username");
savedTheme = JSON.parse(localStorage.getItem("theme"));
saveData.theme = savedTheme || defaultTheme;
const username = $("name_entry");
if (username) {
username.value = saveData.username;
}
}
function saveName() {
const username = $("name_entry");
if (username) {
saveData.username = username.value;
localStorage.setItem("username", saveData.username);
}
}
function setupDiceAutoScroll() {
const diceWin = $("dice_win");
if (diceWin) {
diceWin.addEventListener("toggle", e => {
if (diceWin.open) {
const diceLog = $("dice_log");
if (diceLog && diceLog.children.length > 0) {
diceLog.scrollTop = diceLog.scrollHeight;
}
}
});
}
}
function hexToBytes(hex) {
let bytes = [];
for (let c = 0; c < hex.length; c += 2) {
bytes.push(parseInt(hex.substr(c, 2), 16));
}
return bytes;
}
function toByte(v) {
return ('0' +
Math.min(Math.max(parseInt(v), 0), 255).toString(16)
).slice(-2);
}
function resetTheme(theme) {
try{
let bg_col = theme[0];
let fg_col = theme[1];
let main_col = theme[2];
let sub_col = theme[3];
let err_col = theme[4];
let fg_opacity = hexToBytes(fg_col.substr(7));
fg_col = fg_col.substr(0,7);
let bg_opacity = hexToBytes(bg_col.substr(7));
bg_col = bg_col.substr(0,7);
let main_opacity = hexToBytes(main_col.substr(7));
main_col = main_col.substr(0,7);
let sub_opacity = hexToBytes(sub_col.substr(7));
sub_col = sub_col.substr(0,7);
let err_opacity = hexToBytes(err_col.substr(7));
err_col = err_col.substr(0,7);
$("bg_col_input").value = bg_col;
$("bg_col_opacity").value = bg_opacity;
$("fg_col_input").value = fg_col;
$("fg_col_opacity").value = fg_opacity;
$("main_col_input").value = main_col;
$("main_col_opacity").value = main_opacity;
$("sub_col_input").value = sub_col;
$("sub_col_opacity").value = sub_opacity;
$("err_col_input").value = err_col;
$("err_col_opacity").value = err_opacity;
} catch {}
}
function setTheme() {
try {
let bg_col = $("bg_col_input").value
let bg_opacity = toByte($("bg_col_opacity").value);
let fg_col = $("fg_col_input").value;
let fg_opacity = (toByte($("fg_col_opacity").value));
let main_col = $("main_col_input").value;
let main_opacity = (toByte($("main_col_opacity").value));
let sub_col = $("sub_col_input").value;
let sub_opacity = (toByte($("sub_col_opacity").value));
let err_col = $("err_col_input").value;
let err_opacity = (toByte($("err_col_opacity").value));
saveData.theme[0] = bg_col + bg_opacity;
saveData.theme[1] = fg_col + fg_opacity;
saveData.theme[2] = main_col + main_opacity;
saveData.theme[3] = sub_col + sub_opacity;
saveData.theme[4] = err_col + err_opacity;
localStorage.setItem("theme", JSON.stringify(saveData.theme));
} catch {} finally {
document.body.style.setProperty("--bg_color", saveData.theme[0]);
document.body.style.setProperty("--fg_color", saveData.theme[1]);
document.body.style.setProperty("--main_color", saveData.theme[2]);
document.body.style.setProperty("--sub_color", saveData.theme[3]);
document.body.style.setProperty("--err_color", saveData.theme[4]);
}
}
setupDiceAutoScroll();
loadStorage();
resetTheme(saveData.theme);
setTheme();