{% extends "base_admin.html" %}

{% block title %}MVC Project{% endblock %}

{% block head %}
    {{ parent() }}
{% endblock %}

{% block body %}

<h2>Welcome back 🙋🏼‍♂️</h2>
<br>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Natus eligendi fugiat voluptas. Aliquam aperiam ea itaque soluta delectus labore ullam dicta fugiat ex! Temporibus alias, doloribus velit at error vero.</p>
<br>

<div class="nk-block">
    <div class="row g-gs">
        
        <div class="col-md-8">
            <div class="card card-bordered card-full">
                <div class="nk-wg1">
                    <div class="nk-wg1-block">
                        <div class="nk-wg1-text">
                            <h5 class="title">Google authenticator</h5>
                            {% if userSecret %}
                                <p>Your account has been successfully protected with google authenticator.</p>

                                <form onsubmit="saveGoogleForm(this)">

                                    <input type="hidden" name="remove" value="1">
                                    <input type="hidden" name="secret" value="{{ userSecret }}">

                                    <div class="form-group">
                                        <label class="form-label" for="default-01">Auth code</label>
                                        <div class="form-control-wrap">
                                            <input type="text" class="form-control" id="default-01" placeholder="Auth code" name="code">
                                        </div>
                                    </div>

                                    <button class="btn btn-danger btn-sm" type="submit">Disable</button>
                                </form>
                            {% else %}
                                <div class="row">
                                    <div class="col-sm-6">
                                        <div>{{ secret }}</div>
                                        <img src="{{ imageUrl }}" style="max-height: 150px;" alt="">
                                    </div>
                                    <div class="col-sm-6">

                                        <form onsubmit="saveGoogleForm(this)">

                                            <input type="hidden" name="secret" value="{{ secret }}">

                                            <div class="form-group">
                                                <label class="form-label" for="default-01">Auth code</label>
                                                <div class="form-control-wrap">
                                                    <input type="text" class="form-control" id="default-01" placeholder="Auth code" name="code">
                                                </div>
                                            </div>

                                            <button class="btn btn-primary btn-sm" type="submit">Save data</button>
                                        </form>

                                    </div>
                                </div>
                                
                            {% endif %}
                            
                        </div>
                    </div>
                </div>
            </div>
        </div><!-- .col -->
    </div>
</div>

<script>
    
    function saveGoogleForm(form) {

        event.preventDefault();

        $.ajax({
            url: '{{ urlFor("ajax/admin/saveGoogleForm") }}',
            data: $(form).serialize(),
            type: 'POST',
            success: function(data) {
                if(data.success){
                    location.reload();
                } else {
                    Swal.fire({
                        icon: 'error',
                        title: 'Error',
                        text: `Error (Code ${data.data.error})`,
                    })
                }
            }
        });

    }

</script>

{% endblock %}