misc/tower
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Encode layer name in tile factory, remove get_elem()

Browse Source
This commit is contained in:
Ian Gulliver
2021-05-11 03:23:28 +00:00
parent ea167e42a1
commit b027777a08
29 changed files with 204 additions and 217 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
ts/grid.ts
View File

@@ -50,13 +50,14 @@ export class Grid {
}
}
add_tile(layer: string, tile_factory: TileFactory, x: number, y: number): Tile {
const tile = this.#layers.get(layer)!.add_tile(tile_factory);
const elem = tile.get_elem();
add_tile(tile_factory: TileFactory, x: number, y: number): Tile {
const tile = this.#layers.get(tile_factory.layer_name)!.add_tile(tile_factory);
// Grids are 1-indexed
elem.style.gridColumnStart = `${x + 1}`;
elem.style.gridRowStart = `${y + 1}`;
this.#prnt.appendChild(elem);
tile.elem.style.gridColumnStart = `${x + 1}`;
tile.elem.style.gridRowStart = `${y + 1}`;
this.#prnt.appendChild(tile.elem);
return tile;
}
}

2
ts/layer.ts
View File

@@ -15,7 +15,7 @@ export class Layer {
add_tile(tile_factory: TileFactory): Tile {
const tile = tile_factory.build(this.#tileset);
tile.get_elem().style.zIndex = `${this.#level}`;
tile.elem.style.zIndex = `${this.#level}`;
return tile;
}
}

15
ts/layered_tile.ts
View File

@@ -13,14 +13,13 @@ export class LayeredTile extends Tile {
const tile = tiles[i];
this.tiles.push(tile);
const child = tile.get_elem();
this.elem.appendChild(child);
child.style.width = '100%';
child.style.height = '100%';
child.style.position = 'absolute';
child.style.top = '0';
child.style.left = '0';
child.style.zIndex = `${i}`;
this.elem.appendChild(tile.elem);
tile.elem.style.width = '100%';
tile.elem.style.height = '100%';
tile.elem.style.position = 'absolute';
tile.elem.style.top = '0';
tile.elem.style.left = '0';
tile.elem.style.zIndex = `${i}`;
}
}

6
ts/layered_tile_factory.ts
View File

@@ -5,7 +5,11 @@ export class LayeredTileFactory extends TileFactory {
tile_factories: TileFactory[];
constructor(tile_factories: TileFactory[]) {
super(tile_factories[0].width, tile_factories[0].height);
super(
tile_factories[0].layer_name,
tile_factories[0].width,
tile_factories[0].height,
);
this.tile_factories = tile_factories;
}

4
ts/simple_tile_factory.ts
View File

@@ -5,8 +5,8 @@ export class SimpleTileFactory extends TileFactory {
name: string;
animations: Map<string, [Keyframe[], object]>;
constructor(width: number, height: number, name: string) {
super(width, height);
constructor(layer_name: string, width: number, height: number, name: string) {
super(layer_name, width, height);
this.name = name;
this.animations = new Map();
}

4
ts/tile.ts
View File

@@ -7,9 +7,5 @@ export abstract class Tile {
this.elem.style.gridRowEnd = `span ${height}`;
}
get_elem(): HTMLElement {
return this.elem;
}
abstract play(name: string): void;
}

4
ts/tile_factory.ts
View File

@@ -1,10 +1,12 @@
import { Tile } from './tile.js';
export abstract class TileFactory {
layer_name: string;
width: number;
height: number;
constructor(width: number, height: number) {
constructor(layer_name: string, width: number, height: number) {
this.layer_name = layer_name;
this.width = width;
this.height = height;
}

44
ts/tiles.ts
View File

@@ -2,42 +2,42 @@ import { LayeredTileFactory } from './layered_tile_factory.js';
import { SimpleTileFactory } from './simple_tile_factory.js';
// Straig
export const ROAD_LR = new SimpleTileFactory(6, 4, 'road-lr');
export const ROAD_TB = new SimpleTileFactory(4, 6, 'road-tb');
export const ROAD_LR = new SimpleTileFactory('road', 6, 4, 'road-lr');
export const ROAD_TB = new SimpleTileFactory('road', 4, 6, 'road-tb');
// Elbow
export const ROAD_BL = new SimpleTileFactory(6, 6, 'road-bl');
export const ROAD_BR = new SimpleTileFactory(6, 6, 'road-br');
export const ROAD_TL = new SimpleTileFactory(6, 6, 'road-tl');
export const ROAD_TR = new SimpleTileFactory(6, 6, 'road-tr');
export const ROAD_BL = new SimpleTileFactory('road', 6, 6, 'road-bl');
export const ROAD_BR = new SimpleTileFactory('road', 6, 6, 'road-br');
export const ROAD_TL = new SimpleTileFactory('road', 6, 6, 'road-tl');
export const ROAD_TR = new SimpleTileFactory('road', 6, 6, 'road-tr');
// T
export const ROAD_BLR = new SimpleTileFactory(8, 6, 'road-blr');
export const ROAD_TLR = new SimpleTileFactory(8, 6, 'road-tlr');
export const ROAD_LTB = new SimpleTileFactory(6, 8, 'road-ltb');
export const ROAD_RTB = new SimpleTileFactory(6, 8, 'road-rtb');
export const ROAD_BLR = new SimpleTileFactory('road', 8, 6, 'road-blr');
export const ROAD_TLR = new SimpleTileFactory('road', 8, 6, 'road-tlr');
export const ROAD_LTB = new SimpleTileFactory('road', 6, 8, 'road-ltb');
export const ROAD_RTB = new SimpleTileFactory('road', 6, 8, 'road-rtb');
// +
export const ROAD_TBLR = new SimpleTileFactory(8, 8, 'road-tblr');
export const ROAD_TBLR = new SimpleTileFactory('road', 8, 8, 'road-tblr');
// Tower base
export const EMPTY = new SimpleTileFactory(4, 2, 'empty');
export const EMPTY = new SimpleTileFactory('road', 4, 2, 'empty');
// Straight
export const RIVER_LR = new SimpleTileFactory(6, 4, 'river-lr');
export const RIVER_TB = new SimpleTileFactory(4, 6, 'river-tb');
export const RIVER_LR = new SimpleTileFactory('water', 6, 4, 'river-lr');
export const RIVER_TB = new SimpleTileFactory('water', 4, 6, 'river-tb');
// Elbow
export const RIVER_BR = new SimpleTileFactory(6, 6, 'river-br');
export const RIVER_BL = new SimpleTileFactory(6, 6, 'river-bl');
export const RIVER_TR = new SimpleTileFactory(6, 6, 'river-tr');
export const RIVER_TL = new SimpleTileFactory(6, 6, 'river-tl');
export const RIVER_BR = new SimpleTileFactory('water', 6, 6, 'river-br');
export const RIVER_BL = new SimpleTileFactory('water', 6, 6, 'river-bl');
export const RIVER_TR = new SimpleTileFactory('water', 6, 6, 'river-tr');
export const RIVER_TL = new SimpleTileFactory('water', 6, 6, 'river-tl');
export const BRIDGE_LR = new SimpleTileFactory(6, 4, 'bridge-lr');
export const BRIDGE_LR = new SimpleTileFactory('bridge', 6, 4, 'bridge-lr');
const tower_fireball1_back = new SimpleTileFactory(4, 4, 'fireball1-back');
const tower_fireball1 = new SimpleTileFactory(4, 4, 'fireball1');
const tower_fireball1_front = new SimpleTileFactory(4, 4, 'fireball1-front');
const tower_fireball1_back = new SimpleTileFactory('surface', 4, 4, 'fireball1-back');
const tower_fireball1 = new SimpleTileFactory('surface', 4, 4, 'fireball1');
const tower_fireball1_front = new SimpleTileFactory('surface', 4, 4, 'fireball1-front');
for (const tile_factory of [tower_fireball1_back, tower_fireball1_front]) {
tile_factory.add_animation(

108
ts/tower.ts
View File

@@ -24,64 +24,64 @@ export function main() {
const grid = new Grid(real);
grid.set_size(70, 56);
grid.set_tileset('tropical');
grid.set_layers(['road', 'water', 'bridge', 'tower']);
grid.set_layers(['road', 'water', 'bridge', 'surface']);
grid.add_tile('road', tiles.ROAD_TB, 20, 46);
grid.add_tile('road', tiles.ROAD_BL, 18, 40);
grid.add_tile('road', tiles.ROAD_TR, 12, 38);
grid.add_tile('road', tiles.ROAD_BR, 12, 32);
grid.add_tile('road', tiles.ROAD_TL, 18, 30);
grid.add_tile('road', tiles.ROAD_BL, 18, 24);
grid.add_tile('road', tiles.ROAD_TR, 12, 22);
grid.add_tile('road', tiles.ROAD_BR, 12, 16);
grid.add_tile('road', tiles.ROAD_LR, 18, 16);
grid.add_tile('road', tiles.ROAD_TBLR, 24, 14);
grid.add_tile('road', tiles.ROAD_TB, 26, 2);
grid.add_tile('road', tiles.ROAD_TB, 26, 8);
grid.add_tile('road', tiles.ROAD_TB, 26, 22);
grid.add_tile('road', tiles.ROAD_TB, 26, 28);
grid.add_tile('road', tiles.ROAD_TB, 26, 34);
grid.add_tile('road', tiles.ROAD_TB, 26, 40);
grid.add_tile('road', tiles.ROAD_TB, 26, 46);
grid.add_tile('road', tiles.ROAD_BL, 32, 16);
grid.add_tile('road', tiles.ROAD_TB, 34, 22);
grid.add_tile('road', tiles.ROAD_TB, 34, 28);
grid.add_tile('road', tiles.ROAD_TB, 34, 34);
grid.add_tile('road', tiles.ROAD_TR, 34, 40);
grid.add_tile('road', tiles.ROAD_LR, 40, 42);
grid.add_tile('road', tiles.ROAD_LR, 46, 42);
grid.add_tile('road', tiles.ROAD_TL, 52, 40);
grid.add_tile('road', tiles.ROAD_BL, 52, 34);
grid.add_tile('road', tiles.ROAD_LR, 46, 34);
grid.add_tile('road', tiles.ROAD_TR, 40, 32);
grid.add_tile('road', tiles.ROAD_BR, 40, 26);
grid.add_tile('road', tiles.ROAD_LR, 46, 26);
grid.add_tile('road', tiles.ROAD_TL, 52, 24);
grid.add_tile('road', tiles.ROAD_BL, 52, 18);
grid.add_tile('road', tiles.ROAD_LR, 46, 18);
grid.add_tile('road', tiles.ROAD_TR, 40, 16);
grid.add_tile('road', tiles.ROAD_BR, 40, 10);
grid.add_tile('road', tiles.ROAD_LR, 46, 10);
grid.add_tile('road', tiles.ROAD_LR, 52, 10);
grid.add_tile('road', tiles.ROAD_LR, 58, 10);
grid.add_tile('road', tiles.EMPTY, 30, 20);
grid.add_tile(tiles.ROAD_TB, 20, 46);
grid.add_tile(tiles.ROAD_BL, 18, 40);
grid.add_tile(tiles.ROAD_TR, 12, 38);
grid.add_tile(tiles.ROAD_BR, 12, 32);
grid.add_tile(tiles.ROAD_TL, 18, 30);
grid.add_tile(tiles.ROAD_BL, 18, 24);
grid.add_tile(tiles.ROAD_TR, 12, 22);
grid.add_tile(tiles.ROAD_BR, 12, 16);
grid.add_tile(tiles.ROAD_LR, 18, 16);
grid.add_tile(tiles.ROAD_TBLR, 24, 14);
grid.add_tile(tiles.ROAD_TB, 26, 2);
grid.add_tile(tiles.ROAD_TB, 26, 8);
grid.add_tile(tiles.ROAD_TB, 26, 22);
grid.add_tile(tiles.ROAD_TB, 26, 28);
grid.add_tile(tiles.ROAD_TB, 26, 34);
grid.add_tile(tiles.ROAD_TB, 26, 40);
grid.add_tile(tiles.ROAD_TB, 26, 46);
grid.add_tile(tiles.ROAD_BL, 32, 16);
grid.add_tile(tiles.ROAD_TB, 34, 22);
grid.add_tile(tiles.ROAD_TB, 34, 28);
grid.add_tile(tiles.ROAD_TB, 34, 34);
grid.add_tile(tiles.ROAD_TR, 34, 40);
grid.add_tile(tiles.ROAD_LR, 40, 42);
grid.add_tile(tiles.ROAD_LR, 46, 42);
grid.add_tile(tiles.ROAD_TL, 52, 40);
grid.add_tile(tiles.ROAD_BL, 52, 34);
grid.add_tile(tiles.ROAD_LR, 46, 34);
grid.add_tile(tiles.ROAD_TR, 40, 32);
grid.add_tile(tiles.ROAD_BR, 40, 26);
grid.add_tile(tiles.ROAD_LR, 46, 26);
grid.add_tile(tiles.ROAD_TL, 52, 24);
grid.add_tile(tiles.ROAD_BL, 52, 18);
grid.add_tile(tiles.ROAD_LR, 46, 18);
grid.add_tile(tiles.ROAD_TR, 40, 16);
grid.add_tile(tiles.ROAD_BR, 40, 10);
grid.add_tile(tiles.ROAD_LR, 46, 10);
grid.add_tile(tiles.ROAD_LR, 52, 10);
grid.add_tile(tiles.ROAD_LR, 58, 10);
grid.add_tile(tiles.EMPTY, 30, 20);
grid.add_tile('water', tiles.RIVER_TB, 47, 46);
grid.add_tile('water', tiles.RIVER_TB, 47, 40);
grid.add_tile('water', tiles.RIVER_TB, 47, 34);
grid.add_tile('water', tiles.RIVER_TB, 47, 28);
grid.add_tile('water', tiles.RIVER_TB, 47, 22);
grid.add_tile('water', tiles.RIVER_TB, 47, 16);
grid.add_tile('water', tiles.RIVER_TB, 47, 10);
grid.add_tile('water', tiles.RIVER_TB, 47, 4);
grid.add_tile(tiles.RIVER_TB, 47, 46);
grid.add_tile(tiles.RIVER_TB, 47, 40);
grid.add_tile(tiles.RIVER_TB, 47, 34);
grid.add_tile(tiles.RIVER_TB, 47, 28);
grid.add_tile(tiles.RIVER_TB, 47, 22);
grid.add_tile(tiles.RIVER_TB, 47, 16);
grid.add_tile(tiles.RIVER_TB, 47, 10);
grid.add_tile(tiles.RIVER_TB, 47, 4);
grid.add_tile('bridge', tiles.BRIDGE_LR, 46, 42);
grid.add_tile('bridge', tiles.BRIDGE_LR, 46, 34);
grid.add_tile('bridge', tiles.BRIDGE_LR, 46, 26);
grid.add_tile('bridge', tiles.BRIDGE_LR, 46, 18);
grid.add_tile('bridge', tiles.BRIDGE_LR, 46, 10);
grid.add_tile(tiles.BRIDGE_LR, 46, 42);
grid.add_tile(tiles.BRIDGE_LR, 46, 34);
grid.add_tile(tiles.BRIDGE_LR, 46, 26);
grid.add_tile(tiles.BRIDGE_LR, 46, 18);
grid.add_tile(tiles.BRIDGE_LR, 46, 10);
const tower = grid.add_tile('tower', tiles.TOWER_FIREBALL1, 30, 18);
const tower = grid.add_tile(tiles.TOWER_FIREBALL1, 30, 18);
setInterval(() => tower.play('fire'), 3250);
};