diff --git a/public/assets/json/Towers.json b/public/assets/json/Towers.json index f60e715..1a609f7 100644 --- a/public/assets/json/Towers.json +++ b/public/assets/json/Towers.json @@ -14,5 +14,21 @@ "cost": 100, "range": 3 } + }, + { + "name": "Circle Tower", + "behaviour": "BasicTowerBehaviour", + "sprite": "circle_tower", + "texture": null, + "projectileTextures": [], + "projectileTexturesArrayLength": 4, + "description": "If you feel a little circular.", + "stats": { + "damage": 6, + "cooldown": 180, + "gemSlotsAmount": 3, + "cost": 125, + "range": 3 + } } ] diff --git a/public/assets/projectiles/circle_tower/0.png b/public/assets/projectiles/circle_tower/0.png new file mode 100644 index 0000000..204ab77 Binary files /dev/null and b/public/assets/projectiles/circle_tower/0.png differ diff --git a/public/assets/projectiles/circle_tower/1.png b/public/assets/projectiles/circle_tower/1.png new file mode 100644 index 0000000..b97b520 Binary files /dev/null and b/public/assets/projectiles/circle_tower/1.png differ diff --git a/public/assets/projectiles/circle_tower/2.png b/public/assets/projectiles/circle_tower/2.png new file mode 100644 index 0000000..8172999 Binary files /dev/null and b/public/assets/projectiles/circle_tower/2.png differ diff --git a/public/assets/projectiles/circle_tower/3.png b/public/assets/projectiles/circle_tower/3.png new file mode 100644 index 0000000..204ab77 Binary files /dev/null and b/public/assets/projectiles/circle_tower/3.png differ diff --git a/public/assets/towers/circle_tower.png b/public/assets/towers/circle_tower.png new file mode 100644 index 0000000..4ec30e0 Binary files /dev/null and b/public/assets/towers/circle_tower.png differ diff --git a/src/classes/Assets.ts b/src/classes/Assets.ts index 2c58d16..b3b7655 100644 --- a/src/classes/Assets.ts +++ b/src/classes/Assets.ts @@ -22,10 +22,10 @@ export default class GameAssets { public static PauseIconTexture: PIXI.Texture; public static ExclamationIconTexture: PIXI.Texture; public static HomeIconTexture: PIXI.Texture; + public static HammerIconTexture: PIXI.Texture; public static Missions: MissionDefinition[]; public static MissionBackgrounds: PIXI.Texture[] = []; - public static TowerSprites: PIXI.Texture[] = []; public static Towers: TowerDefinition[]; public static Creeps: CreepDefinition[]; @@ -87,6 +87,7 @@ export default class GameAssets { this.Load('/assets/gui/icons/pause.png').then((texture) => (this.PauseIconTexture = texture)), this.Load('/assets/gui/icons/exclamation.png').then((texture) => (this.ExclamationIconTexture = texture)), this.Load('/assets/gui/icons/home.png').then((texture) => (this.HomeIconTexture = texture)), + this.Load('/assets/gui/icons/hammer.png').then((texture) => (this.HammerIconTexture = texture)), this.LoadMissions(), this.LoadTowers(), this.LoadCreeps(), @@ -120,21 +121,13 @@ export default class GameAssets { const res = await fetch('/assets/json/Towers.json'); const towers = await res.json(); this.Towers = towers; - console.log(this.Towers); for (let idx = 0; idx < this.Towers.length; idx++) { const tower = this.Towers[idx]; for (let i = 0; i < tower.projectileTexturesArrayLength; i++) { const texture = await this.Load(`/assets/projectiles/${tower.sprite}/${i}.png`); tower.projectileTextures[i] = texture; - console.log(tower.projectileTextures); } } - towers.forEach(async (tower) => { - let index = this.TowerSprites.length - 1; - if (index == -1) index = 0; - this.TowerSprites[index] = await this.Load(`/assets/towers/${tower.sprite}.png`); - tower.texture = this.TowerSprites[index]; - }); } private static async LoadMission(missionUrl: string) { diff --git a/src/classes/game/Grid.ts b/src/classes/game/Grid.ts index 74aeacd..6029b43 100644 --- a/src/classes/game/Grid.ts +++ b/src/classes/game/Grid.ts @@ -56,9 +56,7 @@ export class Cell extends GameObject { }); Engine.GameScene.events.on(TowerEvents.TowerPlacedEvent, (_, row, col) => { if (row == this.row && col == this.column) { - console.log('SETTING'); - this.setHasTowerPlaced(true); - console.log(this); + this.hasTowerPlaced = true; this.rangePreview.clear(); } }); @@ -68,9 +66,17 @@ export class Cell extends GameObject { } }); } - private setHasTowerPlaced(v) { - console.log(' CALLLEd'); - this.hasTowerPlaced = v; + public showRangePreview(invalid, range) { + let color = 0xffffff; + if (invalid) color = 0xff0000; + this.rangePreview.clear(); + this.rangePreview.circle(Engine.GridCellSize / 2, Engine.GridCellSize / 2, range * Engine.GridCellSize); + this.rangePreview.fill({ color: color, alpha: 0.3 }); + } + public checkIfCantPlace() { + return ( + this.hasTowerPlaced || this.isPath || this.type == TerrainType.Path || this.type == TerrainType.Restricted + ); } public gDraw() { this.g = new PIXI.Graphics({ diff --git a/src/classes/game/Projectile.ts b/src/classes/game/Projectile.ts index e4811ac..b9e6904 100644 --- a/src/classes/game/Projectile.ts +++ b/src/classes/game/Projectile.ts @@ -24,7 +24,7 @@ export default class Projectile extends GameObject { this.y = y; this.damage = damage; this.sprite = new PIXI.AnimatedSprite({ textures: textures, scale: 0.25, rotation: angle }); - this.sprite.anchor.set(0.5); + this.sprite.anchor.set(0.5, 0.5); this.sprite.play(); this.container.x = this.x; this.container.y = this.y; diff --git a/src/classes/game/Tower.ts b/src/classes/game/Tower.ts index 501dc53..9bbd0c3 100644 --- a/src/classes/game/Tower.ts +++ b/src/classes/game/Tower.ts @@ -51,6 +51,7 @@ export class Tower extends GameObject { this.definition = definition; this.ticksUntilNextShot = 0; this.parent = Engine.Grid.getCellByRowAndCol(row, column); + console.log(texture); this.sprite = new PIXI.Sprite({ texture: texture, height: Engine.GridCellSize, @@ -63,25 +64,16 @@ export class Tower extends GameObject { this.parent.clickDetector.on('pointerenter', this.onParentCellEnter); this.parent.clickDetector.on('pointerleave', this.onParentCellLeave); Engine.GameMaster.currentScene.stage.addChild(this.graphics); - //this.showRangeDisplay(); } private onParentCellEnter = (e) => { - this.showRangeDisplay(); + if (!Engine.TowerManager.isPlacingTower) this.parent.showRangePreview(false, this.definition.stats.range); }; private onParentCellLeave = (e) => { this.graphics.clear(); }; - public showRangeDisplay() { - this.graphics.circle( - this.column * Engine.GridCellSize + Engine.GridCellSize / 2, - this.row * Engine.GridCellSize + Engine.GridCellSize / 2, - this.definition.stats.range * Engine.GridCellSize - ); - this.graphics.fill({ color: 0xffffff, alpha: 0.5 }); - } public GetCreepsInRange() { let creeps = Engine.Grid.creeps; return creeps.filter((creep) => { diff --git a/src/classes/game/TowerManager.ts b/src/classes/game/TowerManager.ts index 7b0d497..606dc55 100644 --- a/src/classes/game/TowerManager.ts +++ b/src/classes/game/TowerManager.ts @@ -24,24 +24,14 @@ export default class TowerManager { constructor() { Engine.TowerManager = this; Engine.GameScene.events.on(GridEvents.CellMouseOver, (cell: Cell) => { - //console.log(`${cell.column}x${cell.row}, ${cell.type}, ${this.isPlacingTower}`); if (this.isPlacingTower) { - let cantPlace = - this.GetTowerByRowAndCol(cell.row, cell.column) || - cell.hasTowerPlaced || - cell.isPath || - cell.type == TerrainType.Path || - cell.type == TerrainType.Restricted; - cell.rangePreview.circle( - Engine.GridCellSize / 2, - Engine.GridCellSize / 2, - this.selectedTower.stats.range * Engine.GridCellSize - ); + let cantPlace = cell.checkIfCantPlace(); if (cantPlace) { - cell.rangePreview.fill({ color: 0xff0000, alpha: 0.4 }); + cell.rangePreview.clear(); + cell.showRangePreview(true, this.selectedTower.stats.range); this.previewSprite.tint = 0xff0000; } else { - cell.rangePreview.fill({ color: 0xffffff, alpha: 0.4 }); + cell.showRangePreview(false, this.selectedTower.stats.range); this.previewSprite.tint = 0xffffff; } this.previewSprite.x = cell.column * Engine.GridCellSize; @@ -89,11 +79,7 @@ export default class TowerManager { return returnTower; } public PlaceTower(definition: TowerDefinition, row, column, behaviour: string, ignoreCost?) { - let idx = 0; - GameAssets.Towers.forEach((item, index) => { - if (item.sprite == definition.sprite) idx = index; - }); - const sprite = GameAssets.TowerSprites[idx]; + const sprite = this.selectedTower.texture; if (!Engine.GameScene.MissionStats.hasEnoughGold(definition.stats.cost) && !ignoreCost) return Engine.NotificationManager.Notify('Not enough gold.', 'warn'); if ( diff --git a/src/classes/gui/TowerTab.ts b/src/classes/gui/TowerTab.ts index 41773e3..4380989 100644 --- a/src/classes/gui/TowerTab.ts +++ b/src/classes/gui/TowerTab.ts @@ -8,8 +8,9 @@ class TowerButton extends GuiObject { private frameSprite: PIXI.NineSliceSprite; private background: PIXI.Sprite; private towerName: string; + private iconSprite: PIXI.Sprite; private i: number = 0; - constructor(index: number, row, width, height, parent: PIXI.Container, backgroundTexture, towerName) { + constructor(index: number, row, width, height, parent: PIXI.Container, backgroundTexture, towerName, iconTexture) { if (index > 3 || row > 2 || index < 0 || row < 0) throw 'Index/row out of bounds for TowerButton.'; super(true); this.towerName = towerName; @@ -18,10 +19,18 @@ class TowerButton extends GuiObject { this.background = new PIXI.Sprite({ texture: backgroundTexture, }); + this.iconSprite = new PIXI.Sprite({ + texture: iconTexture, + }); this.background.width = width; this.background.height = height; + this.iconSprite.x = width / 2; + this.iconSprite.y = height / 2; + this.iconSprite.width = width / 2; + this.iconSprite.height = height / 2; + this.iconSprite.anchor.set(0.5, 0.5); this.container.addChild(this.background); - + this.container.addChild(this.iconSprite); this.frameSprite = new PIXI.NineSliceSprite({ texture: GameAssets.Frame02Texture, leftWidth: 100, @@ -76,7 +85,25 @@ export default class TowerTab extends GuiObject { this.towerTabSprite.height = this.bounds.height; this.container.addChild(this.towerTabSprite); - new TowerButton(0, 0, 70, 70, this.container, GameAssets.RedBackground, 'Basic Tower'); - new TowerButton(0, 1, 70, 70, this.container, GameAssets.GreenBackground, 'Basic Tower'); + new TowerButton( + 0, + 0, + 70, + 70, + this.container, + GameAssets.RedBackground, + 'Basic Tower', + GameAssets.HammerIconTexture + ); + new TowerButton( + 0, + 1, + 70, + 70, + this.container, + GameAssets.GreenBackground, + 'Circle Tower', + GameAssets.HomeIconTexture + ); } }