From 47c3edeb7ff18fa820a863b179c96a9e9c23eb3b Mon Sep 17 00:00:00 2001
From: Patrick Jentsch <p.jentsch@uni-bielefeld.de>
Date: Wed, 14 Aug 2019 16:59:39 +0200
Subject: [PATCH] Toggle paginations if one or less items are displayed.
---
app/templates/base.html.j2 | 11 +++++++++++
app/templates/main/dashboard.html.j2 | 26 ++++++++++----------------
2 files changed, 21 insertions(+), 16 deletions(-)
diff --git a/app/templates/base.html.j2 b/app/templates/base.html.j2
index 7d62b549..bec894a5 100644
--- a/app/templates/base.html.j2
+++ b/app/templates/base.html.j2
@@ -12,6 +12,17 @@
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/materialize.min.css') }}" media="screen,projection"/>
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='css/opaque.css') }}" media="screen,projection"/>
<script src="{{ url_for('static', filename='js/list.js') }}"></script>
+ <script>
+ // Utils
+ var updatePagination = function(list) {
+ pagination = list.listContainer.querySelector(".pagination");
+ if (pagination.childElementCount <= 1) {
+ pagination.classList.add("hide");
+ } else {
+ pagination.classList.remove("hide");
+ }
+ }
+ </script>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
diff --git a/app/templates/main/dashboard.html.j2 b/app/templates/main/dashboard.html.j2
index 3ec36cff..c8a02c07 100644
--- a/app/templates/main/dashboard.html.j2
+++ b/app/templates/main/dashboard.html.j2
@@ -39,16 +39,11 @@
</div>
</div>
<script>
- corpusListOptions = {
- valueNames: ['title'],
- page: 4,
- pagination: true
- };
- corpusList = new List("corpus-list", corpusListOptions);
- /*
- * TODO: Hide Pagination if there is only on page
- * corpusListPagination = document.querySelector("#corpus-list .pagination");
- */
+ corpusList = new List("corpus-list", {valueNames: ["title"],
+ page: 4,
+ pagination: true});
+ corpusList.on("filterComplete", updatePagination);
+ corpusList.on("searchComplete", updatePagination);
</script>
<div class="col s12">
@@ -113,12 +108,11 @@
</div>
</div>
<script>
- jobListOptions = {
- valueNames: ['title'],
- page: 4,
- pagination: true
- };
- jobList = new List("job-list", jobListOptions);
+ var jobList = new List("job-list", {valueNames: ["title"],
+ page: 4,
+ pagination: true});
+ jobList.on("filterComplete", updatePagination);
+ jobList.on("searchComplete", updatePagination);
</script>
<div id="new-corpus-modal" class="modal">
--
GitLab