From c370c7e4f76e007182ff7c07557a7c856ba08215 Mon Sep 17 00:00:00 2001
From: Alissa Cheng <cheng@astron.nl>
Date: Thu, 18 Jan 2024 17:13:05 +0100
Subject: [PATCH] fix pagination and add ellipsis
---
.../templates/taskdatabase/pagination.html | 17 +++++++++++++----
1 file changed, 13 insertions(+), 4 deletions(-)
diff --git a/atdb/taskdatabase/templates/taskdatabase/pagination.html b/atdb/taskdatabase/templates/taskdatabase/pagination.html
index 0ff810f1..c40b0940 100644
--- a/atdb/taskdatabase/templates/taskdatabase/pagination.html
+++ b/atdb/taskdatabase/templates/taskdatabase/pagination.html
@@ -2,10 +2,10 @@
{% if my_tasks.has_previous %}
<a href="?page=1" class="btn btn-outline-primary">First</a>
- <a href="?page={{ my_tasks.previous_page_number }}" class="btn btn-outline-primary">Prev</a>
+ <a href="?page={{ my_tasks.previous_page_number }}" class="btn btn-outline-primary">Previous</a>
{% else %}
<button class="btn btn-outline-primary" disabled>First</button>
- <button class="btn btn-outline-primary" disabled>Prev</button>
+ <button class="btn btn-outline-primary" disabled>Previous</button>
{% endif %}
{% for page_number in my_tasks.paginator.page_range %}
@@ -13,17 +13,26 @@
<button class="btn btn-outline-primary active">
<span>{{ page_number }} <span class="sr-only">(current)</span></span>
</button>
- {% elif my_tasks.number < 5 and page_number < 21 or my_tasks.number > my_tasks.paginator.num_pages|add:"-5" and page_number > my_tasks.paginator.num_pages|add:"-20" %}
+ <!-- first and last 20 pages -->
+ {% elif my_tasks.number < 10 and page_number < 20 or my_tasks.number > my_tasks.paginator.num_pages|add:"-10" and page_number > my_tasks.paginator.num_pages|add:"-20" %}
<a href="?page={{ page_number }}" class="btn btn-outline-primary">
{{ page_number }}
</a>
- {% elif page_number < my_tasks.number and page_number > my_tasks.number|add:"-5" or page_number > my_tasks.number and page_number < my_tasks.number|add:5 %}
+ <!-- 10 pages around current page -->
+ {% elif page_number < my_tasks.number and page_number > my_tasks.number|add:"-10" or page_number > my_tasks.number and page_number < my_tasks.number|add:10 %}
<a href="?page={{ page_number }}" class="btn btn-outline-primary">
{{ page_number }}
</a>
{% endif %}
{% endfor %}
+ <!-- last page button or ellipsis if last page is too far -->
+ {% if my_tasks.number|add:10 < my_tasks.paginator.num_pages %}
+ <button class="btn btn-outline-primary" disabled>...</button>
+ {% elif my_tasks.number|add:10 == my_tasks.paginator.num_pages %}
+ <a href="?page={{ my_tasks.paginator.num_pages }}" class="btn btn-outline-primary">{{ my_tasks.paginator.num_pages }}</a>
+ {% endif %}
+
{% if my_tasks.has_next %}
<a href="?page={{ my_tasks.next_page_number }}" class="btn btn-outline-primary">Next</a>
<a href="?page={{ my_tasks.paginator.num_pages }}" class="btn btn-outline-primary">Last</a>
--
GitLab