From 05ad81ed8d9fcbbe3975c321fd0e7ced1c3a70fe Mon Sep 17 00:00:00 2001 From: Asraelite Date: Tue, 22 Mar 2016 11:56:53 +0000 Subject: [PATCH] add basic ship movement and tracking --- public/js/starbugs/net.js | 4 ++++ public/js/starbugs/render/render.js | 35 +++++++++++++++++++---------- public/js/starbugs/render/ships.js | 3 +++ public/js/starbugs/world/world.js | 6 +++-- server/game/player.js | 4 ++++ server/game/room/index.js | 1 + server/game/room/world/body.js | 11 +++++++++ server/game/room/world/index.js | 2 +- server/game/room/world/physics.js | 13 ++++++----- server/game/room/world/ship.js | 13 +++++------ 10 files changed, 65 insertions(+), 27 deletions(-) create mode 100644 public/js/starbugs/render/ships.js diff --git a/public/js/starbugs/net.js b/public/js/starbugs/net.js index ed394bf..9a42f0b 100644 --- a/public/js/starbugs/net.js +++ b/public/js/starbugs/net.js @@ -17,6 +17,10 @@ function Net() { this.socket.on('update', function(data) { game.world.update(data); }); + + this.socket.on('world', function(data) { + game.world.playerShipId = data; + }); }; this.update = function(move) { diff --git a/public/js/starbugs/render/render.js b/public/js/starbugs/render/render.js index d156381..7cec100 100644 --- a/public/js/starbugs/render/render.js +++ b/public/js/starbugs/render/render.js @@ -8,37 +8,48 @@ function Renderer() { this.canvas = canvas; this.render = function(state) { + var ship = game.world.playerShip || { x: 0, y: 0 }; + var cx = ship.x; + var cy = ship.y; + var cw = canvas.width; + var ch = canvas.height; + if (state == 'connecting' || state == 'disconnected') { pallet.clear(); pallet.fill('#111'); var str = state == 'connecting' ? 'Connecting' : 'Shit\'s ' + - 'diconnected, yo!'; - pallet.text(str, canvas.width / 2, canvas.height / 2, '#fff', 'FreePixel', 16, 'center', 'middle'); + 'diconnected, yo!'; + pallet.text(str, canvas.width / 2, canvas.height / 2, '#fff', + 'FreePixel', 16, 'center', 'middle'); return; } pallet.clear(); pallet.fill('#000'); - this.renderGrid(); + context.save(); + + context.translate(-cx + cw / 2, -cy + ch / 2); + + // Grid + var gridx = ((cx / 50) | 0) * 50; + var gridy = ((cy / 50) | 0) * 50; + for (var x = gridx - cw / 2 - 50; x < cx + cw + 50; x += 50) { + for (var y = gridy - ch / 2 - 50; y < cy + ch + 50; y += 50) { + pallet.outline('#0a0a0a', x, y, 51, 51, 1); + } + } for (var id in game.world.bodies) { var body = game.world.bodies[id]; pallet.rect('#338', body.x, body.y, 10, 10); } + + context.restore(); } this.renderGrid = function() { - var ox = (game.world.playerShip.x || 0) % 50; - var oy = (game.world.playerShip.y || 0) % 50; - - - for (var x = -50 + ox; x < canvas.width + 50; x += 50) { - for (var y = -50 + oy; y < canvas.height + 50; y += 50) { - pallet.outline('#0a0a0a', x, y, 51, 51, 1); - } - } } pallet.fillScreen(); diff --git a/public/js/starbugs/render/ships.js b/public/js/starbugs/render/ships.js new file mode 100644 index 0000000..dd723fd --- /dev/null +++ b/public/js/starbugs/render/ships.js @@ -0,0 +1,3 @@ +function RenderShip(ship) { + +} diff --git a/public/js/starbugs/world/world.js b/public/js/starbugs/world/world.js index ce840ef..36a8999 100644 --- a/public/js/starbugs/world/world.js +++ b/public/js/starbugs/world/world.js @@ -1,12 +1,14 @@ function World() { this.bodies = {}; this.playerShip = false; + this.playerShipId = false; this.update = function(data) { + this.playerShip = this.bodies[this.playerShipId]; + for (var id in data) { if (!this.bodies[id]) { this.bodies[id] = new Ship(id); - this.playerShip = this.bodies[id]; } var body = this.bodies[id]; @@ -14,7 +16,7 @@ function World() { body.y = data[id][1]; body.r = data[id][2]; - + } } } diff --git a/server/game/player.js b/server/game/player.js index 908c4fe..5b1bbd4 100644 --- a/server/game/player.js +++ b/server/game/player.js @@ -25,6 +25,10 @@ class Player { }); } + sendWorld() { + this.connection.send('world', this.ship.id); + } + sendUpdate() { if (Object.keys(this.delta).length == 0) return; this.connection.send('update', this.delta); diff --git a/server/game/room/index.js b/server/game/room/index.js index e539dc4..8136588 100644 --- a/server/game/room/index.js +++ b/server/game/room/index.js @@ -20,6 +20,7 @@ class Room { this.players.add(player); this.setTeam(player, this.teamA.size > this.teamB.size ? 'b' : 'a'); this.world.addPlayer(player); + player.sendWorld(); } remove(player) { diff --git a/server/game/room/world/body.js b/server/game/room/world/body.js index b3c193f..9bd21ba 100644 --- a/server/game/room/world/body.js +++ b/server/game/room/world/body.js @@ -2,6 +2,8 @@ const uuid = require('uuid'); +const b2Vec2 = require('box2d-html5').b2Vec2; + class Body { constructor(world) { this.x = 0; @@ -18,6 +20,15 @@ class Body { this.world.applyDelta(this.id, this.pack()); } + applyForce(x, y, center) { + let b = this.b2body; + b.ApplyForce(new b2Vec2(x, y), b.GetWorldCenter()); + } + + applyTorque(f) { + this.b2body.ApplyTorque(f); + } + pack() { let pos = this.b2body.GetPosition(); let rot = this.b2body.GetAngleRadians(); diff --git a/server/game/room/world/index.js b/server/game/room/world/index.js index 4e27e57..fe77e38 100644 --- a/server/game/room/world/index.js +++ b/server/game/room/world/index.js @@ -51,7 +51,7 @@ class World { tick(self) { self.physics.step(); - if (Math.random() < 0.01) { + if (Math.random() < 0.1) { self.bodies.forEach(body => body.applyDelta()); } } diff --git a/server/game/room/world/physics.js b/server/game/room/world/physics.js index c2f6a8c..b237cde 100644 --- a/server/game/room/world/physics.js +++ b/server/game/room/world/physics.js @@ -4,6 +4,8 @@ // so most changes done to it should be mirrored there to keep consistent // physics between client and server. +const SCALE = 32; + const Box2D = require('box2d-html5'); const b2Vec2 = Box2D.b2Vec2; @@ -15,15 +17,17 @@ class Physics { } createBody(body) { + let s = SCALE; let bodyDef = new Box2D.b2BodyDef(); bodyDef.userData = body; - bodyDef.position = new b2Vec2(body.x || 0, body.y || 0); + bodyDef.position = new b2Vec2(body.x / s || 0, body.y / s || 0); bodyDef.fixedRotation = false; bodyDef.active = true; - bodyDef.linearVelocity = new b2Vec2(body.xvel || 0, body.yvel || 0); + bodyDef.linearVelocity = new b2Vec2(body.xvel / s || 0, body.yvel / s || 0); bodyDef.angularVelocity = body.rvel || 0; bodyDef.type = body.type == 'static' ? - Box2D.b2Body.b2_staticBody : Box2D.b2Body.b2_dynamicBody; + Box2D.b2BodyType.b2_staticBody : Box2D.b2BodyType.b2_dynamicBody; + if (body.player) bodyDef.allowSleep = false; let b2body = this.world.CreateBody(bodyDef); let fixtureDef = new Box2D.b2FixtureDef(); @@ -32,7 +36,7 @@ class Physics { fixtureDef.restitution = 0; for (var poly of body.structure) { - poly = poly.map(vertex => new b2Vec2(vertex[0], vertex[1])); + poly = poly.map(vertex => new b2Vec2(vertex[0] / s, vertex[1] / s)); fixtureDef.shape = new Box2D.b2PolygonShape(); fixtureDef.shape.SetAsArray(poly, poly.length); b2body.CreateFixture(fixtureDef); @@ -46,7 +50,6 @@ class Physics { for (var i = 0; i < this.toRemove.length; i++) { this.world.DestroyBody(this.toRemove[i].b2body); - console.log(this.world.GetBodyList()); } this.toRemove = []; diff --git a/server/game/room/world/ship.js b/server/game/room/world/ship.js index 8be7081..c20fdab 100644 --- a/server/game/room/world/ship.js +++ b/server/game/room/world/ship.js @@ -5,8 +5,6 @@ const hulls = require('./traits/hulls.json'); const Body = require('./body.js'); -const b2Vec2 = require('box2d-html5').b2Vec2; - class Ship extends Body { constructor(world, player, build) { super(world); @@ -24,17 +22,18 @@ class Ship extends Body { } if (data.forward) { - //console.log('forward'); - b.ApplyLinearImpulse(b2Vec2(0, 500), b.GetWorldCenter()); - b.ApplyTorque(2000); + let power = 0.02; + let x = Math.cos(this.b2body.GetAngleRadians()) * power; + let y = Math.sin(this.b2body.GetAngleRadians()) * power; + this.applyForce(x, y); } if (data.left) { - b.ApplyTorque(-20); + this.applyTorque(-0.02); } if (data.right) { - b.ApplyTorque(20); + this.applyTorque(0.02); } } }