Remove occupancy grid -- map maker can handle it
This commit is contained in:
24
ts/grid.ts
24
ts/grid.ts
@@ -5,8 +5,6 @@ export class Grid {
|
||||
#prnt: HTMLElement;
|
||||
#tileset: string;
|
||||
#layers: Map<string, Layer> = new Map<string, Layer>();
|
||||
#size_x: number;
|
||||
#size_y: number;
|
||||
|
||||
constructor(prnt: HTMLElement) {
|
||||
this.#prnt = prnt;
|
||||
@@ -14,20 +12,13 @@ export class Grid {
|
||||
}
|
||||
|
||||
set_size(x: number, y: number) {
|
||||
this.#size_x = x;
|
||||
this.#size_y = y;
|
||||
|
||||
// TODO: Notify layers if shrink
|
||||
|
||||
this.#prnt.style.gridTemplateColumns = `repeat(${x}, 1fr)`;
|
||||
this.#prnt.style.gridTemplateRows = `repeat(${y}, 1fr)`;
|
||||
|
||||
// TODO: Notify layers if expand
|
||||
}
|
||||
|
||||
set_tileset(set: string) {
|
||||
this.#tileset = set;
|
||||
this.#prnt.style.backgroundImage = this.get_url('land');
|
||||
this.#prnt.style.backgroundImage = `url("images/${this.#tileset}/land.svg")`;
|
||||
|
||||
// TODO: Notify layers
|
||||
}
|
||||
@@ -37,7 +28,7 @@ export class Grid {
|
||||
|
||||
for (const name of newNames) {
|
||||
if (!this.#layers.has(name)) {
|
||||
const layer = new Layer(this.#size_x, this.#size_y);
|
||||
const layer = new Layer();
|
||||
layer.set_tileset(this.#tileset);
|
||||
this.#layers.set(name, layer);
|
||||
}
|
||||
@@ -58,19 +49,12 @@ export class Grid {
|
||||
}
|
||||
}
|
||||
|
||||
add_tile(layer: string, tile: Tile, x: number, y: number): boolean {
|
||||
const elem = this.#layers.get(layer)?.add_tile(tile, x, y);
|
||||
if (!elem) {
|
||||
return false;
|
||||
}
|
||||
add_tile(layer: string, tile: Tile, x: number, y: number) {
|
||||
const elem = this.#layers.get(layer)!.add_tile(tile);
|
||||
// Grids are 1-indexed
|
||||
elem.style.gridColumnStart = `${x + 1}`;
|
||||
elem.style.gridRowStart = `${y + 1}`;
|
||||
this.#prnt.appendChild(elem);
|
||||
return true;
|
||||
}
|
||||
|
||||
private get_url(tile: string) {
|
||||
return `url("images/${this.#tileset}/${tile}.svg")`;
|
||||
}
|
||||
}
|
||||
|
||||
67
ts/layer.ts
67
ts/layer.ts
@@ -1,24 +1,9 @@
|
||||
import { Tile } from './tile.js';
|
||||
|
||||
export class Layer {
|
||||
#size_x: number;
|
||||
#size_y: number;
|
||||
#level: number;
|
||||
#tileset: string;
|
||||
|
||||
#occupied: boolean[][];
|
||||
|
||||
constructor(size_x: number, size_y: number) {
|
||||
this.#size_x = size_x;
|
||||
this.#size_y = size_y;
|
||||
|
||||
this.#occupied = [];
|
||||
|
||||
for (let xi = 0; xi < this.#size_x; xi++) {
|
||||
this.#occupied.push(Array(this.#size_y).fill(false));
|
||||
}
|
||||
}
|
||||
|
||||
set_level(level: number) {
|
||||
this.#level = level;
|
||||
}
|
||||
@@ -27,59 +12,9 @@ export class Layer {
|
||||
this.#tileset = tileset;
|
||||
}
|
||||
|
||||
add_tile(tile: Tile, x: number, y: number): HTMLElement | undefined {
|
||||
if (!this.can_add(tile, x, y)) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
this.mark_occupied(tile, x, y);
|
||||
|
||||
add_tile(tile: Tile): HTMLElement {
|
||||
const elem = tile.get_elem(this.#tileset);
|
||||
elem.style.zIndex = `${this.#level}`;
|
||||
|
||||
return elem;
|
||||
}
|
||||
|
||||
private can_add(tile: Tile, x: number, y: number) {
|
||||
const mask = tile.get_mask();
|
||||
|
||||
for (let xi = 0; xi < mask.length; xi++) {
|
||||
if (x + xi >= this.#occupied.length) {
|
||||
// Shape goes off grid (x)
|
||||
return false;
|
||||
}
|
||||
|
||||
for (let yi = 0; yi < mask[xi].length; yi++) {
|
||||
if (!mask[xi][yi]) {
|
||||
continue;
|
||||
}
|
||||
|
||||
if (y + yi >= this.#occupied[x + xi].length) {
|
||||
// Shape goes off grid (y)
|
||||
return false;
|
||||
}
|
||||
|
||||
if (this.#occupied[x + xi][y + yi]) {
|
||||
// Conflicts
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
private mark_occupied(tile: Tile, x: number, y: number) {
|
||||
const mask = tile.get_mask();
|
||||
|
||||
for (let xi = 0; xi < mask.length; xi++) {
|
||||
for (let yi = 0; yi < mask[xi].length; yi++) {
|
||||
if (!mask[xi][yi]) {
|
||||
continue;
|
||||
}
|
||||
|
||||
this.#occupied[x + xi][y + yi] = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
20
ts/tile.ts
20
ts/tile.ts
@@ -2,27 +2,11 @@ export class Tile {
|
||||
#name: string;
|
||||
#width: number;
|
||||
#height: number;
|
||||
#mask: boolean[][];
|
||||
|
||||
constructor(name: string, width: number, height: number, mask: boolean[][]) {
|
||||
constructor(name: string, width: number, height: number) {
|
||||
this.#name = name;
|
||||
this.#width = width;
|
||||
this.#height = height;
|
||||
this.#mask = mask;
|
||||
}
|
||||
|
||||
static rectangle(name: string, width: number, height: number): Tile {
|
||||
const mask = Array(width).fill(Array(height).fill(true));
|
||||
return new Tile(name, width, height, mask);
|
||||
}
|
||||
|
||||
static from_mask(name: string, mask_string: string): Tile {
|
||||
const mask = string_to_mask(mask_string);
|
||||
return new Tile(name, mask.length, mask[0].length, mask);
|
||||
}
|
||||
|
||||
get_mask(): boolean[][] {
|
||||
return this.#mask;
|
||||
}
|
||||
|
||||
get_elem(tileset: string): HTMLElement {
|
||||
@@ -35,6 +19,7 @@ export class Tile {
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
function string_to_mask(mask_string: string): boolean[][] {
|
||||
// mask_string: '\n+++\n+++\n'
|
||||
|
||||
@@ -57,3 +42,4 @@ function string_to_mask(mask_string: string): boolean[][] {
|
||||
|
||||
return mask;
|
||||
}
|
||||
*/
|
||||
|
||||
47
ts/tiles.ts
47
ts/tiles.ts
@@ -1,44 +1,35 @@
|
||||
import { Tile } from './tile.js';
|
||||
|
||||
// Straight
|
||||
export const ROAD_LR = Tile.rectangle('road-lr', 6, 4);
|
||||
export const ROAD_TB = Tile.rectangle('road-tb', 4, 6);
|
||||
export const ROAD_LR = new Tile('road-lr', 6, 4);
|
||||
export const ROAD_TB = new Tile('road-tb', 4, 6);
|
||||
|
||||
// Elbow
|
||||
export const ROAD_BL = Tile.rectangle('road-bl', 6, 6);
|
||||
export const ROAD_BR = Tile.rectangle('road-br', 6, 6);
|
||||
export const ROAD_TL = Tile.rectangle('road-tl', 6, 6);
|
||||
export const ROAD_TR = Tile.rectangle('road-tr', 6, 6);
|
||||
export const ROAD_BL = new Tile('road-bl', 6, 6);
|
||||
export const ROAD_BR = new Tile('road-br', 6, 6);
|
||||
export const ROAD_TL = new Tile('road-tl', 6, 6);
|
||||
export const ROAD_TR = new Tile('road-tr', 6, 6);
|
||||
|
||||
// T
|
||||
export const ROAD_BLR = Tile.rectangle('road-blr', 8, 6);
|
||||
export const ROAD_TLR = Tile.rectangle('road-tlr', 8, 6);
|
||||
export const ROAD_LTB = Tile.rectangle('road-ltb', 6, 8);
|
||||
export const ROAD_RTB = Tile.rectangle('road-rtb', 6, 8);
|
||||
export const ROAD_BLR = new Tile('road-blr', 8, 6);
|
||||
export const ROAD_TLR = new Tile('road-tlr', 8, 6);
|
||||
export const ROAD_LTB = new Tile('road-ltb', 6, 8);
|
||||
export const ROAD_RTB = new Tile('road-rtb', 6, 8);
|
||||
|
||||
// +
|
||||
export const ROAD_TBLR = Tile.from_mask('road-tblr', `
|
||||
.xxxxxx.
|
||||
xxxxxxxx
|
||||
xxxxxxxx
|
||||
xxxxxxxx
|
||||
xxxxxxxx
|
||||
xxxxxxxx
|
||||
xxxxxxxx
|
||||
.xxxxxx.
|
||||
`);
|
||||
export const ROAD_TBLR = new Tile('road-tblr', 8, 8);
|
||||
|
||||
// Tower base
|
||||
export const EMPTY = Tile.rectangle('empty', 4, 2);
|
||||
export const EMPTY = new Tile('empty', 4, 2);
|
||||
|
||||
// Straight
|
||||
export const RIVER_LR = Tile.rectangle('river-lr', 6, 4);
|
||||
export const RIVER_TB = Tile.rectangle('river-tb', 4, 6);
|
||||
export const RIVER_LR = new Tile('river-lr', 6, 4);
|
||||
export const RIVER_TB = new Tile('river-tb', 4, 6);
|
||||
|
||||
// Elbow
|
||||
export const RIVER_BR = Tile.rectangle('river-br', 6, 6);
|
||||
export const RIVER_BL = Tile.rectangle('river-bl', 6, 6);
|
||||
export const RIVER_TR = Tile.rectangle('river-tr', 6, 6);
|
||||
export const RIVER_TL = Tile.rectangle('river-tl', 6, 6);
|
||||
export const RIVER_BR = new Tile('river-br', 6, 6);
|
||||
export const RIVER_BL = new Tile('river-bl', 6, 6);
|
||||
export const RIVER_TR = new Tile('river-tr', 6, 6);
|
||||
export const RIVER_TL = new Tile('river-tl', 6, 6);
|
||||
|
||||
export const BRIDGE_LR = Tile.rectangle('bridge-lr', 6, 4);
|
||||
export const BRIDGE_LR = new Tile('bridge-lr', 6, 4);
|
||||
|
||||
Reference in New Issue
Block a user