Add basic planet collision

js/consts.mjs

@@ -12,7 +12,7 @@ export const STAR_DENSITY = (SECTOR_SIZE ** 2) / 10000;
 // G, G-boy, The big G, Mr. G, g's big brother, G-dog
 export const GRAVITATIONAL_CONSTANT = 0.01;
 // Perspective constraints. Higher zoom value = closer.
-export const MIN_ZOOM = 2;
+export const MIN_ZOOM = 1;
 export const MAX_ZOOM = 30;
 export const DEFAULT_ZOOM = 10;
 export const ZOOM_SPEED = 0.01;

js/game/index.mjs

@@ -18,7 +18,7 @@ export async function init() {
 	gui.init();
 	input.init();
 
-	events.startGame();
+	//events.startGame();
 
 	//tick(); return;
 

js/graphics/index.mjs

@@ -102,10 +102,10 @@ class Perspective {
 	}
 
 	transformCanvas() {
-		let [bx, by, bw, bh] = this.bounds;
+		let [,,bw, bh] = this.bounds;
-		let tx = -this.x + bw / 2;
+		let tx = -this.x * this.zoom;
-		let ty = -this.y + bh / 2;
+		let ty = -this.y * this.zoom;
-		context.translate(tx, ty);
+		context.translate(tx + bw / 2, ty + bh / 2);
 		context.scale(this.zoom, this.zoom);
 	}
 }

js/graphics/world.mjs

@@ -3,8 +3,8 @@ import {images as assets} from '../assets.mjs';
 import * as world from '../world/index.mjs';
 
 export function render() {
-	world.ships.forEach(renderShip);
 	world.celestials.forEach(renderCelestial);
+	world.ships.forEach(renderShip);
 }
 
 function renderShip(ship) {
@@ -24,5 +24,6 @@ const celestialImages = {
 }
 
 function renderCelestial(cel) {
-	context.drawImage(cel.image, cel.x, cel.y, cel.diameter, cel.diameter);
+	context.drawImage(cel.image, cel.x - cel.radius, cel.y - cel.radius,
+		cel.diameter, cel.diameter);
 }

js/world/body.mjs

@@ -11,9 +11,14 @@ export default class Body {
 		this.mass = mass;
 	}
 
+	tickMotion() {
+		this.x += this.xvel;
+		this.y += this.yvel;
+	}
+
 	tickGravity(bodies) {
 		bodies.forEach(b => {
-			let force = b.mass / this.mass / (distanceTo(b) ** 2) * G;
+			let force = b.mass / this.mass / (this.distanceTo(b) ** 2) * G;
 			let angle = Math.atan2(b.y - this.y, b.x - this.x);
 			this.xvel += Math.cos(angle) * force;
 			this.yvel += Math.sin(angle) * force;
@@ -21,6 +26,18 @@ export default class Body {
 	}
 
 	distanceTo(body) {
-		return Math.sqrt(((body.x - this.x) ** 2) + ((body.y - this.y) ** 2));
+		return Math.max(Math.sqrt(((body.x - this.x) ** 2) +
+			((body.y - this.y) ** 2)), 1);
+	}
+
+	approach(body, distance) {
+		let angle = Math.atan2(body.y - this.y, body.x - this.x);
+		this.x += Math.cos(angle) * distance;
+		this.y += Math.sin(angle) * distance;
+	}
+
+	halt() {
+		this.xvel = 0;
+		this.yvel = 0;
 	}
 }

js/world/ship.mjs

@@ -1,5 +1,6 @@
 import Module from './module.mjs';
 import Body from './body.mjs';
+import * as world from './index.mjs';
 
 export default class Ship extends Body {
 	constructor(x, y) {
@@ -10,7 +11,9 @@ export default class Ship extends Body {
 	}
 
 	tick() {
-
+		this.tickMotion();
+		this.tickGravity(world.celestials);
+		this.resolveCollisions();
 	}
 
 	addModule(x, y, properties, options) {
@@ -32,4 +35,14 @@ export default class Ship extends Body {
 			[ax + b.x * b.mass, ay + b.y * b.mass], [0, 0])
 			.map(x => x / this.mass);
 	}
+
+	resolveCollisions() {
+		world.celestials.forEach(c => {
+			let dis = this.distanceTo(c);
+			if (dis < c.radius) {
+				this.approach(c, dis - c.radius);
+				this.halt();
+			}
+		})
+	}
 }