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;
		}
	});
});