{% extends "base.html" %}
{% block nav %}
    <hr>
    <nav>
        <form method="GET" action="{{ url_for('views.index') }}" class="compact">
            <select name="diff" class="button">
                <option value="0" {% if diff==0 %}selected{% endif %}>Level 1</option>
                <option value="1" {% if diff==1 %}selected{% endif %}>Level 2</option>
                <option value="2" {% if diff==2 %}selected{% endif %}>Level 3</option>
                <option value="3" {% if diff==3 %}selected{% endif %}>Normal</option>
                <option value="4" {% if diff==4 %}selected{% endif %}>Hard</option>
            </select>

            <select name="ver" class="button">
                {% for game_version in config["GAME_VERSIONS"] %}
                    <option
                            value="{{ game_version }}"
                            {% if ver==game_version %}selected{% endif %}
                    >{{ game_version }}</option>
                {% endfor %}
            </select>

            <span class="text-input">
                <label for="search">Username</label>
                <input type="text" name="user" id="search" {% if user %}value="{{ user }}"{% endif %} autocomplete="off"/>
            </span>

            <button class="button"><i class="ph ph-magnifying-glass"></i></button>
        </form>
    </nav>
{% endblock %}
{% block content %}
    {% if scores %}
        <div class="table">
            <table>
                <tr>
                    <th></th>
                    <th>Name</th>
                    <th>Time Set</th>
                    <th>Submitted</th>
                    <!-- <th>Game</th> -->
                </tr>
                {% for score in scores %}
                    <tr>
                        {% if loop.index == 1 %}
                            <td><i class="first ph-fill ph-crown"></i></td>
                        {% elif loop.index == 2 %}
                            <td><i class="second ph-duotone ph-crown"></i></td>
                        {% elif loop.index == 3 %}
                            <td><i class="third ph ph-crown"></i></td>
                        {% else %}
                            <td>{{ loop.index }}</td>
                        {% endif %}

                        {% if score.users.id == current_user.id %}
                            <td class="player">{{ score.users.username }}</td>
                        {% else %}
                            <td>{{ score.users.username }}</td>
                        {% endif %}

                        <td>{{ score.score | format_result }}</td>
                        <td>{{ score.scored_at.strftime('%Y-%m-%d') }}</td>
                        <!-- <td>{{ score.version }}</td> -->
                    </tr>
                {% endfor %}
            </table>
        </div>
    {% else %}
        <div class="center-text">
            <h2>No scores</h2>
            <p>Go set some!</p>
        </div>
    {% endif %}
{% endblock %}