diff options
Diffstat (limited to 'public')
| -rw-r--r-- | public/javascripts/game.js | 25 | ||||
| -rw-r--r-- | public/stylesheets/style.css | 14 |
2 files changed, 30 insertions, 9 deletions
diff --git a/public/javascripts/game.js b/public/javascripts/game.js index be86b86..dc69682 100644 --- a/public/javascripts/game.js +++ b/public/javascripts/game.js @@ -1,5 +1,6 @@ -var cursor = "https://s3.amazonaws.com/luckyplop/52d5f60fde3d8562ad566838e0e09ca52725bb09.gif"; +var cursor_image = "https://s3.amazonaws.com/luckyplop/52d5f60fde3d8562ad566838e0e09ca52725bb09.gif"; +var own_cursor; var socket = io.connect(); @@ -12,6 +13,11 @@ var game = { init: function (){ game.bindSocket(); if (window._id) { + socket.emit('joined', JSON.stringify({ "id": window._id })); + own_cursor = new Cursor({ + firstName: "you" + }); + own_cursor.el.addClass("own"); game.bindEvents(); } game.loop(); @@ -19,7 +25,7 @@ var game = { loop: function (){ requestAnimFrame(game.loop); - ui.updateWait(Date.now()); + UI.updateWait(Date.now()); }, bindSocket: function(){ @@ -65,12 +71,15 @@ var game = { $("#reset").html( "You left the page for " + timeInWords(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 ); - socket.emit('mouse', { x: x, y: y, id: _id }); - own_cursor.el.css({ 'margin-right': -data.x, 'margin-bottom': -data.y }); + var emit_mouse_movement = $.throttle(50, function (e) { + var y = Math.floor( e.pageY - window.innerHeight / 2 ); + var x = Math.floor( e.pageX - window.innerWidth / 2 ); + socket.emit('mouse', { x: x, y: y, id: _id }); }); + window.onmousemove = function(e){ + emit_mouse_movement(e); + own_cursor.el.css({ 'left': e.pageX, 'top': e.pageY }); + } } }; @@ -88,7 +97,7 @@ var UI = { $("#reset").html( "You left the page for " + timeInWords(now - blurTime) + ", counting it against your score.." ); } } - } + }, updateUsers: function(data) { console.log(data.users); diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css index 5f1e9a9..413e29a 100644 --- a/public/stylesheets/style.css +++ b/public/stylesheets/style.css @@ -372,7 +372,19 @@ header { background-image: url(/images/cursor-gray.png) !important; text-shadow: 0 0 2px #333; color: transparent; - opacity:0.8; + opacity: 0.8; +} +.cursor.own { + position: absolute; + top: -200px; + left: -200px; + margin: 0; + z-index: 2; + -webkit-transition: none; + -moz-transition: none; + -ms-transition: none; + -o-transition: none; + transition: none; } .cursor span { |