<?php
/**
 * template: Ielts Signup Template
 */

// my account steps
if(!is_user_logged_in()){
    $redirect_url = "https://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
    $settings_st_pro_quiz_auth_redirect_enable_key  = 'st-proqyz__auth-redirect-enable';
    $settings_st_pro_quiz__auth_signup_url_key      = 'st-proqyz__auth-signup-url';
    $settings_st_pro_quiz__auth_signin_url_key      = 'st-proqyz__auth-signin-url';
    $enable_auth_redirect   = get_option($settings_st_pro_quiz_auth_redirect_enable_key,0);
    $auth_signin_url        = get_option($settings_st_pro_quiz__auth_signin_url_key,"/wp-login.php");
    $auth_signup_url        = get_option($settings_st_pro_quiz__auth_signup_url_key,"/wp-login.php");
    $url    = $auth_signup_url;
    $url    .= $enable_auth_redirect == 1? '?redirect_to='.$redirect_url : '';
    wp_safe_redirect($url);
	exit();
} else {
    if(get_user_meta(get_current_user_id(), 'account-completed', true)){
        if(isset($_GET['redirect_to']) && !empty($_GET['redirect_to'])){
            wp_safe_redirect($_GET['redirect_to']);
            exit();
        } else {
            wp_safe_redirect(home_url('/'));
            exit();
        }
    }
    }

    $user_id            = get_current_user_id();

    $custom_logo_id = get_theme_mod( 'custom_logo' );
    $logo_url = wp_get_attachment_image_src( $custom_logo_id, 'full' );

    
    $get_profile_steps  = get_user_meta($user_id, 'account-steps', true);
    $completed_steps    = [];
    
    if( $get_profile_steps ) {
        $completed_steps = (array) json_decode($get_profile_steps);
    }

    $account_steps = [
        "step1" => (object) [

        ]
    ];

    $step1 = "";
    if(class_exists('Ielts_Lms_My_Account_Ajax')){
        $ajax_class = new Ielts_Lms_My_Account_Ajax();
        $step1 = $ajax_class->my_account_step1();
    }


?>

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo('charset'); ?>" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title><?php wp_title(); ?></title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.14/dist/css/bootstrap-select.min.css">
    <link rel="stylesheet" href="<?php echo site_url(); ?>/wp-content/plugins/spacetree/libs/proqyz/includes/templates/public/signup/signup.css" />
    

    <style>
        .spinner-border-sm {
            width: 1rem;
            height: 1rem;
            border-width: 0.2em;
        }
        .spinner-border {
            display: inline-block;
            width: 2rem;
            height: 2rem;
            vertical-align: text-bottom;
            border: 0.25em solid currentColor;
            border-right-color: transparent;
            border-radius: 50%;
            -webkit-animation: spinner-border .75s linear infinite;
            animation: spinner-border .75s linear infinite;
        }

        @keyframes spinner-border {
            100% {
                -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
            }
        }

        @media (max-width: 767px){
            .user-create-profile .active .describes-box__job-list {
                display:block;
            }
            
        }

        .c-pointer{
            cursor:pointer;
        }

    </style>
</head>
<body class="creating-profile user-logged-in path-user has-glyphicons">

<div class="dialog-off-canvas-main-canvas" data-off-canvas-main-canvas="">
    <div class="page user-create-profile ">
        <div class="user-profile-wp">
            <div class="container">
                <img alt="" class="iot-logo" src="<?php echo $logo_url; ?>">
                <h1>Create Your Profile</h1>
                <div id="build-profile-form-wrapper">
                    <div class="region region-content" id="ajax-steps-box">
                        <?php echo $step1; ?>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.4.1/dist/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.14/dist/js/bootstrap-select.min.js"></script>
<script id="multi-step-form">
    jQuery(document).ready(function($){
        $(document).on('submit', '#profile-form-step-1', function(event){
            event.preventDefault();
            // which best describes you
            let data = {};
            let whoAreYou = jQuery('[data-step="ielts_lms_step-which-best-describes-you"].active');
            if(whoAreYou.length == 1){
                data["ielts_lms_step-which-best-describes-you"] = whoAreYou.data("value");
                // describe brifly
                if(whoAreYou.data("value") === "current-student"){
                    let studyIn = jQuery('[data-describe="current-student"] [type="radio"]:checked').val();
                    data["ielts_lms_step-what-kind-of-student-you-are"] = studyIn;
                } else if(whoAreYou.data("value") === "parent-or-guardian-of-current-student"){
                    let studyIn = jQuery('[data-describe="parent-or-guardian-of-current-student"] [type="radio"]:checked').val();
                    data["ielts_lms_step-tell-us-about-your-child"] = studyIn;
                }


                $.ajax({
                    type: 'POST',
                    url: '<?php echo admin_url('admin-ajax.php'); ?>',
                    data:{
                        "action": 'ielts-lms-submit-step-1',
                        "data": data
                    },
                    cache: false,
                    beforeSend: function(){
                        $('.js-form-submit').addClass('bt-disabled');
                        $('.js-form-submit').attr('disabled', true);
                        $('.js-form-submit').html(`<div class="spinner-border spinner-border-sm" role="status">
                            <span class="sr-only">Loading...</span>
                        </div>`);
                    },
                    success: function(json){
                        if(json.success){
                            if(json.has_html){
                                jQuery('#ajax-steps-box').html(json.html);
                                jQuery('[data-select-value]').each(function() {
                                    var selectValue = jQuery(this).data('select-value');
                                    jQuery(this).val(selectValue);

                                });
                                
                                $('.select2').selectpicker({
                                    dropupAuto: true
                                });
                            }
                        }
                    },
                    error: function(){
                        ('.js-form-submit').attr('disabled', false);
                        $('.js-form-submit').html(`Next`);
                    }
                });


                

            } else {
                alert("Missing fields");
            }


            
        });

        $(document).on('submit','#profile-form-step-2', function(event){
            event.preventDefault();
            let firstName   = $('#first_name').val();
            let lastName    = $('#last_name').val();
            let country     = $('#country').val();
            let currency    = $('#currency').val();
            let timezone    = $('#timezone').val();

            let data = {
                "first_name"        : firstName,
                "last_name"         : lastName,
                "billing_country"   : country,
                "currency"          : currency,
                "timezone"          : timezone
            };

            $.ajax({
                type: 'POST',
                url: '<?php echo admin_url('admin-ajax.php'); ?>',
                data:{
                    "action": 'ielts-lms-submit-step-2',
                    "data": data
                },
                cache: false,
                beforeSend: function(){
                    $('.js-form-submit').addClass('bt-disabled');
                    $('.js-form-submit').attr('disabled', true);
                    $('.js-form-submit').html(`<div class="spinner-border spinner-border-sm" role="status">
                        <span class="sr-only">Loading...</span>
                    </div>`);
                    $('.-prev').addClass('bt-disabled');
                    $('.-prev').attr('disabled', true);
                },
                success: function(json){
                    if(json.success){
                        if(json.has_html){
                            jQuery('#ajax-steps-box').html(json.html);  
                            jQuery('[data-select-value]').each(function() {
                                var selectValue = jQuery(this).data('select-value');
                                jQuery(this).val(selectValue);
                            });
                                
                            $('.select2').selectpicker({
                                dropupAuto: true
                            });
                        }
                    }
                },
                error: function(){
                    $('button').removeClass('bt-disabled');
                    $('button').attr('disabled', false);
                    $('.js-form-submit').attr('disabled', false);
                    $('.js-form-submit').html(`Next`);
                }
            });
            

        });

        $(document).on('submit','#profile-form-step-3', function(event){
            event.preventDefault();
            let myReason    = jQuery('.xs-tab3.active a').data('value');
            let iHave       = jQuery('[name="ielts_lms_step-how-about-an-ielts-score"]:checked').val();
            let previous    = jQuery('#previous-score').val();
            let target      = jQuery('#target-score').val();
            let time    = jQuery('#exam-preparation-time').val();

            let data = {
                "ielts_lms_step-my-reason-for-practicing-ielts" : myReason,
                "ielts_lms_step-how-about-an-ielts-score": iHave,
                "ielts_lms_step-previous-score": previous,
                "ielts_lms_step-target-score": target,
                "ielts_lms_step-exam-preparation-time": time 
            };

        

            $.ajax({
                type: 'POST',
                url: '<?php echo admin_url('admin-ajax.php'); ?>',
                data:{
                    "action": 'ielts-lms-submit-step-3',
                    "data": data
                },
                cache: false,
                beforeSend: function(){
                    $('.js-form-submit').addClass('bt-disabled');
                    $('.js-form-submit').attr('disabled', true);
                    $('.js-form-submit').html(`<div class="spinner-border spinner-border-sm" role="status">
                        <span class="sr-only">Loading...</span>
                    </div>`);
                    $('.-prev').addClass('bt-disabled');
                    $('.-prev').attr('disabled', true);
                },
                success: function(json){
                    if(json.success){
                        if(json.redirect){
                            window.location.href = json.url;
                        }
                    }
                },
                error: function(){
                    $('button').removeClass('bt-disabled');
                    $('button').attr('disabled', false);
                    $('.js-form-submit').attr('disabled', false);
                    $('.js-form-submit').html(`Next`);
                }
            });

      
            

        });

        $(document).on('click', '[data-action="ielts-lms-my-account-step-1-load"]', function(){
            $.ajax({
                type: 'POST',
                url: '<?php echo admin_url('admin-ajax.php'); ?>',
                data:{
                    "action": 'ielts-lms-my-account-step-1-load',
                },
                cache: false,
                beforeSend: function(){
                    $('button').addClass('bt-disabled');
                    $('button').attr('disabled', true);
                },
                success: function(json){
                    if(json.success){
                        if(json.has_html){
                            jQuery('#ajax-steps-box').html(json.html);
                        }
                    }
                },
                error: function(){

                }
            });
        });

        $(document).on('click', '[data-action="ielts-lms-my-account-step-2-load"]', function(){
            $.ajax({
                type: 'POST',
                url: '<?php echo admin_url('admin-ajax.php'); ?>',
                data:{
                    "action": 'ielts-lms-my-account-step-2-load',
                },
                cache: false,
                beforeSend: function(){
                    $('button').addClass('bt-disabled');
                    $('button').attr('disabled', true);
                },
                success: function(json){
                    if(json.success){
                        if(json.has_html){
                            jQuery('#ajax-steps-box').html(json.html);
                            jQuery('[data-select-value]').each(function() {
                                var selectValue = jQuery(this).data('select-value');
                                jQuery(this).val(selectValue);
                            });
                            $('.select2').selectpicker({
                                dropupAuto: true
                            });
                        }
                    }
                },
                error: function(){

                }
            });
        });

        $(document).on('click', '[data-toggle="tab0"]', function(event){
            event.preventDefault();
            let target = $(this).attr('href');
            let value = $(this).data('value');
            $('.xs-tabs').removeClass('active'); // remove active from each
            $('[data-toggle="tab"]').parent().removeClass('active');
            $('[role="tabpanel"]').removeClass('active');

            // active only descibe box
            $(`[data-describe="${value}"]`).addClass('active');
            $(`[data-value="${value}"].lg-tab`).addClass('active');
            
            
        });

        $(document).on('click', '[data-toggle="tab"]', function(event){
            event.preventDefault();
            let target = $(this).attr('href');
            $('[data-toggle="tab"]').parent().removeClass('active');
            $('[role="tabpanel"]').removeClass('active');
            $('.xs-tabs').removeClass('active');
            
            $(this).parent().addClass('active');
            $(target).addClass('active');
            $(`[data-describe="${$(this).parent().data('value')}"]`).addClass('active');
            
        });

        $(document).on('click', '[data-toggle="tab2"]', function(event){
            event.preventDefault();
            let target = $(this).attr('href');
            $('[data-toggle="tab2"]').parent().removeClass('active');
            $('.xs-tab3').removeClass('active');
            $(this).parent().addClass('active');
            $(target).addClass('active');
        });

        $(document).on('click', '[data-toggle="tab3"]', function(event){
            event.preventDefault();
            let target = $(this).attr('href');

            $('.xs-tab3').removeClass('active');
            $('[data-toggle="tab2"]').parent().removeClass('active');
            
            $(target).addClass('active');
            $(`[href="${target}"]`).parent().addClass('active');
        });

        $(document).on('change','.virtual-value', function(){
            if($(this).prop('checked')){
                if($(this).val() == "yes"){
                    $('[type="submit"]').prop('disabled', false);
                    $('[type="submit"]').removeClass('bt-disabled');
                }else{
                    $('[type="submit"]').prop('disabled', true);
                    $('[type="submit"]').addClass('bt-disabled');
                }
            }
        });

        $(document).on('change', '[name="ielts_lms_step-how-about-an-ielts-score"]', function(){
            if($(this).prop('checked')){
                if($(this).val() == "i-have-an-ielts-score"){
                    $('.js-form-item-previous-score').addClass('show');
                    $('.js-form-item-previous-score select').attr('required', true);
                }else{
                    $('.js-form-item-previous-score').removeClass('show');
                    $('.js-form-item-previous-score select').attr('required', false);
                }
            }
        });

        


    });
</script>
</body>
</html>