diff options
| -rw-r--r-- | app.js | 90 | ||||
| -rw-r--r-- | client/index.html | 99 |
2 files changed, 156 insertions, 33 deletions
@@ -1,9 +1,9 @@ var mongojs = require("mongojs"); var db = mongojs("localhost:27017/ThePixelWorld", ["account","progress"]); - var express = require("express"); var app = express(); + var serv = require("http").Server(app); app.get('/', function(req,res) { @@ -80,7 +80,24 @@ var Player = function(id){ else self.speedY = 0; } + + self.getInitPack = function() { + return { + id:self.id, + x:self.x, + y:self.y, + number:self.number + }; + } + self.getUpdatePack = function() { + return { + id:self.id, + x:self.x, + y:self.y + }; + } Player.list[id] = self; + initPack.player.push(self.getInitPack()); return self; } @@ -102,10 +119,23 @@ Player.onConnect = function(socket){ else if (data.inputId === 'mouseAngle') player.mouseAngle = data.state; }); + + socket.emit('init',{ + player:Player.getAllInitPack(), + bullet:Bullet.getAllInitPack(), + }); +} + +Player.getAllInitPack = function(){ + var players = []; + for(var i in Player.list) + players.push(Player.list[i].getInitPack()); + return players; } Player.onDisconnect = function(socket){ delete Player.list[socket.id]; + removePack.player.push(socket.id); } Player.update = function(){ @@ -113,11 +143,7 @@ Player.update = function(){ for(var i in Player.list){ var player = Player.list[i]; player.update(); - pack.push({ - x:player.x, - y:player.y, - number:player.number - }); + pack.push(player.getUpdatePack()); } return pack; } @@ -143,7 +169,25 @@ var Bullet = function(parent, angle) { } } } + + self.getInitPack = function() { + return { + id:self.id, + x:self.x, + y:self.y, + }; + } + + self.getUpdatePack = function() { + return { + id:self.id, + x:self.x, + y:self.y, + }; + } + Bullet.list[self.id] = self; + initPack.bullet.push(self.getInitPack()); return self; } @@ -154,20 +198,21 @@ Bullet.update = function(){ for(var i in Bullet.list){ var bullet = Bullet.list[i]; bullet.update(); - if(bullet.toRemove) + if(bullet.toRemove){ delete Bullet.list[i]; + removePack.bullet.push(bullet.id); + } else - pack.push({ - x:bullet.x, - y:bullet.y, - }); + pack.push(bullet.getUpdatePack()); } return pack; } -var USERS = { - "bob":"bub", - "asd": "fgh" +Bullet.getAllInitPack = function(){ + var bullets = []; + for(var i in Bullet.list) + bullets.push(Bullet.list[i].getInitPack()); + return bullets; } var isValidPassword = function(data, cb){ @@ -203,6 +248,7 @@ io.sockets.on('connection', function(socket){ isValidPassword(data, function(res){ if (res){ Player.onConnect(socket); + socket.playerName = data.username; socket.emit('signInResponse', {success:true}); } else { socket.emit('signInResponse', {success:false}); @@ -228,7 +274,7 @@ io.sockets.on('connection', function(socket){ socket.on('sendMsgToServer', function(data){ var playerName = ("" + socket.id).slice(2,7); for (var i in SOCKET_LIST){ - SOCKET_LIST[i].emit('addToChat', playerName + ': ' + data); + SOCKET_LIST[i].emit('addToChat', socket.playerName + ': ' + data); } }); @@ -239,6 +285,9 @@ io.sockets.on('connection', function(socket){ }); }); +var initPack = {player:[], bullet:[]}; +var removePack = {player:[], bullet:[]}; + setInterval(function(){ var pack = { player:Player.update(), @@ -247,6 +296,13 @@ setInterval(function(){ for(var i in SOCKET_LIST){ var socket = SOCKET_LIST[i]; - socket.emit('newPositions', pack); + socket.emit('init', initPack); + socket.emit('update', pack); + socket.emit('remove', removePack); } -},1000/25);
\ No newline at end of file + initPack.player = []; + initPack.bullet = []; + removePack.player = []; + removePack.bullet = []; + +}, 1000/25);
\ No newline at end of file diff --git a/client/index.html b/client/index.html index 666c078..4404a4a 100644 --- a/client/index.html +++ b/client/index.html @@ -27,6 +27,7 @@ // Login var signDiv = document.getElementById("signDiv"); var signDivUsername = document.getElementById("signDiv-username"); + var signDivUsername = document.getElementById("signDiv-username"); var signDivPassword = document.getElementById("signDiv-password"); var signDivSignIn = document.getElementById("signDiv-signIn"); var signDivSignUp = document.getElementById("signDiv-signUp"); @@ -66,31 +67,97 @@ console.log(data); }); + chatForm.onsubmit = function(e){ + e.preventDefault(); + if (chatInput.value[0] === "/") + socket.emit("evalServer", chatInput.value.slice(1)); + else + socket.emit("sendMsgToServer", chatInput.value); + chatInput.value = ""; + } + // Game var ctx = document.getElementById("ctx").getContext("2d"); ctx.font = '30px Arial'; - socket.on('newPositions', function(data){ - ctx.clearRect(0,0,500,500); - for(var i =0; i < data.player.length; i++){ - ctx.fillStyle="rgba(55,55,55,0.8)"; - ctx.fillText(''+ data.player[i].number,data.player[i].x, data.player[i].y); + var Player = function(initPack){ + var self = {}; + self.id = initPack.id; + self.number = initPack.number; + self.x = initPack.x; + self.y = initPack.y; + Player.list[self.id] = self; + return self; + }; + + Player.list = {}; + + var Bullet = function(initPack){ + var self = {}; + self.id = initPack.id; + self.number = initPack.number; + self.x = initPack.x; + self.y = initPack.y; + Bullet.list[self.id] = self; + return self; + }; + + Bullet.list = {}; + + // init (all) + socket.on('init', function(data){ + for(var i = 0; i < data.player.length; i++){ + new Player(data.player[i]); } - for(var i =0; i < data.bullet.length; i++){ - ctx.fillStyle="rgba(55,55,55,0.8)"; - ctx.fillRect(data.bullet[i].x-5, data.bullet[i].y-5, 10, 10); + for(var i = 0; i < data.bullet.length; i++){ + new Bullet(data.bullet[i]); + } + }); + // update (diff) + socket.on('update', function(data){ + for(var i = 0; i < data.player.length; i++){ + var pack = data.player[i]; + var p = Player.list[pack.id]; + if(p){ + if(pack.x !== undefined) + p.x = pack.x; + if(pack.y !== undefined) + p.y = pack.y; + } + } + for(var i = 0; i < data.bullet.length; i++){ + var pack = data.bullet[i]; + var b = Bullet.list[pack.id]; + if(b){ + if(pack.x !== undefined) + b.x = pack.x; + if(pack.y !== undefined) + b.y = pack.y; + } } }); + // remove (del by id) + socket.on('remove', function(data){ + for(var i = 0; i < data.player.length; i++){ + delete Player.list[data.player[i]]; + } + for(var i = 0; i < data.bullet.length; i++){ + delete Bullet.list[data.bullet[i]]; + } + }); - chatForm.onsubmit = function(e){ - e.preventDefault(); - if (chatInput.value[0] === "/") - socket.emit("evalServer", chatInput.value.slice(1)); - else - socket.emit("sendMsgToServer", chatInput.value); - chatInput.value = ""; - } + setInterval(function(){ + ctx.clearRect(0,0,500,500); + for(var i in Player.list){ + ctx.fillStyle="rgba(55,55,55,0.8)"; + ctx.fillText(''+ Player.list[i].number,Player.list[i].x, Player.list[i].y); + } + for(var i in Bullet.list){ + ctx.fillStyle="rgba(55,55,55,0.8)"; + ctx.fillRect(Bullet.list[i].x-5, Bullet.list[i].y-5, 10, 10); + } + }, 1000/25); document.onkeydown = function(event){ //console.log(event.keyCode); |