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

View File

@ -1,5 +1,9 @@
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 = {
key: string;
@ -56,11 +60,22 @@ export class CombatUnitContainer extends Phaser.GameObjects.Container {
})
.setOrigin(0.5);
this.hpBarBg = this.scene.add
.rectangle(0, -CONTAINER_HEIGHT / 2 + 60, HP_BAR_WIDTH, HP_BAR_HEIGHT, 0x333333);
this.hpBarBg = this.scene.add.rectangle(
0,
-CONTAINER_HEIGHT / 2 + 60,
HP_BAR_WIDTH,
HP_BAR_HEIGHT,
0x333333,
);
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);
this.hpText = this.scene.add
@ -101,17 +116,21 @@ export class CombatUnitContainer extends Phaser.GameObjects.Container {
this.nameText.setText(this.currentName);
const hpPercent = this.currentEntity.maxHp > 0
? this.currentEntity.hp / this.currentEntity.maxHp
: 0;
const hpPercent =
this.currentEntity.maxHp > 0
? this.currentEntity.hp / this.currentEntity.maxHp
: 0;
const fillWidth = Math.max(0, HP_BAR_WIDTH * hpPercent);
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.hpText.setText(`${this.currentEntity.hp} / ${this.currentEntity.maxHp} HP`);
this.hpText.setText(
`${this.currentEntity.hp} / ${this.currentEntity.maxHp} HP`,
);
this.renderBuffs(this.currentEntity.effects);
@ -127,7 +146,8 @@ export class CombatUnitContainer extends Phaser.GameObjects.Container {
this.buffContainer.removeAll(true);
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;
entries.forEach(([key, entry], index) => {
@ -142,7 +162,7 @@ export class CombatUnitContainer extends Phaser.GameObjects.Container {
.setStrokeStyle(1, 0xffffff);
const text = this.scene.add
.text(x, 0, `${stacks}`, {
.text(x, 0, `${key} ${stacks}`, {
fontSize: "12px",
color: "#ffffff",
fontStyle: "bold",
@ -181,7 +201,14 @@ export class CombatUnitContainer extends Phaser.GameObjects.Container {
playDamageEffect(): void {
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);
this.scene.tweens.add({