1 files changed, 76 insertions, 16 deletions

diff --git a/public/javascripts/game.js b/public/javascripts/game.js
index 90e3a67..7ac3926 100644
--- a/public/javascripts/game.js
+++ b/public/javascripts/game.js
@@ -4,7 +4,7 @@ var own_cursor;
 
 var socket = io.connect();
 
-var users = {}, cursors = [];
+var users = {}, scores = {}, cursors = [];
 
 var game = {
 	cursor: null,
@@ -41,6 +41,7 @@ var game = {
 			UI.updateScores(data);
 		});
 		socket.on('mouse', function(data){
+		console.log(data.id, data.id in users);
 			if (data.id != _id && data.id in users) {
 				users[data.id].cursor.el.css({ 'margin-right': -data.x, 'margin-bottom': -data.y });
 			}
@@ -104,17 +105,12 @@ var UI = {
 	updateUsers: function(data) {
 		console.log(data.users);
 		var now = data.now;
-		$("#count").html(Object.keys(data.users).length);
-		for (var i in users) {
-			if (!( i in data.users )) {
-				if (users[i].cursor) {
-					users[i].cursor.remove();
-				}
-				delete users[i];
-			}
-		}
+
+		var seen_ids = {};
+
 		for (var i in data.users) {
 			var user = data.users[i];
+			seen_ids[ user.id ] = true;
 			if (!( user.id in users )) {
 				users[user.id] = user;
 				if (user.id != _id && ! user.cursor) {
@@ -123,33 +119,91 @@ var UI = {
 					user.cursor.el.css({ 'margin-right': -user.x, 'margin-bottom': -user.y });
 				}
 				else if (user.id == _id && own_cursor) {
+					user.cursor = own_cursor;
 					own_cursor.name.html( user.firstname );
 				}
+				
+				if (user.id in scores) {
+					user.cursor.score = scores[user.id];
+				}
+
+			}
+		}
+		
+		for (var id in users) {
+			if (!( id in seen_ids )) {
+				if (users[id].cursor) {
+					users[id].cursor.remove();
+				}
+				delete users[id];
 			}
 		}
+		
 	},
 	
 	updateScores: function(data){
-		var scores = data.scores;
+		var current_scores = data.scores;
 		$("#scores").html("");
-		for (var i = 0; i < scores.length; i++) {
-			var s = scores[i];
-			var $li = $("<li>");
-			$li.html("<b>" + s.firstname + " " + s.lastname + "</b> &mdash; " + timeInWords(s.count));
-			$("#scores").append($li);
+		for (var i = 0; i < current_scores.length; i++) {
+			var score = new Score( current_scores[i] );
+
+			if (score.id in users) {
+				users[score.id].cursor.score = score;
+			}
+			
+			scores[score.id] = score;
 		}
 	}
 }
 
+function Score ( user ) {
+	var base = this;
+	base.add = function(){
+		base.el = $("<li>");
+		
+		base.id = user.id;
+		base.count = user.count;
+		base.current = user.count;
+
+		base.name = $("<span>");
+		base.name.addClass("name");
+		base.name.html(user.firstname + " " + user.lastname);
+
+		base.time = $("<span>");
+		base.time.addClass("time");
+		base.time.html( timeInWords(user.count) );
+		
+		base.el.append(base.name);
+		base.el.append(" &mdash; ");
+		base.el.append(base.time);
+		
+		$("#scores").append(base.el);
+	}
+	
+	base.update = function(howlong){
+	  base.current = base.count + howlong
+		base.time.html( timeInWords( base.current ) );
+	}
+	
+	base.save = function(){
+		base.count = base.current;
+	}
+	
+	base.add();
+
+}
+
 function Cursor ( user, now ) {
 	var base = this;
 
+	base.id = user.id;
 	base.start = Date.now();
 	base.initial = user.current || 0;
 	base.delay = 0;
 	base.blurStart = 0;
 	base.afk = false;
 	base.own = false;
+	base.score = null;
 
 	base.add = function(){
 		base.el = $("<div>");
@@ -182,6 +236,9 @@ function Cursor ( user, now ) {
 	base.update = function(now){
 		var howlong = Math.floor( (now - base.start) ) + base.initial - base.delay;
 		base.time.html( timeInSecs( howlong ) );
+		if (base.score) {
+			base.score.update( howlong );
+		}
 	}
 
 	base.blur = function(){
@@ -199,6 +256,9 @@ function Cursor ( user, now ) {
 	}
 	
 	base.remove = function(){
+		if (base.score) {
+			base.score.save();
+		}
 		base.el.remove();
 		cursors.splice( cursors.indexOf(base), 1 )
 	}