live tiles on home page, ninjaed from andrew might need to randomize starting times, can be disabled by removing the slider class from the div, maybe this should be a setting in admin/categories

public/css/style.less

@@ -247,6 +247,7 @@ footer.footer {
 	cursor: pointer;
 	margin-bottom: 20px;
 	border-radius: 5px;
+	overflow:hidden;
 }
 .category-row h4 {
 	font-weight: 700;
@@ -651,7 +652,7 @@ body .navbar .nodebb-inline-block {
 
 		&.menu-visible {
 			margin-top: 0%;
-		}
+  	}
 
 		i {
 			width: 100%;
@@ -667,4 +668,94 @@ body .navbar .nodebb-inline-block {
 	top: 0px;
 	overflow: hidden;
 	margin-top: 60px;
-}
+}
+
+.category-box {
+  height:90px;
+  
+  .post-preview {
+    padding-left:10px;
+    padding-right:10px;
+    text-align:left;
+    img {
+      width:60px;
+      height:60px;
+      padding-right:5px;
+    }
+    
+    p {
+      overflow: hidden;
+      text-overflow:ellipsis;
+      height:60px;
+    }
+  }
+}
+
+@-webkit-keyframes scroll-2 /* Safari and Chrome */
+{
+    0%   {top: 0px;}
+    25%   {top: -90px;}
+    50%  {top: -180px;}
+    75%  {top: -270px;}
+    100% {top: -360px;}
+}
+
+@keyframes scroll-2
+{
+    0%   {top: 0px;}
+    25%   {top: -90px;}
+    50%  {top: -180px;}
+    75%  {top: -270px;}
+    100% {top: -360px;}
+}
+
+@-webkit-keyframes scroll-1 /* Safari and Chrome */
+{
+    0%   {top: 0px;}
+    33%   {top: -90px;}
+    66%  {top: -180px;}
+    100%  {top: -270px;}
+}
+
+@keyframes scroll-1
+{
+    0%   {top: 0px;}
+    33%   {top: -90px;}
+    66%  {top: -180px;}
+    100%  {top: -270px;}
+}
+
+@-webkit-keyframes scroll-0 /* Safari and Chrome */
+{
+    0%   {top: 0px;}
+    50%   {top: -90px;}
+    100%  {top: -180px;}
+}
+
+@keyframes scroll-0
+{
+    0%   {top: 0px;}
+    50%   {top: -90px;}
+    100%  {top: -180px;}
+}
+
+.category-slider-2 {
+  position:relative;
+
+  -webkit-animation: scroll-2 15s ease 2s infinite normal;    
+  animation: scroll-2 15s ease 2s infinite normal;/* Safari and Chrome: */
+}
+
+.category-slider-1 {
+  position:relative;
+
+  -webkit-animation: scroll-1 12s ease 2s infinite normal;    
+  animation: scroll-1 12s ease 2s infinite normal;/* Safari and Chrome: */
+}
+
+.category-slider-0 {
+  position:relative;
+
+  -webkit-animation: scroll-0 9s ease 2s infinite normal;    
+  animation: scroll-0 9s ease 2s infinite normal;/* Safari and Chrome: */
+}

public/templates/home.tpl

@@ -7,9 +7,20 @@
 	<div class="span3">
 		<a href="category/{categories.slug}">
 			<h4><span class="badge {categories.badgeclass}">{categories.topic_count} </span> {categories.name}</h4>
-			<!-- {categories.description} -->
 			<div class="category-icon {categories.blockclass}">
-				<i class="{categories.icon} icon-4x"></i>
+				<div id="category-{categories.cid}" class="category-slider-{categories.post_count}">
+					<div class="category-box"><i class="{categories.icon} icon-4x"></i></div>
+					<div class="category-box">{categories.description}</div>
+					<!-- BEGIN posts -->
+					<div class="category-box">
+						<div class="post-preview">
+							<img src="{categories.posts.picture}" class="pull-left" >
+							<p class=""><strong>{categories.posts.username}</strong>: {categories.posts.content}</p>
+						</div>
+					</div>
+					<!-- END posts -->
+					<div class="category-box"><i class="{categories.icon} icon-4x"></i></div>
+				</div>
 			</div>
 		</a>
 	</div>

src/categories.js

@@ -200,6 +200,8 @@ var	RDB = require('./redis.js'),
 		});
 	}
 
+	
+
 	Categories.getModerators = function(cid, callback) {
 		RDB.smembers('cid:' + cid + ':moderators', function(err, mods) {
 			if (mods.length === 0)
@@ -274,11 +276,11 @@ var	RDB = require('./redis.js'),
 		});	
 	}
 
-	Categories.getRecentReplies = function(cid, callback) {
+	Categories.getRecentReplies = function(cid, count, callback) {
-		RDB.zrevrange('categories:recent_posts:cid:' + cid, 0, 4, function(err, pids) {
+		RDB.zrevrange('categories:recent_posts:cid:' + cid, 0, count, function(err, pids) {
 
 			if (pids.length == 0) {
-				callback(false);
+				callback([]);
 				return;
 			}
 			posts.getPostSummaryByPids(pids, function(posts) {
@@ -330,5 +332,7 @@ var	RDB = require('./redis.js'),
 			});
 		}		
 	};
+	
+	
 
 }(exports));

src/posts.js

@@ -196,8 +196,6 @@ marked.setOptions({
 						RDB.del('cid:' + cid + ':read_by_uid', function(err, data) {
 							topics.markAsRead(tid, uid);	
 						});
-						
-						RDB.zadd('categories:recent_posts:cid:' + cid, Date.now(), pid);
 					});
 
 					Posts.getTopicPostStats(socket);
@@ -285,6 +283,8 @@ marked.setOptions({
 
 						feed.updateTopic(tid, cid);
 
+						RDB.zadd('categories:recent_posts:cid:' + cid, Date.now(), pid);
+
 						// this is a bit of a naive implementation, defn something to look at post-MVP
 						RDB.scard('cid:' + cid + ':active_users', function(amount) {
 							if (amount > 10) {
@@ -295,6 +295,8 @@ marked.setOptions({
 						});
 					});
 					
+					
+					
 					user.onNewPostMade(uid, tid, pid, timestamp);					
 
 					if (callback) 

src/webserver.js

@@ -186,9 +186,25 @@ var express = require('express'),
 				break;
 			case 'home' :
 					categories.getAllCategories(function(data) {
-						data.motd_class = (config.show_motd === '1' || config.show_motd === undefined) ? '' : 'none';
+						
-						data.motd = marked(config.motd || "# NodeBB v0.1\nWelcome to NodeBB, the discussion platform of the future.\n\n<a target=\"_blank\" href=\"http://www.nodebb.org\" class=\"btn btn-large\"><i class=\"icon-comment\"></i> Get NodeBB</a> <a target=\"_blank\" href=\"https://github.com/designcreateplay/NodeBB\" class=\"btn btn-large\"><i class=\"icon-github-alt\"></i> Fork us on Github</a> <a target=\"_blank\" href=\"https://twitter.com/dcplabs\" class=\"btn btn-large\"><i class=\"icon-twitter\"></i> @dcplabs</a>");
+						var async = require('async');
-						res.json(data);
+						
+						function iterator(category, callback) {
+							console.log(category.cid);
+							categories.getRecentReplies(category.cid, 2, function(posts) {
+								category["posts"] = posts;
+								category["post_count"] = posts.length;
+								callback(null);
+							});
+						}
+						
+						async.each(data.categories, iterator, function(err) {
+							data.motd_class = (config.show_motd === '1' || config.show_motd === undefined) ? '' : 'none';
+							data.motd = marked(config.motd || "# NodeBB v0.1\nWelcome to NodeBB, the discussion platform of the future.\n\n<a target=\"_blank\" href=\"http://www.nodebb.org\" class=\"btn btn-large\"><i class=\"icon-comment\"></i> Get NodeBB</a> <a target=\"_blank\" href=\"https://github.com/designcreateplay/NodeBB\" class=\"btn btn-large\"><i class=\"icon-github-alt\"></i> Fork us on Github</a> <a target=\"_blank\" href=\"https://twitter.com/dcplabs\" class=\"btn btn-large\"><i class=\"icon-twitter\"></i> @dcplabs</a>");
+							res.json(data);							
+						});
+						
+
 					}, uid);
 				break;
 			case 'login' :

src/websockets.js

@@ -287,7 +287,7 @@ var SocketIO = require('socket.io').listen(global.server, { log:false }),
 		});
 
 		socket.on('api:categories.getRecentReplies', function(tid) {
-			categories.getRecentReplies(tid, function(replies) {
+			categories.getRecentReplies(tid, 4, function(replies) {
 				socket.emit('api:categories.getRecentReplies', replies);
 			});
 		});