1 files changed, 18 insertions, 30 deletions

diff --git a/assets/js/themes.js b/assets/js/themes.js
index 3f503b38..7e86e9ac 100644
--- a/assets/js/themes.js
+++ b/assets/js/themes.js
@@ -1,60 +1,48 @@
 'use strict';
 var toggle_theme = document.getElementById('toggle_theme');
-toggle_theme.href = 'javascript:void(0);';
+toggle_theme.href = 'javascript:void(0)';
 
 toggle_theme.addEventListener('click', function () {
     var dark_mode = document.body.classList.contains('light-theme');
 
-    var url = '/toggle_theme?redirect=false';
-    var xhr = new XMLHttpRequest();
-    xhr.responseType = 'json';
-    xhr.timeout = 10000;
-    xhr.open('GET', url, true);
-
     set_mode(dark_mode);
-    try {
-        window.localStorage.setItem('dark_mode', dark_mode ? 'dark' : 'light');
-    } catch (e) {}
+    helpers.storage.set('dark_mode', dark_mode ? 'dark' : 'light');
 
-    xhr.send();
+    helpers.xhr('GET', '/toggle_theme?redirect=false', {}, {});
 });
 
-window.addEventListener('storage', function (e) {
+// Handles theme change event caused by other tab
+addEventListener('storage', function (e) {
     if (e.key === 'dark_mode') {
         update_mode(e.newValue);
     }
 });
 
-window.addEventListener('DOMContentLoaded', function () {
+addEventListener('DOMContentLoaded', function () {
     const dark_mode = document.getElementById('dark_mode_pref').textContent;
-    try {
-        // Update localStorage if dark mode preference changed on preferences page
-        window.localStorage.setItem('dark_mode', dark_mode);
-    } catch (e) {}
+    // Update storage if dark mode preference changed on preferences page
+    helpers.storage.set('dark_mode', dark_mode);
     update_mode(dark_mode);
 });
 
 
-var darkScheme = window.matchMedia('(prefers-color-scheme: dark)');
-var lightScheme = window.matchMedia('(prefers-color-scheme: light)');
+var darkScheme = matchMedia('(prefers-color-scheme: dark)');
+var lightScheme = matchMedia('(prefers-color-scheme: light)');
 
 darkScheme.addListener(scheme_switch);
 lightScheme.addListener(scheme_switch);
 
 function scheme_switch (e) {
-  // ignore this method if we have a preference set
-  try {
-    if (localStorage.getItem('dark_mode')) {
-      return;
-    }
-  } catch (exception) {}
-  if (e.matches) {
+    // ignore this method if we have a preference set
+    if (helpers.storage.get('dark_mode')) return;
+
+    if (!e.matches) return;
+
     if (e.media.includes('dark')) {
-      set_mode(true);
+        set_mode(true);
     } else if (e.media.includes('light')) {
-      set_mode(false);
+        set_mode(false);
     }
-  }
 }
 
 function set_mode (bool) {
@@ -82,7 +70,7 @@ function update_mode (mode) {
         // If preference for light mode indicated
         set_mode(false);
     }
-    else if (document.getElementById('dark_mode_pref').textContent === '' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+    else if (document.getElementById('dark_mode_pref').textContent === '' && matchMedia('(prefers-color-scheme: dark)').matches) {
         // If no preference indicated here and no preference indicated on the preferences page (backend), but the browser tells us that the operating system has a dark theme
         set_mode(true);
     }