{% extends 'base.jinja' %}

{% block title %}Formula 10 - Race Result{% endblock title %}

{% set active_page = "/result" %}

{% block head_extra %}
    <link href="../static/style/draggable.css" rel="stylesheet">
    <script src="../static/script/draggable.js" defer></script>
{% endblock head_extra %}

{% block navbar_center %}

    {% if model.all_race_results() | length > 0 %}
        <div class="dropdown">
            <button class="btn btn-outline-danger dropdown-toggle" type="button" data-bs-toggle="dropdown"
                    aria-expanded="false">
                {{ model.active_result_race_name_or_current_race_name() }}
            </button>
            <ul class="dropdown-menu">
                {% if model.current_race is not none %}
                    <li>
                        <a class="dropdown-item"
                           href="/result/{{ model.current_race.name_sanitized }}">{{ model.current_race.name }}</a>
                    </li>
                    <li>
                        <hr class="dropdown-divider">
                    </li>
                {% endif %}

                {% for result in model.all_race_results() %}
                    <li>
                        <a class="dropdown-item"
                           href="/result/{{ result.race.name_sanitized }}">{{ result.race.name }}</a>
                    </li>
                {% endfor %}
            </ul>
        </div>
    {% endif %}

{% endblock navbar_center %}

{% block body %}

    <div class="grid card-grid">

        <div class="card shadow-sm mb-2" style="max-width: 450px;">
            <div class="card-header">
                {{ model.active_result_race_name_or_current_race_name() }}
            </div>

            <div class="card-body">
                <div class="d-inline-block overflow-x-scroll w-100">
                    <div style="width: 410px;">
                        {% set race_result_open=model.race_result_open(model.active_result_race_name_or_current_race_name()) %}
                        {% if race_result_open == true %}
                            {% set action_save_href = "/result-enter/" ~ model.active_result_race_name_or_current_race_name_sanitized() %}
                        {% else %}
                            {% set action_save_href = "" %}
                        {% endif %}

                        <form action="{{ action_save_href }}" method="post">
                            {# Place numbers #}
                            <ul class="list-group list-group-flush d-inline-block">
                                {% for driver in model.all_drivers_or_active_result_standing_drivers() %}
                                    <li class="list-group-item p-1"><span id="place_number"
                                                                          class="fw-bold">P{{ "%02d" % loop.index }}</span>:
                                    </li>
                                {% endfor %}
                            </ul>

                            {# Drag and drop #}
                            <ul id="columns" class="list-group list-group-flush d-inline-block float-end">

                                {% for driver in model.all_drivers_or_active_result_standing_drivers() %}
                                    <li class="list-group-item {% if race_result_open == true %}column{% endif %} p-1"
                                        {% if race_result_open == true %}draggable="true"{% endif %}>
                                        {{ driver.name }}

                                        <div class="d-inline-block float-end" style="margin-left: 30px;">
                                            {# Driver DNFed at first #}
                                            <div class="form-check form-check-reverse d-inline-block">
                                                <input type="checkbox" class="form-check-input"
                                                       value="{{ driver.id }}"
                                                       id="first-dnf-{{ driver.id }}" name="first-dnf-drivers"
                                                       {% if (model.active_result is not none) and (driver in model.active_result.initial_dnf) %}checked{% endif %}
                                                       {% if race_result_open == false %}disabled="disabled"{% endif %}>
                                                <label for="first-dnf-{{ driver.id }}"
                                                       class="form-check-label text-muted">1. DNF</label>
                                            </div>

                                            {# Driver DNFed #}
                                            <div class="form-check form-check-reverse d-inline-block mx-2">
                                                <input type="checkbox" class="form-check-input"
                                                       value="{{ driver.id }}"
                                                       id="dnf-{{ driver.id }}" name="dnf-drivers"
                                                       {% if (model.active_result is not none) and (driver in model.active_result.all_dnfs) %}checked{% endif %}
                                                       {% if race_result_open == false %}disabled="disabled"{% endif %}>
                                                <label for="dnf-{{ driver.id }}"
                                                       class="form-check-label text-muted">DNF</label>
                                            </div>

                                            {# Driver Excluded #}
                                            <div class="form-check form-check-reverse d-inline-block">
                                                <input type="checkbox" class="form-check-input"
                                                       value="{{ driver.id }}"
                                                       id="exclude-{{ driver.id }}" name="excluded-drivers"
                                                       {% if (model.active_result is not none) and (driver in model.active_result.standing_exclusions) %}checked{% endif %}
                                                       {% if race_result_open == false %}disabled="disabled"{% endif %}>
                                                <label for="exclude-{{ driver.id }}"
                                                       class="form-check-label text-muted" data-bs-toggle="tooltip"
                                                       title="Driver is not counted for standing">NC</label>
                                            </div>
                                        </div>

                                        {# Standing order #}
                                        <input type="hidden" name="pxx-drivers" value="{{ driver.id }}">
                                    </li>
                                {% endfor %}
                            </ul>

                            <input type="submit" class="btn btn-danger mt-2 w-100" value="Save"
                                   {% if race_result_open == false %}disabled="disabled"{% endif %}>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

{% endblock body %}