From fe22956d5dbdeb2b80a9e56b46abe2be9f2bfcdb Mon Sep 17 00:00:00 2001
From: Lizzy Hunt <lizzy.hunt@usu.edu>
Date: Tue, 26 Mar 2024 16:00:05 -0600
Subject: initial commit

---
 static/js/components/themeSwitcher.js | 27 +++++++++++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 static/js/components/themeSwitcher.js

(limited to 'static/js/components/themeSwitcher.js')

diff --git a/static/js/components/themeSwitcher.js b/static/js/components/themeSwitcher.js
new file mode 100644
index 0000000..5f6d927
--- /dev/null
+++ b/static/js/components/themeSwitcher.js
@@ -0,0 +1,27 @@
+const THEMES = {
+  DARK: "DARK",
+  LIGHT: "LIGHT",
+};
+
+const flipFlopTheme = (theme) =>
+  THEMES[theme] === THEMES.DARK ? THEMES.LIGHT : THEMES.DARK;
+
+const themePickerText = {
+  DARK: "light mode.",
+  LIGHT: "dark mode.",
+};
+
+const themeSwitcher = document.getElementById("theme-switcher");
+
+const setTheme = (theme) => {
+  themeSwitcher.textContent = `${themePickerText[theme]}`;
+
+  document.documentElement.setAttribute("data-theme", theme);
+  localStorage.setItem("theme", theme);
+};
+
+themeSwitcher.addEventListener("click", () =>
+  setTheme(flipFlopTheme(document.documentElement.getAttribute("data-theme"))),
+);
+
+setTheme(localStorage.getItem("theme") ?? THEMES.LIGHT);
-- 
cgit v1.2.3-70-g09d2