class UserSettings {
|
constructor() {
|
this.cache = new window.jvbCache('settings');
|
this.debouncer = window.debouncer;
|
|
this.isLoggedIn = jvbSettings.currentUser !== null;
|
|
this.initListeners();
|
|
this.subscribers = new Set();
|
}
|
|
initListeners() {
|
this.changeHandler = this.handleChange.bind(this);
|
|
document.addEventListener('change', this.changeHandler);
|
}
|
|
handleChange(e) {
|
|
}
|
|
saveSetting(name, value) {
|
this.cache.setItem(name, value);
|
if (this.isLoggedIn) {
|
|
}
|
}
|
|
loadSetting(name) {
|
let value = this.cache.getItem(name);
|
|
if (this.isLoggedIn) {
|
|
}
|
}
|
|
loadUserSetting(name) {
|
|
}
|
|
/**
|
* Event system
|
*/
|
subscribe(callback) {
|
this.subscribers.add(callback);
|
return () => this.subscribers.delete(callback);
|
}
|
|
notify(event, data) {
|
this.subscribers.forEach(cb => cb(event, data));
|
}
|
|
/***************************************************
|
CLEANUP
|
***************************************************/
|
destroy() {
|
document.removeEventListener('change', this.changeHandler);
|
this.subscribers.clear();
|
}
|
}
|
|
document.addEventListener('DOMContentLoaded', function() {
|
window.jvbUserSettings = new UserSettings();
|
});
|
|
// Theme switching functionality
|
document.addEventListener('DOMContentLoaded', function() {
|
console.log('Theme switch initiated');
|
const themeSwitch = document.getElementById('theme-switch');
|
|
if (!themeSwitch) return;
|
|
// Initialize theme from localStorage or system preference
|
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)');
|
const storedTheme = localStorage.getItem('theme');
|
|
if (storedTheme) {
|
document.documentElement.classList.toggle('dark', storedTheme === 'dark');
|
themeSwitch.checked = storedTheme === 'dark';
|
} else {
|
document.documentElement.classList.toggle('dark', prefersDark.matches);
|
themeSwitch.checked = prefersDark.matches;
|
}
|
|
// Handle theme switch changes
|
themeSwitch.addEventListener('change', async function () {
|
const isDark = this.checked;
|
document.documentElement.classList.toggle('dark', isDark);
|
localStorage.setItem('theme', isDark ? 'dark' : 'light');
|
|
// If user is logged in, save preference
|
if (jvbSettings.currentUser !== null) {
|
try {
|
await fetch(`${jvbSettings.api}settings`, {
|
method: 'POST',
|
headers: {
|
'Content-Type': 'application/json',
|
'X-WP-Nonce': jvbSettings.nonce,
|
'action_nonce': jvbSettings.dash,
|
},
|
body: JSON.stringify({
|
dark_mode: isDark,
|
user: jvbSettings.currentUser
|
})
|
});
|
} catch (error) {
|
console.error('Failed to save theme preference:', error);
|
}
|
}
|
|
// Update label
|
const label = document.getElementById('theme-switch');
|
if (label) {
|
label.title = isDark ? 'Toggle Light Mode' : 'Toggle Dark Mode';
|
}
|
});
|
|
// Handle system theme changes
|
prefersDark.addEventListener('change', (e) => {
|
if (!localStorage.getItem('theme')) {
|
const isDark = e.matches;
|
document.documentElement.classList.toggle('dark', isDark);
|
themeSwitch.checked = isDark;
|
}
|
});
|
});
|
