Spaces:
Running
Running
| import tiles from './tiles'; | |
| import * as CONST from '../constants'; | |
| import position from './position'; | |
| import surrounding from './surrounding'; | |
| import related from './related'; | |
| export default class cell { | |
| #data; | |
| #debug = {}; | |
| surrounding; | |
| city; | |
| scene; | |
| position; | |
| water; | |
| tiles; | |
| related; | |
| parent; | |
| index; | |
| constructor (options) { | |
| this.#data = options.data; | |
| this.scene = options.scene; | |
| this.city = options.scene.city; | |
| this.water = options.data.water; | |
| this.index = options.index; | |
| this.position = new position({ cell: this, data: this.#data }); | |
| this.tiles = new tiles({ cell: this, list: options.data.tiles._list }); | |
| this.surrounding = new surrounding({ cell: this }); | |
| return this; | |
| } | |
| create () { | |
| this.tiles.create(); | |
| this.related = new related({ cell: this }); | |
| } | |
| onPointerUp () { | |
| } | |
| onPointerDown () { | |
| console.log(this); | |
| } | |
| onPointerMove () { | |
| this.scene.city.map.selectedCell.x = this.x; | |
| this.scene.city.map.selectedCell.y = this.y; | |
| } | |
| onPointerOver () { | |
| this.scene.city.map.selectedCell.x = this.x; | |
| this.scene.city.map.selectedCell.y = this.y; | |
| this.tiles.sprites.forEach((sprite) => { | |
| if (sprite.visible) sprite.setTint(0xaa0000); | |
| }); | |
| this.related.forEach((cell) => { | |
| cell.tiles.sprites.forEach((sprite) => { | |
| if (sprite.visible) sprite.setTint(0xaa0000); | |
| }); | |
| }); | |
| if (this.tiles.heightmap) { | |
| if (this.tiles.heightmap.polygon.top){ | |
| this.tiles.heightmap.polygon.top.fillAlpha = 0.5; | |
| } | |
| if (this.tiles.heightmap.polygon.slope){ | |
| this.tiles.heightmap.polygon.slope.fillAlpha = 0.5; | |
| } | |
| } | |
| } | |
| onPointerOut () { | |
| this.tiles.sprites.forEach((sprite) => { | |
| if (sprite.visible) sprite.clearTint(); | |
| }); | |
| this.related.forEach((cell) => { | |
| cell.tiles.sprites.forEach((sprite) => { | |
| if (sprite.visible) sprite.clearTint(); | |
| }); | |
| }); | |
| if (this.tiles.heightmap) { | |
| if (this.tiles.heightmap.polygon.top){ | |
| this.tiles.heightmap.polygon.top.fillAlpha = 1; | |
| } | |
| if (this.tiles.heightmap.polygon.slope){ | |
| this.tiles.heightmap.polygon.slope.fillAlpha = 1; | |
| } | |
| } | |
| } | |
| highlight (color = 0x00aa00) { | |
| this.tiles.sprites.forEach((sprite) => { | |
| if (sprite.visible) sprite.setTint(color); | |
| }); | |
| } | |
| clearHighlight () { | |
| this.tiles.sprites.forEach((sprite) => { | |
| if (sprite.visible) sprite.clearTint(); | |
| }); | |
| } | |
| get depth () { | |
| return this.position.depth; | |
| } | |
| set depth (depth) { | |
| this.position.depth = depth; | |
| } | |
| get x () { | |
| return this.position.x; | |
| } | |
| set x (x) { | |
| this.position.x = x; | |
| } | |
| get y () { | |
| return this.position.y; | |
| } | |
| set y (y) { | |
| this.position.y = y; | |
| } | |
| get z () { | |
| return this.position.z; | |
| } | |
| set z (z) { | |
| this.position.z = z; | |
| } | |
| hide () { | |
| this.tiles.hide(); | |
| } | |
| show () { | |
| this.tiles.show(); | |
| } | |
| // | |
| // draw a 1px box bounding box around the calculated cell position | |
| // | |
| debugBox () { | |
| let bounds = { | |
| x: this.position.topLeft.x, | |
| y: this.position.topLeft.y, | |
| w: this.position.right.x - this.position.left.x, | |
| h: this.position.top.y - this.position.bottom.y, | |
| }; | |
| this.#debug.box = this.scene.add.rectangle(bounds.x, bounds.y, bounds.w, bounds.h, 0x00ff00, 0.10); | |
| this.#debug.box.setOrigin(CONST.ORIGIN_X, CONST.ORIGIN_Y); | |
| this.#debug.box.setDepth(this.depth + 1024); | |
| this.#debug.box.setStrokeStyle(1, 0x00ff00, 0.60); | |
| //this.debugPoint(); | |
| } | |
| debugPoint () { | |
| //top left | |
| this.#debug.topLeft = this.scene.add.circle(this.position.topLeft.x, this.position.topLeft.y, 3, 0xffffff, 1); | |
| this.#debug.topLeft.setOrigin(CONST.ORIGIN_X, CONST.ORIGIN_Y); | |
| this.#debug.topLeft.setDepth(this.depth + 1024); | |
| // top middle | |
| this.#debug.topMiddle = this.scene.add.circle(this.position.center.x, this.position.top.y, 3, 0xffff00, 1); | |
| this.#debug.topMiddle.setOrigin(CONST.ORIGIN_X, CONST.ORIGIN_Y); | |
| this.#debug.topMiddle.setDepth(this.depth + 1024); | |
| // top right | |
| this.#debug.topRight = this.scene.add.circle(this.position.topRight.x, this.position.topRight.y, 3, 0xff00ff, 1); | |
| this.#debug.topRight.setOrigin(CONST.ORIGIN_X, CONST.ORIGIN_Y); | |
| this.#debug.topRight.setDepth(this.depth + 1024); | |
| // center left | |
| this.#debug.centerLeft = this.scene.add.circle(this.position.left.x, this.position.center.y, 3, 0x00ffff, 1); | |
| this.#debug.centerLeft.setOrigin(CONST.ORIGIN_X, CONST.ORIGIN_Y); | |
| this.#debug.centerLeft.setDepth(this.depth + 1024); | |
| // center middle | |
| this.#debug.centerMiddle = this.scene.add.circle(this.position.center.x, this.position.center.y, 3, 0x0000ff, 1); | |
| this.#debug.centerMiddle.setOrigin(CONST.ORIGIN_X, CONST.ORIGIN_Y); | |
| this.#debug.centerMiddle.setDepth(this.depth + 1024); | |
| // center right | |
| this.#debug.centerRight = this.scene.add.circle(this.position.right.x, this.position.center.y, 3, 0x00ff00, 1); | |
| this.#debug.centerRight.setOrigin(CONST.ORIGIN_X, CONST.ORIGIN_Y); | |
| this.#debug.centerRight.setDepth(this.depth + 1024); | |
| // bottom left | |
| this.#debug.bottomLeft = this.scene.add.circle(this.position.bottomLeft.x, this.position.bottomLeft.y, 3, 0xff0000, 1); | |
| this.#debug.bottomLeft.setOrigin(CONST.ORIGIN_X, CONST.ORIGIN_Y); | |
| this.#debug.bottomLeft.setDepth(this.depth + 1024); | |
| // bottom middle | |
| this.#debug.bottomMiddle = this.scene.add.circle(this.position.center.x, this.position.bottom.y, 3, 0x666666, 1); | |
| this.#debug.bottomMiddle.setOrigin(CONST.ORIGIN_X, CONST.ORIGIN_Y); | |
| this.#debug.bottomMiddle.setDepth(this.depth + 1024); | |
| // bottom right | |
| this.#debug.bottomRight = this.scene.add.circle(this.position.bottomRight.x, this.position.bottomRight.y, 3, 0x000000, 1); | |
| this.#debug.bottomRight.setOrigin(CONST.ORIGIN_X, CONST.ORIGIN_Y); | |
| this.#debug.bottomRight.setDepth(this.depth + 1024); | |
| } | |
| // | |
| // draw a text label with the cell location above all other objects | |
| // | |
| debugLabels () { | |
| this.#debug.label = this.scene.add.text(this.position.center.x, this.position.center.y, this.x+','+this.y+','+this.z, { fontFamily: 'Verdana', fontSize: 8, color: '#ffffff' }); | |
| this.#debug.label.setDepth(this.depth + 128); | |
| this.#debug.label.setOrigin(0.5, 0.5); | |
| } | |
| } |