/**
 * ZA Creative Login Shield - Onboarding Wizard
 */
(function() {
    'use strict';

    document.addEventListener( 'DOMContentLoaded', function() {
        var currentStep = 1;
        var totalSteps = 5;

        var steps = document.querySelectorAll( '.zacls-wizard-step' );
        var indicators = document.querySelectorAll( '.wizard-step-indicator' );
        var prevBtn = document.getElementById( 'wizard-prev' );
        var nextBtn = document.getElementById( 'wizard-next' );
        var finishBtn = document.getElementById( 'wizard-finish' );
        var skipBtn = document.getElementById( 'zacls-skip-onboarding' );

        function showStep( step ) {
            steps.forEach( function( s ) { s.style.display = 'none'; } );
            indicators.forEach( function( i ) { i.classList.remove( 'active' ); } );

            document.querySelector( '.zacls-wizard-step[data-step="' + step + '"]' ).style.display = 'block';
            document.querySelector( '.wizard-step-indicator[data-step="' + step + '"]' ).classList.add( 'active' );

            prevBtn.style.display = step > 1 ? '' : 'none';
            nextBtn.style.display = step < totalSteps ? '' : 'none';
            finishBtn.style.display = step === totalSteps ? '' : 'none';
        }

        function saveStep( step, enabled ) {
            var formData = new FormData();
            var stepNames = [ '', 'custom_login', 'login_limits', 'password_policy', 'email_notifications', '2fa' ];
            formData.append( 'action', 'zacls_save_wizard_step' );
            formData.append( 'nonce', zaclsData.nonce );
            formData.append( 'step', stepNames[step] );
            formData.append( 'enabled', enabled ? 'true' : 'false' );
            fetch( zaclsData.ajaxUrl, { method: 'POST', body: formData, headers: { 'X-Requested-With': 'XMLHttpRequest' } } );
        }

        function finishSetup() {
            var settings = {};
            settings.zacls_onboarding_completed = 'yes';
            settings.zacls_block_wp_login = 'yes';

            var formData = new FormData();
            formData.append( 'action', 'zacls_save_settings' );
            formData.append( 'nonce', zaclsData.nonce );
            formData.append( 'settings', JSON.stringify( settings ) );
            fetch( zaclsData.ajaxUrl, {
                method: 'POST',
                body: formData,
                headers: { 'X-Requested-With': 'XMLHttpRequest' }
            } ).then( function( r ) { return r.json(); } ).then( function( d ) {
                if ( d.success ) {
                    window.location.href = zaclsData.redirectUrl;
                }
            } );
        }

        document.querySelectorAll( '.wizard-toggle' ).forEach( function( cb ) {
            cb.addEventListener( 'change', function() {
                var step = parseInt( this.getAttribute( 'data-step' ) );
                saveStep( step, this.checked );
            } );
        } );

        nextBtn.addEventListener( 'click', function() {
            var cb = document.querySelector( '.wizard-toggle[data-step="' + currentStep + '"]' );
            saveStep( currentStep, cb ? cb.checked : true );
            currentStep++;
            showStep( currentStep );
        } );

        prevBtn.addEventListener( 'click', function() {
            currentStep--;
            showStep( currentStep );
        } );

        finishBtn.addEventListener( 'click', finishSetup );

        if ( skipBtn ) {
            skipBtn.addEventListener( 'click', function( e ) {
                e.preventDefault();
                var formData = new FormData();
                formData.append( 'action', 'zacls_save_settings' );
                formData.append( 'nonce', zaclsData.nonce );
                var settings = { zacls_onboarding_completed: 'yes' };
                formData.append( 'settings', JSON.stringify( settings ) );
                fetch( zaclsData.ajaxUrl, {
                    method: 'POST',
                    body: formData,
                    headers: { 'X-Requested-With': 'XMLHttpRequest' }
                } ).then( function( r ) { return r.json(); } ).then( function( d ) {
                    window.location.href = zaclsData.redirectUrl;
                } );
            } );
        }

        showStep( 1 );
    } );

})();
