just_another_tree/js/utils/themes.js

// ************ 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)",
	},
	amber: {
		1: "#eff1ac",
		2: "#b6b95a",
		3: "#7e812a",
		color: "#eff1ac",
		points: "#feffe4",
		locked: "#c4a7b3",
		background: "#161603",
		background_tooltip: "rgba(5, 6, 0, 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();
}