Aethelgard/js/managers/UIManager.js

35 lines
1.1 KiB
JavaScript

export default class UIManager {
constructor(scene, xpManager) {
this.scene = scene;
this.xpManager = xpManager;
// Base health bar
this.healthBar = this.scene.add.graphics();
this.updateBaseHealth(100);
// XP text
this.xpText = this.scene.add.text(20, 20, 'XP: 0 / 100', { font: '20px Arial', fill: '#fff' });
// Level display
this.levelText = this.scene.add.text(20, 50, 'Level: 1', { font: '20px Arial', fill: '#fff' });
this.xpManager.on('levelup', lvl => this.levelText.setText(`Level: ${lvl}`));
}
updateBaseHealth(current) {
const max = 100; // same as BASE_HEALTH; could be dynamic later
const width = 300, height = 20;
const percent = Phaser.Math.Clamp(current / max, 0, 1);
const y = this.scene.scale.height - 40;
this.healthBar.clear();
this.healthBar.fillStyle(0x555555);
this.healthBar.fillRect(20, y, width, height);
this.healthBar.fillStyle(0xff0000);
this.healthBar.fillRect(20, y, width * percent, height);
}
updateXP(current, next) {
this.xpText.setText(`XP: ${current} / ${next}`);
}
}