next page link on mailbox pages

7 files changed, 45 insertions, 22 deletions

diff --git a/bucky/app/api.js b/bucky/app/api.js
index f0474a4..a8149d0 100644
--- a/bucky/app/api.js
+++ b/bucky/app/api.js
@@ -248,6 +248,7 @@ function route (app){
         user: { id: req.user.get("id"), username: req.user.get("username") },
         messages: res.messages,
         boxes: res.boxes,
+        query: res.query,
       })
     })
   app.get("/api/message/:id",
diff --git a/bucky/app/bucky.js b/bucky/app/bucky.js
index 47eb7e1..b331688 100644
--- a/bucky/app/bucky.js
+++ b/bucky/app/bucky.js
@@ -592,8 +592,11 @@ var bucky = module.exports = {
     })
   },
   ensureMessages: function (req, res, next){
-    db.getMessages(req.user.get('username'), req.params.box, 50, 0).then(function(messages){
+    const limit = parseInt(req.query.limit) || 50
+    const offset = parseInt(req.query.offset) || 0
+    db.getMessages(req.user.get('username'), req.params.box, limit, offset).then(function(messages){
       res.messages = messages
+      res.query = { limit, offset }
       next()
     })
   },
diff --git a/public/assets/css/bucky.css b/public/assets/css/bucky.css
index e0c5be0..c768f86 100644
--- a/public/assets/css/bucky.css
+++ b/public/assets/css/bucky.css
@@ -807,7 +807,7 @@ pre br {
   padding: 5px;
   margin: 10px 0;
 }
-#search .next_page {
+.next_page {
   font-size: 14px;
   display: block;
   padding: 10px;
@@ -847,6 +847,9 @@ pre br {
   color: #211;
 }
 
+#no_messages {
+	display: none;
+}
 #messages {
   width: 100%;
 }
diff --git a/public/assets/js/lib/views/mail/mailbox.js b/public/assets/js/lib/views/mail/mailbox.js
index 5635a7d..9d988cb 100644
--- a/public/assets/js/lib/views/mail/mailbox.js
+++ b/public/assets/js/lib/views/mail/mailbox.js
@@ -16,7 +16,8 @@ var MailboxView = View.extend({
   load: function(name){
     name = sanitize(name) || "inbox"
     $("h1").html(name)
-    $.get(this.action + name, this.populate.bind(this))
+    var query = window.location.search.substr(1)
+    $.get(this.action + name, query, this.populate.bind(this))
   },
 
   populate: function(data){
@@ -26,7 +27,19 @@ var MailboxView = View.extend({
       var user = data.user
       var max = data.messages.length-1
       if (data.messages.length) {
-        $("#no_messages").hide()
+        var limit = data.query.limit || 50
+        var offset = data.query.offset + data.messages.length
+        if (limit > data.messages.length) {
+          $(".next_page").hide()
+        }
+        else {
+          var query = { limit, offset }
+          $(".next_page a").attr("href", "?" + querystring(query))
+        }
+      }
+      else {
+        $("#no_messages").show()
+        $(".next_page").hide()
       }
       data.messages.forEach(function(message, i){
         var $row = this.parse(message, user)
diff --git a/public/assets/js/lib/views/search/results.js b/public/assets/js/lib/views/search/results.js
index 0af68ba..0f34845 100644
--- a/public/assets/js/lib/views/search/results.js
+++ b/public/assets/js/lib/views/search/results.js
@@ -2,15 +2,15 @@ var SearchResults = View.extend({
 
   el: "#search",
   template: $("#search .template").html(),
-  
+
   events: {
   },
-  
+
   action: "/api/search",
-  
+
   initialize: function(opt){
   },
-  
+
   load: function(){
     var query = window.location.search.substr(1)
     if (! query || ! query.length) {
@@ -19,7 +19,7 @@ var SearchResults = View.extend({
     }
     $.get(this.action, query, this.populate.bind(this))
   },
-  
+
   populate: function(res){
     var query = sanitize(res.meta.query)
     var terms = res.meta.terms
@@ -63,16 +63,3 @@ var SearchResults = View.extend({
   },
 
 })
-
-function bold_terms (s, terms) {
-  s = sanitize(s)
-  terms.forEach( (term) => {
-    s = s.replace(new RegExp(term, "ig"), "<b>" + term + "</b>")
-  })
-  return s
-}
-function querystring(opt){
-  return '?' + Object.keys(opt).map((key) => {
-    return encodeURIComponent(key) + "=" + encodeURIComponent(opt[key])
-  }).join("&")
-}
diff --git a/public/assets/js/util/format.js b/public/assets/js/util/format.js
index c765052..7032305 100644
--- a/public/assets/js/util/format.js
+++ b/public/assets/js/util/format.js
@@ -10,6 +10,18 @@ function choice(a){ return a[randint(a.length)] }
 function csrf() {
   return $("[name=_csrf]").attr("value")
 }
+function bold_terms (s, terms) {
+  s = sanitize(s)
+  terms.forEach( (term) => {
+    s = s.replace(new RegExp(term, "ig"), "<b>" + term + "</b>")
+  })
+  return s
+}
+function querystring(opt){
+  return '?' + Object.keys(opt).map((key) => {
+    return encodeURIComponent(key) + "=" + encodeURIComponent(opt[key])
+  }).join("&")
+}
 function commatize (n, radix) {
   radix = radix || 1024
   var nums = [], i, counter = 0, r = Math.floor
diff --git a/views/pages/mailbox.ejs b/views/pages/mailbox.ejs
index a0304d7..756cb21 100644
--- a/views/pages/mailbox.ejs
+++ b/views/pages/mailbox.ejs
@@ -38,6 +38,10 @@
     </script>
   </table>
 
+  <div class="next_page">
+    <a>Next page &rarr;</a>
+  </div>
+
 </div>
 
 <div id="sidebar">