/**
 * LoginCraft Overview page scripts.
 *
 * @package LoginPageCustomizerAndDesigner
 */

(function () {
	'use strict';

	/* ── Enable / Disable toggle ── */
	var cb = document.getElementById( 'lpcd-ov-enable-cb' );
	if ( cb ) {
		cb.addEventListener( 'change', function () {
			var enabled = cb.checked ? 1 : 0;
			var data    = new FormData();
			data.append( 'action', 'lpcd_toggle_enabled' );
			data.append( 'enabled', enabled );
			data.append( '_wpnonce', lpcdOverview.toggleNonce );

			fetch( lpcdOverview.ajaxUrl, { method: 'POST', body: data, credentials: 'same-origin' } )
				.then( function ( r ) { return r.json(); } )
				.then( function () {
					var display = document.getElementById( 'lpcd-ov-status-display' );
					if ( display ) {
						if ( enabled ) {
							display.innerHTML = '<span class="lpcd-ov-status-dot"></span><span>' + lpcdOverview.i18n.active + '</span>';
						} else {
							display.innerHTML = '<span class="lpcd-ov-status-dot lpcd-ov-status-dot--inactive"></span><span>' + lpcdOverview.i18n.inactive + '</span>';
						}
					}
				} );
		} );
	}

	/* ── Install / Activate recommended plugins ── */
	var pluginBtns = document.querySelectorAll( '.lpcd-ov-plugin-row button[data-action]' );
	pluginBtns.forEach( function ( btn ) {
		btn.addEventListener( 'click', function ( e ) {
			e.preventDefault();
			var action = btn.getAttribute( 'data-action' );
			var slug   = btn.getAttribute( 'data-slug' );
			var file   = btn.getAttribute( 'data-file' );

			if ( action === 'active' ) {
				return;
			}

			btn.disabled = true;

			if ( action === 'install' ) {
				btn.textContent = lpcdOverview.i18n.installing;
				var installData = new FormData();
				installData.append( 'action', 'lpcd_install_plugin' );
				installData.append( 'slug', slug );
				installData.append( '_wpnonce', lpcdOverview.pluginNonce );

				fetch( lpcdOverview.ajaxUrl, { method: 'POST', body: installData, credentials: 'same-origin' } )
					.then( function ( r ) { return r.json(); } )
					.then( function ( res ) {
						if ( res.success ) {
							btn.textContent = lpcdOverview.i18n.activate;
							btn.setAttribute( 'data-action', 'activate' );
							btn.disabled = false;
						} else {
							btn.textContent = lpcdOverview.i18n.error;
							btn.disabled = false;
						}
					} )
					.catch( function () {
						btn.textContent = lpcdOverview.i18n.error;
						btn.disabled = false;
					} );
			} else if ( action === 'activate' ) {
				btn.textContent = lpcdOverview.i18n.activating;
				var activateData = new FormData();
				activateData.append( 'action', 'lpcd_activate_plugin' );
				activateData.append( 'file', file );
				activateData.append( '_wpnonce', lpcdOverview.pluginNonce );

				fetch( lpcdOverview.ajaxUrl, { method: 'POST', body: activateData, credentials: 'same-origin' } )
					.then( function ( r ) { return r.json(); } )
					.then( function ( res ) {
						if ( res.success ) {
							btn.textContent = lpcdOverview.i18n.activeLabel;
							btn.classList.add( 'lpcd-ov-btn-active' );
							btn.setAttribute( 'data-action', 'active' );
							btn.disabled = true;
						} else {
							btn.textContent = lpcdOverview.i18n.error;
							btn.disabled = false;
						}
					} )
					.catch( function () {
						btn.textContent = lpcdOverview.i18n.error;
						btn.disabled = false;
					} );
			}
		} );
	} );
})();
