scale rendering

public/js/starbugs/render/render.js

@@ -1,16 +1,21 @@
 function Renderer() {
 	var self = this;
 
-	var canvas = document.getElementsByTagName('canvas')[0];
-	var context = canvas.getContext('2d');
-	var pallet = new Pallet();
+	var s = SCALE;
 
+	var pallet = new Pallet();
+	var canvas = pallet.canvas;
+	var context = pallet.context;
+
+	this.pallet = pallet;
 	this.canvas = canvas;
+	this.context = context;
 
 	this.render = function(state) {
-		var ship = game.world.playerShip || { x: 0, y: 0 };
-		var cx = ship.x;
-		var cy = ship.y;
+		var ship = game.world.playerShip;
+		var cpos = game.world.getCenter();
+		var cx = -cpos.x;
+		var cy = -cpos.y;
 		var cw = canvas.width;
 		var ch = canvas.height;
 
@@ -29,11 +34,12 @@ function Renderer() {
 
 		context.save();
 
-		context.translate(-cx + cw / 2, -cy + ch / 2);
+		pallet.view(cw / 2, ch / 2, 1, 0);
+		//context.translate(-cx / s, -cy / s);
 
 		// Grid
-		var gridx = ((cx / 50) | 0) * 50;
-		var gridy = ((cy / 50) | 0) * 50;
+		var gridx = cx % 50;
+		var gridy = cy % 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);
@@ -50,7 +56,7 @@ function Renderer() {
 			}
 		}
 
-		context.restore();
+		pallet.restore();
 	}
 
 	this.renderGrid = function() {

public/js/starbugs/render/ships.js

@@ -5,7 +5,16 @@ function renderShip(pallet, ship) {
 	var thr5 = game.assets.images.ships[ship.hull].thrust5;
 	var thr8 = game.assets.images.ships[ship.hull].thrust8;
 	//pallet.view(ship.x, ship.y, false, ship.r);
-	pallet.image(col, ship.x, ship.y, ship.r);
-	pallet.image(img, ship.x, ship.y, ship.r);
-	pallet.image(ship.move[0] ? thr8 : thr0, ship.x, ship.y, ship.r);
+	var pos = ship.getPos();
+	var x = pos.x + 16;
+	var y = pos.y + 16;
+	var vx = -game.world.getCenter().x;
+	var vy = -game.world.getCenter().y;
+
+	pallet.view(x + vx, y + vy, false, ship.r);
+	pallet.image(col, 0, 0, 0);
+	pallet.image(img, 0, 0, 0);
+	pallet.image(ship.move[0] ? thr8 : thr0, 0, 0, 0);
+
+	pallet.restore();
 }

public/js/starbugs/world/Untitled Document

@@ -0,0 +1,3 @@
+function Body() {
+
+}

public/js/starbugs/world/ship.js

@@ -7,6 +7,19 @@ function Ship(id) {
 	this.move = [];
 	this.lastMove = [];
 	this.bodyType = 'ship';
+	this.com = {
+		x: 16,
+		y: 17.6
+	};
+
+	var s = SCALE;
+
+	this.getPos = function() {
+		return {
+			x: this.x * s,
+			y: this.y * s
+		}
+	}
 
 	this.updateMove = function() {
 		if (JSON.stringify(this.move) != JSON.stringify(this.lastMove) || true) {

public/js/starbugs/world/world.js

@@ -1,8 +1,27 @@
+var SCALE = 32;
+
 function World() {
 	this.bodies = {};
 	this.playerShip = false;
 	this.playerShipId = false;
 
+	this.getCenter = function() {
+		if (!this.playerShip) return { x: 0, y: 0 };
+
+		var x = this.playerShip.getPos().x;
+		var y = this.playerShip.getPos().y;
+		var comx = this.playerShip.com.x;
+		var comy = this.playerShip.com.y;
+		var r = this.playerShip.r;
+		var d = Math.sqrt(comx * comx + comy * comy);
+		var a = Math.atan2(comy, comx);
+
+		x += Math.cos(a + r) * d;
+		y += Math.sin(a + r) * d;
+
+		return { x: x, y: y };
+	}
+
 	this.clear = function() {
 		this.bodies = {};
 		this.playerShip = false;

server/game/room/world/ship.js

@@ -17,12 +17,15 @@ class Ship extends Body {
 	move(data) {
 		let b = this.b2body;
 
+
+		//console.log(b.GetLocalCenter());
+
 		for(var i in b) {
 			//if(typeof b[i] == 'function') console.log(i);
 		}
 
 		if (data.forward) {
-			let power = 0.05;
+			let power = 0.002;
 			let x = Math.cos(this.b2body.GetAngleRadians()) * power;
 			let y = Math.sin(this.b2body.GetAngleRadians()) * power;
 			this.applyForce(x, y);

server/game/room/world/traits/hulls.json

@@ -2,9 +2,9 @@
 	"01": [
 		[
 			[1, 28],
-			[30, 28],
-			[30, 19],
-			[18, 2],
+			[31, 28],
+			[31, 19],
+			[19, 2],
 			[13, 2],
 			[1, 19]
 		]