stub in details page

14 files changed, 322 insertions, 84 deletions

diff --git a/lib/bucky.js b/lib/bucky.js
index 9a43c0d..ad2018f 100644
--- a/lib/bucky.js
+++ b/lib/bucky.js
@@ -41,7 +41,6 @@ var bucky = module.exports = {
       keywords.forEach(function(k){
         lookup[k.get('keyword')] = k
       })
-      console.log(keywords)
       res.threads.forEach(function(t){
         var kw = t.get('keyword')
         if (! kw) return
@@ -49,7 +48,6 @@ var bucky = module.exports = {
         if (! k) return
         if (! t.get("color")) {
           t.set("color", k.get("color"))
-          console.log(k.get("color"))
         }
       })
       next()
@@ -71,13 +69,14 @@ var bucky = module.exports = {
   /* DETAILS */
   
   ensureThread: function (req, res, next){
-    db.getThread(req.param.id).then(function(thread){
+    var id = req.params.id.replace(/\D/g, "")
+    db.getThread(id).then(function(thread){
       if (thread) {
         res.thread = thread
         next()
       }
       else {
-        res.sendCode(404)
+        res.sendStatus(404)
       }
     })
   },
@@ -90,16 +89,31 @@ var bucky = module.exports = {
     })
   },
   ensureCommentsForThread: function (req, res, next){
-    db.getCommentsForThread(id).then(function(comments){
+    db.getCommentsForThread(res.thread.get('id')).then(function(comments){
       res.comments = comments
       next()
     })
   },
   ensureFilesForThread: function (req, res, next){
-    db.getCommentsForThread(id).then(function(files){
+    db.getFilesForThread(res.thread.get('id')).then(function(files){
       res.files = files
       next()
     })
   },
+  
+  /* KEYWORDS */
+
+  ensureThreadsForKeyword: function (req, res, next){
+    var keyword = req.params.keyword
+    if (! keyword) {
+      res.sendStatus(404)
+    }
+    db.getThreadsForKeyword(keyword).then(function(threads){
+      res.threads = threads
+      res.threads_ids = res.threads.pluck("id").sort()
+      res.keywords = _.uniq(res.threads.pluck("keyword"))
+      next()
+    })
+  },
 
 }
\ No newline at end of file
diff --git a/lib/db/index.js b/lib/db/index.js
index 899abcc..7452f3d 100644
--- a/lib/db/index.js
+++ b/lib/db/index.js
@@ -65,6 +65,14 @@ db.getLatestThreads = function () {
     qb.orderBy("id", "desc").limit(50)
   }).fetchAll()
 }
+db.getThreadsForKeyword = function (keyword) {
+  return Thread.query(function(qb){
+    qb.where("keyword", "=", keyword).orderBy("id", "desc")
+  }).fetchAll()
+}
+db.getThread = function (id) {
+  return Thread.query("where", "id", "=", id).fetch()
+}
 
 /* FILES */
 
@@ -82,7 +90,7 @@ db.getFileSizes = function(ids){
 
 db.getCommentsForThread = function (id, limit, offset){
   return Comment.query(function(qb){
-    qb.where("thread", "=", id).orderBy("id", "desc")
+    qb.where("thread", "=", id).orderBy("id", "asc")
     if (limit) {
       qb = qb.limit(limit)
     }
@@ -101,9 +109,13 @@ db.getCommentCounts = function(ids){
 }
 
 /* KEYWORDS */
+
 db.getKeywords = function (keywords){
   return Keyword.query("where", "keyword", "in", keywords).fetchAll()
 }
+db.getKeyword = function (keyword) {
+  return Keyword.query("where", "keyword", "=", keyword).fetch()
+}
 
 
 /* PRIVATE MESSAGES */
@@ -114,4 +126,4 @@ db.getMessage = function (id){
     message.set("body", message.get("body").toString() )
     return message
   })
-}
\ No newline at end of file
+}
diff --git a/lib/index.js b/lib/index.js
index c1ded7e..ad97526 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -14,12 +14,6 @@ var sessionstore = require('sessionstore')
 var session = require('express-session')
 var multer = require('multer')
 
-var db = require('./db')
-var auth = require('./auth')
-var middleware = require('./middleware')
-var fortune = require('./fortune')
-var bucky = require('./bucky')
-
 var app, server
 
 var mongodb = require('mongodb')
@@ -56,72 +50,11 @@ site.init = function(){
 	app.use(passport.initialize())
 	app.use(passport.session())
 
-	app.all('*', middleware.ensureLocals)
-	
   server = http.createServer(app).listen(5000, function () {
     console.log('Bucky listening at http://5.k:%s', server.address().port)
   })
 
-  site.route()
+  site.route(app)
 }
 
-site.route = function(){
-  auth.init()
-
-  app.get("/", middleware.ensureAuthenticated, function(req, res){
-    res.redirect('/index')
-  })
-  app.get("/login", function(req, res){
-    res.render("pages/login", {
-      title: "login"
-    })
-  })
-  app.get("/index", middleware.ensureAuthenticated, function(req, res){
-    res.render("pages/index", {
-      title: fortune("titles"),
-      hoot_text: fortune("hoots"),
-    })
-  })
-  app.post("/api/login", auth.loggedInLocal)
-  app.get("/api/index",
-    bucky.ensureLatestThreads,
-    bucky.ensureCommentCountsForThreads,
-    bucky.ensureFileCountsForThreads,
-    bucky.ensureKeywordsForThreads,
-    bucky.ensureHootbox,
-    bucky.ensureLastlog,
-    function(req, res){
-      res.json({
-        threads: res.threads,
-        hootbox: res.hootbox,
-        lastlog: res.lastlog,
-      })
-    }
-  )
-  app.get("/api/thread/:id", function(req, res){
-    bucky.ensureThread,
-    bucky.ensureKeywordForThread,
-    bucky.ensureCommentsForThread,
-    bucky.ensureFilesForThread,
-    function(req, res){
-      res.json({
-        thread: res.thread,
-        comments: res.comments,
-        files: res.files,
-        keyword: res.keyword,
-      })
-    }
-  })
-  app.post("/api/thread/:id", function(req, res){
-  })
-  app.post("/api/thread/:id/comment", function(req, res){
-  })
-  app.delete("/api/thread/:id", function(req, res){
-  })
-
-  app.put("/api/comment/:id", function(req, res){
-  })
-  app.delete("/api/thread/:id", function(req, res){
-  })
-  
-}
+site.route = require('./router')
diff --git a/lib/router.js b/lib/router.js
new file mode 100644
index 0000000..d8e75c0
--- /dev/null
+++ b/lib/router.js
@@ -0,0 +1,83 @@
+var auth = require('./auth')
+var middleware = require('./middleware')
+var fortune = require('./fortune')
+var bucky = require('./bucky')
+
+module.exports = function(app){
+	app.all('*', middleware.ensureLocals)
+	
+  auth.init()
+
+  app.get("/", middleware.ensureAuthenticated, function(req, res){
+    res.redirect('/index')
+  })
+  app.get("/login", function(req, res){
+    res.render("pages/login", {
+      title: "login"
+    })
+  })
+  app.get("/index", middleware.ensureAuthenticated, function(req, res){
+    res.render("pages/index", {
+      title: fortune("titles"),
+      hoot_text: fortune("hoots"),
+    })
+  })
+  app.get("/details/:id", middleware.ensureAuthenticated, function(req, res){
+    res.render("pages/details", {})
+  })
+  
+  app.post("/api/login", auth.loggedInLocal)
+  app.get("/api/index",
+    bucky.ensureLatestThreads,
+    bucky.ensureCommentCountsForThreads,
+    bucky.ensureFileCountsForThreads,
+    bucky.ensureKeywordsForThreads,
+    bucky.ensureHootbox,
+    bucky.ensureLastlog,
+    function(req, res){
+      res.json({
+        threads: res.threads,
+        hootbox: res.hootbox,
+        lastlog: res.lastlog,
+      })
+    }
+  )
+  app.get("/api/thread/:id",
+    bucky.ensureThread,
+    bucky.ensureKeywordForThread,
+    bucky.ensureCommentsForThread,
+    bucky.ensureFilesForThread,
+    function(req, res){
+      res.json({
+        thread: res.thread,
+        comments: res.comments,
+        files: res.files,
+        keyword: res.keyword,
+      })
+    }
+  )
+  app.post("/api/thread/:id", function(req, res){
+  })
+  app.post("/api/thread/:id/comment", function(req, res){
+  })
+  app.delete("/api/thread/:id", function(req, res){
+  })
+
+  app.get("/api/keyword/:keyword",
+    bucky.ensureThreadsForKeyword,
+    bucky.ensureCommentCountsForThreads,
+    bucky.ensureFileCountsForThreads,
+    bucky.ensureKeywordsForThreads,
+    function(req, res){
+      res.json({
+        threads: res.threads,
+      })
+    }
+  )
+  
+  app.put("/api/comment/:id", function(req, res){
+  })
+  app.delete("/api/comment/:id", function(req, res){
+  })
+  
+}
diff --git a/public/assets/css/bucky.css b/public/assets/css/bucky.css
index f3e60a9..9f19341 100644
--- a/public/assets/css/bucky.css
+++ b/public/assets/css/bucky.css
@@ -6,7 +6,7 @@ body {
 	color: #111111;
 	font-size: 10px;
 	font-family: Trebuchet MS, Helvetica, Arial, sans-serif;
-	margin: 20px;
+	padding: 20px 30px;
 }
 small {
 	font-size: 10px;
diff --git a/public/assets/js/lib/router.js b/public/assets/js/lib/router.js
index 5bc05c3..d5b9652 100644
--- a/public/assets/js/lib/router.js
+++ b/public/assets/js/lib/router.js
@@ -8,7 +8,7 @@ var SiteRouter = Router.extend({
 		"/":            'login',
 		"/index":       'index',
 		"/login":       'login',
-		"/details/:id": 'room',
+		"/details/:id": 'details',
 	},
 	
 	initialize: function(){
@@ -22,5 +22,10 @@ var SiteRouter = Router.extend({
   login: function(){
     app.view = new LoginView ()
   },
+  
+  details: function(id){
+    app.view = new DetailsView ()
+    app.view.load(id)
+  }
 
 })
\ No newline at end of file
diff --git a/public/assets/js/lib/views/details/comments.js b/public/assets/js/lib/views/details/comments.js
new file mode 100644
index 0000000..164a3b1
--- /dev/null
+++ b/public/assets/js/lib/views/details/comments.js
@@ -0,0 +1,39 @@
+var CommentsView = FormView.extend({
+  
+  el: "#comments",
+  
+  events: {
+  },
+  
+  initialize: function(){
+    this.__super__.initialize.call(this)
+    this.template = this.$(".template").html()
+  },
+  
+  load: function(comments){
+    comments.forEach(this.appendComment.bind(this))
+  },
+  
+  parse: function(comment){
+    var datetime = verbose_date(comment.date)
+    var t = this.template.replace(/{{username}}/g, comment.username)
+                         .replace(/{{comment}}/g, comment.comment)
+                         .replace(/{{date}}/g, datetime[0])
+                         .replace(/{{time}}/g, datetime[1])
+    return t
+  },
+  
+  prependComment: function(comment){
+    var $el = $( this.parse(comment) )
+    this.$el.prepend($el)
+  },
+
+  appendComment: function(comment){
+    var $el = $( this.parse(comment) )
+    this.$el.append($el)
+  },
+  
+  success: function(){
+    this.prependComment(comment)
+  }
+})
\ No newline at end of file
diff --git a/public/assets/js/lib/views/details/files.js b/public/assets/js/lib/views/details/files.js
new file mode 100644
index 0000000..5a19519
--- /dev/null
+++ b/public/assets/js/lib/views/details/files.js
@@ -0,0 +1,59 @@
+var FilesView = FormView.extend({
+  
+  el: "#files",
+  
+  events: {
+  },
+  
+  initialize: function(){
+    this.__super__.initialize.call(this)
+    this.template = this.$(".template").html()
+    this.templateTotal = this.$(".templateTotal").html()
+  },
+  
+  load: function(files){
+    if (! files.length) {
+      this.$el.hide()
+    }
+    var total = 0
+    files.forEach(function(file){
+      this.appendFile(file)
+      total += file.size
+    }.bind(this))
+    
+    var size = hush_size(total)
+    var t = this.templateTotal.replace(/{{size_class}}/g, size[0])
+                              .replace(/{{size}}/g, size[1])
+    this.$el.append(t)
+  },
+  
+  parse: function(file){
+    var size = hush_size(file.size)
+    var datetime = verbose_date(file.date)
+    var date_class = carbon_date(file.date)
+
+    var t = this.template.replace(/{{username}}/g, file.username)
+                         .replace(/{{link}}/g, file.filename)
+                         .replace(/{{filename}}/g, file.filename)
+                         .replace(/{{date_class}}/g, date_class)
+                         .replace(/{{date}}/g, datetime[0])
+                         .replace(/{{time}}/g, datetime[1])
+                         .replace(/{{size_class}}/g, size[0])
+                         .replace(/{{size}}/g, size[1])
+    return t
+  },
+  
+  prependFile: function(file){
+    var $el = $( this.parse(file) )
+    this.$el.prepend($el)
+  },
+
+  appendFile: function(file){
+    var $el = $( this.parse(file) )
+    this.$el.append($el)
+  },
+  
+  success: function(){
+    this.prependFile(file)
+  }
+})
\ No newline at end of file
diff --git a/public/assets/js/lib/views/details/index.js b/public/assets/js/lib/views/details/index.js
new file mode 100644
index 0000000..e2adb55
--- /dev/null
+++ b/public/assets/js/lib/views/details/index.js
@@ -0,0 +1,28 @@
+var DetailsView = View.extend({
+
+  events: {
+  },
+  
+  action: "/api/thread/",
+  
+  initialize: function(opt){
+    this.comments = new CommentsView ({ parent: this })
+    this.files = new FilesView ({ parent: this })
+  },
+  
+  load: function(id){
+    id = id.replace(/\D/g, "")
+    $.get(this.action + id, this.populate.bind(this))
+  },
+  
+  populate: function(data){
+    $("h1").html(data.thread.title)
+    this.comments.load(data.comments)
+    this.files.load(data.files)
+  },
+  
+  success: function(){
+    window.location.href = "/index"
+  },
+
+})
diff --git a/public/assets/js/lib/views/index/threadbox.js b/public/assets/js/lib/views/index/threadbox.js
index 2e7d211..9f12411 100644
--- a/public/assets/js/lib/views/index/threadbox.js
+++ b/public/assets/js/lib/views/index/threadbox.js
@@ -27,14 +27,16 @@ var ThreadBox = View.extend({
     var comments = hush_null(thread.comment_count, "c")
     var files = hush_null(thread.file_count, "f")
     var dot = privacy_dot(thread.private)
+    var datetime = verbose_date(thread.lastmodified)
 
     var t = this.template
                 .replace(/{{id}}/g, thread.id)
                 .replace(/{{username}}/g, thread.username)
                 .replace(/{{privacy_dot}}/g, dot)
                 .replace(/{{title}}/g, thread.title)
-                .replace(/{{age}}/g, verbose_date(thread.lastmodified) )
-                .replace(/{{age_class}}/g, carbon_date(thread.lastmodified) )
+                .replace(/{{date}}/g, datetime[0])
+                .replace(/{{time}}/g, datetime[1])
+                .replace(/{{date_class}}/g, carbon_date(thread.lastmodified) )
                 .replace(/{{views}}/g, views[1])
                 .replace(/{{comments}}/g, comments[1])
                 .replace(/{{files}}/g, files[1])
diff --git a/public/assets/js/util/format.js b/public/assets/js/util/format.js
index d034c26..de8fd65 100644
--- a/public/assets/js/util/format.js
+++ b/public/assets/js/util/format.js
@@ -51,7 +51,7 @@ function verbose_date (date) {
   var date = d + '‑' + short_months[date.getMonth()] + '‑' + date.getFullYear()
   var time = h + ':' + m + meridian
   
-  return date + " <small>" + time + "</small>"
+  return [date, time]
 }
 function carbon_date (date, no_bold) {
   var span = (+new Date() / 1000 - date)
diff --git a/views/pages/details.ejs b/views/pages/details.ejs
new file mode 100644
index 0000000..ea3333c
--- /dev/null
+++ b/views/pages/details.ejs
@@ -0,0 +1,59 @@
+<% include ../partials/header %>
+
+<hr>
+
+<div id="details">
+  <table id="comments">
+    <script class="template" type="text/html">
+      <tr>
+        <td>
+          <a href="/profile/{{username}}"><img src="//www.carbonpictures.com/bucky/data/profile/.thumb/am.{{username}}.jpg"></a>
+          <a href="/profile/{{username}}">{{username}}</a>
+        <td colspan="2">
+          {{comment}}
+          <br><br>
+          <span class="date">
+            {{date}} {{time}}
+          </span>
+          <span class="edit-links">
+            <a href="/comment/{{id}}/edit">edit</a> &middot;
+            <a href="/comment/{{id}}/remove">remove</a> &middot;
+            <a href="/comment/{{id}}/reply">reply</a>
+          </span>
+        </td>
+      </tr>
+    </script>
+  </table>
+
+  <table id="files">
+    <script class="template" type="text/html">
+      <tr>
+        <td>
+          <a href="{{link}}">{{filename}}</a>
+        </td>
+        <td class="{{date_class}}">
+          {{date}}
+        </td>
+        <td class="{{date_class}}">
+          {{time}}
+        </td>
+        <td>
+          {{size}}
+        </td>
+        <td>
+          <a href="/profile/{{username}}">{{username}}</a>
+        </td>
+      </tr>
+    </script>
+    <script class="templateTotal" type="text/html">
+      <tr>
+        <td colspan="5">
+          total size: <span class="{{size_class}}">{{size}}</span>
+        </td>
+      </tr>
+    </script>
+  </table>
+</div>
+
+
+<% include ../partials/footer %>
diff --git a/views/pages/index.ejs b/views/pages/index.ejs
index 070d1ff..ceafe74 100644
--- a/views/pages/index.ejs
+++ b/views/pages/index.ejs
@@ -42,8 +42,8 @@
         <td class="{{color}}">
           <a href="/details/{{id}}">{{title}}</a>
         </td>
-        <td class="{{age_class}}">
-          {{age}}
+        <td class="{{date_class}}">
+          {{date}} <small>{{time}}</small>
         </td>
         <td class="{{views_class}}">
           {{views}}
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index 8a2e33a..d02ca8d 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -19,6 +19,10 @@
 <script src="/assets/js/lib/views/index/hootbox.js"></script>
 <script src="/assets/js/lib/views/index/threadbox.js"></script>
 
+<script src="/assets/js/lib/views/details/index.js"></script>
+<script src="/assets/js/lib/views/details/comments.js"></script>
+<script src="/assets/js/lib/views/details/files.js"></script>
+
 <script src="/assets/js/index.js"></script>
 
 <!--