Enhance back button for each post to redirect to the last known page

kelyvin · May 2, 2016 · 6c75375 · 6c75375
1 parent 408b6e2
commit 6c75375
Show file tree

Hide file tree

Showing 7 changed files with 45 additions and 6 deletions.
diff --git a/assets/css/caffeine-theme.css b/assets/css/caffeine-theme.css
diff --git a/assets/js/caffeine-theme.js b/assets/js/caffeine-theme.js
diff --git a/assets/js/src/__init.js b/assets/js/src/__init.js
@@ -34,6 +34,17 @@ $(function() {
             }
 
         },
+        redirect: function (pageNum) {
+            var redirectUrl = "";
+
+            if (pageNum > 1) {
+                redirectUrl += "/page/" + pageNum + "/#open";
+            } else {
+                redirectUrl += "/#open";
+            }
+
+            window.location.href = redirectUrl;
+        },
         isOpen: function () {
             return location.hash === openHash;
         },
@@ -46,6 +57,18 @@ $(function() {
         close: function() {
              window.history.replaceState(null, null, "#");
         },
+        getLastPageNum: function() {
+            var pageNum = window.store.get("pageNum") || "";
+
+            return pageNum;
+        },
+        setLastPageNum: function() {
+            var pageNum = $("#pageNum").text() || "";
+
+            if (pageNum.length > 0) {
+                window.store.set("pageNum", pageNum);
+            }
+        },
         readTime: function() {
             var DateInDays;
             DateInDays = function(selector) {

diff --git a/assets/js/src/main.js b/assets/js/src/main.js
@@ -45,17 +45,30 @@ $(function() {
         $(".subscribe-button").removeClass("hide");
     }
 
+    // "Home" page setup
     if (CaffeineTheme.is("page", "home")) {
         if (!CaffeineTheme.isOpen()) {
             CaffeineTheme.hideIndexPage();
         }
     }
 
+    // "Post" page setup
     if (CaffeineTheme.is("page", "post")) {
         $("main").readingTime({
             readingTimeTarget: ".reading-time > span"
         });
         $(".content").fitVids();
+
+        $("#back-button").on("click", function (event) {
+            var lastPageNum = CaffeineTheme.getLastPageNum();
+            event.preventDefault();
+
+            if (lastPageNum.length > 0) {
+                CaffeineTheme.redirect(lastPageNum);
+            } else {
+                window.history.back();
+            }
+        });
     }
 
     // Sets up masonry effects
@@ -79,7 +92,7 @@ $(function() {
     }
 
     //  Check if local store is enabled. This is required.
-    if (!store.enabled) {
+    if (!window.store.enabled) {
         return;
     }
 
@@ -106,5 +119,7 @@ $(function() {
         } else {
             $posts.css("visibility", "visible");
         }
+
+        CaffeineTheme.setLastPageNum();
     });
 });
diff --git a/assets/scss/components/_pagination.scss b/assets/scss/components/_pagination.scss
@@ -37,5 +37,6 @@
         margin-left: 16px;
         font-size: 12px;
         color: $gray-dark;
+        display: inline;
     }
 }
diff --git a/partials/pagination.hbs b/partials/pagination.hbs
@@ -2,7 +2,7 @@
     {{#if prev}}
     <a rel="next" class="newer btn small hvr-grow" href="{{page_url prev}}#open"><i class="fa fa-arrow-left"></i> Newer Posts</a>
     {{/if}}
-    <span class="index">Page {{page}} of {{pages}}</span>
+    <div class="index">Page <span id="pageNum">{{page}}</span> of {{pages}}</div>
     {{#if next}}
     <a rel="prev" class="older btn small hvr-grow" href="{{page_url next}}#open">Older Posts <i class="fa fa-arrow-right"></i></a>
     {{/if}}

diff --git a/post.hbs b/post.hbs
@@ -5,7 +5,7 @@
   <article class="{{post_class}}">
     {{> material-cover}}
     <div class="post-card animated fade-in">
-        <a href="javascript:window.history.back()" title="Go back" class="hvr-grow">
+        <a id="back-button" href="#open" title="Go back" class="hvr-grow">
             <div class="back-button">
                 <i class="fa fa-arrow-left"></i>
             </div>