Add inventory

js/game/control.mjs

@@ -2,13 +2,15 @@ import * as input from '../input.mjs';
 import * as events from './events.mjs';
 import * as player from './player.mjs';
 import * as graphics from '../graphics/index.mjs';
+import * as inventory from './inventory.mjs';
 import {state} from './index.mjs';
 
 export const mapping = {
 	thrust: 'KeyW',
 	left: 'KeyA',
 	right: 'KeyD',
-	exitEdit: 'Escape'
+	exitEdit: 'Escape',
+	inventory: 'KeyE',
 };
 
 let held, pressed;
@@ -42,6 +44,10 @@ function tickPlaying() {
 	if (held[mapping.right]) {
 		player.ship.applyThrust({ turnRight: 1 });
 	}
+
+	if (pressed[mapping.inventory]) {
+		state.inventory = !state.inventory;
+	}
 }
 
 function tickEditing() {

js/game/events.mjs

@@ -23,12 +23,14 @@ export function launchShip() {
 
 export function editShip() {
 	game.state.editing = true;
+	game.state.inventory = true;
 	edit.init();
 }
 
 export function endEditing() {
 	graphics.changePerspective('universe');
 	game.state.editing = false;
+	game.state.inventory = false;
 	edit.end();
 }
 

js/game/index.mjs

@@ -2,6 +2,7 @@ import * as graphics from '../graphics/index.mjs';
 import * as gui from '../gui/index.mjs';
 import * as assets from '../assets.mjs';
 import * as input from '../input.mjs';
+import * as inventory from './inventory.mjs';
 import * as world from '../world/index.mjs';
 import * as events from './events.mjs';
 import * as control from './control.mjs';
@@ -15,7 +16,8 @@ export async function init() {
 		view: 'menu',
 		playing: false,
 		editing: false,
-		paused: false
+		paused: false,
+		inventory: false
 	};
 
 	graphics.init();
@@ -29,7 +31,7 @@ export async function init() {
 
 	// Recursive `requestAnimationFrame` can cause problems with Parcel.
 	while(true) {
-		await tick();
+		tick();
 		await new Promise(res => requestAnimationFrame(res));
 	}
 }
@@ -44,10 +46,11 @@ export function changeView(view) {
 		state.paused = false;
 		world.init();
 		player.init();
+		inventory.init();
 	}
 }
 
-async function tick() {
+function tick() {
 	if (state.view == 'game') {
 		world.tick();
 		control.tick();

js/game/inventory.mjs

@@ -0,0 +1,62 @@
+import {modules} from '../data.mjs';
+import {images as assets} from '../assets.mjs';
+
+export const items = new Map();
+export let currentItem = null;
+
+export function init() {
+	items.clear();
+	addItem('capsule', 'small');
+	addItem('thruster', 'light');
+}
+
+export function getTiles() {
+	let list = Array.from(items.values());
+	list.sort((a, b) => toId(...a.ident) < toId(...b.ident));
+	return list;
+}
+
+export function addItem(type, id) {
+	let mapId = toId(type, id);
+	if (!items.has(mapId)) items.set(mapId, new Tile(type, id));
+	let tile = items.get(mapId);
+	tile.increase();
+}
+
+export function removeItem(type, id) {
+	let mapId = toId(type, id);
+	if (!items.has(mapId)) return;
+	let tile = items.get(mapId);
+	tile.decrease();
+}
+
+export function selectItem(type, id) {
+	currentItem = items.get(toId(type, id));
+}
+
+function toId(type, id) {
+	return `${type}.${id}`;
+}
+
+class Tile {
+	constructor(type, id, q = 0) {
+		this.type = type;
+		this.id = id;
+		this.mapId = toId(type, id);
+		this.quantity = q;
+		this.image = assets.modules[type][id];
+		if (type === 'thruster') this.image = this.image.off;
+	}
+
+	get ident() {
+		return [this.type, this.id];
+	}
+
+	increase() {
+		this.quantity++;
+	}
+
+	decrease() {
+		this.quantity = Math.max(0, this.quantity - 1);
+	}
+}