From 10c86197f1f63e222dfc9e937911e35ab500a208 Mon Sep 17 00:00:00 2001
From: Jonathan Tschanter <jmtw@tutanota.de>
Date: Sat, 22 Jan 2022 21:24:24 +0100
Subject: Adds edit cards and templates to include

---
 templates/card/card.twig               |  13 +++--
 templates/card/card_add.twig           |  43 ++++----------
 templates/card/card_display.twig       |  48 ---------------
 templates/card/card_edit.twig          |  30 +++-------
 templates/card/card_list.twig          |  43 ++++----------
 templates/card/card_meta_template.twig |  21 +++++++
 templates/card/card_template.twig      | 103 +++++++++++++++++++++++++++++++++
 templates/card/card_view.twig          |  11 ++++
 8 files changed, 172 insertions(+), 140 deletions(-)
 delete mode 100644 templates/card/card_display.twig
 create mode 100644 templates/card/card_meta_template.twig
 create mode 100644 templates/card/card_template.twig
 create mode 100644 templates/card/card_view.twig

(limited to 'templates/card')

diff --git a/templates/card/card.twig b/templates/card/card.twig
index fcf6bd0..211f6e3 100644
--- a/templates/card/card.twig
+++ b/templates/card/card.twig
@@ -4,13 +4,14 @@
   Cards
 {% endblock %}
 {% block main %}
-  <div class="content content-header">
-    <button onclick="location.href='/card/list'">Overview</button>
+  <section class="content">
+    <button onclick="location.href='/card'">Overview</button>
+    <!--
+    TODO
+    <button onclick="location.href='/card/{{ cardOfTheDay.id }}'">Card Of The Day</button>
+    -->
     <button onclick="location.href='/card/add'">New Card</button>
-  </div>
-  <div class="content content-header">
-    <h3>{% block pagetitle %}{% endblock %}</h3>
-  </div>
+  </section>
 
   <div style="align-content: center;">
     {% block pagecontent %}{% endblock %}
diff --git a/templates/card/card_add.twig b/templates/card/card_add.twig
index db91fc4..0a90aea 100644
--- a/templates/card/card_add.twig
+++ b/templates/card/card_add.twig
@@ -1,47 +1,24 @@
 {% extends 'card/card.twig' %}
 
 {% block pagetitle %}
-  Edit Card
+  Add Card
 {% endblock %}
 {% block pagecontent %}
   <div class="content">
-    <form action="/card/{{ card.id }}/edit" method="post" enctype="multipart/form-data">
-      {% for meta in card.meta %}
+    <form action="/card/add" method="post" enctype="multipart/form-data">
+      {% for key, field in fields %}
         <p>
-          <label>{{ meta.key }}</label><br>
-          <input type="text" name="{{ meta.key }}" value="{{ meta.value }}">
+          <label>{{ key }}</label><br>
+          <input type="text" name="meta[{{ field }}]">
         </p>
       {% endfor %}
 
-      <input type="submit" value="Save">
+      <!-- TODO: add artworks when adding a card? -->
+      <h4>Artworks</h4>
+      <input type="file" name="images[]" multiple>
+
+      <input type="submit" value="Add">
     </form>
   </div>
 {% endblock %}
 
-{% block pagetitle %}
-  Add Card
-{% endblock %}
-{% block pagecontent %}
-  <form action="/card/add" method="post" enctype="multipart/form-data">
-    {% for key, field in fields %}
-      <p>
-        <label>{{ key }}</label><br>
-        <input type="text" name="{{ field }}">
-      </p>
-    {% endfor %}
-
-    <!--
-    {% for meta in card.meta %}
-      <p>
-        <label>{{ meta.key }}</label><br>
-        <input type="text" name="{{ meta.key }}" value="{{ meta.value }}" disabled>
-      </p>
-    {% endfor %}
-    -->
-
-    <h4>Artworks</h4>
-    <input type="file" name="images[]" multiple>
-
-    <input type="submit" value="Add">
-  </form>
-{% endblock %}
diff --git a/templates/card/card_display.twig b/templates/card/card_display.twig
deleted file mode 100644
index 7b2ed3e..0000000
--- a/templates/card/card_display.twig
+++ /dev/null
@@ -1,48 +0,0 @@
-{% extends 'card/card.twig' %}
-
-{% block pagetitle %}
-  Show Card
-{% endblock %}
-{% block pagecontent %}
-  <div class="content">
-    <button onclick="location.href='/card/{{ card.id }}/edit'">Edit</button>
-  </div>
-
-  <div class="content">
-    <div class="row">
-      <div class="column column-5">
-        <button class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button>
-        {{ card.getVotesTotal() }}
-        <button class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button>
-      </div>
-      <div class="column column-95">
-        {% for meta in card.meta %}
-          <p>
-            <label>{{ meta.key }}</label><br>
-            <input type="text" name="{{ meta.key }}" value="{{ meta.value }}" disabled>
-          </p>
-        {% endfor %}
-      </div>
-    </div>
-  </div>
-
-  <div class="content content-header">
-    <h3>Artworks</h3>
-  </div>
-
-  {% for artwork in card.artworks %}
-  <div class="content">
-    <div class="row">
-      <div class="column column-5">
-        <button class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button>
-        {{ artwork.getVotesTotal() }}
-        <button class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button>
-      </div>
-      <div class="column column-95">
-        <img class="image" src='{{ artwork.path }}'>
-        <button onclick="location.href='/artwork/{{ artwork.id }}'">Show</button>
-      </div>
-    </div>
-  </div>
-  {% endfor %}
-{% endblock %}
diff --git a/templates/card/card_edit.twig b/templates/card/card_edit.twig
index b066437..4d13efa 100644
--- a/templates/card/card_edit.twig
+++ b/templates/card/card_edit.twig
@@ -1,36 +1,24 @@
 {% extends 'card/card.twig' %}
 
-{% block pagetitle %}
-  Edit Card
-{% endblock %}
 {% block pagecontent %}
+  <section class="content">
+    <h3>Edit Card</h3>
+  </section>
+
+  <div class="content">
+    <button onclick="location.href='/card/{{ card.id }}'">Goto Card</button>
+  </div>
+
   <div class="content">
     <form action="/card/{{ card.id }}/edit" method="post" enctype="multipart/form-data">
       {% for meta in card.meta %}
         <p>
           <label>{{ meta.key }}</label><br>
-          <input type="text" name="{{ meta.key }}" value="{{ meta.value }}">
+          <input type="text" name="meta[{{ meta.key }}]" value="{{ meta.value }}">
         </p>
       {% endfor %}
 
       <input type="submit" value="Save">
     </form>
   </div>
-
-  <div class="content content-header">
-    <h3>Edit Artworks</h3>
-  </div>
-
-  <div class="content">
-    <button>Add Artwork</button>
-  </div>
-
-  {% for artwork in card.artworks %}
-    <div class="content">
-      <img class="image" src='{{ artwork.path }}'>
-      <button onclick="location.href='/artwork/{{ artwork.id }}/edit'">Edit</button>
-      <button>Remove</button>
-    </div>
-  {% endfor %}
-
 {% endblock %}
\ No newline at end of file
diff --git a/templates/card/card_list.twig b/templates/card/card_list.twig
index b6d8bbe..a233df9 100644
--- a/templates/card/card_list.twig
+++ b/templates/card/card_list.twig
@@ -1,38 +1,17 @@
 {% extends 'card/card.twig' %}
 
-{% block pagetitle %}
-List
-{% endblock %}
 {% block pagecontent %}
+  <section class="content">
+    <h3>Cards</h3>
+  </section>
+
   {% for card in cards %}
-    <div class="content">
-      <div class="row">
-        <div class="column column-5">
-          <button class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button>
-          {{ card.getVotesTotal() }}
-          <button class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button>
-        </div>
-        <div class="column column-95">
-          <table>
-            <thead>
-              <tr>
-                {% for meta in card.getAllMeta() %}
-                  <th>{{ meta.key }}</th>
-                {% endfor %}
-              </tr>
-            </thead>
-            <tbody>
-              <tr>
-                {% for meta in card.getAllMeta() %}
-                  <td>{{ meta.value }}</td>
-                {% endfor %}
-              </tr>
-            </tbody>
-          </table>
-          <button onclick="location.href='/card/{{ card.id }}'">Card</button>
-          <button onclick="location.href='/card/{{ card.id }}/artworks'">Artworks</button>
-        </div>
-      </div>
-    </div>
+    {% set cardSettings = {
+      "cardHeader": "",
+      "isPreview": true,
+      "isVotable": true,
+      "showArtworks": true
+    } %}
+    {{ include('card/card_template.twig') }}
   {% endfor %}
 {% endblock %}
diff --git a/templates/card/card_meta_template.twig b/templates/card/card_meta_template.twig
new file mode 100644
index 0000000..d57cdd8
--- /dev/null
+++ b/templates/card/card_meta_template.twig
@@ -0,0 +1,21 @@
+<div class="row">
+  <div class="column column-5">
+    <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data">
+      <input type="hidden" name="value" value="1">
+      <button type="submit" class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button>
+    </form>
+    {{ card.getVotesTotal() }}
+    <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data">
+      <input type="hidden" name="value" value="-1">
+      <button type="submit" class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button>
+    </form>
+  </div>
+  <div class="column column-95">
+    {% for meta in card.meta %}
+      <p>
+        <label>{{ meta.key }}</label><br>
+        <input type="text" name="{{ meta.key }}" value="{{ meta.value }}" disabled>
+      </p>
+    {% endfor %}
+  </div>
+</div>
\ No newline at end of file
diff --git a/templates/card/card_template.twig b/templates/card/card_template.twig
new file mode 100644
index 0000000..411ec2f
--- /dev/null
+++ b/templates/card/card_template.twig
@@ -0,0 +1,103 @@
+{% if cardSettings.isPreview == true %}
+  <div class="content">
+    {% if cardSettings.cardHeader != "" %}
+      <h4>{{ cardSettings.cardHeader }}</h4>
+    {% endif %}
+
+    <div class="row">
+      <div class="column column-5">
+        {% if cardSettings.isVotable == true %}
+          <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data">
+            <input type="hidden" name="value" value="1">
+            <button type="submit" class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button>
+          </form>
+          {{ card.getVotesTotal() }}
+          <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data">
+            <input type="hidden" name="value" value="-1">
+            <button type="submit" class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button>
+          </form>
+        {% endif %}
+      </div>
+      <div class="column column-95">
+        {% for meta in card.meta %}
+          <p>
+            <label>{{ meta.key }}</label><br>
+            <input type="text" name="{{ meta.key }}" value="{{ meta.value }}" disabled>
+          </p>
+        {% endfor %}
+
+        {% if cardSettings.showArtworks == true %}
+          {% if card.artworks|length > 0 %}
+            <div class="splide">
+              <div class="splide__track">
+                <ul class="splide__list">
+                  {% for artwork in card.artworks %}
+                    <li class="splide__slide">
+                      <img class="image" src='{{ artwork.path }}'>
+                    </li>
+                  {% endfor %}
+                </ul>
+              </div>
+            </div>
+          {% endif %}
+        {% endif %}
+
+        <button onclick="location.href='/card/{{ card.id }}'">View Card</button>
+      </div>
+    </div>
+  </div>
+{% else %}
+  <section id="card" class="content">
+    <h3>Card</h3>
+  </section>
+
+  <div class="content">
+    <button onclick="location.href='/card/{{ card.id }}/edit'">Edit Card</button>
+  </div>
+
+  <div class="content">
+    <div class="row">
+      <div class="column column-5">
+        {% if cardSettings.isVotable == true %}
+          <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data">
+            <input type="hidden" name="value" value="1">
+            <button type="submit" class="vote"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></button>
+          </form>
+          {{ card.getVotesTotal() }}
+          <form action="/card/{{ card.id }}/vote" method="post" enctype="multipart/form-data">
+            <input type="hidden" name="value" value="-1">
+            <button type="submit" class="vote"><i class="fa fa-thumbs-o-down" aria-hidden="true"></i></button>
+          </form>
+        {% endif %}
+      </div>
+      <div class="column column-95">
+        {% for meta in card.meta %}
+          <p>
+            <label>{{ meta.key }}</label><br>
+            <input type="text" name="{{ meta.key }}" value="{{ meta.value }}" disabled>
+          </p>
+        {% endfor %}
+      </div>
+    </div>
+  </div>
+
+  {% if cardSettings.showArtworks == true %}
+    <section id="artworks" class="content">
+      <h3>Artworks</h3>
+    </section>
+
+    <div class="content">
+      <!-- TODO -->
+      <button>Add Artwork</button>
+    </div>
+
+    {% for artwork in card.artworks %}
+      {% set artworkSettings = {
+        "artworkHeader": "",
+        "isPreview": true,
+        "isVotable": true
+      } %}
+      {{ include('artwork/artwork_template.twig') }}
+    {% endfor %}
+  {% endif %}
+{% endif %}
diff --git a/templates/card/card_view.twig b/templates/card/card_view.twig
new file mode 100644
index 0000000..3b84b26
--- /dev/null
+++ b/templates/card/card_view.twig
@@ -0,0 +1,11 @@
+{% extends 'card/card.twig' %}
+
+{% block pagecontent %}
+  {% set cardSettings = {
+    "cardHeader": "",
+    "isPreview": false,
+    "isVotable": true,
+    "showArtworks": true
+  } %}
+  {{ include('card/card_template.twig') }}
+{% endblock %}
-- 
cgit v1.2.3