// ************ Themes ************ var colors = { default: { 1: "#ffffff",//Branch color 1 2: "#bfbfbf",//Branch color 2 3: "#7f7f7f",//Branch color 3 color: "#dfdfdf", points: "#ffffff", locked: "#bf8f8f", background: "#0f0f0f", background_tooltip: "rgba(0, 0, 0, 0.75)", }, aqua: { 1: "#bfdfff", 2: "#8fa7bf", 3: "#5f6f7f", color: "#bfdfff", points: "#dfefff", locked: "#c4a7b3", background: "#001f3f", background_tooltip: "rgba(0, 15, 31, 0.75)", }, verdant: { 1: "#ceffbd", 2: "#8fd376", 3: "#6e965f", color: "#ceffbd", points: "#edf3eb", locked: "#c4a7b3", background: "#0d180e", background_tooltip: "rgba(0, 22, 3, 0.75)", }, crimson: { 1: "#f1b8b8", 2: "#c28282", 3: "#9f5555", color: "#f1b8b8", points: "#fcefef", locked: "#c4a7b3", background: "#251010", background_tooltip: "rgba(26, 13, 13, 0.75)", }, } function changeTheme() { colors_theme = colors[options.theme || "default"]; document.body.style.setProperty('--background', colors_theme["background"]); document.body.style.setProperty('--background_tooltip', colors_theme["background_tooltip"]); document.body.style.setProperty('--color', colors_theme["color"]); document.body.style.setProperty('--points', colors_theme["points"]); document.body.style.setProperty("--locked", colors_theme["locked"]); } function getThemeName() { return options.theme ? options.theme : "default"; } function switchTheme() { let index = Object.keys(colors).indexOf(options.theme) if (options.theme === null || index >= Object.keys(colors).length-1 || index < 0) { options.theme = Object.keys(colors)[0]; } else { index ++; options.theme = Object.keys(colors)[index]; } changeTheme(); resizeCanvas(); }