Browse files

Got the sprites walking and whatnot

  • Loading branch information...
1 parent 9fd5a80 commit e6ee4b3e94a8844d1169f09e526a16da2b085a42 @robrighter committed Dec 31, 2011
Showing with 76 additions and 82 deletions.
  1. +9 −9 server.js
  2. +63 −69 static/js/script.js
  3. +4 −4 views/layout.jade
View
18 server.js
@@ -38,15 +38,15 @@ server.listen( port);
//Setup Socket.IO
var io = io.listen(server);
-io.on('connection', function(client){
- console.log('Client Connected');
- client.on('message', function(message){
- client.broadcast(message);
- client.send(message);
- });
- client.on('disconnect', function(){
- console.log('Client Disconnected.');
- });
+io.sockets.on('connection', function(socket){
+ console.log('Client Connected');
+ socket.on('move_character', function(data){
+ socket.broadcast.emit('server_move_character',data);
+ socket.emit('server_move_character',data);
+ });
+ socket.on('disconnect', function(){
+ console.log('Client Disconnected.');
+ });
});
View
132 static/js/script.js
@@ -1,4 +1,4 @@
-/* Author: YOUR NAME HERE
+/* Author: Rob Righter
*/
$(document).ready(function() {
@@ -15,25 +15,25 @@ $(document).ready(function() {
sp.move(100, 100);
sp.update();
});
-
- socket = new io.Socket(null, {
- port: 8081
- ,transports: ['websocket', 'htmlfile', 'xhr-multipart', 'xhr-polling']
- });
- socket.connect();
- $('#sender').bind('click', function() {
- socket.emit('message', 'Message Sent on ' + new Date());
- });
+ var socket = io.connect();
- socket.on('move_character', function(data){
- console.log(data);
+ socket.on('server_move_character', function(data){
sps[data.character].xv = data.xv;
sps[data.character].yv = data.yv;
if(data.direction){
spriteAnimateDirection(sps[data.character], data.direction);
}
});
+
+ //"/images/sprites/lando.png" 128x192 32x48
+
+
+ var image = 'lando.png';
+ var inmotion = false;
+ var input = sjs.Input(scene);
+ var ticker = scene.Ticker(gameTick, {tickDuration: 130});
+ ticker.run();
function updateAllSprites(){
_.each(_.keys(sps), function(item){
@@ -42,65 +42,59 @@ $(document).ready(function() {
sp.update();
})
}
-
- //"/images/sprites/lando.png" 128x192 32x48
+ function gameTick(ticker){
+ var character = {xv: 0, yv: 0, direction: null};
+ var speed = 5;
+ if (input.keyboard.left){
+ character.xv = speed*-1;
+ character.direction = 'left';
+ }else if (input.keyboard.right){
+ character.xv = speed;
+ character.direction = 'right';
+ }
+ else{
+ character.xv = 0;
+ }
- // load the images in parallel. When all the images are
- // ready, the callback function is called.
- var image = 'lando.png';
- scene.loadImages(["/images/sprites/"+image], function() {
-
- var input = sjs.Input(scene);
- var ticker = scene.Ticker(function(ticker){
- var character = {xv: 0, yv: 0, direction: null};
-
- var speed = 5;
- if (input.keyboard.left){
- character.xv = speed*-1;
- character.direction = 'left';
- }else if (input.keyboard.right){
- character.xv = speed;
- character.direction = 'right';
- }
- else{
- character.xv = 0;
- }
-
- if (input.keyboard.up){
- character.yv = speed*-1;
- character.direction = 'up';
- }else if (input.keyboard.down){
- character.yv = speed;
- character.direction = 'down';
- }
- else{
- character.yv = 0;
- }
-
- socket.emit('move_character', {character: 'lando', xv: character.xv, yv: character.yv, direction: character.direction });
- updateAllSprites();
- }, {tickDuration: 130});
- ticker.run();
- });
-
-});
+ if (input.keyboard.up){
+ character.yv = speed*-1;
+ character.direction = 'up';
+ }else if (input.keyboard.down){
+ character.yv = speed;
+ character.direction = 'down';
+ }
+ else{
+ character.yv = 0;
+ }
+ if(character.direction){
+ inmotion = true;
+ socket.emit('move_character', {character: 'lando', xv: character.xv, yv: character.yv, direction: character.direction });
+ }
+ else if(inmotion){
+ inmotion=false;
+ socket.emit('move_character', {character: 'lando', xv: 0, yv: 0, direction: null });
+ }
+ updateAllSprites();
+ }
-function spriteAnimateDirection(sprite, direction){
- var width = 32;
- var height = 48;
- var prop = 'rrcustomizedanimation';
- var spritekey = {down: 0*height, left: 1*height, right: 2*height, up: 3*height};
- if(!sprite.hasOwnProperty(prop)){
- sprite[prop] = {
- down: 0,
- left: 0,
- right: 0,
- up: 0
- };
+ function spriteAnimateDirection(sprite, direction){
+ var width = 32;
+ var height = 48;
+ var prop = 'rrcustomizedanimation';
+ var spritekey = {down: 0*height, left: 1*height, right: 2*height, up: 3*height};
+ if(!sprite.hasOwnProperty(prop)){
+ sprite[prop] = {
+ down: 0,
+ left: 0,
+ right: 0,
+ up: 0
+ };
+ }
+ sprite[prop][direction]++;
+ sprite[prop][direction] = sprite[prop][direction]%4;
+ sprite.offset(sprite[prop][direction]*width, spritekey[direction]);
}
- sprite[prop][direction]++;
- sprite[prop][direction] = sprite[prop][direction]%4;
- sprite.offset(sprite[prop][direction]*width, spritekey[direction]);
-}
+});
+
View
8 views/layout.jade
@@ -18,14 +18,14 @@ html.no-js(lang='en')
link(rel='stylesheet', href='/css/style.css')
//-script(src='js/libs/modernizr-2.0.6.min.js')
body!=body
+ script(src='/socket.io/socket.io.js')
script(src='//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js')
script
window.jQuery || document.write('<script src="js/libs/jquery-1.7.1.min.js"><\\/script>')
//-script(defer, src='js/plugins.js')
- script(defer, src='/js/script.js')
- script(defer, src='/js/sprite/sprite.js')
- script(defer, src='/js/underscore.js')
- script(defer, src='/socket.io/socket.io.js')
+ script(src='/js/sprite/sprite.js')
+ script(src='/js/underscore.js')
+ script(src='/js/script.js')
script
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview'],['_trackPageLoadTime']];
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.async=1;

0 comments on commit e6ee4b3

Please sign in to comment.