From 6be9ac4f70568cc601e056880cc038aadbf62e0c Mon Sep 17 00:00:00 2001
From: Chad Nelson <chadbnelson@gmail.com>
Date: Sun, 21 Nov 2021 17:18:18 -0500
Subject: [PATCH] Abstract JS for multivalue form fields

---
 bookwyrm/static/js/bookwyrm.js                 | 18 ++++++++++++++++++
 .../templates/book/edit/edit_book_form.html    | 12 +++++++++---
 bookwyrm/views/books/edit_book.py              |  4 ++--
 3 files changed, 29 insertions(+), 5 deletions(-)

diff --git a/bookwyrm/static/js/bookwyrm.js b/bookwyrm/static/js/bookwyrm.js
index 2d5b88ad..bf5efb46 100644
--- a/bookwyrm/static/js/bookwyrm.js
+++ b/bookwyrm/static/js/bookwyrm.js
@@ -368,4 +368,22 @@ let BookWyrm = new class {
             );
         }
     }
+
+    duplicateInput (input_id ) {
+        const orig = document.getElementById(input_id);
+        const parent = orig.parentNode;
+        const new_count = parent.querySelectorAll("input").length + 1
+
+        let input = orig.cloneNode();
+
+        input.id += ("-" + (new_count))
+        input.value = ""
+
+        let label = parent.querySelector("label").cloneNode();
+
+        label.setAttribute("for", input.id)
+
+        parent.appendChild(label)
+        parent.appendChild(input)
+    }
 }();
diff --git a/bookwyrm/templates/book/edit/edit_book_form.html b/bookwyrm/templates/book/edit/edit_book_form.html
index 982bb56d..841a3c53 100644
--- a/bookwyrm/templates/book/edit/edit_book_form.html
+++ b/bookwyrm/templates/book/edit/edit_book_form.html
@@ -119,10 +119,16 @@
                 </fieldset>
                 {% endif %}
                 <div class="field">
-                    <label class="label" for="id_add_author">{% trans "Add Authors:" %}</label>
-                    <input class="input" type="text" name="add_author" id="id_add_author" placeholder="{% trans 'John Doe, Jane Smith' %}" value="{{ add_author }}" {% if confirm_mode %}readonly{% endif %}>
-                    <span class="help">{% trans "Separate multiple values with commas." %}</span>
+                    <label class="label">{% trans "Add Authors:" %}</label>
+                    {% for author in add_author %}
+                    <label class="label is-sr-only" for="id_add_author{% if not forloop.first %}-{{forloop.counter}}{% endif %}">{% trans "Add Author" %}</label>
+                    <input class="input" type="text" name="add_author" id="id_add_author{% if not forloop.first %}-{{forloop.counter}}{% endif %}" placeholder="{% trans 'Jane Doe' %}" value="{{ author }}" {% if confirm_mode %}readonly{% endif %}>
+                    {% empty %}
+                    <label class="label is-sr-only" for="id_add_author">{% trans "Add Author" %}</label>
+                    <input class="input" type="text" name="add_author" id="id_add_author" placeholder="{% trans 'Jane Doe' %}" value="{{ author }}" {% if confirm_mode %}readonly{% endif %}>
+                    {% endfor %}
                 </div>
+                <span class="help"><a id="another_author_field" onclick="BookWyrm.duplicateInput('id_add_author')">{% trans "Add Another Author" %}</a></span>
             </div>
         </section>
     </div>
diff --git a/bookwyrm/views/books/edit_book.py b/bookwyrm/views/books/edit_book.py
index 1445dc01..0bacd607 100644
--- a/bookwyrm/views/books/edit_book.py
+++ b/bookwyrm/views/books/edit_book.py
@@ -43,12 +43,12 @@ class EditBook(View):
         if not form.is_valid():
             return TemplateResponse(request, "book/edit/edit_book.html", data)
 
-        add_author = request.POST.get("add_author")
+        add_author = request.POST.getlist("add_author")
         # we're adding an author through a free text field
         if add_author:
             data["add_author"] = add_author
             data["author_matches"] = []
-            for author in add_author.split(","):
+            for author in add_author:
                 if not author:
                     continue
                 # check for existing authors