{% import "includes/macros" as macros %}

{% extends "base" %}

{% block content %}
	<div class="max-w-screen-lg w-full">
    <h1 class="h1">Ergo Challenges</h1>

    {% if flash %}
        {{ macros::alert(message=flash.1, type=flash.0, class="my-3") }}
    {% endif %}

    <div class="grid gap-3">
      <div class="bg-white dark:bg-primary-900 text-black dark:text-white rounded-md block shadow mt-5" role="alert">
        <h2 class="h2">Ergo-Challenge?!</h2>
         <div class="text-sm p-3">
          <ul class="list-disc ms-2">
            <li class="py-1"><a href="https://rudernlinz.at/termin" target="_blank" class="link-primary">Überblick der Challenges</a></li>
            <li class="py-1">Eintragung ist jederzeit möglich, alle Daten die bis Sonntag 23:59 hier hochgeladen wurden, werden gesammelt an die Ister Ergo Challenge geschickt
            <li class="py-1">Dienstag + Donnerstag &rarr; gemeinsames Training; bitte um <a href="/" class="link-primary">Anmeldung</a>, damit jeder einen Ergo hat</li>
	    <li class="py-1">Offizielle Ergebnisse: <a href="https://rudernlinz.at/dt" target="_blank" style="text-decoration: underline;">Dirty Thirty (rudernlinz.at/dt)</a> / <a href="https://rudernlinz.at/dd" target="_blank" style="text-decoration: underline;">Dirty Dozen (rudernlinz.at/dd)</a>, bei Fehlern direkt mit <a href="mailto:office@ergochallenge.at" style="text-decoration: underline;">Christian (Ister)</a> Kontakt aufnehmen</li>
            <li class="py-1"><a href="https://cloud.rudernlinz.at/s/m7mPQdwSWscpaXT" target="_blank" class="link-primary">Noch mehr Infos zur Ergo-Challenge findest du hier</a></li>
          </ul>
        </div>

        <details class="bg-white dark:bg-primary-900 text-black dark:text-white rounded-md p-2">
          <summary class="cursor-pointer">Deine Daten</summary>
          <div class="pt-3">
            <p>
              Folgende Daten hat der Ruderassistent von dir. Wenn diese nicht mehr aktuell sind, bitte gewünschte Änderungen an Philipp melden (Tel. nr siehe Signal, oder an <a href="mailto:it@rudernlinz.at" class="text-primary-600 dark:text-primary-200 hover:text-primary-950 hover:dark:text-primary-300 underline" target="_blank">it@rudernlinz.at</a>).
            <br /><br />
            <ul>
              <li>Geburtsdatum: {{ loggedin_user.dob }}</li>
              <li>Gewicht: {{ loggedin_user.weight}} kg</li>
              <li>Geschlecht: {{ loggedin_user.sex}}</li>
            </ul>
            </p>
          </div>
        </details>
      </div>
    
    <div class="bg-white dark:bg-primary-900 text-black dark:text-white rounded-md block shadow grid gap-3">
      <h2 class="h2">Neuer Eintrag</h1>
      
      <details class="p-2">
        <summary class="cursor-pointer">Dirty Thirty</summary>
        <div class="mt-3">
          <form action="/ergo/thirty" class="grid gap-3" method="post" enctype="multipart/form-data">
            <div>
              <label for="user-thirty" class="text-sm text-gray-600 dark:text-gray-100">Ergo-Fahrer</label>
              <select name="user" id="user-thirty" class="input rounded-md">
                <option disabled="disabled">User auswählen</option>
                {% for user in users %}
                  {% if user.id == loggedin_user.id %}
                    <option value="{{ user.id }}" selected="selected">{{ user.name }}</option>
                  {% else %}
                    <option value="{{ user.id }}">{{ user.name }}</option>
                  {% endif %}
                {% endfor %}
              </select>
            </div>
            
             {{ macros::input(label="Distanz [m]", name="result", required=true, type="number", class="input rounded-md") }}

            <div>
              <label for="file-thirty" class="text-sm text-gray-600 dark:text-gray-100">Ergebnis-Foto vom Ergo-Display</label>
              <input type="file" id="file-thirty" name="proof" class="input rounded-md" accept="image/*">
            </div>
            <div class="text-end">
              <input type="submit" value="Speichern" class="btn btn-primary btn-fw m-auto"/>
            </div>
          </form>
        </div>
      </details>

      <details class="p-2">
        <summary class="cursor-pointer">Dirty Dozen</summary>
        <div class="mt-3">
          <form action="/ergo/dozen"  class="grid gap-3" method="post" enctype="multipart/form-data">
            <div>
              <label for="user-dozen" class="text-sm text-gray-600 dark:text-gray-100">Ergo-Fahrer</label>
              <select name="user" id="user-dozen" class="input rounded-md">
                <option disabled="disabled">User auswählen</option>
                {% for user in users %}
                  {% if user.id == loggedin_user.id %}
                    <option value="{{ user.id }}" selected="selected">{{ user.name }}</option>
                  {% else %}
                    <option value="{{ user.id }}">{{ user.name }}</option>
                  {% endif %}
                {% endfor %}
              </select>
            </div>
            
             {{ macros::input(label="Zeit [hh:mm:ss.s] oder Distanz [m]", name="result", required=true, type="text", class="input rounded-md", pattern="(?:\d+:\d{2}:\d{2}\.\d+|\d{1,2}:\d{2}\.\d+|\d+(\.\d+)?)") }}

            <div>
              <label for="file-dozen" class="text-sm text-gray-600 dark:text-gray-100">Ergebnis-Foto vom Ergo-Display</label>
              <input type="file" id="file-dozen" name="proof" class="input rounded-md" accept="image/*">
            </div>
            <div class="text-end">
              <input type="submit" value="Speichern" class="btn btn-primary btn-fw m-auto"/>
            </div>
          </form>
        </div>
      </details>
    </div>


    <div class="bg-white dark:bg-primary-900 text-black dark:text-white rounded-md block shadow grid gap-3">
      <h2 class="h2">Aktuelle Woche</h2>
      
      <details class="p-2">
        <summary class="cursor-pointer">Dirty Thirty <small class="text-gray-600 dark:text-white">({{thirty | length}})</small></summary>
        <div class="mt-3">
          <ol>
          {% for stat in thirty %}
            <li><strong>{{ stat.name }}:</strong> {{ stat.result }}</li>
          {% endfor %}
          </ol>
        </div>
      </details>

      <details class="p-2">
        <summary class="cursor-pointer">Dirty Dozen <small class="text-gray-600 dark:text-white">({{dozen | length}})</small></summary>
        <div class="mt-3">
          <ol>
          {% for stat in dozen %}
            <li><strong>{{ stat.name }}:</strong> {{ stat.result }}</li>
          {% endfor %}
          </ol>
        </div>
      </details>
      </div>

      {% if "admin" in loggedin_user.roles %}
          <div class="bg-white dark:bg-primary-900 text-black dark:text-white rounded-md block shadow grid gap-3">
            <h2 class="h2">Update</h2>
            
            <details class="p-2">
              <summary class="cursor-pointer">Dirty Thirty <small class="text-gray-600 dark:text-white">({{thirty | length}})</small></summary>
              <div class="mt-3">
                <ol>
                {% for stat in thirty %}
                  <li>
                    <form action="/ergo/thirty/user/{{ stat.id }}/new" method="get">
                      {{ stat.name }}: <input type="text" value="{{stat.result}}" name="new" style="color: black;"/><input type="submit"/>
                    </form>
                  </li>
                {% endfor %}
                </ol>
              </div>
            </details>

            <details class="p-2">
              <summary class="cursor-pointer">Dirty Dozen <small class="text-gray-600 dark:text-white">({{dozen | length}})</small></summary>
              <div class="mt-3">
                <ol>
                  {% for stat in dozen %}
                    <li>
                      <form action="/ergo/dozen/user/{{ stat.id }}/new" method="get">
                        {{ stat.name }}: <input type="text" value="{{stat.result}}" name="new" style="color: black;"/><input type="submit"/>
                      </form>
                    </li>
                  {% endfor %}
                </ol>
              </div>
            </details>
          </div>
        </div>
      {% endif %}
    </div>
	</div>

{% endblock content%}