From 548fb99c8b8186267b52a141ada56ec5f5fe4358 Mon Sep 17 00:00:00 2001
From: asraelite <markusscully@gmail.com>
Date: Mon, 5 Mar 2018 11:10:20 +0000
Subject: [PATCH] Add right click edit grid interaction

---
 js/game/edit.mjs      | 48 ++++++++++++++++++++++++++++++++++++++++---
 js/game/events.mjs    |  4 ++++
 js/graphics/edit.mjs  | 16 ---------------
 js/graphics/gui.mjs   |  2 +-
 js/graphics/index.mjs |  1 -
 js/graphics/world.mjs |  3 +--
 js/gui/edit.mjs       | 12 ++++++++---
 js/gui/item.mjs       |  5 +++--
 js/world/module.mjs   |  2 ++
 9 files changed, 65 insertions(+), 28 deletions(-)
 delete mode 100644 js/graphics/edit.mjs

diff --git a/js/game/edit.mjs b/js/game/edit.mjs
index 9b635a1..9a35679 100644
--- a/js/game/edit.mjs
+++ b/js/game/edit.mjs
@@ -2,6 +2,9 @@ import * as game from './index.mjs';
 import * as graphics from '../graphics/index.mjs';
 import * as world from '../world/index.mjs';
 import * as consts from '../consts.mjs';
+import * as events from './events.mjs';
+import {modules} from '../data.mjs';
+import {images as assets} from '../assets.mjs';
 
 export let tiles = new Map();
 export let width = 0;
@@ -33,11 +36,39 @@ export function end() {
 
 }
 
-export function getTile(x, y) {
+function trueFromVisible(x, y) {
+	let [px, py] = position;
+	return [x - px, y - py];
+}
+
+export function clickTile(x, y) {
+	if (currentModule !== null) return;
+	let current = getTile(x, y).source;
+	if (current.type !== null) {
+		events.invalidTilePlacement();
+		return;
+	}
+
 	let id = posId(x, y);
+	tiles.set(id, new Tile(x, y, currentModule));
+}
+
+export function rightClickTile(x, y) {
+	let current = getTile(x, y).source;
+	if (current === null) return;
+	let { x: tx, y: ty } = current;
+	let id = posId(tx, ty);
+	tiles.set(id, new Tile(tx, ty, null));
+}
+
+export function getTile(x, y) {
+	let [px, py] = position;
+	let [tx, ty] = [px + x, py + y];
+	let id = posId(tx, ty);
 	if (!tiles.has(id))
-		tiles.set(id, new Tile(x, y, null));
+		tiles.set(id, new Tile(tx, ty, null));
 	return tiles.get(id);
+	// TODO: Get linked tiles.
 }
 
 function posId(x, y) {
@@ -50,7 +81,14 @@ function getBoundaries() {
 
 class Tile {
 	constructor(x, y, module) {
-		this.module = module;
+		if (module === null) {
+			this.module = null;
+			this.image = null;
+		} else {
+			this.module = modules[module.type][module.id];
+			this.image = assets.modules[module.type][module.id];
+			if (module.type === 'thruster') this.image = this.image.off;
+		}
 		this.x = x;
 		this.y = y;
 	}
@@ -59,6 +97,10 @@ class Tile {
 		return true;
 	}
 
+	get source() {
+		return this;
+	}
+
 	get drawPos() {
 		let [px, py] = pos;
 		return [this.x + px, this.y + py];
diff --git a/js/game/events.mjs b/js/game/events.mjs
index f451efe..281571d 100644
--- a/js/game/events.mjs
+++ b/js/game/events.mjs
@@ -31,3 +31,7 @@ export function endEditing() {
 	game.state.editing = false;
 	edit.end();
 }
+
+export function invalidTilePlacement() {
+	// TODO: Play some audio.
+}
diff --git a/js/graphics/edit.mjs b/js/graphics/edit.mjs
deleted file mode 100644
index 01b972b..0000000
--- a/js/graphics/edit.mjs
+++ /dev/null
@@ -1,16 +0,0 @@
-import {context} from './index.mjs';
-import * as edit from '../game/edit.mjs';
-import * as world from '../world/index.mjs';
-
-export function render() {
-	let ship = world.playerShip;
-
-	context.save();
-	context.translate(...ship.com);
-	context.rotate(ship.r);
-	let [cx, cy] = ship.localCom;
-
-	context.translate(-cx, -cy);
-
-	context.restore();
-}
diff --git a/js/graphics/gui.mjs b/js/graphics/gui.mjs
index c59efb6..3f7cf2f 100644
--- a/js/graphics/gui.mjs
+++ b/js/graphics/gui.mjs
@@ -49,7 +49,7 @@ function renderButton(element) {
 
 function renderItemButton(element) {
 	context.globalAlpha = 0.5;
-	if (element.mouseHeld) {
+	if (element.mouseHeld || element.rightMouseHeld) {
 		context.fillStyle = '#080808';
 	} else {
 		context.fillStyle = element.mouseOver ? '#222' : '#0e0e0e';
diff --git a/js/graphics/index.mjs b/js/graphics/index.mjs
index 3327e6f..689b3cb 100644
--- a/js/graphics/index.mjs
+++ b/js/graphics/index.mjs
@@ -3,7 +3,6 @@ import * as draw from './draw.mjs';
 import * as input from '../input.mjs';
 import {render as renderWorld} from './world.mjs';
 import {render as renderBackground} from './background.mjs';
-import {render as renderEdit} from './edit.mjs';
 import * as world from '../world/index.mjs';
 import * as consts from '../consts.mjs';
 
diff --git a/js/graphics/world.mjs b/js/graphics/world.mjs
index 78a11f4..8c76957 100644
--- a/js/graphics/world.mjs
+++ b/js/graphics/world.mjs
@@ -1,7 +1,6 @@
 import {canvas, context} from './index.mjs';
 import {images as assets} from '../assets.mjs';
 import * as world from '../world/index.mjs';
-import * as edit from './edit.mjs';
 import {state} from '../game/index.mjs';
 
 export function render() {
@@ -24,7 +23,7 @@ function renderShip(ship) {
 	ship.modules.forEach(m => {
 		let [mx, my] = [m.x, m.y];
 		if (state.editing) {
-			
+
 		}
 		context.drawImage(m.currentImage, m.x, m.y, 1, 1);
 	});
diff --git a/js/gui/edit.mjs b/js/gui/edit.mjs
index 80df1a5..cb3bbed 100644
--- a/js/gui/edit.mjs
+++ b/js/gui/edit.mjs
@@ -35,7 +35,7 @@ export default class GuiEdit extends GuiElement {
 
 		for (let x = 0; x < this.tileWidth; x++)
 		for (let y = 0; y < this.tileHeight; y++) {
-			let tile = this.getTile(x, y);
+			let tile = edit.getTile(x, y);
 			let ex = x * tileSize + spacing / 2 + ox + this.x;
 			let ey = y * tileSize + spacing / 2 + oy + this.y;
 			let [ew, eh] = [tileSize - spacing, tileSize - spacing];
@@ -44,7 +44,7 @@ export default class GuiEdit extends GuiElement {
 				this.tileClicked(x, y, button);
 			};
 
-			let el = new GuiItemButton(tile.module, onclick, ex, ey, ew, eh);
+			let el = new GuiItemButton(tile, onclick, ex, ey, ew, eh);
 			this.append(el);
 		}
 	}
@@ -64,6 +64,12 @@ export default class GuiEdit extends GuiElement {
 	}
 
 	tileClicked(x, y, button) {
-		console.log(x, y, button);
+		if (button == 'left') {
+			edit.clickTile(x, y);
+		} else if (button == 'right') {
+			edit.rightClickTile(x, y);
+		}
+
+		this.updateTiles();
 	}
 }
diff --git a/js/gui/item.mjs b/js/gui/item.mjs
index 1a997d6..f1525aa 100644
--- a/js/gui/item.mjs
+++ b/js/gui/item.mjs
@@ -2,9 +2,10 @@ import * as gui from './index.mjs';
 import GuiButton from './button.mjs';
 
 export default class GuiItemButton extends GuiButton {
-	constructor(module, onclick, x, y, w = 50, h = 50) {
+	constructor(tile, onclick, x, y, w = 50, h = 50) {
 		super(null, onclick, x, y, w, h);
-		this.image = module === null ? null : module.currentImage;
+		this.module = tile.module;
+		this.image = tile.image;
 		this.type = 'itemButton';
 	}
 
diff --git a/js/world/module.mjs b/js/world/module.mjs
index 9675f7a..f5b4b4b 100644
--- a/js/world/module.mjs
+++ b/js/world/module.mjs
@@ -1,3 +1,4 @@
+import {modules} from '../data.mjs';
 import {images as assets} from '../assets.mjs';
 
 export default class Module {
@@ -19,6 +20,7 @@ export default class Module {
 		this.ship = ship;
 		this.id = id;
 		this.images = assets.modules[this.type][this.id];
+		this.data = modules[this.type][this.id];
 		// Fuel
 		if (this.type == 'fuel') {
 			this.fuel = filled ? fuelCapacity : 0;