@extends('Admin.master_layout.master')

@section('title', 'Change Password')

@section('header_menu')
@parent
@endsection

@section('sidebar_menu')
@parent
@endsection

@section('content')
<div id="content">
    <!--breadcrumbs-->
    <div id="content-header">
        <div id="breadcrumb"> <a href="{{ url('/') }}" title="Go to Home" class="tip-bottom"><i class="icon-home"></i> Home</a><a class="current">Change Password</a> </div>
        <h1>Change Password</h1>
    </div>
    <div class="container-fluid">
        <hr>
        @if(Session::has('success'))
        <div class="alert alert-success">
            <button class="close" data-dismiss="alert">×</button>
            <strong>Success!</strong>  {{ Session('success') }}
        </div>
        @endif
        @if(Session::has('failed'))
        <div class="alert alert-success">
            <button class="close" data-dismiss="alert">×</button>
            <strong>Success!</strong> {{ Session('failed') }}
        </div>
        @endif
        <div class="row-fluid">
            <div class="span12">
                <div class="widget-box">
                    <div class="widget-title"> <span class="icon"> <i class="icon-pencil"></i> </span>
                        <h5>Change Password</h5>
                    </div>
                    <div class="widget-content nopadding">
                        <form class="form-horizontal" action="{{ url('save_changed_password') }}" id="change_password" method="post" enctype="multipart/form-data">
                            <input type="hidden" name="_token" value="{{ csrf_token() }}">
                            <input type="hidden" name="checkOTP" id="checkOTP" value="0">
                            <div id="form-wizard-1" class="step">
                                <div class="control-group">
                                    <label class="control-label">New Password</label>
                                    <div class="controls">
                                        <input id="new_password" type="password" class="span11" name="new_password" />
                                        <label for="new_password" generated="true" class="error"></label>
                                    </div>
                                </div>
                                <div class="control-group">
                                    <label class="control-label">Confirm Password</label>
                                    <div class="controls">
                                        <input id="confirm_password" type="password" class="span11" name="confirm_password" />
                                        <label for="confirm_password" generated="true" class="error"></label>
                                    </div>
                                </div>
                            </div>
                            <div id="form-wizard-2" class="step" style="display: none;">
                                <div class="control-group">
                                    <label class="control-label">Enter OTP</label>
                                    <div class="controls">
                                        <input id="otp" type="text" name="otp" />
                                        <label for="otp" generated="true" class="error"></label>
                                    </div>
                                </div>
                            </div>
                            <div class="form-actions">
                                <label id="error" generated="true" class="error"></label>
                                <a href="{{ url('/') }}" class="btn btn-primary">Cancel</a>
                                <!-- <input class="btn btn-primary" type="reset" value="Reset" /> -->
                                <input class="btn btn-info" onclick="return false;" id="submit" type="submit" value="Change Password" />
                                <div id="status"></div>
                            </div>
                            <div id="submitted"></div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('footer')
@parent
@endsection

@section('extraa_script_and_js')
<script type="text/javascript">
    $("#submit").click(function(event) {
        if($('#new_password').val() == ''){
            $('#new_password').next('.error').html('Please enter new password.');
        }
        if($('#new_password').val() == ''){
            $('#confirm_password').next('.error').html('Please enter confirm password.');
        }
        if($('#new_password').val() != $('#confirm_password').val()){
            $('#confirm_password').next('.error').html('Not metch new and confirm password.');
        }
        if($('#new_password').val() != '' && $('#confirm_password').val() != ''  && $('#new_password').val() == $('#confirm_password').val()){
            $('#new_password').next('.error').html('');
            $('#confirm_password').next('.error').html('');
            $.ajax({
                url: '{{ url('save_changed_password') }}',
                type: 'POST',
                data: $('form').serialize(),
            })
            .done(function(data) {
                if (data.status) {
                    if(data.error == 200){
                        alert(data.message);
                        location.reload(true);
                    }else{
                        $("#submit").val('OTP');
                        $('#checkOTP').val(1);
                        $('#form-wizard-1').hide();
                        $('#form-wizard-2').show();
                    }
                }else{
                    $('#error').html(data.message);
                    //data.smsResponse.errors[0].message
                }
                //console.log(data);
            })
            .fail(function() {
                console.log("error");
            });
            
        }
    });
</script>
@parent
@endsection