{% extends "base.html" %}

{% block title %}OurTieba{% endblock %}
{% block head %}
    {{ super() }}
    <link href="{{ url_for('static', filename='css/signin.css') }}" rel="stylesheet">
{% endblock %}

{% block page_content %}
    <form class="form-signin" method="post" target="dummy">
        <img class="mb-4" src="{{ url_for("static", filename='ico/favicon.ico') }}" alt="" width="72" height="72">
        <h1 class="h3 mb-3 fw-normal">Admin Login</h1>
        <iframe name="dummy" id="dummy" style="display: none;"></iframe>
        <div class="form-floating">
            <input type="text" class="form-control" id="aname" placeholder="username">
            <label for="aname">Username</label>
        </div>
        <div class="form-floating">
            <input type="password" class="form-control" id="password" placeholder="Password">
            <label for="password">Password</label>
        </div>

        <button class="w-100 btn btn-lg btn-primary" type="submit" id="btn_submit">Sign in</button>
        <p class="mt-5 mb-3 text-muted">&copy; OurTieba</p>
    </form>


    <div id="username-err" class="alert alert-warning" style="display: none">
    </div>
{% endblock %}

{% block scripts %}
    {{ super() }}
    <script>
        $(document).ready(function () {
            $("#btn_submit").click(function () {
                let aname = $("#aname").val().trim();
                let password = $("#password").val().trim();

                if (aname !== "" && password !== "") {
                    $.ajax({
                        url: '{{ url_for('admin.admin_auth_login') }}',
                        type: 'post',
                        dataType: 'json',
                        data: {aname: aname, password: password},
                        success: function (response) {
                            let msg = "";
                            if (response.status !== 0) {
                                window.location = "{{ url_for('admin.admin_hello') }}";
                            } else {
                                msg = response.error['msg'];
                                $("#username-err").html(msg).show();

                            }

                        }
                    });
                }
            });
        });
    </script>
{% endblock %}
