Update darkmode.js

Titanor-Soulstone · Jan 28, 2024 · ca8b958 · ca8b958
1 parent b900458
commit ca8b958
Showing 1 changed file with 58 additions and 39 deletions.
diff --git a/darkmode.js b/darkmode.js
@@ -1,3 +1,27 @@
+// Dark Mode Toggle Function
+function toggleDarkMode() {
+  const body = document.body;
+  const darkModeToggle = document.getElementById('darkModeToggle');
+  const sunMoon = document.getElementById('sunMoon');
+
+  if (darkModeToggle.checked) {
+    body.classList.add('dark-mode');
+    sunMoon.innerHTML = '&#x1F319;'; // Moon symbol
+    setCookie('darkMode', 'enabled', 365);
+  } else {
+    body.classList.remove('dark-mode');
+    sunMoon.innerHTML = '&#x2600;'; // Sun symbol
+    setCookie('darkMode', 'disabled', 365);
+  }
+}
+
+// Function to set a cookie
+function setCookie(name, value, days) {
+  const expires = new Date();
+  expires.setTime(expires.getTime() + days * 24 * 60 * 60 * 1000);
+  document.cookie = name + '=' + value + ';expires=' + expires.toUTCString();
+}
+
 // Function to get a cookie
 function getCookie(name) {
   const cookieName = name + '=';
@@ -14,30 +38,27 @@ function getCookie(name) {
   return '';
 }
 
-// Dark Mode Toggle Function
-function toggleDarkMode() {
-  const body = document.body;
-  const darkModeToggle = document.getElementById('darkModeToggle'); // Check if the element exists
+// Function to accept cookies
+function acceptCookies() {
+  document.getElementById('cookieConsent').style.display = 'none';
+  setCookie('cookieConsent', 'accepted', 365);
+
+  // Check and apply dark mode preference
+  const darkModeToggle = document.getElementById('darkModeToggle');
   const sunMoon = document.getElementById('sunMoon');
+  const darkModeCookie = getCookie('darkMode');
 
-  if (darkModeToggle) { // Ensure darkModeToggle exists before proceeding
-    if (darkModeToggle.checked) {
-      body.classList.add('dark-mode');
-      sunMoon.innerHTML = '&#x1F319;'; // Moon symbol
-      setCookie('darkMode', 'enabled', 365);
-    } else {
-      body.classList.remove('dark-mode');
-      sunMoon.innerHTML = '&#x2600;'; // Sun symbol
-      setCookie('darkMode', 'disabled', 365);
-    }
+  if (darkModeCookie === 'enabled') {
+    darkModeToggle.checked = true;
+    document.body.classList.add('dark-mode');
+    sunMoon.innerHTML = '&#x1F319;'; // Moon symbol
+  } else {
+    darkModeToggle.checked = false;
+    document.body.classList.remove('dark-mode');
+    sunMoon.innerHTML = '&#x2600;'; // Sun symbol
   }
-}
 
-// Function to set a cookie
-function setCookie(name, value, days) {
-  const expires = new Date();
-  expires.setTime(expires.getTime() + days * 24 * 60 * 60 * 1000);
-  document.cookie = name + '=' + value + ';expires=' + expires.toUTCString() + ';path=/'; // Added path=/
+  applyDarkModeToIframe(); // Apply dark mode styles to the iframe content
 }
 
 // Function to apply dark mode styles to iframe content
@@ -53,28 +74,26 @@ function applyDarkModeToIframe() {
 }
 
 // Event listener for dark mode toggle
+document.getElementById('darkModeToggle').addEventListener('change', function() {
+  toggleDarkMode();
+  applyDarkModeToIframe();
+});
+
+// Check and apply dark mode preference on initial load
 window.addEventListener('load', function() {
   const darkModeToggle = document.getElementById('darkModeToggle');
   const sunMoon = document.getElementById('sunMoon');
+  const darkModeCookie = getCookie('darkMode');
 
-  if (darkModeToggle) { // Ensure darkModeToggle exists before proceeding
-    darkModeToggle.addEventListener('change', function() {
-      toggleDarkMode();
-      applyDarkModeToIframe();
-    });
-
-    const darkModeCookie = getCookie('darkMode');
-
-    if (darkModeCookie === 'enabled') {
-      darkModeToggle.checked = true;
-      document.body.classList.add('dark-mode');
-      sunMoon.innerHTML = '&#x1F319;'; // Moon symbol
-    } else {
-      darkModeToggle.checked = false;
-      document.body.classList.remove('dark-mode');
-      sunMoon.innerHTML = '&#x2600;'; // Sun symbol
-    }
-
-    applyDarkModeToIframe(); // Apply dark mode styles to the iframe on initial load
+  if (darkModeCookie === 'enabled') {
+    darkModeToggle.checked = true;
+    document.body.classList.add('dark-mode');
+    sunMoon.innerHTML = '&#x1F319;'; // Moon symbol
+  } else {
+    darkModeToggle.checked = false;
+    document.body.classList.remove('dark-mode');
+    sunMoon.innerHTML = '&#x2600;'; // Sun symbol
   }
+
+  applyDarkModeToIframe(); // Apply dark mode styles to the iframe on initial load
 });