Browse Source

added some socket io events

master
jrtechs 5 years ago
parent
commit
6fdc786646
2 changed files with 145 additions and 15 deletions
  1. +38
    -11
      front end/index.html
  2. +107
    -4
      server/server.js

+ 38
- 11
front end/index.html View File

@ -26,6 +26,9 @@
{ {
var socket = io('http://localhost:3000'); var socket = io('http://localhost:3000');
io.connect(); io.connect();
socket.emit('register', "Jrtechs");
var canvas = document.getElementById("mycanvas"); var canvas = document.getElementById("mycanvas");
canvas.addEventListener('keydown', doKeyDown, true); canvas.addEventListener('keydown', doKeyDown, true);
canvas.addEventListener('keyup', doKeyUp, true); canvas.addEventListener('keyup', doKeyUp, true);
@ -36,7 +39,9 @@
var players = {}; var players = {};
var blocks = {};
var blocks = new Array();
var name = "Jrtechs";
socket.on("connected", function(data) socket.on("connected", function(data)
{ {
@ -46,9 +51,10 @@
blocks = data.blocks; blocks = data.blocks;
}); });
socket.on("update",function(data)
socket.on("updateClient",function(data)
{ {
console.log(data);
players[data.name] = data.player;
}); });
function doKeyUp(e) function doKeyUp(e)
@ -67,27 +73,48 @@
context.fillStyle = "#000000"; context.fillStyle = "#000000";
context.fillRect(0, 0, width, height); context.fillRect(0, 0, width, height);
console.log(blocks);
for(var i = 0; i< blocks.length; i++) for(var i = 0; i< blocks.length; i++)
{ {
if(bullets[i] != -1)
if(blocks[i] != -1)
{ {
context.fillStyle = "rgba(255, 0, 199, 1)"; //pink context.fillStyle = "rgba(255, 0, 199, 1)"; //pink
context.fillRect(blocks[i].x, blocks[i].y, 10,10); context.fillRect(blocks[i].x, blocks[i].y, 10,10);
} }
} }
for(var i = 0; i< players.length; i++)
Object.keys(players).forEach(function(key)
{ {
if(players[i] != -1)
{
context.fillStyle = "rgba(0, 45, 160, 1)"; //blue
context.fillRect(players[i].x, players[i].y, 25,25);
}
}
context.fillStyle = "rgba(0, 45, 160, 1)"; //blue
context.fillRect(players[key].x, players[key].y, 25,25);
});
} }
var speed = 5;
setInterval(function () setInterval(function ()
{ {
Object.keys(players).forEach(function(key)
{
console.log(key);
if(players[key].upB)
{
players[key].y -= speed;
}
else if(players[key].downB)
{
players[key].y += speed;
}
else if(players[key].leftB)
{
players[key].x -= speed;
}
else if(players[key].rightB)
{
players[key].x += speed;
}
});
draw(); draw();
}, 1000/60); }, 1000/60);

+ 107
- 4
server/server.js View File

@ -13,14 +13,50 @@ var PORT = 3000;
var players = {}; var players = {};
var sockets = {};
var blocks = []; var blocks = [];
var Player = function() var Player = function()
{ {
var name;
var x = 350;
var y = 350;
var upB= false;
var downB = false;
var leftB = false;
var rightB = false;
}; };
var blocks = function(xx, yy, ownerName)
{
var x = xx;
var y = yy;
var owner = ownerName;
//1 up
//2 left
//3 right
//4 down
var direction;
};
var update = function(command, object)
{
Object.keys(sockets).forEach(function(key)
{
console.log(players[key]);
sockets[key].emit(command, object);
});
};
io.on('connection', function(socket) io.on('connection', function(socket)
{ {
var p = new Player(); var p = new Player();
@ -33,21 +69,88 @@ io.on('connection', function(socket)
socket.emit('connected', initialState); socket.emit('connected', initialState);
socket.on('move', function(data)
socket.on('keyDown', function(data)
{ {
console.log("keydown");
if(data.direction == 38)
{
//up
p.upB = true;
}
else if (data.direction == 40)
{
//down
p.downB = true;
}
else if (data.direction == 39)
{
//right
p.leftR = true;
}
else if (data.direction == 37)
{
//left
p.leftB = true;
}
else if (data.direction == 32)
{
//space
}
var object = new Object();
object.name = p.name;
object.player = p;
update("updateClient", object);
}); });
socket.on('shoot', function(data)
socket.on('keyUp', function(data)
{ {
console.log("keyUp");
if(data.direction == 38)
{
//up
p.upB = false;
}
else if (data.direction == 40)
{
//down
p.downB = false;
}
else if (data.direction == 39)
{
//right
p.rightB = false;
}
else if (data.direction == 37)
{
//left
p.leftB = false;
}
});
socket.on('die', function(data)
{
players.remove(p);
}); });
socket.on('disconnect', function() socket.on('disconnect', function()
{ {
console.log("user disconnected"); console.log("user disconnected");
})
});
socket.on('register', function(data)
{
console.log(data);
p.name = data;
players[data] = p;
sockets[data] = socket;
p.x = 300;
p.y = 300;
});
}); });
http.listen(PORT, function() http.listen(PORT, function()

Loading…
Cancel
Save