From 5aa68ff1dd114a0dafbe6da0a76f2931122e2e00 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 form cell (#10179)

---
 combo/apps/wcs/models.py                      |  4 +++
 .../templates/combo/wcs/current_forms.html    |  1 +
 .../templates/combo/wcs/list_of_forms.html    |  4 +--
 .../templates/combo/wcs/user_all_forms.html   |  1 +
 .../templates/combo/wcs/user_done_forms.html  |  1 +
 combo/public/static/js/combo.paginate.js      | 30 +++++++++++++++++++
 combo/public/templates/combo/pagination.html  |  9 ++++++
 7 files changed, 48 insertions(+), 2 deletions(-)
 create mode 100644 combo/public/static/js/combo.paginate.js
 create mode 100644 combo/public/templates/combo/pagination.html

diff --git a/combo/apps/wcs/models.py b/combo/apps/wcs/models.py
index 092f34b..67c32de 100644
--- a/combo/apps/wcs/models.py
+++ b/combo/apps/wcs/models.py
@@ -303,6 +303,7 @@ class WcsUserDataBaseCell(WcsDataBaseCell):
 @register_cell_class
 class WcsCurrentFormsCell(WcsUserDataBaseCell):
     variable_name = 'user_forms'
+    paginate_by = 10
 
     categories = JSONField(_('Categories'), blank=True)
     current_forms = models.BooleanField(_('Current Forms'), default=True)
@@ -380,6 +381,9 @@ class WcsCurrentFormsCell(WcsUserDataBaseCell):
                 continue
             context['forms'].extend(context['user_forms'][wcs_site]['data'])
 
+        if self.paginate_by:
+            context['paginate_by'] = self.paginate_by
+
         return context
 
 @register_cell_class
diff --git a/combo/apps/wcs/templates/combo/wcs/current_forms.html b/combo/apps/wcs/templates/combo/wcs/current_forms.html
index e4adb0c..38ce44a 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/list_of_forms.html b/combo/apps/wcs/templates/combo/wcs/list_of_forms.html
index 5d1099c..0b97034 100644
--- a/combo/apps/wcs/templates/combo/wcs/list_of_forms.html
+++ b/combo/apps/wcs/templates/combo/wcs/list_of_forms.html
@@ -3,8 +3,8 @@
 <ul>
   {% for data in forms.data|dictsortreversed:"form_receipt_datetime" %}
   {% if data.url and data.title %}
-  <li class="{{data.status_css_class}} {% if data.form_status_is_endpoint %}done{% endif %}"><a
-      {% if data.readable %}href="{{ data.url }}"{% endif %}><span class="form-title">{{data.name}}</span>
+    <li class="{{data.status_css_class}} {% if data.form_status_is_endpoint %}done{% endif %}" {% if paginate_by %}hidden{% endif %}>
+      <a {% if data.readable %}href="{{ data.url }}"{% endif %}><span class="form-title">{{data.name}}</span>
     <span class="form-number">{{data.form_number}}
     {% if data.form_digest %}<span class="form-digest">({{data.form_digest}})</span>{% endif %}
     </span>
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 36c2faa..03c2b05 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 2455a6f..f2c08e6 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.paginate.js b/combo/public/static/js/combo.paginate.js
new file mode 100644
index 0000000..8524f2b
--- /dev/null
+++ b/combo/public/static/js/combo.paginate.js
@@ -0,0 +1,30 @@
+$(function() {
+  var page_index = 0;
+  var paginate_by = $('a#paginate-by').text();
+  if(!paginate_by)
+    return;
+  paginate_by = parseInt(paginate_by);
+  // Get all <li> inside the same div as us, ignoring whether they are part of
+  // different <ul>
+  var items = $('div#navigate-pages').parent().find('li');
+  var max_page_index = Math.ceil(items.length / paginate_by);
+
+  function update_page(step) {
+    new_index = page_index + step;
+    if(!(new_index >= 0 && new_index < max_page_index))
+      return;
+    page_index = new_index;
+    $('a#prev,a#next').show();
+    if(page_index == 0)
+      $('a#prev').hide();
+    if(page_index == max_page_index - 1)
+      $('a#next').hide();
+    start_item = paginate_by * page_index;
+    items.hide();
+    items.slice(start_item, start_item + paginate_by).show();
+  };
+  update_page(0);
+
+  $('a#next').click(function() {update_page(1)});
+  $('a#prev').click(function() {update_page(-1)});
+});
diff --git a/combo/public/templates/combo/pagination.html b/combo/public/templates/combo/pagination.html
new file mode 100644
index 0000000..666f4e5
--- /dev/null
+++ b/combo/public/templates/combo/pagination.html
@@ -0,0 +1,9 @@
+{% load static %}
+
+<script src="{% static "js/combo.paginate.js" %}"></script>
+
+<div id="navigate-pages">
+  <a hidden id="paginate-by">{{ paginate_by }}</a>
+  <a id="prev" href="#prev-item" hidden>Previous</a>
+  <a id="next" href="#next-item" hidden>Next</a>
+</div>
-- 
2.20.1

