{% 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.username }}"{% endif %}
                    autocomplete="off"
                />
            </span>

            <button class="button"><i class="ph ph-magnifying-glass"></i></button>
        </form>
    </nav>
{% endblock %}
{% block content %}
    {% if user %}
        <div class="account-block">
            {% if user.picture %}
                <img src="{{ url_for('api.upload_dir', filename=user.picture) }}" alt="Profile picture">
            {% else %}
                <img src="{{ url_for('static', filename='images/pfp.png') }}" alt="Profile picture">
            {% endif %}
            <div class="other">
                <h2>{{ user.username }}</h2>
                <p>Joined {{ user.joined_at.strftime('%Y-%m-%d') }}</p>

                <hr>

                <p>Best score: {{ scores[0].score | format_result }}</p>
            </div>
        </div>
    {% endif %}

    {% if scores %}
        <div class="table">
            <table>
                <tr>
                    <th></th>
                    <th>Name</th>
                    <th>Time Set</th>
                    <th>Submitted</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>
                    </tr>
                {% endfor %}
            </table>
        </div>
    {% else %}
        <div class="center-text">
            <h2>No scores</h2>
            <p>Go set some!</p>
        </div>
    {% endif %}
{% endblock %}