From 0199f87087bc138ba39640b8405946ecb02e3f5a Mon Sep 17 00:00:00 2001
From: Joxit <joxit972@gmail.com>
Date: Fri, 31 May 2019 00:44:29 +0200
Subject: [PATCH] feat(pagination): Identify the current page

---
 src/scripts/utils.js    | 2 +-
 src/style.css           | 4 ++++
 src/tags/pagination.tag | 2 +-
 src/tags/taglist.tag    | 9 ++++++---
 4 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/scripts/utils.js b/src/scripts/utils.js
index 2fcca52..6d6e18a 100644
--- a/src/scripts/utils.js
+++ b/src/scripts/utils.js
@@ -88,7 +88,7 @@ registryUI.getPageLabels = function(page, nPages) {
     pageLabels.push({'icon': 'chevron_left', page: page - 1});
   }
   for (var i = Math.max(1, page - maxItems); i <= Math.min(nPages, page + maxItems); i++) {
-    pageLabels.push({page: i});
+    pageLabels.push({page: i, current: i === page + 1});
   }
   if (page !== nPages && nPages >= maxItems) {
     pageLabels.push({'icon': 'chevron_right', page: nPages});
diff --git a/src/style.css b/src/style.css
index 3abe299..3630f98 100644
--- a/src/style.css
+++ b/src/style.css
@@ -525,4 +525,8 @@ material-checkbox .checkbox.checked {
 
 pagination material-button {
   padding: 0.2em 0.75em;
+}
+
+pagination material-button.current {
+  border: 1px solid rgba(0, 0, 0, .12);
 }
\ No newline at end of file
diff --git a/src/tags/pagination.tag b/src/tags/pagination.tag
index 97c0a6d..7ac292d 100644
--- a/src/tags/pagination.tag
+++ b/src/tags/pagination.tag
@@ -18,7 +18,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
   <!-- Begin of tag -->
   <div class="conatianer">
     <div class="pagination-centered">
-      <material-button waves-color="rgba(158,158,158,.4)" each="{p in this.opts.pages}">
+      <material-button waves-color="rgba(158,158,158,.4)" each="{p in this.opts.pages}" class="{ current: p.current }">
         <i show="{ p.icon }" class="material-icons">{ p.icon }</i>
         <div hide="{ p.icon }">{ p.page }</div>
       </material-button>
diff --git a/src/tags/taglist.tag b/src/tags/taglist.tag
index 4208cc9..81d683d 100644
--- a/src/tags/taglist.tag
+++ b/src/tags/taglist.tag
@@ -30,8 +30,11 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
   <div hide="{ registryUI.taglist.loadend }" class="spinner-wrapper">
     <material-spinner></material-spinner>
   </div>
-  <pagination pages="{ registryUI.getPageLabels(this.page, registryUI.getNumPages(registryUI.taglist.tags))}"></pagination>
-  <material-card ref="taglist-tag" class="taglist" multi-delete={ this.multiDelete } tags={ registryUI.getPage(registryUI.taglist.tags, this.page) } show="{ registryUI.taglist.loadend }" >
+  <pagination pages="{ registryUI.getPageLabels(this.page, registryUI.getNumPages(registryUI.taglist.tags)) }"></pagination>
+  <material-card ref="taglist-tag" class="taglist"
+    multi-delete={ this.multiDelete }
+    tags={ registryUI.getPage(registryUI.taglist.tags, this.page) }
+    show="{ registryUI.taglist.loadend }">
     <table show="{ registryUI.taglist.loadend }" style="border: none;">
       <thead>
       <tr>
@@ -77,7 +80,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
       </tbody>
     </table>
   </material-card>
-  <pagination pages="{ registryUI.getPageLabels(this.page, registryUI.getNumPages(registryUI.taglist.tags))}"></pagination>
+  <pagination pages="{ registryUI.getPageLabels(this.page, registryUI.getNumPages(registryUI.taglist.tags)) }"></pagination>
   <script>
     var self = registryUI.taglist.instance = this;
     self.page = 0;