static/util.js (raw)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 |
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.children[diceLog.children.length - 1].scrollIntoView(); } } }); } } 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(); |