sub-aligator/static/theme.js

(function () {
  var STORAGE_KEY = 'sub-aligator-theme';

  function storedTheme() {
    try {
      return localStorage.getItem(STORAGE_KEY);
    } catch (e) {
      return null;
    }
  }

  function currentTheme() {
    return document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light';
  }

  function applyTheme(theme) {
    document.documentElement.setAttribute('data-theme', theme);
  }

  // Apply the saved theme before the body renders to avoid a flash of the wrong theme.
  applyTheme(storedTheme() === 'dark' ? 'dark' : 'light');

  function updateToggle(btn) {
    btn.textContent = currentTheme() === 'dark' ? '[ Light ]' : '[ Dark ]';
    btn.setAttribute('aria-pressed', currentTheme() === 'dark' ? 'true' : 'false');
  }

  function wireToggle() {
    var btn = document.getElementById('theme-toggle');
    if (!btn) {
      return;
    }
    updateToggle(btn);
    btn.addEventListener('click', function () {
      var next = currentTheme() === 'dark' ? 'light' : 'dark';
      applyTheme(next);
      try {
        localStorage.setItem(STORAGE_KEY, next);
      } catch (e) {}
      updateToggle(btn);
    });
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', wireToggle);
  } else {
    wireToggle();
  }
})();