diff options
| -rw-r--r-- | app.js | 9 | ||||
| -rw-r--r-- | public/javascripts/util.js | 18 | ||||
| -rw-r--r-- | views/index.ejs | 51 |
3 files changed, 58 insertions, 20 deletions
@@ -128,7 +128,7 @@ var userSchema = mongoose.Schema({ var User = mongoose.model( 'User', userSchema ); function updateTime ( user, now, connected ) { - var time = ( now - connected ) / 1000; + var time = ( now - connected ); var newCount = user.count + time; user.count = newCount; user.save(function(err) { @@ -151,7 +151,7 @@ io.sockets.on('connection', function (socket) { getHighScores(function(err, users) { scores = []; for (var i = 0; i < users.length; i++) { - scores.unshift({ + scores.push({ firstname: users[i].firstname, lastname: users[i].lastname, count: users[i].count @@ -184,7 +184,8 @@ io.sockets.on('connection', function (socket) { lastname: user.lastname, image: user.image, count: user.count, - connected: now + connected: now, + active: true }; io.sockets.emit('count', { @@ -203,6 +204,7 @@ io.sockets.on('connection', function (socket) { var now = Date.now(); updateTime(socket.user, now, socket.connected); socket.connected = now; + users[socket.user.id].active = false; io.sockets.emit('blur', data); }); @@ -210,6 +212,7 @@ io.sockets.on('connection', function (socket) { if (!socket.user) return; var now = Date.now(); socket.connected = now; + users[socket.user.id].active = true; io.sockets.emit('focus', data); }); diff --git a/public/javascripts/util.js b/public/javascripts/util.js index 9c2fff4..df29b7e 100644 --- a/public/javascripts/util.js +++ b/public/javascripts/util.js @@ -1,8 +1,19 @@ +window.requestAnimFrame = (function(){ + return window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + window.oRequestAnimationFrame || + window.msRequestAnimationFrame || + function( callback ){ + window.setTimeout(callback, 1000 / 60); + }; +})(); function pluralize (n, s) { return n + " " + (n == 1 ? s : s + "s"); } function toTime (time) { var str = []; + time /= 1000; if (time > 86400) { str.push( pluralize( Math.floor(time / 86400), "day" ) ); } @@ -12,6 +23,11 @@ function toTime (time) { if (time > 60) { str.push( pluralize( Math.floor(time / 60) % 60, "minute" ) ); } - str.push( pluralize( Math.floor(10 * (time % 60)) / 10, "second" ) ); + var seconds = Math.floor(100 * (time % 60)) / 100; + seconds = (seconds + "").split("."); + if (seconds.length == 1) seconds[1] = "00"; +// if (seconds[0].length == 1) seconds[0] = "0" + seconds[0]; + if (seconds[1].length == 1) seconds[1] = seconds[1] + "0"; + str.push( pluralize( seconds[0] + "." + seconds[1], "second" ) ); return str.join(", "); }
\ No newline at end of file diff --git a/views/index.ejs b/views/index.ejs index 2f616ed..7e9054c 100644 --- a/views/index.ejs +++ b/views/index.ejs @@ -8,6 +8,8 @@ <script src="/javascripts/jquery-ba-throttle.js"></script> <script src="/javascripts/util.js"></script> <script> + + var cursor = "https://s3.amazonaws.com/luckyplop/52d5f60fde3d8562ad566838e0e09ca52725bb09.gif"; var socket = io.connect(); @@ -19,18 +21,23 @@ _id = null; <% } %> - var start = 0, now = 0; + var start = 0; var users = {}; - function updateWait(data) { + function updateWait(now) { + if (afk) return; if (start == 0) { - start = data.now; + start = now; } - now = data.now; - var howlong = Math.floor( (now - start) / 1000 ); - $("#waiting").html( howlong == 1 ? howlong + " second" : howlong + " seconds" ); + var howlong = Math.floor( (now - start) ) - delay; + $("#waiting").html( toTime( howlong ) ); } - + + (function loop (){ + requestAnimFrame(loop); + updateWait(Date.now()); + })(); + function updateUsers(data) { console.log(data.users); $("#count").html(Object.keys(data.users).length); @@ -60,12 +67,12 @@ } socket.on('count', function(data){ - updateWait(data); + // updateWait(data); updateUsers(data); }); socket.on('update', function(data){ - updateWait(data); + // updateWait(data); }); socket.on('mouse', function(data){ @@ -84,28 +91,39 @@ $("#scores").append($li); } }); - + socket.on('focus', function(data) { if (data.id != _id && _id in users && users[data.id].cursor) { users[data.id].cursor.removeClass('idle'); } }); + socket.on('blur', function(data){ if (data.id != _id && _id in users && users[data.id].cursor) { users[data.id].cursor.addClass('idle'); } }) - + var afk = false, blurred = 0, blurTime = 0, delay = 0; if (_id) { - window.onfocus = function () { - $("#really_waiting").html("FOCUS"); - socket.emit('focus', { id: _id }); - } + window.onblur = function () { $("#really_waiting").html("BLUR"); socket.emit('blur', { id: _id }); + blurred = Date.now(); + afk = true; + } + + window.onfocus = function () { + $("#really_waiting").html("FOCUS"); + socket.emit('focus', { id: _id }); + if (blurred) { + afk = false; + delay = delay + (Date.now() - blurred); + $("#reset").html( "You left the page for " + toTime(delay) + ", counting it against your score.." ); + } } + window.onmousemove = $.throttle(50, function (e) { var y = Math.floor( e.pageY - window.innerHeight / 2 ); var x = Math.floor( e.pageX - window.innerWidth / 2 ); @@ -158,7 +176,8 @@ <a href="/auth/facebook">Login with Facebook</a> <% } %> - <div>You've been waiting for <span id="waiting">0 seconds</span></div> + <div>You've been waiting for <span id="waiting">0 seconds</span><br> + <span id="reset"></span></div> <div><span id="count">0</span> ppl online now!!</div> <div id="really_waiting">FOCUS</div> |