<html>
    <script src="{{ url_for('static', filename='js/lib/base64.js') }}"></script>
    <script src="{{ url_for('static', filename='js/webauthn.js') }}"></script>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/base.css') }}">
    <title>WebAuthn Test</title>
    <body>
        <h1>WebAuthn Test</h1>
        {% with messages = get_flashed_messages() %}
            {% if messages %}
                {% for message in messages %}
                    <p class="flash">{{ message }}</li>
                {% endfor %}
            {% endif %}
        {% endwith %}
        {% if current_user.is_authenticated %}
        <p>Logged in as {{ current_user.username }} | <a href="{{ url_for('logout') }}">Logout</a></p>
        {% else %}
            <h2>Register</h2>
            <form id="register-form" name="register" method="get">
                <label for="register_username">Username:</label>
                <input name="register_username"></input>
                <label for="register_display_name">Display Name:</label>
                <input name="register_display_name"></input>
                <button id="register" type="submit">Register with WebAuthn</button>
            </form>

            <hr></hr>

            <h2>Log In</h2>
            <form id="login-form" name="login" method="get">
                <label for="login_username">Username:</label>
                <input name="login_username"></input>
                <button id="login" type="submit">Log in with WebAuthn</button>
            </form>
        {% endif %}
    </body>
</html>
