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();