online page changes

public/src/forum/users.js

@@ -77,8 +77,11 @@ define(function() {
 
 		socket.on('api:user.isOnline', function(data) {
 			if(active == 'online' && !loadingMoreUsers) {
-				$('#users-container').empty();
+				$('#users-container .registered-user').remove();
 				startLoading('users:online', 0);
+				socket.emit('api:user.getOnlineAnonCount', {} , function(anonCount) {
+					$('#online_anon_count').html(anonCount);
+				});
 			}
 		});
 
@@ -86,7 +89,7 @@ define(function() {
 			var html = templates.prepare(templates['users'].blocks['users']).parse({
 				users: users
 			});
-			$('#users-container').append(html);
+			$('#users-container').prepend(html);
 		}
 
 		function loadMoreUsers() {

public/templates/users.tpl

@@ -20,7 +20,7 @@
 
 	<ul id="users-container" class="users-container">
 		<!-- BEGIN users -->
-		<div class="users-box">
+		<div class="users-box registered-user">
 			<a href="/user/{users.userslug}">
 				<img src="{users.picture}" class="img-thumbnail"/>
 			</a>
@@ -39,6 +39,17 @@
 			</div>
 		</div>
 		<!-- END users -->
+		<div class="users-box {show_anon}">
+			<a href="#">
+				<img src="" class="img-thumbnail"/>
+			</a>
+			<br/>
+			<div class="user-info">
+				<span id="online_anon_count">{anonymousUserCount}</span>
+				<br/>
+				<a href="#">Anonymous</a>
+			</div>
+		</div>
 	</ul>
 
 	<div class="text-center {loadmore_display}">

src/routes/user.js

@@ -6,7 +6,10 @@ var user = require('./../user.js'),
 	path = require('path'),
 	winston = require('winston'),
 	nconf = require('nconf'),
-	meta = require('./../meta');
+	meta = require('./../meta'),
+	async= require('async'),
+	RDB = require('./../redis'),
+	websockets = require('./../websockets.js');
 
 (function (User) {
 	User.create_routes = function (app) {
@@ -457,7 +460,8 @@ var user = require('./../user.js'),
 				res.json({
 					search_display: 'none',
 					loadmore_display: 'block',
-					users: data
+					users: data,
+					show_anon: 'hide'
 				});
 			});
 		}
@@ -467,7 +471,8 @@ var user = require('./../user.js'),
 				res.json({
 					search_display: 'none',
 					loadmore_display: 'block',
-					users: data
+					users: data,
+					show_anon: 'hide'
 				});
 			});
 		}
@@ -477,17 +482,36 @@ var user = require('./../user.js'),
 				res.json({
 					search_display: 'none',
 					loadmore_display: 'block',
-					users: data
+					users: data,
+					show_anon: 'hide'
 				});
 			});
 		}
 
 		function getOnlineUsers(req, res) {
 			user.getUsers('users:online', 0, 49, function (err, data) {
+
+				var onlineUsers = [];
+
+				function iterator(user, callback) {
+					if(websockets.isUserOnline(user.uid)) {
+						onlineUsers.push(user);
+					} else {
+						RDB.zrem('users:online', user.uid);
+					}
+					callback(null);
+				}
+
+				var anonymousUserCount = websockets.getOnlineAnonCount();
+
+				async.each(data, iterator, function(err) {
 					res.json({
 						search_display: 'none',
 						loadmore_display: 'block',
-					users: data
+						users: onlineUsers,
+						anonymousUserCount: anonymousUserCount,
+						show_anon: anonymousUserCount?'':'hide'
+					});
 				});
 			});
 		}
@@ -496,7 +520,8 @@ var user = require('./../user.js'),
 			res.json({
 				search_display: 'block',
 				loadmore_display: 'none',
-				users: []
+				users: [],
+				show_anon: 'hide'
 			});
 		}
 

src/websockets.js

@@ -68,7 +68,6 @@ module.exports.init = function(io) {
 
 					RDB.zadd('users:online', Date.now(), uid, function(err, data) {
 						socket.join('uid_' + uid);
-						io.sockets. in ('global').emit('api:user.isOnline', isUserOnline(uid));
 
 						user.getUserField(uid, 'username', function(err, username) {
 							socket.emit('event:connect', {
@@ -79,6 +78,8 @@ module.exports.init = function(io) {
 						});
 					});
 				}
+
+				io.sockets. in ('global').emit('api:user.isOnline', isUserOnline(uid));
 			});
 		});
 
@@ -96,11 +97,12 @@ module.exports.init = function(io) {
 				delete userSockets[uid];
 				if (uid) {
 					RDB.zrem('users:online', uid, function(err, data) {
-						io.sockets. in ('global').emit('api:user.isOnline', isUserOnline(uid));
 					});
 				}
 			}
 
+			io.sockets. in ('global').emit('api:user.isOnline', isUserOnline(uid));
+
 			emitOnlineUserCount();
 
 			for (var roomName in rooms) {
@@ -266,6 +268,8 @@ module.exports.init = function(io) {
 			return !!userSockets[uid] && userSockets[uid].length > 0;
 		}
 
+		module.exports.isUserOnline = isUserOnline;
+
 		socket.on('api:user.get_online_users', function(data) {
 			var returnData = [];
 
@@ -282,6 +286,7 @@ module.exports.init = function(io) {
 		socket.on('api:user.isOnline', function(uid, callback) {
 			callback({
 				online: isUserOnline(uid),
+				uid: uid,
 				timestamp: Date.now()
 			});
 		});
@@ -438,6 +443,14 @@ module.exports.init = function(io) {
 			});
 		});
 
+		socket.on('api:user.getOnlineAnonCount', function(data, callback) {
+			callback(module.exports.getOnlineAnonCount());
+		});
+
+		module.exports.getOnlineAnonCount = function () {
+			return userSockets[0] ? userSockets[0].length : 0;
+		}
+
 		function emitOnlineUserCount() {
 			var anon = userSockets[0] ? userSockets[0].length : 0;
 			var registered = Object.keys(userSockets).length;
@@ -445,7 +458,8 @@ module.exports.init = function(io) {
 				registered = registered - 1;
 
 			var returnObj = {
-				users: registered + anon
+				users: registered + anon,
+				anon: anon
 			};
 			io.sockets.emit('api:user.active.get', returnObj)
 		}