jusemon/slime
1
0
Fork 0
Code Issues Pull requests Releases Packages 1 Activity Actions

feat: Move player stats and skill progress display from active HUD to the paused menu, removing minor HUD elements and consolidating evolution details into the stats display.

Browse source
This commit is contained in:
Juan Sebastián Montoya 2026-01-06 17:25:34 -05:00
parent cf04677511
commit 86c1c3bc59
2 changed files with 37 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

50
src/systems/UISystem.js
View file

@ -64,8 +64,7 @@ export class UISystem extends System {
// Draw UI
this.drawHUD(player);
this.drawSkills(player);
this.drawStats(player);
this.drawSkillProgress(player);
// REMOVED drawStats and drawSkillProgress from active gameplay
this.drawDamageNumbers();
this.drawNotifications();
this.drawAbsorptionEffects();
@ -105,13 +104,6 @@ export class UISystem extends System {
const form = evolution.getDominantForm();
const formY = barY + barHeight + 14;
PixelFont.drawText(ctx, form.toUpperCase(), barX, formY, Palette.SKY_BLUE, 1);
// Tiny evolution details
const evoDetails = `H${Math.floor(evolution.human)} B${Math.floor(evolution.beast)} S${Math.floor(evolution.slime)}`;
PixelFont.drawText(ctx, evoDetails, barX, formY + 9, Palette.ROYAL_BLUE, 1);
// Small Instructions
PixelFont.drawText(ctx, 'WASD CLICK', barX, this.engine.canvas.height - 10, Palette.DARK_BLUE, 1);
}
drawSkills(player) {
@ -140,43 +132,47 @@ export class UISystem extends System {
});
}
drawStats(player) {
drawStats(player, x, y) {
const stats = player.getComponent('Stats');
if (!stats) return;
const evolution = player.getComponent('Evolution');
if (!stats || !evolution) return;
const ctx = this.ctx;
const width = this.engine.canvas.width;
const startX = width - 80;
const startY = 60;
PixelFont.drawText(ctx, 'STATISTICS', x, y, Palette.WHITE, 1);
PixelFont.drawText(ctx, `STR ${stats.strength}`, x, y + 10, Palette.ROYAL_BLUE, 1);
PixelFont.drawText(ctx, `AGI ${stats.agility}`, x, y + 20, Palette.ROYAL_BLUE, 1);
PixelFont.drawText(ctx, `INT ${stats.intelligence}`, x, y + 30, Palette.ROYAL_BLUE, 1);
PixelFont.drawText(ctx, `CON ${stats.constitution}`, x, y + 40, Palette.ROYAL_BLUE, 1);
PixelFont.drawText(ctx, 'STATS', startX, startY, Palette.WHITE, 1);
PixelFont.drawText(ctx, `STR ${stats.strength} AGI ${stats.agility}`, startX, startY + 9, Palette.ROYAL_BLUE, 1);
PixelFont.drawText(ctx, `INT ${stats.intelligence} CON ${stats.constitution}`, startX, startY + 18, Palette.ROYAL_BLUE, 1);
PixelFont.drawText(ctx, 'EVOLUTION', x, y + 60, Palette.WHITE, 1);
PixelFont.drawText(ctx, `HUMAN: ${Math.floor(evolution.human)}`, x, y + 70, Palette.ROYAL_BLUE, 1);
PixelFont.drawText(ctx, `BEAST: ${Math.floor(evolution.beast)}`, x, y + 80, Palette.ROYAL_BLUE, 1);
PixelFont.drawText(ctx, `SLIME: ${Math.floor(evolution.slime)}`, x, y + 90, Palette.ROYAL_BLUE, 1);
}
drawSkillProgress(player) {
drawSkillProgress(player, x, y) {
const skillProgress = player.getComponent('SkillProgress');
if (!skillProgress) return;
const ctx = this.ctx;
const width = this.engine.canvas.width;
const startX = width - 80;
const startY = 100;
const progress = skillProgress.getAllProgress();
if (progress.size === 0) return;
PixelFont.drawText(ctx, 'LRN', startX, startY, Palette.CYAN, 1);
PixelFont.drawText(ctx, 'KNOWLEDGE', x, y, Palette.CYAN, 1);
if (progress.size === 0) {
PixelFont.drawText(ctx, 'NONE YET', x, y + 10, Palette.DARK_BLUE, 1);
return;
}
let idx = 0;
progress.forEach((count, skillId) => {
const required = skillProgress.requiredAbsorptions;
const skill = SkillRegistry.get(skillId);
let name = skill ? skill.name : skillId;
if (name.length > 4) name = name.substring(0, 4);
if (name.length > 10) name = name.substring(0, 10);
const y = startY + 9 + idx * 8;
PixelFont.drawText(ctx, `${name} ${count}/${required}`, startX, y, Palette.SKY_BLUE, 1);
const py = y + 10 + idx * 9;
PixelFont.drawText(ctx, `${name}: ${count}/${required}`, x, py, Palette.SKY_BLUE, 1);
idx++;
});
}