header

11 files changed, 166 insertions, 18 deletions

diff --git a/lib/bucky.js b/lib/bucky.js
index 2488c31..ef6fbbc 100644
--- a/lib/bucky.js
+++ b/lib/bucky.js
@@ -39,7 +39,13 @@ var bucky = module.exports = {
       next()
     })
   },
-    
+  ensureLastlog: function (req, res, next){
+    db.getLastlog(6).then(function(lastlog){
+      res.lastlog = lastlog
+      next()
+    })
+  },
+      
   /* DETAILS */
   
   ensureThread: function (req, res, next){
diff --git a/lib/db/index.js b/lib/db/index.js
index 994187e..e7ad632 100644
--- a/lib/db/index.js
+++ b/lib/db/index.js
@@ -53,6 +53,10 @@ db.getUserByUsername = function(username) {
   var model = new User({'username': username})
   return model.fetch()
 }
+db.getLastlog = function(limit){
+  return knex.column('username').column('lastseen').select().from('users').orderBy('lastseen', 'desc').limit(limit || 10)
+}
+
 
 /* THREADS */
 
diff --git a/lib/index.js b/lib/index.js
index e84c32a..ace34af 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -89,10 +89,12 @@ site.route = function(){
     bucky.ensureFileCountsForThreads,
 //    bucky.ensureFileSizeForThreads,
     bucky.ensureHootbox,
+    bucky.ensureLastlog,
     function(req, res){
       res.json({
         threads: res.threads,
         hootbox: res.hootbox,
+        lastlog: res.lastlog,
       })
     }
   )
diff --git a/lib/middleware.js b/lib/middleware.js
index b38cec3..a744c89 100644
--- a/lib/middleware.js
+++ b/lib/middleware.js
@@ -11,6 +11,12 @@ var middleware = module.exports = {
 	ensureLocals: function (req, res, next) {
 		res.locals.csrfToken = req.csrfToken()
 		res.locals.title = "bucky"
+		if (req.isAuthenticated()) {
+      res.locals.show_header = true
+		}
+		else {
+      res.locals.show_header = false
+		}
 		next()
 	},
 	
diff --git a/public/assets/css/bucky.css b/public/assets/css/bucky.css
index 5dc41cf..d404fe8 100644
--- a/public/assets/css/bucky.css
+++ b/public/assets/css/bucky.css
@@ -35,13 +35,6 @@ button {
 .hidden {
   visibility: hidden;
 }
-
-
-.head a:link    { color: #000;}
-.head a:visited { color: #000;}
-.head a:active  { color: #000;}
-.head a:hover   { color: #558;}
-
 h1 {
   font-size: 30px;
   font-weight: bold;
@@ -66,6 +59,10 @@ hr {
   border-color: #000;
 }
 
+.lastlog {
+  float: right;
+}
+
 #sidebar, #content {
   float: left;
 }
@@ -97,15 +94,11 @@ hr {
 #hootbox button {
   width: 44px;
 }
-#hoots {
+#hoots, #hoots tr {
   margin: 0;
   padding: 0;
   border-spacing: 0;
 }
-#hoots tr {
-  margin: 0;
-  padding: 0;
-}
 #hoots td {
   margin: 0;
   padding: 0;
@@ -125,15 +118,94 @@ hr {
 #hoots tr:nth-child(odd) td:nth-child(2) { background-color: #f3f1f2; }
 #hoots tr:nth-child(even) td:nth-child(2) { background-color: #e3e8e3; }
 
+.threads, .threads tr {
+  margin: 0; padding: 0;
+  border-spacing: 0;
+}
 .threads td {
   text-align: right;
+  padding-left: 4px;
+  padding-right: 4px;
+}
+.threads td:nth-child(1) a {
+  margin-left: 10px;
+}
+.threads td:nth-child(1) a {
+  color: #444;
+  text-decoration: none;
 }
 .threads td:nth-child(2) {
   text-align: left;
   font-family: Georgia, serif;
   font-size: 120%;
+  padding: 2px 4px;
+  border-left: 1px solid #b6aeab; border-right: 1px solid #b6aeab;
+}
+.threads td:nth-child(3) {
+  padding-left: 10px;
 }
-.threads tr:nth-child(odd) td:nth-child(2) {
+.threads tr:first-child td:nth-child(2) {
+  border-top: 1px solid #b6aeab;
 }
-.threads tr:nth-child(even) td:nth-child(2) {
-}
\ No newline at end of file
+.threads tr:last-child td:nth-child(2) {
+  border-bottom: 1px solid #b6aeab;
+}
+tr:nth-child(odd) td.row	{ background-color: #e6f0f0; }
+tr:nth-child(odd) td.row:hover	{ background-color: #d8e0ec; color: #000000; }
+tr:nth-child(even) td.row { background-color: #e0e8e8; }
+tr:nth-child(even) td.row:hover	{ background-color: #d8e0ec; color: #000000; }
+
+tr:nth-child(odd) td.plain{ background-color: #d0dBe8; border-bottom: 1px solid #d3d3d0; }
+tr:nth-child(odd) td.plain:hover	{ background-color: #d7e4f0; color: #000000; border-bottom: 1px solid #d3d3d0; }
+tr:nth-child(even) td.plain { background-color: #edf8f6; border-bottom: 1px solid #d3d3d0; }
+tr:nth-child(even) td.plain:hover	{ background-color: #f3fafa; color: #000000; border-bottom: 1px solid #ded2dd; }
+
+tr:nth-child(odd) td.ivory{ background-color: #e0e0d8; border-bottom: 1px solid #d3d3d0; }
+tr:nth-child(odd) td.ivory:hover	{ background-color: #f8f0e9; color: #000000; border-bottom: 1px solid #d3d3d0; }
+tr:nth-child(even) td.ivory { background-color: #f0f0ea; border-bottom: 1px solid #d3d3d0; }
+tr:nth-child(even) td.ivory:hover	{ background-color: #f8f0e9; color: #000000; border-bottom: 1px solid #d3d3d0; }
+
+tr:nth-child(odd) td.tan	{ background-color: #e1e1bf; border-bottom: 1px solid #ced2cd; }
+tr:nth-child(odd) td.tan:hover	{ background-color: #f7f6ed; color: #000000; border-bottom: 1px solid #ced2cd; }
+tr:nth-child(even) td.tan { background-color: #f0eddf; border-bottom: 1px solid #ced2cd; }
+tr:nth-child(even) td.tan:hover	{ background-color: #f7f6ed; color: #000000; border-bottom: 1px solid #ced2cd; }
+
+tr:nth-child(odd) td.red	{ background-color: #fcc7c2; border-bottom: 1px solid #E8B1AC; }
+tr:nth-child(odd) td.red:hover	{ background-color: #FFACB2; color: #000000; border-bottom: 1px solid #E8B1AC; }
+tr:nth-child(even) td.red { background-color: #fde1df; border-bottom: 1px solid #E8B1AC; }
+tr:nth-child(even) td.red:hover	{ background-color: #FFACB2; color: #000000; border-bottom: 1px solid #E8B1AC; }
+
+tr:nth-child(odd) td.orange     { background-color: #F8E0C6; border-bottom: 1px solid #F5D1AA; }
+tr:nth-child(odd) td.orange:hover{ background-color: #FFD799; color: #000000; border-bottom: 1px solid #F5D1AA; }
+tr:nth-child(even) td.orange     { background-color: #FBEEE1; border-bottom: 1px solid #F5D1AA; }
+tr:nth-child(even) td.orange:hover{ background-color: #FFD799; color: #000000; border-bottom: 1px solid #F5D1AA; }
+
+tr:nth-child(odd) td.yellow     { background-color: #FAFDC2; border-bottom: 1px solid #CED3D2; }
+tr:nth-child(odd) td.yellow:hover{ background-color: #FFF7A8; color: #000000; border-bottom: 1px solid #CED3D2; }
+tr:nth-child(even) td.yellow     { background-color: #FDFEDF; border-bottom: 1px solid #CED3D2; }
+tr:nth-child(even) td.yellow:hover{ background-color: #FFF7A8; color: #000000; border-bottom: 1px solid #CED3D2; }
+
+tr:nth-child(odd) td.green      { background-color: #E6FFCC; border-bottom: 1px solid #AFD8AB; }
+tr:nth-child(odd) td.green:hover { background-color: #d8F4b4; color: #000000; border-bottom: 1px solid #AFD8AB; }
+tr:nth-child(even) td.green      { background-color: #F0FFE2; border-bottom: 1px solid #AFD8AB; }
+tr:nth-child(even) td.green:hover { background-color: #d4eeb0; color: #000000; border-bottom: 1px solid #AFD8AB; }
+
+tr:nth-child(odd) td.blue       { background-color: #ddE2FF; border-bottom: 1px solid #c9c9F5; }
+tr:nth-child(odd) td.blue:hover  { background-color: #cac8fe; color: #000000; border-bottom: 1px solid #c9c9F5; }
+tr:nth-child(even) td.blue       { background-color: #ebefff; border-bottom: 1px solid #c9c9F5; }
+tr:nth-child(even) td.blue:hover  { background-color: #cac8fe; color: #000000; border-bottom: 1px solid #c9c9F5; }
+
+tr:nth-child(odd) td.purple     { background-color: #E0CBF4; border-bottom: 1px solid #D6A9EA; }
+tr:nth-child(odd) td.purple:hover{ background-color: #DDB1FF; color: #000000; border-bottom: 1px solid #D6A9EA; }
+tr:nth-child(even) td.purple     { background-color: #EFE4F9; border-bottom: 1px solid #D6A9EA; }
+tr:nth-child(even) td.purple:hover{ background-color: #DDB1FF; color: #000000; border-bottom: 1px solid #D6A9EA; }
+
+tr:nth-child(odd) td.pink       { background-color: #F1CDE4; border-bottom: 1px solid #E8ABD2; }
+tr:nth-child(odd) td.pink:hover  { background-color: #FFAECD; color: #000000; border-bottom: 1px solid #E8ABD2; }
+tr:nth-child(even) td.pink       { background-color: #F8E5F1; border-bottom: 1px solid #E8ABD2; }
+tr:nth-child(even) td.pink:hover  { background-color: #FFAECD; color: #000000; border-bottom: 1px solid #E8ABD2; }
+
+tr:nth-child(odd) td.black       { background-color: #ccc; border-bottom: 1px solid #aaa; }
+tr:nth-child(odd) td.black:hover  { background-color: #f8f8f8; color: #000000; border-bottom: 1px solid #aaa; }
+tr:nth-child(even) td.black       { background-color: #eee; border-bottom: 1px solid #aaa; }
+tr:nth-child(even) td.black:hover  { background-color: #f8f8f8; color: #000000; border-bottom: 1px solid #aaa; }
diff --git a/public/assets/js/lib/views/index/index.js b/public/assets/js/lib/views/index/index.js
index 473df38..3d4dc72 100644
--- a/public/assets/js/lib/views/index/index.js
+++ b/public/assets/js/lib/views/index/index.js
@@ -9,6 +9,7 @@ var IndexView = View.extend({
     // opt.parent = parent
     this.hootbox = new HootBox ({ parent: this })
     this.threadbox = new ThreadBox ({ parent: this })
+    this.lastlog = new LastLog ({ parent: this })
     this.load()
   },
   
@@ -19,6 +20,7 @@ var IndexView = View.extend({
   populate: function(data){
     this.hootbox.load(data.hootbox)
     this.threadbox.load(data.threads)
+    this.lastlog.load(data.lastlog)
   },
   
   success: function(){
diff --git a/public/assets/js/lib/views/index/lastlog.js b/public/assets/js/lib/views/index/lastlog.js
new file mode 100644
index 0000000..2f7b224
--- /dev/null
+++ b/public/assets/js/lib/views/index/lastlog.js
@@ -0,0 +1,34 @@
+/*
+age_class
+views_class
+comments_class
+size_class
+files_class
+*/
+
+var LastLog = View.extend({
+  el: ".lastlog",
+  
+  events: {
+  },
+  
+  initialize: function(){
+    this.__super__.initialize.call(this)
+    this.template = this.$(".template").html()
+  },
+  
+  load: function(lastlog){
+    var s = lastlog.map(this.parse.bind(this)).join(', ')
+    this.$el.html(s)
+  },
+  
+  parse: function(user){
+    var t = this.template
+                .replace(/{{username}}/g, user.username)
+                .replace(/{{age}}/g, get_age(user.lastseen) )
+                .replace(/{{age_class}}/g, carbon_date(user.lastseen) )
+                .trim()
+    return t
+  },
+  
+})
diff --git a/public/assets/js/lib/views/index/threadbox.js b/public/assets/js/lib/views/index/threadbox.js
index 3137c7c..069f85d 100644
--- a/public/assets/js/lib/views/index/threadbox.js
+++ b/public/assets/js/lib/views/index/threadbox.js
@@ -44,6 +44,7 @@ var ThreadBox = View.extend({
                 .replace(/{{files_class}}/g, files[0])
                 .replace(/{{show_files}}/g, thread.file_count == 0 ? "hidden" : "")
                 .replace(/{{size_class}}/g, size[0] )
+                .replace(/{{color}}/g, thread.color || "plain" )
     return t
   },
   
diff --git a/views/pages/index.ejs b/views/pages/index.ejs
index 35143cb..070d1ff 100644
--- a/views/pages/index.ejs
+++ b/views/pages/index.ejs
@@ -39,7 +39,7 @@
           <a href="/profile/{{username}}">{{username}}</a>
           {{privacy_dot}}
         </td>
-        <td>
+        <td class="{{color}}">
           <a href="/details/{{id}}">{{title}}</a>
         </td>
         <td class="{{age_class}}">
diff --git a/views/partials/header.ejs b/views/partials/header.ejs
index 0b2c5c5..799040f 100644
--- a/views/partials/header.ejs
+++ b/views/partials/header.ejs
@@ -9,4 +9,24 @@
 
 <h1><%= title %></h1>
 
-<hr>
\ No newline at end of file
+<hr>
+
+<% if (show_header) { %>
+  <div id="menu">
+    <span class="lastlog">
+      <script class="template" type="text/html">
+        <a href="/profile/{{username}}">{{username}}</a>
+        [{{age}}]
+      </script>
+    </span>
+    <span class="links">
+      <a href="/index">home</a> |
+      <a href="/search">search</a> |
+      <a href="/post">post</a> |
+      <a href="/inbox">inbox</a> |
+      <a href="/message">message</a> |
+      <a href="/profile">profile</a> |
+      <a href="/logout">logout</a>
+    </span>
+  </div>
+<% } %>
\ No newline at end of file
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index fa03f2b..8a2e33a 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -15,6 +15,7 @@
 <script src="/assets/js/lib/views/login/login.js"></script>
 
 <script src="/assets/js/lib/views/index/index.js"></script>
+<script src="/assets/js/lib/views/index/lastlog.js"></script>
 <script src="/assets/js/lib/views/index/hootbox.js"></script>
 <script src="/assets/js/lib/views/index/threadbox.js"></script>