From 95371d0d7f22479f20cf764ed5e9b94dc37f4f28 Mon Sep 17 00:00:00 2001
From: Ozzieisaacs <ozzie.fernandez.isaacs@googlemail.com>
Date: Tue, 2 Nov 2021 20:27:50 +0400
Subject: [PATCH] Fix shelf grid ordering for inverted order at page load
 Ordering buttons now visible on medium size screens

---
 cps/static/js/filter_grid.js | 10 ++++++----
 cps/templates/author.html    |  2 +-
 cps/templates/grid.html      | 10 ++++------
 cps/templates/index.html     |  2 +-
 cps/templates/list.html      | 10 ++++------
 cps/templates/search.html    |  2 +-
 cps/templates/shelf.html     |  2 +-
 7 files changed, 18 insertions(+), 20 deletions(-)

diff --git a/cps/static/js/filter_grid.js b/cps/static/js/filter_grid.js
index 7043131a..d84cf57a 100644
--- a/cps/static/js/filter_grid.js
+++ b/cps/static/js/filter_grid.js
@@ -21,10 +21,11 @@ var $list = $("#list").isotope({
     itemSelector: ".book",
     layoutMode: "fitRows",
     getSortData: {
-        title: ".title",
-    }
+        title: ".title"
+    },
 });
 
+
 $("#desc").click(function() {
     if (direction === 0) {
         return;
@@ -37,9 +38,10 @@ $("#desc").click(function() {
         url: getPath() + "/ajax/view",
         data: "{\"" + page + "\": {\"dir\": \"desc\"}}",
     });
+    // invert sorting order to make already inverted start order working
     $list.isotope({
         sortBy: "name",
-        sortAscending: true
+        sortAscending: !$list.data('isotope').options.sortAscending
     });
     direction = 0;
 });
@@ -58,7 +60,7 @@ $("#asc").click(function() {
     });
     $list.isotope({
         sortBy: "name",
-        sortAscending: false
+        sortAscending: !$list.data('isotope').options.sortAscending
     });
     direction = 1;
 });
diff --git a/cps/templates/author.html b/cps/templates/author.html
index d82b2ebd..4ae2df42 100644
--- a/cps/templates/author.html
+++ b/cps/templates/author.html
@@ -22,7 +22,7 @@
   {% if author is not none %}
     <h3>{{_("In Library")}}</h3>
   {% endif %}
-    <div class="filterheader hidden-xs hidden-sm">
+    <div class="filterheader hidden-xs">
       <a id="new" data-toggle="tooltip" title="{{_('Sort according to book date, newest first')}}" class="btn btn-primary" href="{{url_for('web.books_list', data='author', book_id=id, sort_param='new')}}"><span class="glyphicon glyphicon-book"></span> <span class="glyphicon glyphicon-calendar"></span><span class="glyphicon glyphicon-sort-by-order"></span></a>
       <a id="old" data-toggle="tooltip" title="{{_('Sort according to book date, oldest first')}}" class="btn btn-primary" href="{{url_for('web.books_list', data='author', book_id=id, sort_param='old')}}"><span class="glyphicon glyphicon-book"></span> <span class="glyphicon glyphicon-calendar"></span><span class="glyphicon glyphicon-sort-by-order-alt"></span></a>
       <a id="asc" data-toggle="tooltip" title="{{_('Sort title in alphabetical order')}}" class="btn btn-primary" href="{{url_for('web.books_list', data='author', book_id=id, sort_param='abc')}}"><span class="glyphicon glyphicon-font"></span><span class="glyphicon glyphicon-sort-by-alphabet"></span></a>
diff --git a/cps/templates/grid.html b/cps/templates/grid.html
index c9f3d0ae..b1cc64ec 100644
--- a/cps/templates/grid.html
+++ b/cps/templates/grid.html
@@ -2,19 +2,17 @@
 {% block body %}
 <h1 class="{{page}}">{{_(title)}}</h1>
 
-    <div class="filterheader hidden-xs hidden-sm">
-      {% if entries.__len__() %}
-       {% if entries[0][0].sort %}
+    <div class="filterheader hidden-xs">
+      {% if entries.__len__() and data == 'author' %}
         <button id="sort_name" class="btn btn-primary"><b>B,A <-> A B</b></button>
-       {% endif %}
       {% endif %}
       <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
       <button id="asc" data-id="series" data-order="{{ order }}" class="btn btn-primary"><span class="glyphicon glyphicon-sort-by-alphabet"></span></button>
       <button id="desc" data-id="series" class="btn btn-primary"><span class="glyphicon glyphicon-sort-by-alphabet-alt"></span></button>
       {% if charlist|length %}
-      <button id="all" class="btn btn-primary">{{_('All')}}</button>
+      <button id="all" class="btn btn-primary {% if charlist|length > 9 %}hidden-sm{% endif %}">{{_('All')}}</button>
       {% endif %}
-      <div class="btn-group character" role="group">
+      <div class="btn-group character {% if charlist|length > 9 %}hidden-sm{% endif %}" role="group">
         {% for char in charlist%}
         <button class="btn btn-primary char">{{char.char}}</button>
         {% endfor %}
diff --git a/cps/templates/index.html b/cps/templates/index.html
index df276638..4c67e362 100644
--- a/cps/templates/index.html
+++ b/cps/templates/index.html
@@ -64,7 +64,7 @@
 {% endif %}
 <div class="discover load-more">
   <h2 class="{{title}}">{{title}}</h2>
-    <div class="filterheader hidden-xs hidden-sm">
+    <div class="filterheader hidden-xs">
       <a data-toggle="tooltip" title="{{_('Sort according to book date, newest first')}}" id="new" class="btn btn-primary" href="{{url_for('web.books_list', data=page, book_id=id, sort_param='new')}}"><span class="glyphicon glyphicon-book"></span> <span class="glyphicon glyphicon-calendar"></span><span class="glyphicon glyphicon-sort-by-order"></span></a>
       <a data-toggle="tooltip" title="{{_('Sort according to book date, oldest first')}}" id="old" class="btn btn-primary" href="{{url_for('web.books_list', data=page, book_id=id, sort_param='old')}}"><span class="glyphicon glyphicon-book"></span> <span class="glyphicon glyphicon-calendar"></span><span class="glyphicon glyphicon-sort-by-order-alt"></span></a>
       <a data-toggle="tooltip" title="{{_('Sort title in alphabetical order')}}" id="asc" class="btn btn-primary" href="{{url_for('web.books_list', data=page, book_id=id, sort_param='abc')}}"><span class="glyphicon glyphicon-font"></span><span class="glyphicon glyphicon-sort-by-alphabet"></span></a>
diff --git a/cps/templates/list.html b/cps/templates/list.html
index a8be24ec..239e8151 100644
--- a/cps/templates/list.html
+++ b/cps/templates/list.html
@@ -2,18 +2,16 @@
 {% block body %}
 <h1 class="{{page}}">{{_(title)}}</h1>
 
-    <div class="filterheader hidden-xs hidden-sm">
-      {% if entries.__len__() %}
-       {% if data == 'author' %}
+    <div class="filterheader hidden-xs">
+      {% if entries.__len__() and data == 'author' %}
         <button id="sort_name" class="btn btn-primary"><b>B,A <-> A B</b></button>
-       {% endif %}
       {% endif %}
       <button id="asc" data-order="{{ order }}" data-id="{{ data }}" class="btn btn-primary"><span class="glyphicon glyphicon-sort-by-alphabet"></span></button>
       <button id="desc" data-id="{{ data }}" class="btn btn-primary"><span class="glyphicon glyphicon-sort-by-alphabet-alt"></span></button>
       {% if charlist|length %}
-      <button id="all" class="btn btn-primary">{{_('All')}}</button>
+      <button id="all" class="btn btn-primary {% if charlist|length > 9 %}hidden-sm{% endif %}">{{_('All')}}</button>
       {% endif %}
-      <div class="btn-group character" role="group">
+      <div class="btn-group character {% if charlist|length > 9 %}hidden-sm{% endif %}" role="group">
         {% for char in charlist%}
         <button class="btn btn-primary char">{{char.char}}</button>
         {% endfor %}
diff --git a/cps/templates/search.html b/cps/templates/search.html
index e88c2974..0f3e3b60 100644
--- a/cps/templates/search.html
+++ b/cps/templates/search.html
@@ -25,7 +25,7 @@
           </div>
         {% endif %}
       {% endif %}
-      <div class="filterheader hidden-xs hidden-sm"><!-- ToDo: Implement filter for search results -->
+      <div class="filterheader hidden-xs"><!-- ToDo: Implement filter for search results -->
         <a id="new" data-toggle="tooltip" title="{{_('Sort according to book date, newest first')}}" class="btn btn-primary" href="{{url_for('web.books_list', data=page, sort_param='new', query=query)}}"><span class="glyphicon glyphicon-sort-by-order"></span></a>
         <a id="old" data-toggle="tooltip" title="{{_('Sort according to book date, oldest first')}}" class="btn btn-primary" href="{{url_for('web.books_list', data=page, sort_param='old', query=query)}}"><span class="glyphicon glyphicon-sort-by-order-alt"></span></a>
         <a id="asc" data-toggle="tooltip" title="{{_('Sort title in alphabetical order')}}" class="btn btn-primary" href="{{url_for('web.books_list', data=page, sort_param='abc', query=query)}}"><span class="glyphicon glyphicon-font"></span><span class="glyphicon glyphicon-sort-by-alphabet"></span></a>
diff --git a/cps/templates/shelf.html b/cps/templates/shelf.html
index df05f0ad..4f74a4da 100644
--- a/cps/templates/shelf.html
+++ b/cps/templates/shelf.html
@@ -13,7 +13,7 @@
       {% if entries.__len__() %}
       <a id="order_shelf" href="{{ url_for('shelf.order_shelf', shelf_id=shelf.id) }}" class="btn btn-primary">{{ _('Arrange books manually') }} </a>
       <button id="toggle_order_shelf" type="button" data-alt-text="{{ _('Disable Change order') }}" class="btn btn-primary">{{ _('Enable Change order') }}</button>
-        <div class="filterheader hidden-xs hidden-sm">
+        <div class="filterheader hidden-xs">
           <a data-toggle="tooltip" title="{{_('Sort according to book date, newest first')}}" id="new" class="btn btn-primary disabled" href="{{url_for('shelf.show_shelf', shelf_id=shelf.id, sort_param='new')}}"><span class="glyphicon glyphicon-book"></span> <span class="glyphicon glyphicon-calendar"></span><span class="glyphicon glyphicon-sort-by-order"></span></a>
           <a data-toggle="tooltip" title="{{_('Sort according to book date, oldest first')}}" id="old" class="btn btn-primary disabled" href="{{url_for('shelf.show_shelf', shelf_id=shelf.id, sort_param='old')}}"><span class="glyphicon glyphicon-book"></span> <span class="glyphicon glyphicon-calendar"></span><span class="glyphicon glyphicon-sort-by-order-alt"></span></a>
           <a data-toggle="tooltip" title="{{_('Sort title in alphabetical order')}}" id="asc" class="btn btn-primary disabled" href="{{url_for('shelf.show_shelf', shelf_id=shelf.id, sort_param='abc')}}"><span class="glyphicon glyphicon-font"></span><span class="glyphicon glyphicon-sort-by-alphabet"></span></a>