Update visible shelve buttons on read action

bookwyrm/static/js/status_cache.js

@@ -57,7 +57,7 @@ let StatusCache = new class {
     /**
      * Post a status with ajax
      *
-     * @param  {Event} event
+     * @param  {} event
      * @return {undefined}
      */
     submitStatus(event) {
@@ -81,6 +81,11 @@ let StatusCache = new class {
 
         if (modal) {
             modal.getElementsByClassName("modal-close")[0].click();
+
+            // Update shelve buttons
+            document.querySelectorAll("[data-shelve-button-book='" + form.book.value +"']")
+                .forEach(button => this.cycleShelveButtons(button, form.reading_status.value));
+            return;
         }
 
         // Close reply panel
@@ -89,8 +94,30 @@ let StatusCache = new class {
         if (reply) {
             document.querySelector("[data-controls=" + reply.id + "]").click();
         }
+    }
 
-        // Update shelve buttons
+    /**
+     * Change which buttons are available for a shelf
+     *
+     * @param  {Object} html button dom element
+     * @param  {String} the identifier of the selected shelf
+     * @return {undefined}
+     */
+    cycleShelveButtons(button, identifier) {
+        // pressed button
+        let shelf = button.querySelector("[data-shelf-identifier='" + identifier + "']");
+
+        // set all buttons to hidden
+        button.querySelectorAll("[data-shelf-identifier]")
+            .forEach(item => BookWyrm.addRemoveClass(item, "is-hidden", true));
+
+        // button that should be visible now
+        let next = button.querySelector("[data-shelf-identifier=" + shelf.dataset.shelfNext + "]");
+
+        // show the desired button
+        BookWyrm.addRemoveClass(next, "is-hidden", false);
+
+        // dropdown buttons
     }
 }();
 

bookwyrm/templates/snippets/shelve_button/shelve_button.html

@@ -6,7 +6,7 @@
 {% with book.id|uuid as uuid %}
 {% active_shelf book as active_shelf %}
 {% latest_read_through book request.user as readthrough %}
-<div class="field has-addons mb-0">
+<div class="field has-addons mb-0" data-shelve-button-book="{{ book.id }}">
     {% if switch_mode and active_shelf.book != book %}
     <div class="control">
         {% include 'snippets/switch_edition_button.html' with edition=book size='is-small' %}

bookwyrm/templates/snippets/shelve_button/shelve_button_options.html

@@ -2,64 +2,89 @@
 {% load utilities %}
 {% load i18n %}
 
-{% for shelf in shelves %}
+{% with next_shelf_identifier=active_shelf.shelf.identifier|next_shelf %}
-{% comparison_bool shelf.identifier active_shelf.shelf.identifier as is_current %}
-{% if dropdown %}<li role="menuitem" class="dropdown-item p-0">{% endif %}
-    <div class="{% if not dropdown and active_shelf.shelf.identifier|next_shelf != shelf.identifier %}is-hidden{% endif %}">
-    {% if shelf.identifier == 'reading' %}{% if not dropdown or active_shelf.shelf.identifier|next_shelf != shelf.identifier %}
 
-        {% trans "Start reading" as button_text %}
+{% if not dropdown %}
-        {% url 'reading-status' 'start' book.id as fallback_url %}
+<div
-        {% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="start_reading" controls_uid=button_uuid focus="modal_title_start_reading" disabled=is_current fallback_url=fallback_url %}
+    class="{% if next_shelf_identifier != 'complete' %}is-hidden{% endif %}"
-
+    data-shelf-identifier="complete"
-    {% endif %}{% elif shelf.identifier == 'read' and active_shelf.shelf.identifier == 'read' %}{% if not dropdown or active_shelf.shelf.identifier|next_shelf != shelf.identifier %}
+>
     <button type="button" class="button {{ class }}" disabled>
         <span>{% trans "Read" %}</span>
     </button>
-    {% endif %}{% elif shelf.identifier == 'read' %}{% if not dropdown or active_shelf.shelf.identifier|next_shelf != shelf.identifier %}
+</div>
+{% endif %}
 
-        {% trans "Finish reading" as button_text %}
+{% for shelf in shelves %}
-        {% url 'reading-status' 'finish' book.id as fallback_url %}
+{% comparison_bool shelf.identifier active_shelf.shelf.identifier boolean=dropdown as is_current %}
-        {% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="finish_reading" controls_uid=button_uuid focus="modal_title_finish_reading" disabled=is_current fallback_url=fallback_url %}
 
-    {% endif %}{% elif shelf.identifier == 'to-read' %}{% if not dropdown or active_shelf.shelf.identifier|next_shelf != shelf.identifier %}
+    {% if dropdown %}<li role="menuitem" class="dropdown-item p-0">{% endif %}
 
-        {% trans "Want to read" as button_text %}
+        <div
-        {% url 'reading-status' 'want' book.id as fallback_url %}
+            class="{% if not dropdown and next_shelf_identifier != shelf.identifier %}is-hidden{% endif %}"
-        {% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="want_to_read" controls_uid=button_uuid focus="modal_title_want_to_read" disabled=is_current fallback_url=fallback_url %}
+            data-shelf-identifier="{{ shelf.identifier }}"
+            data-shelf-next="{{ shelf.identifier|next_shelf }}"
+        >
+        {% if shelf.identifier == 'reading' %}
+            {% if not dropdown or next_shelf_identifier != shelf.identifier %}
 
-    {% endif %}{% elif shelf.editable %}
+                {% trans "Start reading" as button_text %}
-        <form name="shelve" action="/shelve/" method="post">
+                {% url 'reading-status' 'start' book.id as fallback_url %}
+                {% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="start_reading" controls_uid=button_uuid focus="modal_title_start_reading" disabled=is_current fallback_url=fallback_url %}
+
+            {% endif %}
+        {% elif shelf.identifier == 'read' %}
+            {% if not dropdown or next_shelf_identifier != shelf.identifier %}
+
+                {% trans "Finish reading" as button_text %}
+                {% url 'reading-status' 'finish' book.id as fallback_url %}
+                {% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="finish_reading" controls_uid=button_uuid focus="modal_title_finish_reading" disabled=is_current fallback_url=fallback_url %}
+
+            {% endif %}
+        {% elif shelf.identifier == 'to-read' %}
+            {% if not dropdown or next_shelf_identifier != shelf.identifier %}
+
+                {% trans "Want to read" as button_text %}
+                {% url 'reading-status' 'want' book.id as fallback_url %}
+                {% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="want_to_read" controls_uid=button_uuid focus="modal_title_want_to_read" disabled=is_current fallback_url=fallback_url %}
+
+            {% endif %}
+        {% elif shelf.editable %}
+
+            <form name="shelve" action="/shelve/" method="post">
+                {% csrf_token %}
+                <input type="hidden" name="book" value="{{ active_shelf.book.id }}">
+                <button class="button {{ class }}" name="shelf" type="submit" value="{{ shelf.identifier }}" {% if shelf in book.shelf_set.all %} disabled {% endif %}>
+                    <span>{{ shelf.name }}</span>
+                </button>
+            </form>
+
+        {% endif %}
+        </div>
+    {% if dropdown %}</li>{% endif %}
+{% endfor %}
+
+
+{% if dropdown %}
+    {% if readthrough and active_shelf.shelf.identifier != 'read' %}
+    <li role="menuitem" class="dropdown-item p-0">
+        {% trans "Update progress" as button_text %}
+        {% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="progress_update" controls_uid=button_uuid focus="modal_title_progress_update" %}
+    </li>
+    {% endif %}
+
+    {% if active_shelf.shelf %}
+    <li role="menuitem" class="dropdown-item p-0">
+        <form  name="shelve" action="/unshelve/" method="post">
             {% csrf_token %}
             <input type="hidden" name="book" value="{{ active_shelf.book.id }}">
-            <button class="button {{ class }}" name="shelf" type="submit" value="{{ shelf.identifier }}" {% if shelf in book.shelf_set.all %} disabled {% endif %}>
+            <input type="hidden" name="shelf" value="{{ active_shelf.shelf.id }}">
-                <span>{{ shelf.name }}</span>
+            <button class="button is-fullwidth is-small{% if dropdown %} is-radiusless{% endif %} is-danger is-light" type="submit">
+                {% blocktrans with name=active_shelf.shelf.name %}Remove from {{ name }}{% endblocktrans %}
             </button>
         </form>
+    </li>
     {% endif %}
-    </div>
-{% if dropdown %}</li>{% endif %}
-{% endfor %}
-{% if dropdown %}
-
-{% if readthrough and active_shelf.shelf.identifier != 'read' %}
-<li role="menuitem" class="dropdown-item p-0">
-    {% trans "Update progress" as button_text %}
-    {% include 'snippets/toggle/toggle_button.html' with class=class text=button_text controls_text="progress_update" controls_uid=button_uuid focus="modal_title_progress_update" %}
-</li>
 {% endif %}
 
-{% if active_shelf.shelf %}
+{% endwith %}
-<li role="menuitem" class="dropdown-item p-0">
-    <form  name="shelve" action="/unshelve/" method="post">
-        {% csrf_token %}
-        <input type="hidden" name="book" value="{{ active_shelf.book.id }}">
-        <input type="hidden" name="shelf" value="{{ active_shelf.shelf.id }}">
-        <button class="button is-fullwidth is-small{% if dropdown %} is-radiusless{% endif %} is-danger is-light" type="submit">
-            {% blocktrans with name=active_shelf.shelf.name %}Remove from {{ name }}{% endblocktrans %}
-        </button>
-    </form>
-</li>
-{% endif %}
-
-{% endif %}

bookwyrm/templatetags/bookwyrm_tags.py

@@ -49,7 +49,7 @@ def get_next_shelf(current_shelf):
     if current_shelf == "reading":
         return "read"
     if current_shelf == "read":
-        return "read"
+        return "complete"
     return "to-read"
 
 

bookwyrm/templatetags/utilities.py

@@ -36,9 +36,9 @@ def get_title(book, too_short=5):
 
 
 @register.simple_tag(takes_context=False)
-def comparison_bool(str1, str2):
+def comparison_bool(str1, str2, boolean=True):
-    """idk why I need to write a tag for this, it reutrns a bool"""
+    """idk why I need to write a tag for this, it returns a bool"""
-    return str1 == str2
+    return boolean and str1 == str2
 
 
 @register.filter(is_safe=True)