koneko/bastion.overflow.fun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tower panel begin

Browse Source
This commit is contained in:
koneko 2025-01-21 01:09:29 +01:00
parent 56137fa3c0
commit 70218e5425
10 changed files with 113 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -4,7 +4,7 @@
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"dev": "vite --host",
"build": "tsc && vite build",
"preview": "vite preview"
},

2
src/classes/Assets.ts
View File

@ -28,6 +28,7 @@ export default class GameAssets {
public static ExclamationIconTexture: PIXI.Texture;
public static HomeIconTexture: PIXI.Texture;
public static HammerIconTexture: PIXI.Texture;
public static XIconTexture: PIXI.Texture;
public static GemAmountIcons: PIXI.Texture[] = [];
public static Missions: MissionDefinition[];
@ -99,6 +100,7 @@ export default class GameAssets {
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.Load('/assets/gui/icons/cross.png').then((texture) => (this.XIconTexture = texture)),
this.LoadMissions(),
this.LoadTowers(),
this.LoadCreeps(),

1
src/classes/game/Gem.ts Normal file
View File

@ -0,0 +1 @@
export default class Gem {}

3
src/classes/game/Grid.ts
View File

@ -38,7 +38,6 @@ export class Cell extends GameObject {
zIndex: 99,
interactive: true,
});
// ? TODO: make range preview 1 global graphics obj, child. fix
this.g = new PIXI.Graphics({
zIndex: 5,
@ -83,6 +82,8 @@ export class Cell extends GameObject {
}
public OpenSelectedTowerPanel() {
if (this.hasTowerPlaced) {
const tower = Engine.TowerManager.GetTowerByRowAndCol(this.row, this.column);
Engine.GameScene.towerPanel.Show(tower);
}
}
public checkIfCantPlace() {

23
src/classes/game/Tower.ts
View File

@ -5,28 +5,13 @@ import { TowerDefinition } from '../Definitions';
import { Cell } from './Grid';
import { TowerBehaviours } from './TowerManager';
import Projectile, { calculateAngleToPoint } from './Projectile';
import GameAssets from '../Assets';
import Creep from './Creep';
import Gem from './Gem';
function distance(x1, y1, x2, y2) {
return Math.sqrt((x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1));
}
export type TowerInstance = {
row: number;
column: number;
sprite: PIXI.Sprite;
projectiles: Array<any>;
baseDamage: number;
damage: number;
cooldown: number;
ticksToFireAt: number;
slottedGems: Array<any>;
cost: number;
baseRange: number;
range: number;
};
export enum TowerEvents {
TowerPlacedEvent = 'towerPlacedEvent',
TowerSoldEvent = 'towerSoldEvent',
@ -35,9 +20,11 @@ export enum TowerEvents {
export class Tower extends GameObject {
public row: number;
public column: number;
public definition: TowerDefinition;
public slottedGems: Array<Gem>;
public damageDealt: number = 0;
private projectiles: Projectile[] = [];
private behaviour: string;
private definition: TowerDefinition;
private sprite: PIXI.Sprite;
private ticksUntilNextShot: number;
private graphics: PIXI.Graphics = new PIXI.Graphics();
@ -51,7 +38,6 @@ 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,
@ -97,6 +83,7 @@ export class Tower extends GameObject {
public update(elapsedMS: any): void {
this.projectiles.forEach((proj) => {
if (proj.deleteMe) {
this.damageDealt += this.definition.stats.damage;
this.projectiles.splice(this.projectiles.indexOf(proj), 1);
proj = null;
} else proj.update(elapsedMS);

2
src/classes/game/TowerManager.ts
View File

@ -71,7 +71,7 @@ export default class TowerManager {
'TowerManager.selectedTower is null when trying to place tower.',
'danger'
);
throw console.warn('TowerManager.selectedTower is null when trying to place tower.');
return console.warn('TowerManager.selectedTower is null when trying to place tower.');
}
this.PlaceTower(this.selectedTower, row, column, this.selectedTower.behaviour);
}

32
src/classes/gui/SelectedTowerPanel.ts
View File

@ -1,32 +0,0 @@
import * as PIXI from 'pixi.js';
import GuiObject from '../GuiObject';
import GameAssets from '../Assets';
import { Engine } from '../Bastion';
// ! TODO NEXT!
export default class SelectedTowerPanel extends GuiObject {
private bounds: PIXI.Rectangle;
private towerPanel: PIXI.NineSliceSprite;
constructor(bounds: PIXI.Rectangle) {
super(false);
this.bounds = bounds;
this.container.x = this.bounds.x;
this.container.y = this.bounds.y;
this.towerPanel = new PIXI.NineSliceSprite({
texture: GameAssets.FrameTowerTab,
leftWidth: 1000,
topHeight: 1000,
rightWidth: 1000,
bottomHeight: 1000,
});
this.towerPanel.x = -300;
this.towerPanel.y = -300;
this.towerPanel.width = this.bounds.width;
this.towerPanel.height = this.bounds.height;
this.container.addChild(this.towerPanel);
Engine.GameMaster.currentScene.stage.addChild(this.container);
}
}

97
src/classes/gui/TowerPanel.ts Normal file
View File

@ -0,0 +1,97 @@
import * as PIXI from 'pixi.js';
import GuiObject from '../GuiObject';
import GameAssets from '../Assets';
import { Engine } from '../Bastion';
import GameUIConstants from '../GameUIConstants';
import Button, { ButtonTexture } from './Button';
import { Tower } from '../game/Tower';
export default class TowerPanel extends GuiObject {
private bounds: PIXI.Rectangle;
private towerPanel: PIXI.NineSliceSprite;
private closeBtn: Button;
public isShown: boolean = false;
titleText: PIXI.Text;
constructor(bounds: PIXI.Rectangle) {
super(false);
this.bounds = bounds;
this.towerPanel = new PIXI.NineSliceSprite({
texture: GameAssets.Frame03Texture,
leftWidth: 100,
topHeight: 100,
rightWidth: 100,
bottomHeight: 100,
});
this.towerPanel.width = this.bounds.width;
this.towerPanel.height = this.bounds.height - this.bounds.height / 3.5;
this.closeBtn = new Button(new PIXI.Rectangle(-20, -20, 60, 60), '', ButtonTexture.Button01, true);
this.closeBtn.container.removeFromParent();
// Added custom button logic to still keep all the regular events for the button, just have an icon instead of text.
// TODO: maybe make this better? add like a seperate class for icon buttons or smth
this.closeBtn.CustomButtonLogic = () => {
this.closeBtn.buttonIcon = new PIXI.Sprite({
texture: GameAssets.XIconTexture,
x: this.closeBtn.container.width / 2,
y: this.closeBtn.container.height / 2,
scale: 0.2,
});
this.closeBtn.buttonIcon.anchor.set(0.5, 0.5);
this.closeBtn.container.addChild(this.closeBtn.buttonIcon);
};
this.closeBtn.onClick = () => {
this.Hide();
};
this.Hide();
this.closeBtn.CustomButtonLogic();
this.container.y = Engine.app.canvas.height / 2 - Engine.app.canvas.height / 2.7;
this.container.addChild(this.towerPanel);
this.container.addChild(this.closeBtn.container);
Engine.GameMaster.currentScene.stage.addChild(this.container);
this.titleText = new PIXI.Text({
x: this.bounds.width / 3,
y: 50,
zIndex: 5,
style: new PIXI.TextStyle({
fill: 0xffffff,
stroke: {
color: 0x000000,
width: 2,
},
}),
});
this.titleText.anchor.set(0.5, 0);
this.container.addChild(this.titleText);
}
public Show(tower: Tower) {
let mouseX = Engine.MouseX;
this.isShown = true;
this.SetContent(tower);
if (mouseX < 900) {
this.ShowRight();
} else {
this.ShowLeft();
}
}
private SetContent(tower: Tower) {
this.titleText.text = tower.definition.name;
}
private ShowLeft() {
this.towerPanel.x = -100;
this.container.x = 0;
this.container.alpha = 1;
this.closeBtn.container.x = this.container.width - 150;
}
private ShowRight() {
this.towerPanel.x = -10;
this.container.x = GameUIConstants.SidebarRect.x - 210;
this.closeBtn.container.x = -20;
this.container.alpha = 1;
}
public Hide() {
this.isShown = false;
this.container.alpha = 0;
this.container.x = GameUIConstants.SidebarRect.x + 10;
}
}

1
src/classes/gui/TowerTab.ts
View File

@ -76,6 +76,7 @@ class TowerButton extends GuiObject {
Engine.GameScene.sidebar.towerTab.resetTint();
Engine.TowerManager.ResetChooseTower();
}
Engine.GameScene.towerPanel.Hide();
Engine.GameScene.tooltip.Hide();
if (this.frameSprite.tint == 0x00ff00) {
this.frameSprite.tint = 0xffffff;

3
src/scenes/Game.ts
View File

@ -13,6 +13,7 @@ import TowerManager from '../classes/game/TowerManager';
import { MissionPickerScene } from './MissionPicker';
import GameUIConstants from '../classes/GameUIConstants';
import Tooltip from '../classes/gui/Tooltip';
import TowerPanel from '../classes/gui/TowerPanel';
enum RoundMode {
Purchase = 0,
@ -29,6 +30,7 @@ export class GameScene extends Scene {
public changeRoundButton: Button;
public sidebar: Sidebar;
public tooltip: Tooltip;
public towerPanel: TowerPanel;
private currentRound: number = 0;
private isWaveManagerFinished: boolean = false;
private playerWon: boolean = false;
@ -72,6 +74,7 @@ export class GameScene extends Scene {
this.events.on(CreepEvents.Died, (playerAward, creepThatDied) => {
this.MissionStats.earnGold(playerAward);
});
this.towerPanel = new TowerPanel(GameUIConstants.SidebarRect);
this.sidebar = new Sidebar(GameUIConstants.SidebarRect);
this.tooltip = new Tooltip(new PIXI.Rectangle(0, 0, 350, 160));
this.changeRoundButton = new Button(GameUIConstants.ChangeRoundButtonRect, '', ButtonTexture.Button01, true);