style: reformat CombatUnitContainer for readability
This commit is contained in:
parent
a6ddafb802
commit
5d84c42b78
|
|
@ -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({
|
||||
|
|
|
|||
Loading…
Reference in New Issue