From 8196e9c1ebbd703ba8eb2464116d07366b95221a Mon Sep 17 00:00:00 2001
From: Valentin Deniaud <vdeniaud@entrouvert.com>
Date: Wed, 23 Oct 2019 15:56:15 +0200
Subject: [PATCH] wcs: add pagination for current forms/drafts cells (#10179)

---
 .../templates/combo/wcs/current_drafts.html   |  1 +
 .../templates/combo/wcs/current_forms.html    |  1 +
 .../templates/combo/wcs/user_all_forms.html   |  1 +
 .../templates/combo/wcs/user_done_forms.html  |  1 +
 combo/public/static/js/combo.public.js        | 39 +++++++++++++++++++
 combo/public/templates/combo/pagination.html  |  5 +++
 6 files changed, 48 insertions(+)
 create mode 100644 combo/public/templates/combo/pagination.html

diff --git a/combo/apps/wcs/templates/combo/wcs/current_drafts.html b/combo/apps/wcs/templates/combo/wcs/current_drafts.html
index 9e7489e3..1a1e1b09 100644
--- a/combo/apps/wcs/templates/combo/wcs/current_drafts.html
+++ b/combo/apps/wcs/templates/combo/wcs/current_drafts.html
@@ -17,4 +17,5 @@
   {% endif %}
 </div>
 {% endfor %}
+{% include "combo/pagination.html" %}
 {% endblock %}
diff --git a/combo/apps/wcs/templates/combo/wcs/current_forms.html b/combo/apps/wcs/templates/combo/wcs/current_forms.html
index e4adb0cd..38ce44a1 100644
--- a/combo/apps/wcs/templates/combo/wcs/current_forms.html
+++ b/combo/apps/wcs/templates/combo/wcs/current_forms.html
@@ -6,4 +6,5 @@
   {% include "combo/wcs/list_of_forms.html" with forms=forms %}
   </div>
 {% endfor %}
+{% include "combo/pagination.html" %}
 {% endblock %}
diff --git a/combo/apps/wcs/templates/combo/wcs/user_all_forms.html b/combo/apps/wcs/templates/combo/wcs/user_all_forms.html
index 10b83e76..82d4fc89 100644
--- a/combo/apps/wcs/templates/combo/wcs/user_all_forms.html
+++ b/combo/apps/wcs/templates/combo/wcs/user_all_forms.html
@@ -6,4 +6,5 @@
   {% include "combo/wcs/list_of_forms.html" with forms=forms %}
   </div>
 {% endfor %}
+{% include "combo/pagination.html" %}
 {% endblock %}
diff --git a/combo/apps/wcs/templates/combo/wcs/user_done_forms.html b/combo/apps/wcs/templates/combo/wcs/user_done_forms.html
index be4c61bc..754fc43c 100644
--- a/combo/apps/wcs/templates/combo/wcs/user_done_forms.html
+++ b/combo/apps/wcs/templates/combo/wcs/user_done_forms.html
@@ -6,4 +6,5 @@
   {% include "combo/wcs/list_of_forms.html" with forms=forms %}
   </div>
 {% endfor %}
+{% include "combo/pagination.html" %}
 {% endblock %}
diff --git a/combo/public/static/js/combo.public.js b/combo/public/static/js/combo.public.js
index 0ba0b76f..66b974bc 100644
--- a/combo/public/static/js/combo.public.js
+++ b/combo/public/static/js/combo.public.js
@@ -279,4 +279,43 @@ $(function() {
     return false;
   });
 
+  // pagination in cells with list of items
+  $(document).on('combo:cell-loaded', function(ev, cell) {
+    var $pagination = $(cell).find('.cell-items-pagination');
+    if ($pagination.length == 0) return;
+    var page_index = 0;
+    var paginate_by = parseInt($pagination.data('paginate-by'));
+    // Get all <li> inside the same div as us, ignoring whether they are part of
+    // different <ul>
+    var items = $pagination.parent().find('li');
+    var max_page_index = Math.ceil(items.length / paginate_by);
+    if (items.length <= paginate_by) {
+      return;
+    }
+
+    function update_page(step) {
+      page_index = page_index + step;
+      if (page_index == 0) {
+        $pagination.find('.cell-items-pagination-prev').prop('disabled', true);
+      } else {
+        $pagination.find('.cell-items-pagination-prev').prop('disabled', null);
+      }
+      if (page_index == max_page_index - 1) {
+        $pagination.find('.cell-items-pagination-next').prop('disabled', true);
+      } else {
+        $pagination.find('.cell-items-pagination-next').prop('disabled', null);
+      }
+      start_item = paginate_by * page_index;
+      items.hide();
+      items.slice(start_item, start_item + paginate_by).show();
+    };
+
+    $pagination.find('.cell-items-pagination-prev').click(function() { update_page(-1); });
+    $pagination.find('.cell-items-pagination-next').click(function() { update_page(1); });
+    update_page(0);
+    $pagination.show();
+  });
+  $('.cell-items-pagination').each(function(idx, elem) {
+    $(document).trigger('combo:cell-loaded', $(elem).parents('.cell').first());
+  });
 });
diff --git a/combo/public/templates/combo/pagination.html b/combo/public/templates/combo/pagination.html
new file mode 100644
index 00000000..02f33ce7
--- /dev/null
+++ b/combo/public/templates/combo/pagination.html
@@ -0,0 +1,5 @@
+{% load static %}
+<div class="cell-items-pagination" data-paginate-by="10" hidden>
+  <button class="cell-items-pagination-prev" disabled>←</a>
+  <button class="cell-items-pagination-next" disabled>→</a>
+</div>