add start of ship controls
This commit is contained in:
parent
1027d980c1
commit
fcfe1e8790
10 changed files with 131 additions and 2 deletions
|
@ -0,0 +1,62 @@
|
||||||
|
function Input() {
|
||||||
|
this.mouse = {
|
||||||
|
x: 0,
|
||||||
|
y: 0,
|
||||||
|
held: {},
|
||||||
|
pressed: {}
|
||||||
|
};
|
||||||
|
this.keys = {
|
||||||
|
held: {},
|
||||||
|
pressed: {}
|
||||||
|
};
|
||||||
|
|
||||||
|
this.mouseMove = function (el) {
|
||||||
|
return function (event) {
|
||||||
|
var rect = game.renderer.canvas.getBoundingClientRect();
|
||||||
|
el.mouse.x = event.clientX - rect.left;
|
||||||
|
el.mouse.y = event.clientY - rect.top;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
this.mouseDown = function (el) {
|
||||||
|
return function (event) {
|
||||||
|
el.mouse.pressed[event.which] = true;
|
||||||
|
el.mouse.held[event.which] = true;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
this.mouseUp = function (el) {
|
||||||
|
return function (event) {
|
||||||
|
el.mouse.held[event.which] = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
this.keyDown = function (el) {
|
||||||
|
return function (event) {
|
||||||
|
if (!el.keys.held[event.which]) el.keys.pressed[event.which] = true;
|
||||||
|
el.keys.held[event.which] = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
this.keyUp = function (el) {
|
||||||
|
return function (event) {
|
||||||
|
el.keys.held[event.which] = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('mousemove', this.mouseMove(this));
|
||||||
|
document.addEventListener('mousedown', this.mouseDown(this));
|
||||||
|
document.addEventListener('mouseup', this.mouseUp(this));
|
||||||
|
document.addEventListener('keydown', this.keyDown(this));
|
||||||
|
document.addEventListener('keyup', this.keyUp(this));
|
||||||
|
|
||||||
|
this.mouseAnyPressed = function () {
|
||||||
|
var p = this.mouse.pressed;
|
||||||
|
return p[1] || p[2] || p[3];
|
||||||
|
}
|
||||||
|
|
||||||
|
this.clear = function () {
|
||||||
|
for (var i in this.keys.pressed) this.keys.pressed[i] = false;
|
||||||
|
for (var i in this.mouse.pressed) this.mouse.pressed[i] = false;
|
||||||
|
};
|
||||||
|
}
|
|
@ -18,6 +18,7 @@ function Game() {
|
||||||
this.connected = false;
|
this.connected = false;
|
||||||
this.state = 'connecting';
|
this.state = 'connecting';
|
||||||
|
|
||||||
|
this.input = new Input();
|
||||||
this.net = new Net();
|
this.net = new Net();
|
||||||
this.world = new World();
|
this.world = new World();
|
||||||
this.renderer = new Renderer();
|
this.renderer = new Renderer();
|
||||||
|
@ -25,6 +26,17 @@ function Game() {
|
||||||
this.tick = function() {
|
this.tick = function() {
|
||||||
self.renderer.render(self.state);
|
self.renderer.render(self.state);
|
||||||
|
|
||||||
|
var ship = self.world ? self.world.playerShip : false;
|
||||||
|
|
||||||
|
if(ship) {
|
||||||
|
ship.move[0] = self.input.keys.held[87] || false;
|
||||||
|
ship.move[1] = self.input.keys.held[65] || false;
|
||||||
|
ship.move[2] = self.input.keys.held[68] || false;
|
||||||
|
ship.updateMove();
|
||||||
|
}
|
||||||
|
|
||||||
|
self.input.clear();
|
||||||
|
|
||||||
requestAnimationFrame(self.tick);
|
requestAnimationFrame(self.tick);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -18,4 +18,12 @@ function Net() {
|
||||||
game.world.update(data);
|
game.world.update(data);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
this.update = function(move) {
|
||||||
|
this.socket.emit('move', {
|
||||||
|
forward: move[0],
|
||||||
|
left: move[1],
|
||||||
|
right: move[2]
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -5,6 +5,8 @@ function Renderer() {
|
||||||
var context = canvas.getContext('2d');
|
var context = canvas.getContext('2d');
|
||||||
var pallet = new Pallet();
|
var pallet = new Pallet();
|
||||||
|
|
||||||
|
this.canvas = canvas;
|
||||||
|
|
||||||
this.render = function(state) {
|
this.render = function(state) {
|
||||||
if (state == 'connecting' || state == 'disconnected') {
|
if (state == 'connecting' || state == 'disconnected') {
|
||||||
pallet.clear();
|
pallet.clear();
|
||||||
|
|
|
@ -2,4 +2,13 @@ function Ship(id) {
|
||||||
this.id = id;
|
this.id = id;
|
||||||
this.x = 0;
|
this.x = 0;
|
||||||
this.y = 0;
|
this.y = 0;
|
||||||
|
this.move = [];
|
||||||
|
this.lastMove = [];
|
||||||
|
|
||||||
|
this.updateMove = function() {
|
||||||
|
if (JSON.stringify(this.move) != JSON.stringify(this.lastMove) || true) {
|
||||||
|
game.net.update(this.move);
|
||||||
|
this.lastMove = Array.apply(0, this.move); // Bloody Javascript.
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -22,6 +22,10 @@ class Connection {
|
||||||
this.player.name = data.name.slice(0, 20) || 'Fish';
|
this.player.name = data.name.slice(0, 20) || 'Fish';
|
||||||
});
|
});
|
||||||
|
|
||||||
|
socket.on('move', data => {
|
||||||
|
this.player.move(data);
|
||||||
|
});
|
||||||
|
|
||||||
this.server.assignRoom(this.player);
|
this.server.assignRoom(this.player);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -17,6 +17,14 @@ class Player {
|
||||||
this.room.remove(this);
|
this.room.remove(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
move(data) {
|
||||||
|
this.ship.move({
|
||||||
|
forward: data.forward || 0,
|
||||||
|
left: data.left || 0,
|
||||||
|
right: data.right || 0
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
sendUpdate() {
|
sendUpdate() {
|
||||||
if (Object.keys(this.delta).length == 0) return;
|
if (Object.keys(this.delta).length == 0) return;
|
||||||
this.connection.send('update', this.delta);
|
this.connection.send('update', this.delta);
|
||||||
|
|
|
@ -51,7 +51,7 @@ class World {
|
||||||
tick(self) {
|
tick(self) {
|
||||||
self.physics.step();
|
self.physics.step();
|
||||||
|
|
||||||
if (Math.random() < 0.001) {
|
if (Math.random() < 0.01) {
|
||||||
self.bodies.forEach(body => body.applyDelta());
|
self.bodies.forEach(body => body.applyDelta());
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -20,7 +20,7 @@ class Physics {
|
||||||
bodyDef.position = new b2Vec2(body.x || 0, body.y || 0);
|
bodyDef.position = new b2Vec2(body.x || 0, body.y || 0);
|
||||||
bodyDef.fixedRotation = false;
|
bodyDef.fixedRotation = false;
|
||||||
bodyDef.active = true;
|
bodyDef.active = true;
|
||||||
bodyDef.linearVelocity = new b2Vec2(body.xvel || 0.05, body.yvel || 0);
|
bodyDef.linearVelocity = new b2Vec2(body.xvel || 0, body.yvel || 0);
|
||||||
bodyDef.angularVelocity = body.rvel || 0;
|
bodyDef.angularVelocity = body.rvel || 0;
|
||||||
bodyDef.type = body.type == 'static' ?
|
bodyDef.type = body.type == 'static' ?
|
||||||
Box2D.b2Body.b2_staticBody : Box2D.b2Body.b2_dynamicBody;
|
Box2D.b2Body.b2_staticBody : Box2D.b2Body.b2_dynamicBody;
|
||||||
|
|
|
@ -5,6 +5,8 @@ const hulls = require('./traits/hulls.json');
|
||||||
|
|
||||||
const Body = require('./body.js');
|
const Body = require('./body.js');
|
||||||
|
|
||||||
|
const b2Vec2 = require('box2d-html5').b2Vec2;
|
||||||
|
|
||||||
class Ship extends Body {
|
class Ship extends Body {
|
||||||
constructor(world, player, build) {
|
constructor(world, player, build) {
|
||||||
super(world);
|
super(world);
|
||||||
|
@ -13,6 +15,28 @@ class Ship extends Body {
|
||||||
this.player = player;
|
this.player = player;
|
||||||
this.structure = hulls[this.build.hull];
|
this.structure = hulls[this.build.hull];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
move(data) {
|
||||||
|
let b = this.b2body;
|
||||||
|
|
||||||
|
for(var i in b) {
|
||||||
|
//if(typeof b[i] == 'function') console.log(i);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (data.forward) {
|
||||||
|
//console.log('forward');
|
||||||
|
b.ApplyLinearImpulse(b2Vec2(0, 500), b.GetWorldCenter());
|
||||||
|
b.ApplyTorque(2000);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (data.left) {
|
||||||
|
b.ApplyTorque(-20);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (data.right) {
|
||||||
|
b.ApplyTorque(20);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = Ship;
|
module.exports = Ship;
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue