@ussebastian/kitdigital/src/js/components/initializeThemeToggler.js

Kit Digital de la Universidad San Sebastián

export function initializeThemeToggler() {
  // Initialize USSKitDigital if it does not exist
  if (!window.USSKitDigital) {
    window.USSKitDigital = {};
  }

  function setThemeToLight() {
    document.documentElement.classList.remove('dark');
    localStorage.theme = 'light';
  }

  function setThemeToDark() {
    document.documentElement.classList.add('dark');
    localStorage.theme = 'dark';
  }

  function toggleTheme() {
    const prevent = window.USSKitDigital.preventThemeToggle;
    if (prevent === true || prevent === 'true') {
      return;
    }
    if (localStorage.theme === 'dark') {
      setThemeToLight();
    } else {
      setThemeToDark();
    }
    window.parent.postMessage(
      {
        type: 'toggleTheme',
        theme: document.documentElement.classList.contains('dark') ? 'dark' : 'light',
      },
      '*',
    );
  }

  // Set initial theme based on localStorage or system preference
  const matches =
    !('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches;
  if (localStorage.theme === 'dark' || matches) {
    setThemeToDark();
  } else {
    setThemeToLight();
  }

  // Listen for keyboard events to toggle theme
  document.addEventListener('keydown', (event) => {
    if (event.target.tagName === 'BODY' && (event.key === 't' || event.key === 'T')) {
      toggleTheme();
    }
  });

  // Expose functions through USSKitDigital for global access
  window.USSKitDigital.setThemeToDark = setThemeToDark;
  window.USSKitDigital.setThemeToLight = setThemeToLight;
  window.USSKitDigital.toggleTheme = toggleTheme;
  window.USSKitDigital.preventThemeToggle = false;
}

// Usage
// initializeThemeToggler();