Improve race guesses frontend

This commit is contained in:
2024-02-15 16:32:06 +01:00
parent 46214514c8
commit 54ca61124a
3 changed files with 32 additions and 19 deletions

View File

@ -109,4 +109,4 @@ def enterresult(raceid):
if __name__ == "__main__": if __name__ == "__main__":
app.run(debug=False) app.run(debug=True)

View File

@ -3,7 +3,8 @@
{# Easy nav-bar entries. When a page sets the active_page variable, the current entry will be underlined #} {# Easy nav-bar entries. When a page sets the active_page variable, the current entry will be underlined #}
{% macro nav_selector(page='', text='') %} {% macro nav_selector(page='', text='') %}
<a class="nav-link" href="/{{ page }}">{% if active_page == page %}<u>{% endif %} {{ text }} {% if active_page == page %}</u>{% endif %}</a> <a class="nav-link" href="/{{ page }}">{% if active_page == page %}<u>{% endif %} {{ text }}
{% if active_page == page %}</u>{% endif %}</a>
{% endmacro %} {% endmacro %}
<head> <head>
@ -20,14 +21,18 @@
</head> </head>
<body> <body>
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<nav class="navbar fixed-top navbar-expand-lg bg-body-tertiary">
<div class="container-fluid"> <div class="container-fluid">
<a class="navbar-brand" href="/"> <a class="navbar-brand" href="/">
<img src="../static/image/f1_logo.svg" alt="Logo" width="120" height="30" <img src="../static/image/f1_logo.svg" alt="Logo" width="120" height="30"
class="d-inline-block align-text-top"> class="d-inline-block align-text-top">
Formula <i>10</i> - 2024 Formula <i>10</i> - 2024
</a> </a>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup"> <button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target="#navbarCollapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<div class="navbar-nav"> <div class="navbar-nav">
{{ nav_selector("race", "Guess Race") }} {{ nav_selector("race", "Guess Race") }}
{{ nav_selector("season", "Guess Season") }} {{ nav_selector("season", "Guess Season") }}
@ -38,7 +43,10 @@
</div> </div>
</nav> </nav>
{% block body %}{% endblock body %} <div style="margin-top: 55px;">
{% block body %}{% endblock body %}
</div>
</body> </body>
</html> </html>

View File

@ -6,7 +6,7 @@
{% block body %} {% block body %}
<table class="table table-bordered"> <table class="table table-bordered table-sm table-responsive">
<thead> <thead>
<tr> <tr>
<th scope="col" rowspan="2" class="text-center">Race</th> <th scope="col" rowspan="2" class="text-center">Race</th>
@ -22,7 +22,7 @@
<td>&nbsp;</td> <td>&nbsp;</td>
{% for user in users %} {% for user in users %}
<td class="text-center">{{ user.name }}</td> <td class="text-center text-nowrap">{{ user.name }}</td>
{% endfor %} {% endfor %}
<td>&nbsp;</td> <td>&nbsp;</td>
@ -30,8 +30,8 @@
{# Next Race Guess #} {# Next Race Guess #}
{% if nextrace is not none %} {% if nextrace is not none %}
<tr> <tr class="table-light">
<td><span class="fw-bold">{{ nextrace.id }}:</span> {{ nextrace.grandprix }}</td> <td class="text-nowrap"><span class="fw-bold">{{ nextrace.id }}:</span> {{ nextrace.grandprix }}</td>
{% for user in users %} {% for user in users %}
<td> <td>
@ -44,14 +44,17 @@
{% for driver in drivers %} {% for driver in drivers %}
{% if (user.name in nextguesses) and (nextguesses.get(user.name).pxx.abbr == driver.abbr) %} {% if (user.name in nextguesses) and (nextguesses.get(user.name).pxx.abbr == driver.abbr) %}
{% set user_has_chosen.pxx = "true" %} {% set user_has_chosen.pxx = "true" %}
<option selected="selected" value="{{ driver.name }}">{{ driver.abbr }}</option> <option selected="selected"
value="{{ driver.name }}">{{ driver.abbr }}</option>
{% else %} {% else %}
<option value="{{ driver.name }}">{{ driver.abbr }}</option> <option value="{{ driver.name }}">{{ driver.abbr }}</option>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
{# Add an empty default if nothing has been chosen #}
{% if user_has_chosen.pxx == "false" %} {% if user_has_chosen.pxx == "false" %}
<option value="" selected="selected" disabled="disabled" hidden="hidden"></option> <option value="" selected="selected" disabled="disabled"
hidden="hidden"></option>
{% endif %} {% endif %}
</select> </select>
<label for="pxxselect" class="text-primary">P{{ nextrace.pxx }}:</label> <label for="pxxselect" class="text-primary">P{{ nextrace.pxx }}:</label>
@ -65,20 +68,23 @@
{% for driver in drivers %} {% for driver in drivers %}
{% if (user.name in nextguesses) and (nextguesses.get(user.name).dnf.abbr == driver.abbr) %} {% if (user.name in nextguesses) and (nextguesses.get(user.name).dnf.abbr == driver.abbr) %}
{% set user_has_chosen.dnf = "true" %} {% set user_has_chosen.dnf = "true" %}
<option selected="selected" value="{{ driver.name }}">{{ driver.abbr }}</option> <option selected="selected"
value="{{ driver.name }}">{{ driver.abbr }}</option>
{% else %} {% else %}
<option value="{{ driver.name }}">{{ driver.abbr }}</option> <option value="{{ driver.name }}">{{ driver.abbr }}</option>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
{# Add an empty default if nothing has been chosen #}
{% if user_has_chosen.dnf == "false" %} {% if user_has_chosen.dnf == "false" %}
<option value="" selected="selected" disabled="disabled" hidden="hidden"></option> <option value="" selected="selected" disabled="disabled"
hidden="hidden"></option>
{% endif %} {% endif %}
</select> </select>
<label for="dnfselect" class="text-primary">DNF:</label> <label for="dnfselect" class="text-primary">DNF:</label>
</div> </div>
<input type="submit" class="btn btn-primary mt-2 w-100" value="Save"> <input type="submit" class="btn btn-danger mt-2 w-100" value="Save">
</form> </form>
</td> </td>
{% endfor %} {% endfor %}
@ -108,7 +114,7 @@
<label for="dnfselect" class="text-primary">DNF:</label> <label for="dnfselect" class="text-primary">DNF:</label>
</div> </div>
<input type="submit" class="btn btn-primary mt-2 w-100" value="Save"> <input type="submit" class="btn btn-danger mt-2 w-100" value="Save">
</form> </form>
</td> </td>
</tr> </tr>
@ -116,10 +122,10 @@
{# Race Results #} {# Race Results #}
{% for raceresult in raceresults %} {% for raceresult in raceresults %}
<tr> <tr>
<td><span class="fw-bold">{{ raceresult.race.id }}:</span> {{ raceresult.race.grandprix }}</td> <td class="text-nowrap"><span class="fw-bold">{{ raceresult.race.id }}:</span> {{ raceresult.race.grandprix }}</td>
{% for user in users %} {% for user in users %}
<td> <td class="text-center text-nowrap">
{% if (raceresult.race_id in guesses) and (user.name in guesses.get(raceresult.race_id)) %} {% if (raceresult.race_id in guesses) and (user.name in guesses.get(raceresult.race_id)) %}
{% set pxx = guesses.get(raceresult.race_id).get(user.name).pxx.abbr %} {% set pxx = guesses.get(raceresult.race_id).get(user.name).pxx.abbr %}
{% set dnf = guesses.get(raceresult.race_id).get(user.name).dnf.abbr %} {% set dnf = guesses.get(raceresult.race_id).get(user.name).dnf.abbr %}
@ -133,8 +139,7 @@
</td> </td>
{% endfor %} {% endfor %}
<td class="text-center text-nowrap">
<td>
<ul class="list-group list-group-flush"> <ul class="list-group list-group-flush">
<li class="list-group-item">P{{ raceresult.race.pxx }}: {{ raceresult.pxx.abbr }}</li> <li class="list-group-item">P{{ raceresult.race.pxx }}: {{ raceresult.pxx.abbr }}</li>
<li class="list-group-item {% if raceresult.dnf.abbr == 'NON' %}text-muted{% endif %}"> <li class="list-group-item {% if raceresult.dnf.abbr == 'NON' %}text-muted{% endif %}">