Refactors en stemmen werkt

2024-02-07 14:07:36 +01:00
parent 0f5090cadc
commit 48dcf3bd9d
8 changed files with 61 additions and 34 deletions
@@ -3,7 +3,7 @@
    {% load static %}
    <script src="{% static 'js/htmx.min.js' %}" defer></script>
  </head>
-  <body>
+  <body hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'>
    <header>
      <nav>
        <ul hx-boost="true">
@@ -1,6 +1,35 @@
-<div id="vote-box" hx-boost="true" hx-target="#vote-box">
-  <iframe src="https://open.spotify.com/embed/track/{{ id }}"
+{% if track %}
+<div id="vote-box" hx-target="#vote-box">
+  {% if error %}<div class="error">{{ error }}</div>{% endif %}
+  <iframe src="https://open.spotify.com/embed/track/{{ track.id }}"
  class="play-sample" width="300" height="380" frameborder="0" allowtransparency="true" 
  allow="encrypted-media"></iframe>
-  <a href="{% url 'vote-track'%}">Ja</a> | <a href="{% url 'vote-track' %}">Nee</a>
+  <div id="vote-buttons" hx-vals='{"spotify_id": "{{ track.id }}"}'>
+    <button
+      hx-vals='{"vote": "2"}'
+      hx-post="{% url 'vote-track' %}"
+    >Helemaal mee eens</button>
+    <button
+      hx-vals='{"vote": "1"}'
+      hx-post="{% url 'vote-track' %}"
+    >Mee eens</button>
+    <button
+      hx-vals='{"vote": "0"}'
+      hx-post="{% url 'vote-track' %}"
+    >Neutraal</button>
+    <button
+      hx-vals='{"vote": "-1"}'
+      hx-post="{% url 'vote-track' %}"
+    >Niet mee eens</button>
+    <button
+      hx-vals='{"vote": "-2"}'
+      hx-post="{% url 'vote-track' %}"
+    >Helemaal niet mee eens</button>
+  </div>
 </div>
+{% else %}
+<p hx-boost="true">
+  Je hebt niets meer om te stemmen. Lekker bezig!
+  <a href="{% url 'nominate' %}">Nomineer zelf iets</a>, als je nog quota hebt.
+</p>
+{% endif %}
@@ -1,12 +1,8 @@
 {% extends "Base.html" %}

 {% block main-content %}
-  {% for song in songs %}
-    {{ song }}
-  {% endfor %}
-
+  <h2>Lekker stemmen</h2>
  <div hx-get="{% url 'vote-track' %}" hx-trigger="load">
-etst
-
+    Laden...
  </div>
 {% endblock %}