/* global rmsAdmin */
(function ($) {
	'use strict';

	// Hilfs-Selektoren
	const $form             = $('#rms-settings-form');
	const $saveBtn          = $('#rms-save-button');
	const $resetBtn         = $('#rms-reset-button');
	const $noticeSuccess    = $('#rms-notice-success');
	const $noticeError      = $('#rms-notice-error');
	const $themeToggle      = $('#theme-toggle');
	const $body             = $('body');
	const $loadingOverlay   = $('#loading-overlay'); // Neuer Selektor für das Ladebild

	// Checkbox-Gruppen
	const $activateAll      = $('#rms-activate-all');
	const $activateAllIds   = $('#rms-activate-all-ids');
	const $menuLocations    = $('input[name="menu_locations[]"]');
	const $menuIds          = $('input[name="menu_ids[]"]');

	// ============== Theme Toggle ==============

	// Theme-Toggle initialisieren
	function initThemeToggle() {
		// Gespeicherten Theme-Status laden oder Standard setzen
		const savedTheme = localStorage.getItem('rms-theme') || 'light';
		setTheme(savedTheme);
		
		// Toggle-Event hinzufügen
		$themeToggle.on('click', function() {
			const currentTheme = $body.hasClass('responsive-menu-dark-mode') ? 'dark' : 'light';
			const newTheme = currentTheme === 'light' ? 'dark' : 'light';
			setTheme(newTheme);
			localStorage.setItem('rms-theme', newTheme);
		});
	}

	// Theme setzen
	function setTheme(theme) {
		if (theme === 'dark') {
			$body.removeClass('responsive-menu-light-mode').addClass('responsive-menu-dark-mode');
			$themeToggle.addClass('active');
		} else {
			$body.removeClass('responsive-menu-dark-mode').addClass('responsive-menu-light-mode');
			$themeToggle.removeClass('active');
		}
	}

	// ============== UI-Handler ==============

	// „Alle" (Locations) schaltet alle an/aus, aber wir deaktivieren nur die Felder zur Klarheit
	function handleActivateAllChange() {
		const checked = $activateAll.is(':checked');
		if (checked) {
			$menuLocations.prop('checked', true);
		}
		$menuLocations.prop('disabled', checked);
	}

	// „Alle" (IDs) schaltet alle an/aus, aber nie aktiv „abwählen", wenn nicht gesetzt
	function handleActivateAllIdsChange() {
		const checked = $activateAllIds.is(':checked');
		if (checked) {
			$menuIds.prop('checked', true);
		}
		$menuIds.prop('disabled', checked);
	}

	// ============== Submit / AJAX ==============

	// Vorbereiten der Form-Daten:
	// WICHTIGER FIX:
	// - Wenn „Alle" **aktiv** ist: individuelle Checkboxen auf checked setzen (damit der Server die Werte sicher erhält).
	// - Wenn „Alle" **nicht aktiv** ist: niemals pauschal alle abwählen (sondern Benutzerwahl respektieren).
	function prepareFormData() {
		// Locations
		if ($activateAll.is(':checked')) {
			$menuLocations.prop('checked', true);
		}
		// IDs
		if ($activateAllIds.is(':checked')) {
			$menuIds.prop('checked', true);
		}

		// Jetzt die Formdaten serialisieren
		const data = $form.serializeArray();
		// CSRF etc. (falls in deinem Setup benötigt: Nonce etc. liegt bereits via wp_localize_script vor)
		return data;
	}

	// ============== AJAX Feedback ==============

	function showSuccess(message = 'Einstellungen erfolgreich gespeichert!') {
		$noticeError.hide();
		$noticeSuccess.text(message).fadeIn(150);
		setTimeout(() => $noticeSuccess.fadeOut(150), 4000);
	}

	function showError(message = 'Fehler beim Speichern der Einstellungen.') {
		$noticeSuccess.hide();
		$noticeError.text(message).fadeIn(150);
		setTimeout(() => $noticeError.fadeOut(150), 5000);
	}

	function showLoading() {
		$loadingOverlay.fadeIn(200);
	}

	function hideLoading() {
		$loadingOverlay.fadeOut(200);
	}

	// ============== Event Handler ==============

	$activateAll.on('change', handleActivateAllChange);
	$activateAllIds.on('change', handleActivateAllIdsChange);

	$saveBtn.on('click', function (e) {
		e.preventDefault();
		
		// Button in saving state setzen
		$saveBtn.addClass('is-saving').prop('disabled', true);
		showLoading();
		
		const payload = prepareFormData();

		$.ajax({
			url: rmsAdmin.ajax_url,
			method: 'POST',
			data: payload,
			success: function (resp) {
				hideLoading();
				
				if (resp && resp.success) {
					// Success state
					$saveBtn.removeClass('is-saving').addClass('success');
					showSuccess('Einstellungen erfolgreich gespeichert!');
					
					// Formular-Status aktualisieren
					if (resp.data && resp.data.settings) {
						updateFormState(resp.data.settings);
					}
					
					// Nach 3 Sekunden zurücksetzen
					setTimeout(() => {
						$saveBtn.removeClass('success');
					}, 3000);
				} else {
					// Error state
					$saveBtn.removeClass('is-saving').addClass('error');
					const errorMsg = resp && resp.data && resp.data.message ? resp.data.message : 'Unbekannter Fehler beim Speichern.';
					showError(errorMsg);
					
					// Nach 4 Sekunden zurücksetzen
					setTimeout(() => {
						$saveBtn.removeClass('error');
					}, 4000);
				}
			},
			error: function(xhr, status, error) {
				hideLoading();
				
				// Error state
				$saveBtn.removeClass('is-saving').addClass('error');
				
				let errorMsg = 'Netzwerkfehler beim Speichern.';
				if (xhr.status === 403) {
					errorMsg = 'Zugriff verweigert. Bitte melden Sie sich erneut an.';
				} else if (xhr.status === 500) {
					errorMsg = 'Serverfehler. Bitte versuchen Sie es später erneut.';
				} else if (status === 'timeout') {
					errorMsg = 'Zeitüberschreitung. Bitte überprüfen Sie Ihre Internetverbindung.';
				}
				
				showError(errorMsg);
				
				// Nach 4 Sekunden zurücksetzen
				setTimeout(() => {
					$saveBtn.removeClass('error');
				}, 4000);
			},
			complete: function () {
				// Button wieder aktivieren
				$saveBtn.prop('disabled', false);
			}
		});
	});

	$resetBtn.on('click', function (e) {
		e.preventDefault();
		if (!window.confirm(rmsAdmin.i18n.confirm_reset || 'Wirklich auf Standardwerte zurücksetzen?')) {
			return;
		}
		
		$resetBtn.prop('disabled', true);
		showLoading();

		$.ajax({
			url: rmsAdmin.ajax_url,
			method: 'POST',
			data: {
				action: 'rms_reset_settings',
				nonce: rmsAdmin.nonce
			},
			success: function (resp) {
				hideLoading();
				
				if (resp && resp.success) {
					showSuccess('Einstellungen wurden erfolgreich zurückgesetzt!');
					// Nach 2 Sekunden neu laden
					setTimeout(() => {
						window.location.reload();
					}, 2000);
				} else {
					const errorMsg = resp && resp.data && resp.data.message ? resp.data.message : 'Fehler beim Zurücksetzen der Einstellungen.';
					showError(errorMsg);
				}
			},
			error: function(xhr, status, error) {
				hideLoading();
				
				let errorMsg = 'Netzwerkfehler beim Zurücksetzen.';
				if (xhr.status === 403) {
					errorMsg = 'Zugriff verweigert. Bitte melden Sie sich erneut an.';
				} else if (xhr.status === 500) {
					errorMsg = 'Serverfehler. Bitte versuchen Sie es später erneut.';
				}
				
				showError(errorMsg);
			},
			complete: function () {
				$resetBtn.prop('disabled', false);
			}
		});
	});

	// ============== Initialisierung ==============

	// Initialzustand übernehmen
	handleActivateAllChange();
	handleActivateAllIdsChange();

	// Theme-Toggle initialisieren
	initThemeToggle();

})(jQuery);

