hypercross
/
boardgame-phaser
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style: reformat CombatUnitContainer for readability

This commit is contained in:
hypercross 2026-04-22 11:46:39 +08:00
parent a6ddafb802
commit 5d84c42b78
1 changed files with 39 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
packages/sts-like-viewer/src/gameobjects/CombatUnitContainer.ts
View File

@ -1,5 +1,9 @@
import Phaser from "phaser"; import Phaser from "phaser";
import type { CombatEntity, EffectTable, EnemyEntity } from "boardgame-core/samples/slay-the-spire-like"; import type {
CombatEntity,
EffectTable,
EnemyEntity,
} from "boardgame-core/samples/slay-the-spire-like";
export type CombatUnitData = { export type CombatUnitData = {
key: string; key: string;
@ -56,11 +60,22 @@ export class CombatUnitContainer extends Phaser.GameObjects.Container {
}) })
.setOrigin(0.5); .setOrigin(0.5);
this.hpBarBg = this.scene.add this.hpBarBg = this.scene.add.rectangle(
.rectangle(0, -CONTAINER_HEIGHT / 2 + 60, HP_BAR_WIDTH, HP_BAR_HEIGHT, 0x333333); 0,
-CONTAINER_HEIGHT / 2 + 60,
HP_BAR_WIDTH,
HP_BAR_HEIGHT,
0x333333,
);
this.hpBarFill = this.scene.add this.hpBarFill = this.scene.add
.rectangle(-HP_BAR_WIDTH / 2, -CONTAINER_HEIGHT / 2 + 60, HP_BAR_WIDTH, HP_BAR_HEIGHT, 0x22c55e) .rectangle(
-HP_BAR_WIDTH / 2,
-CONTAINER_HEIGHT / 2 + 60,
HP_BAR_WIDTH,
HP_BAR_HEIGHT,
0x22c55e,
)
.setOrigin(0, 0.5); .setOrigin(0, 0.5);
this.hpText = this.scene.add this.hpText = this.scene.add
@ -101,17 +116,21 @@ export class CombatUnitContainer extends Phaser.GameObjects.Container {
this.nameText.setText(this.currentName); this.nameText.setText(this.currentName);
const hpPercent = this.currentEntity.maxHp > 0 const hpPercent =
? this.currentEntity.hp / this.currentEntity.maxHp this.currentEntity.maxHp > 0
: 0; ? this.currentEntity.hp / this.currentEntity.maxHp
: 0;
const fillWidth = Math.max(0, HP_BAR_WIDTH * hpPercent); const fillWidth = Math.max(0, HP_BAR_WIDTH * hpPercent);
this.hpBarFill.setDisplaySize(fillWidth, HP_BAR_HEIGHT); this.hpBarFill.setDisplaySize(fillWidth, HP_BAR_HEIGHT);
const hpColor = hpPercent > 0.5 ? 0x22c55e : hpPercent > 0.25 ? 0xf59e0b : 0xef4444; const hpColor =
hpPercent > 0.5 ? 0x22c55e : hpPercent > 0.25 ? 0xf59e0b : 0xef4444;
this.hpBarFill.setFillStyle(hpColor); this.hpBarFill.setFillStyle(hpColor);
this.hpText.setText(`${this.currentEntity.hp} / ${this.currentEntity.maxHp} HP`); this.hpText.setText(
`${this.currentEntity.hp} / ${this.currentEntity.maxHp} HP`,
);
this.renderBuffs(this.currentEntity.effects); this.renderBuffs(this.currentEntity.effects);
@ -127,7 +146,8 @@ export class CombatUnitContainer extends Phaser.GameObjects.Container {
this.buffContainer.removeAll(true); this.buffContainer.removeAll(true);
const entries = Object.entries(effects); const entries = Object.entries(effects);
const totalWidth = entries.length * BUFF_ICON_SIZE + (entries.length - 1) * BUFF_ICON_GAP; const totalWidth =
entries.length * BUFF_ICON_SIZE + (entries.length - 1) * BUFF_ICON_GAP;
const startX = -totalWidth / 2 + BUFF_ICON_SIZE / 2; const startX = -totalWidth / 2 + BUFF_ICON_SIZE / 2;
entries.forEach(([key, entry], index) => { entries.forEach(([key, entry], index) => {
@ -142,7 +162,7 @@ export class CombatUnitContainer extends Phaser.GameObjects.Container {
.setStrokeStyle(1, 0xffffff); .setStrokeStyle(1, 0xffffff);
const text = this.scene.add const text = this.scene.add
.text(x, 0, `${stacks}`, { .text(x, 0, `${key} ${stacks}`, {
fontSize: "12px", fontSize: "12px",
color: "#ffffff", color: "#ffffff",
fontStyle: "bold", fontStyle: "bold",
@ -181,7 +201,14 @@ export class CombatUnitContainer extends Phaser.GameObjects.Container {
playDamageEffect(): void { playDamageEffect(): void {
const flash = this.scene.add const flash = this.scene.add
.rectangle(this.x, this.y, CONTAINER_WIDTH, CONTAINER_HEIGHT, 0xff0000, 0.4) .rectangle(
this.x,
this.y,
CONTAINER_WIDTH,
CONTAINER_HEIGHT,
0xff0000,
0.4,
)
.setDepth(200); .setDepth(200);
this.scene.tweens.add({ this.scene.tweens.add({