Initial commit

folkugat_web/assets/templates/fragments/sessions/live/start.html

@@ -0,0 +1,6 @@
+<button title="Inicia una sessió"
+        class="text-beige mx-1"
+        hx-put="/api/sessio/{{ session.id }}/live"
+        hx-swap="outerHTML">
+    <i class="fa fa-play" aria-hidden="true"></i>
+</button>

folkugat_web/assets/templates/fragments/sessions/live/stop.html

@@ -0,0 +1,6 @@
+<button title="Atura una sessió"
+        class="text-beige mx-1"
+        hx-delete="/api/sessio/{{ session.id }}/live"
+        hx-swap="outerHTML">
+    <i class="fa fa-stop" aria-hidden="true"></i>
+</button>

folkugat_web/assets/templates/fragments/sessions/pagina.html

@@ -0,0 +1,25 @@
+{% include "fragments/menu.html" %}
+<div class="p-12 text-center">
+  <h3 class="text-3xl text-beige p-4">Calendari</h3>
+  {% if logged_in %}
+  <button title="Afegeix una sessió"
+          class="text-beige m-2"
+          hx-post="/api/sessions/editor/"
+          hx-target="#{{ calendar_list_id }}"
+          hx-swap="beforeend transition:true">
+    <i class="fa fa-plus" aria-hidden="true"></i>
+    Afegeix una sessió
+  </button>
+  {% endif %}
+  <div hx-get="/api/sessions/upcoming"
+       hx-trigger="load"
+       hx-target="this"
+       hx-swap="innerHTML">
+  </div>
+  <h3 class="text-3xl text-beige p-4">Historial</h3>
+  <div hx-get="/api/sessions/history"
+       hx-trigger="load"
+       hx-target="this"
+       hx-swap="innerHTML">
+  </div>
+</div>

folkugat_web/assets/templates/fragments/sessions/sessio.html

@@ -0,0 +1,33 @@
+{% include "fragments/menu.html" %}
+<div class="flex justify-center">
+  <div class="m-12 grow max-w-4xl text-center">
+    <h3 class="text-3xl p-4">
+        {% set dn = date_names(session.date) %}
+        {{ dn.day_name }} {{ dn.day }} {{ dn.month_name }} de {{ dn.year }}
+    </h3>
+    {% if logged_in %}
+      {% if session.is_live %}
+        {% include "fragments/sessions/live/stop.html" %}
+      {% else %}
+        {% include "fragments/sessions/live/start.html" %}
+      {% endif %}
+    {% endif %}
+    <div class="text-left">
+      <h4 class="text-xl text-beige">Horari i lloc</h4>
+        De {{ session.start_time.strftime("%H:%M") }}
+        a {{ session.end_time.strftime("%H:%M") }}
+        {% if session.venue.name %}
+          a
+          {% if session.venue.url %}
+          <a href="{{ session.venue.url }}"
+            class="text-beige"
+            target="_blank">
+            {{ session.venue.name }}
+          </a>
+          {% else %}
+            {{ session.venue.name }}
+          {% endif %}
+        {% endif %}
+    </div>
+  </div>
+</div>

folkugat_web/assets/templates/fragments/sessions/session_date.html

@@ -0,0 +1,24 @@
+<p>
+  {% if session == None %}
+    <a> L'últim Dimecres de cada mes </a>
+  {% else %}
+    <a>
+        {% set dn = date_names(session.date) %}
+        {{ dn.day_name }} {{ dn.day }} {{ dn.month_name }}
+    </a>
+     de {{ session.start_time.strftime("%H:%M") }}
+     a {{ session.end_time.strftime("%H:%M") }}
+    {% if session.venue.name %}
+       a {{ session.venue.name }}
+      <!-- {% if session.venue.url %} -->
+      <!-- <a href="{{ session.venue.url }}" -->
+      <!--    class="text-beige" -->
+      <!--    target="_blank"> -->
+      <!--   {{ session.venue.name }} -->
+      <!-- </a> -->
+      <!-- {% else %} -->
+        <!-- {{ session.venue.name }} -->
+      <!-- {% endif %} -->
+    {% endif %}
+  {% endif %}
+</p>

folkugat_web/assets/templates/fragments/sessions/session_list.html

@@ -0,0 +1,28 @@
+<ol id="{{ session_list_id }}"
+    class="flex flex-col items-center justify-center">
+{% for session in sessions %}
+    {% include "fragments/sessions/session_row.html" %}
+{% endfor %}
+{% if more_sessions or less_sessions %}
+    <li>
+      {% if more_sessions %}
+        <button title="Mostra més sessions"
+                class="text-beige mx-2"
+                hx-get="{{ get_sessions_url }}?limit={{ more_sessions }}"
+                hx-target="#{{ session_list_id }}"
+                hx-swap="outerHTML">
+          <i class="fa fa-caret-down" aria-hidden="true"></i>
+        </button>
+      {% endif %}
+      {% if less_sessions %}
+        <button title="Mostra menys sessions"
+                class="text-beige mx-2"
+                hx-get="{{ get_sessions_url }}?limit={{ less_sessions }}"
+                hx-target="#{{ session_list_id }}"
+                hx-swap="outerHTML">
+          <i class="fa fa-caret-up" aria-hidden="true"></i>
+        </button>
+      {% endif %}
+    </li>
+{% endif %}
+</ol>

folkugat_web/assets/templates/fragments/sessions/session_row.html

@@ -0,0 +1,44 @@
+<li class="border rounded border-beige
+            flex flex-row grow
+            p-2 m-2 w-full max-w-xl
+            relative"
+    id="session-row-{{session.id}}">
+  <a href="/session/{{session.id}}">
+  <div class="flex flex-row grow justify-center pl-10">
+    <div class="flex-1">
+      {% include "fragments/sessions/session_date.html" %}
+    </div>
+    <div class="ml-auto">
+      <a title="Més informació"
+         class="text-beige mx-1"
+         href="/sessio/{{session.id}}/">
+          <i class="fa fa-info-circle" aria-hidden="true"></i>
+      </a>
+      {% if logged_in %}
+      <button title="Edita la sessió"
+              class="text-beige mx-1"
+              hx-get="/api/sessions/editor/{{session.id}}/edita"
+              hx-target="#session-row-{{session.id}}"
+              hx-swap="outerHTML">
+        <i class="fa fa-pencil" aria-hidden="true"></i>
+      </button>
+      <button title="Esborra la sessió"
+              class="text-beige mx-1"
+              hx-delete="/api/sessions/editor/{{session.id}}/"
+              hx-target="#session-row-{{session.id}}"
+              hx-swap="outerHTML swap:0.5s">
+        <i class="fa fa-times" aria-hidden="true"></i>
+      </button>
+      {% endif %}
+    </div>
+  </div>
+  {% if session.id == next_session_id %}
+      <div class="absolute -top-5 -left-6
+                   bg-beige text-xs font-bold
+                   px-2 py-1
+                   transition-opacity duration-200
+                   rounded">
+        Propera<br>sessió
+      </div>
+  {% endif %}
+</li>

folkugat_web/assets/templates/fragments/sessions/session_row_editing.html

@@ -0,0 +1,96 @@
+<li id="session-editor-row-{{session.id}}"
+    class="border rounded border-beige
+           flex flex-col grow
+           py-2 px-10 m-2 w-full max-w-xl">
+  <form>
+    <div class="flex flex-row justify-end items-center">
+      <button title="Aplica els canvis"
+              class="text-beige mx-2"
+              hx-put="/api/sessions/editor/{{session.id}}/"
+              hx-target="#session-editor-row-{{session.id}}"
+              hx-swap="outerHTML">
+        <i class="fa fa-check" aria-hidden="true"></i>
+      </button>
+      <button title="Descarta els canvis"
+              class="text-beige mx-2"
+              hx-get="/api/sessions/editor/{{session.id}}/"
+              hx-target="#session-editor-row-{{session.id}}"
+              hx-swap="outerHTML">
+        <i class="fa fa-times" aria-hidden="true"></i>
+      </button>
+    </div>
+    <div class="flex flex-col items-start pl-5">
+      <div>
+        <label for="session-editor-row-{{session.id}}-date">
+          Data:
+        </label>
+        <input type="date" name="date"
+               value="{{ session.date.strftime('%Y-%m-%d') }}"
+               min="2022-01-01"
+               max="2050-12-31"
+               class="border-none focus:outline-none
+                      text-yellow-50 text-center
+                      bg-brown p-0 m-0
+                      session-editor-{{session.id}}"
+               />
+      </div>
+      <div>
+        <label for="session-editor-row-{{session.id}}-start-time">
+          Hora d'inici:
+        </label>
+        <input type="time" name="start_time"
+               value="{{ session.start_time.strftime('%H:%M') }}"
+               step="60"
+               class="border-none focus:outline-none
+                      text-yellow-50 text-center
+                      bg-brown p-0 m-0
+                      session-editor-{{session.id}}"
+               />
+      </div>
+      <div>
+        <label for="session-editor-row-{{session.id}}-end-time">
+          Hora final:
+        </label>
+        <input type="time" name="end_time"
+               value="{{ session.end_time.strftime('%H:%M') }}"
+               step="60"
+               class="border-none focus:outline-none
+                      text-yellow-50 text-center
+                      bg-brown p-0 m-0
+                      session-editor-{{session.id}}"
+               />
+      </div>
+      <div>
+        <label for="session-editor-row-{{session.id}}-venue-name">
+          Lloc:
+        </label>
+        <input list="llocs" name="venue_name"
+               placeholder="nom del lloc"
+               value="{{ session.venue.name or "" }}"
+               class="border border-yellow-50 focus:outline-none
+                      rounded
+                      text-yellow-50 text-center
+                      bg-brown p-0 m-0
+                      session-editor-{{session.id}}"
+               />
+        <datalist id="llocs">
+          <option value="la FEM">
+          <option value="Cal Temerari">
+        </datalist>
+      </div>
+      <div>
+        <label for="session-editor-row-{{session.id}}-venue-url">
+          Link:
+        </label>
+        <input placeholder="URL del lloc" name="venue_url"
+               value="{{ session.venue.url or "" }}"
+               class="border border-yellow-50 focus:outline-none
+                      rounded
+                      text-yellow-30 text-center
+                      bg-brown p-0 m-0 my-1
+                      session-editor-{{session.id}}"
+               />
+      </div>
+    </div>
+  </form>
+</li>