<?php
include('header.php');
?>
<style>
    .d-hide{display:none;}
    .fa-eye:before { content: "\f06e"; }
</style>
<!-- start main -->
<section class="user-form-part">
	<div class="container">
		<div class="row justify-content-center">
			<div class="col-12 col-sm-10 col-md-8 col-lg-6 col-xl-5 mb-4">
				<div class="user-form-card">
					<div class="user-form-title">
						<h2>Join Now!</h2>
						<p>Setup A New Account In A Minute</p>
					</div>
					<!--<form class="user-form" id="registerform" method="POST" action="<?=base_url('register/form');?>">-->
						<div class="form-group"><input type="text" class="form-control" onkeypress="return isNumberKey(event)" maxlength="10" pattern="[0-9]{10}" id="mobile_number" placeholder="Enter your Mobile Number" required></div>
						<div class="input-group mb-3 d-hide otp">
                            <input type="text" id="otp" onkeypress="return isNumberKey(event)" maxlength="6" pattern="[0-9]{6}" name="password" class="form-control" placeholder="Enter your OTP">
                            <button class="bg-theme-color text-white rounded px-3" type="button" id="resend_otp">Get OTP</button>
                        </div>
						<input type="hidden" id="form_open" class="form-control" value="1" required>
						<div class="form-group d-hide name"><input type="text" id="sid" class="form-control" placeholder="Enter Sponsor Phone number"></div>
						<div class="form-group d-hide name"><input type="text" id="name" class="form-control" placeholder="Enter your name"></div>
						<div class="form-group d-hide email"><input type="email" id="email" class="form-control" placeholder="Enter your email" ></div>
						<div class="input-group mb-3 d-hide password">
                            <input type="password" id="password" name="password" class="form-control" placeholder="Enter your password">
                            <button class="bg-theme-color text-white rounded px-3" type="button" onclick="if($('#password').attr('type')=='password'){$('#password').attr('type','text');}else{$('#password').attr('type','password');}$('#eye').toggleClass('fa-eye');"><i id="eye" class="fa fa-eye-slash"></i></button>
                        </div>
						<div class="input-group mb-3 d-hide repeat_pass">
                            <input type="password" id="repeat_pass" name="repeat_pass" class="form-control" placeholder="Enter repeat password">
                            <button class="bg-theme-color text-white rounded px-3" type="button" onclick="if($('#repeat_pass').attr('type')=='password'){$('#repeat_pass').attr('type','text');}else{$('#repeat_pass').attr('type','password');}$('#eye2').toggleClass('fa-eye');"><i id="eye2" class="fa fa-eye-slash"></i></button>
                        </div>
						<div class="form-button"><button id="register_btn" type="submit">Continue</button></div>
					<!--</form>-->
				</div>
				<div class="user-form-remind">
					<p>Already Have An Account?<a href="<?=base_url('login');?>">login here</a></p>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- end main -->

<?php
include('footer.php');
?>

<? // register verification process;?>
<script>
    $(document).ready(function(){
        $('#register_btn').click(function(){
                var mobile_number = $("#mobile_number").val();
                var otp = $("#otp").val();
                var cust_name = $("#name").val();
                var cust_email = $("#email").val();
                var reg_password = $("#password").val();
                var reg_confirm_password = $("#repeat_pass").val();
                var form2 = $("#form_open").val();
                
                intRegex = /[0-9 -()+]+$/;
                if((mobile_number.length < 10) || (!intRegex.test(mobile_number)))
                {
                    sweetalert('warning', 'Please enter a valid mobile number.');
                    return false;
                }
                /*emailReg = /^([w-.]+@([w-]+.)+[w-]{2,4})?$/;
                if(!emailReg.test(email) || email == '')
                {
                    alert('warning', 'Please enter a valid email address.');
                    return false;
                }*/
                if(form2=='1'){
                    var form = 1;
                    $.ajax({
                        type: "POST",
                        url: "<?=base_url('register/get_otp');?>",
                        data: {
                        mobile_number: mobile_number,
                        form: form
                    },
                    success: function(data) {
                    var obj = JSON.parse(data);
                        if(obj.log == 0){
                            sweetalert('warning', obj.error);
                            setTimeout(function(){ window.location='<?=base_url('login');?>';}, 3000);
                        }
                        if(obj.log == 1){
                            sweetalert('success', 'OTP is Sent On Your Mobile Number.'+ obj.succ);
                            $("#mobile_number").attr('readonly',true);
                            $("#form_open").val(obj.form);
                            $("#register_btn").html("Verify OTP!!");
                            $(".otp").css('display','flex');
                        }
                    }
                    });
                }
                if('2'==form2){
                    if(otp.length < 6){
                        sweetalert('warning', 'Please enter Valid OTP.');
                        return false;
                    }
                    
                    var form = 2;
                    $.ajax({
                        type: "POST",
                        url: "<?=base_url('register/verify_otp_form');?>",
                        data: {
                        mobile_number: mobile_number,
                        otp: otp,
                        form: form
                    },
                    success: function(data) {
                        var obj = JSON.parse(data);
                        if(obj.log == 0){
                            sweetalert('warning', obj.error);
                        }

                        if(obj.log == 1){
                            sweetalert('success', obj.succ);
                            $(".otp").hide();
                            $("#register_btn").html("Create Account!!");
                            $("#form_open").val(obj.form);
                            $(".name").show();
                            $(".email").show();
                            $(".password").css('display','flex');
                            $(".repeat_pass").css('display','flex');
                        }
                    }
                    });
                }
                if(mobile_number !='' && otp!='' && cust_name!='' && cust_email!='' && reg_password!='' && reg_confirm_password!='' && '3'==form2){
                    var form = 3;
                                $.ajax({
                    	            type: "POST",
                    	            url: "<?=base_url('register/final_form');?>",
                    	            data: {
                    	                mobile_number: mobile_number,
                    	                otp: otp,
                    	                cust_name: cust_name,
                    	                cust_email: cust_email,
                    	                reg_password: reg_password,
                    	                reg_confirm_password: reg_confirm_password,
                    	                form: form
                    	            },
                    	            success: function(data) {
                    	                var obj = JSON.parse(data);
                                        if(obj.log == 0){
                                            sweetalert('warning', obj.error);
                                        }
                    	                if(obj.log == 1){
                                            sweetalert('success', obj.succ);
                                            setTimeout(function(){ window.location='<?=base_url();?>';}, 3000);
                    	                }
                    	            }
                    	        });
                    	        }
            return false;
        });
    });
</script>
<script>
    $(document).ready(function(){
        $('#resend_otp').click(function(){
            var mobile_number = $("#mobile_number").val();
            var form = $("#form_open").val();
            $.ajax({
                type: "POST",
                url: "<?=base_url('register/get_otp');?>",
                data: {
                mobile_number: mobile_number,
                form: form
            },
            success: function(data) {
                var obj = JSON.parse(data);
                if(obj.log == 0){
                    sweetalert('warning', obj.error);
                    setTimeout(function(){ window.location='<?=base_url('login');?>';}, 3000);
                }
                if(obj.log == 1){
                    sweetalert('success', 'OTP is Resend Successfully. ==' + obj.succ + '== ');
                    $("#form_open").val('2');
                }
            }
            });
        });
    });
</script>
<script>

    $(document).ready(function(){
        $('#email').blur(function(){
            var email = $("#email").val();
            var form = $("#form_open").val();
            $.ajax({
                type: "POST",
                url: "<?=base_url('register/check_email');?>",
                data: {
                cust_email: email
            },
            success: function(data) {
                var obj = JSON.parse(data);
                if(obj.log == 0){
                    $("#email").val('');
                    sweetalert('warning', obj.error);
                }
            }
            });
        });
    });
    
</script>
<? // register verification process;?>