User prompt
make an individual asset for healthbars and enemy
User prompt
Create HealthbarAsset and EnemyHealthbarAsset classes for styled healthbars Replace enemy healthbar GUI with EnemyHealthbarAsset instance Replace healthbar GUI with HealthbarAsset instance
User prompt
Please fix the bug: 'Cannot read properties of undefined (reading 'setText')' in or related to this line: 'self.valueTxt.setText(val + "/" + max);' Line Number: 214
User prompt
Please fix the bug: 'Cannot read properties of undefined (reading 'setText')' in or related to this line: 'self.labelTxt.setText(txt);' Line Number: 218
User prompt
Please fix the bug: 'self.init is not a function' in or related to this line: 'self.init({' Line Number: 76
User prompt
make the healthbar and enemy an asset
User prompt
put an enemy asset above the arena and give it a health too
User prompt
make the healthbar box styled and visible under the arena
User prompt
Please fix the bug: 'Cannot set properties of undefined (setting 'width')' in or related to this line: 'healthbarFg.children[0].width = Math.max(0, healthbarWidth * ratio);' Line Number: 172
User prompt
Please fix the bug: 'Cannot read properties of undefined (reading 'addChild')' in or related to this line: 'healthbarBg.addChild(healthbarBgRect);' Line Number: 119
User prompt
add a healthbar and hp for the sol
User prompt
make the game over screen 5 seconds after dying
User prompt
make the texture change 2 the seconds after dieing
User prompt
change the souls texture asset if the soul is died
User prompt
make the bullet moving pattern closer to the middel of the arena ,n wave 2
User prompt
make the line moving unpredictable
User prompt
make the bullet lines go rihgt and left in fisrt wave
User prompt
make tyhe bullets symetric again in first weave
User prompt
make the first wave harder
User prompt
make the bllets line go up and down in 2nd wave
User prompt
Move one of the bullet lines in the first wave a little to the right so that it looks diagonal and the player has to move
User prompt
more
User prompt
more
User prompt
ls˧ower it more
User prompt
lower the frequency
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
/****
* Classes
****/
// Arena border (visual only)
var ArenaBorder = Container.expand(function () {
var self = Container.call(this);
var border = self.attachAsset('arenaBorder', {
anchorX: 0.5,
anchorY: 0.5
});
border.alpha = 0.7;
return self;
});
// Bullet class
var Bullet = Container.expand(function () {
var self = Container.call(this);
var bulletSprite = self.attachAsset('bullet', {
anchorX: 0.5,
anchorY: 0.5
});
self.vx = 0;
self.vy = 0;
self.update = function () {
self.x += self.vx;
self.y += self.vy;
};
return self;
});
// Enemy (boss) class
var Enemy = Container.expand(function () {
var self = Container.call(this);
// Use arenaBorder as a placeholder, but you can swap to a unique asset if available
var enemySprite = self.attachAsset('arenaBorder', {
anchorX: 0.5,
anchorY: 0.5,
width: 220,
height: 120,
color: 0xff4444
});
// Health property
self.maxHP = 20;
self.hp = self.maxHP;
// For hit flash
self.flash = function () {
tween(self, {
alpha: 0.3
}, {
duration: 80,
onFinish: function onFinish() {
tween(self, {
alpha: 1
}, {
duration: 120
});
}
});
};
return self;
});
// Soul (player) class
var Soul = Container.expand(function () {
var self = Container.call(this);
var soulSprite = self.attachAsset('soul', {
anchorX: 0.5,
anchorY: 0.5
});
// For hit flash
self.flash = function () {
tween(self, {
alpha: 0.3
}, {
duration: 80,
onFinish: function onFinish() {
tween(self, {
alpha: 1
}, {
duration: 120
});
}
});
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x181818
});
/****
* Game Code
****/
// Arena dimensions (centered)
// Heart-shaped soul (red)
// Arena border (white rectangle, thin)
// Bullet (white circle)
// Enemy warning (yellow, for telegraphing)
var ARENA_W = 1200;
var ARENA_H = 900;
var ARENA_X = 2048 / 2 - ARENA_W / 2;
var ARENA_Y = 2732 / 2 - ARENA_H / 2;
// Add arena border
var arenaBorder = new ArenaBorder();
arenaBorder.x = 2048 / 2;
arenaBorder.y = 2732 / 2;
game.addChild(arenaBorder);
// Add enemy (boss) above the arena
var enemy = new Enemy();
enemy.x = 2048 / 2;
enemy.y = ARENA_Y - 90; // 90px above arena top
game.addChild(enemy);
// Enemy healthbar GUI (styled box above arena)
var enemyHealthbarBg = new Container();
var enemyHealthbarFg = new Container();
var enemyHealthbarWidth = 400;
var enemyHealthbarHeight = 36;
var enemyHealthbarX = 2048 / 2 - enemyHealthbarWidth / 2;
var enemyHealthbarY = ARENA_Y - 80; // 80px above arena
// Enemy healthbar background (rounded box, dark gray)
var enemyHealthbarBgRect = LK.getAsset('arenaBorder', {
width: enemyHealthbarWidth + 8,
height: enemyHealthbarHeight + 8,
color: 0x222222,
anchorX: 0,
anchorY: 0
});
enemyHealthbarBg.addChild(enemyHealthbarBgRect);
// Enemy healthbar border (white, slightly larger than fg)
var enemyHealthbarBorderRect = LK.getAsset('arenaBorder', {
width: enemyHealthbarWidth + 4,
height: enemyHealthbarHeight + 4,
color: 0xffffff,
anchorX: 0,
anchorY: 0
});
enemyHealthbarBorderRect.x = 2;
enemyHealthbarBorderRect.y = 2;
enemyHealthbarBg.addChild(enemyHealthbarBorderRect);
// Enemy healthbar foreground (red, will be resized)
var enemyHealthbarFgRect = LK.getAsset('arenaBorder', {
width: enemyHealthbarWidth,
height: enemyHealthbarHeight,
color: 0xff4444,
anchorX: 0,
anchorY: 0
});
enemyHealthbarFg.addChild(enemyHealthbarFgRect);
// Add to game (not GUI, so it stays above arena)
enemyHealthbarBg.x = enemyHealthbarX - 4;
enemyHealthbarBg.y = enemyHealthbarY - 4;
enemyHealthbarFg.x = enemyHealthbarX;
enemyHealthbarFg.y = enemyHealthbarY;
game.addChild(enemyHealthbarBg);
game.addChild(enemyHealthbarFg);
// Enemy healthbar label (left of bar)
var enemyHealthbarLabel = new Text2('ENEMY', {
size: 48,
fill: "#fff"
});
enemyHealthbarLabel.anchor.set(1, 0.5);
enemyHealthbarLabel.x = enemyHealthbarX - 24;
enemyHealthbarLabel.y = enemyHealthbarY + enemyHealthbarHeight / 2;
game.addChild(enemyHealthbarLabel);
// Enemy healthbar value text (right of bar)
var enemyHealthbarValue = new Text2('', {
size: 48,
fill: "#fff"
});
enemyHealthbarValue.anchor.set(0, 0.5);
enemyHealthbarValue.x = enemyHealthbarX + enemyHealthbarWidth + 24;
enemyHealthbarValue.y = enemyHealthbarY + enemyHealthbarHeight / 2;
game.addChild(enemyHealthbarValue);
// Enemy healthbar update function
function updateEnemyHealthbar() {
// Clamp HP
if (enemy.hp < 0) enemy.hp = 0;
if (enemy.hp > enemy.maxHP) enemy.hp = enemy.maxHP;
// Update width
var ratio = enemy.hp / enemy.maxHP;
if (enemyHealthbarFg.children && enemyHealthbarFg.children.length > 0 && enemyHealthbarFg.children[0]) {
enemyHealthbarFg.children[0].width = Math.max(0, enemyHealthbarWidth * ratio);
}
// Update value text
enemyHealthbarValue.setText(enemy.hp + "/" + enemy.maxHP);
}
updateEnemyHealthbar();
// Add soul (player)
var soul = new Soul();
soul.x = 2048 / 2;
soul.y = 2732 / 2;
game.addChild(soul);
// GUI: Timer (shows wave time left)
var timerTxt = new Text2('', {
size: 80,
fill: "#fff"
});
timerTxt.anchor.set(0.5, 0);
LK.gui.top.addChild(timerTxt);
// GUI: Wave counter
var waveTxt = new Text2('', {
size: 80,
fill: "#fff"
});
waveTxt.anchor.set(0.5, 0);
LK.gui.top.addChild(waveTxt);
waveTxt.y = 90;
// Healthbar GUI (styled box under arena)
var healthbarBg = new Container();
var healthbarFg = new Container();
var healthbarWidth = 400;
var healthbarHeight = 36;
// Position healthbar centered horizontally, below the arena
var healthbarX = 2048 / 2 - healthbarWidth / 2;
var healthbarY = ARENA_Y + ARENA_H + 48; // 48px below arena
// Healthbar background (rounded box, dark gray)
var healthbarBgRect = LK.getAsset('arenaBorder', {
width: healthbarWidth + 8,
height: healthbarHeight + 8,
color: 0x222222,
anchorX: 0,
anchorY: 0
});
healthbarBg.addChild(healthbarBgRect);
// Healthbar border (white, slightly larger than fg)
var healthbarBorderRect = LK.getAsset('arenaBorder', {
width: healthbarWidth + 4,
height: healthbarHeight + 4,
color: 0xffffff,
anchorX: 0,
anchorY: 0
});
healthbarBorderRect.x = 2;
healthbarBorderRect.y = 2;
healthbarBg.addChild(healthbarBorderRect);
// Healthbar foreground (green, will be resized)
var healthbarFgRect = LK.getAsset('arenaBorder', {
width: healthbarWidth,
height: healthbarHeight,
color: 0x44ff44,
anchorX: 0,
anchorY: 0
});
healthbarFg.addChild(healthbarFgRect);
// Add to game (not GUI, so it stays under arena)
healthbarBg.x = healthbarX - 4;
healthbarBg.y = healthbarY - 4;
healthbarFg.x = healthbarX;
healthbarFg.y = healthbarY;
game.addChild(healthbarBg);
game.addChild(healthbarFg);
// Healthbar label (left of bar)
var healthbarLabel = new Text2('HP', {
size: 48,
fill: "#fff"
});
healthbarLabel.anchor.set(1, 0.5);
healthbarLabel.x = healthbarX - 24;
healthbarLabel.y = healthbarY + healthbarHeight / 2;
game.addChild(healthbarLabel);
// Healthbar value text (right of bar)
var healthbarValue = new Text2('', {
size: 48,
fill: "#fff"
});
healthbarValue.anchor.set(0, 0.5);
healthbarValue.x = healthbarX + healthbarWidth + 24;
healthbarValue.y = healthbarY + healthbarHeight / 2;
game.addChild(healthbarValue);
// Healthbar update function
function updateHealthbar() {
// Clamp HP
if (soulHP < 0) soulHP = 0;
if (soulHP > soulMaxHP) soulHP = soulMaxHP;
// Update width
var ratio = soulHP / soulMaxHP;
if (healthbarFg.children && healthbarFg.children.length > 0 && healthbarFg.children[0]) {
healthbarFg.children[0].width = Math.max(0, healthbarWidth * ratio);
}
// Update value text
healthbarValue.setText(soulHP + "/" + soulMaxHP);
}
updateHealthbar();
// Game state
var bullets = [];
var currentWave = 0;
var waveTime = 0;
var waveTimer = 0;
var waveActive = false;
var soulAlive = true;
var dragSoul = false;
var dragOffsetX = 0;
var dragOffsetY = 0;
// Soul health
var soulMaxHP = 5;
var soulHP = soulMaxHP;
// Healthbar GUI
// (removed duplicate healthbarBg, healthbarFg, healthbarWidth, healthbarHeight, healthbarX, healthbarY declarations)
// Arena bounds (for clamping soul)
function clampSoul(x, y) {
var hw = 50,
hh = 50; // soul half size
var minX = ARENA_X + hw;
var maxX = ARENA_X + ARENA_W - hw;
var minY = ARENA_Y + hh;
var maxY = ARENA_Y + ARENA_H - hh;
return {
x: Math.max(minX, Math.min(maxX, x)),
y: Math.max(minY, Math.min(maxY, y))
};
}
// Touch/drag controls
function handleSoulMove(x, y, obj) {
if (!dragSoul || !soulAlive) return;
var pos = clampSoul(x - dragOffsetX, y - dragOffsetY);
soul.x = pos.x;
soul.y = pos.y;
}
game.move = function (x, y, obj) {
handleSoulMove(x, y, obj);
};
game.down = function (x, y, obj) {
// Only start drag if inside soul
var dx = x - soul.x,
dy = y - soul.y;
if (dx * dx + dy * dy <= 60 * 60) {
dragSoul = true;
dragOffsetX = x - soul.x;
dragOffsetY = y - soul.y;
handleSoulMove(x, y, obj);
}
};
game.up = function (x, y, obj) {
dragSoul = false;
};
// Waves definition
// Each wave: {duration, spawnFunc(tick, bulletsArr)}
var waves = [
// Wave 1: Simple slow bullets from top
{
duration: 180,
// 3s
spawnFunc: function spawnFunc(tick, arr) {
// Unpredictable horizontal movement for the whole line
if (typeof spawnFunc._targetX === "undefined") {
spawnFunc._targetX = 0;
spawnFunc._currentX = 0;
spawnFunc._tween = null;
spawnFunc._lastTick = 0;
}
if (tick - spawnFunc._lastTick > 40 || Math.abs(spawnFunc._targetX - spawnFunc._currentX) < 5) {
// Pick a new random target X offset within [-180, 180]
var newTarget = (Math.random() * 2 - 1) * 180;
spawnFunc._lastTick = tick;
spawnFunc._targetX = newTarget;
// Tween smoothly to new target over 30-60 frames
if (spawnFunc._tween) spawnFunc._tween.stop();
spawnFunc._tween = tween(spawnFunc, {
_currentX: newTarget
}, {
duration: 30 + Math.floor(Math.random() * 30)
});
}
var lineXOffset = spawnFunc._currentX;
if (tick % 24 === 0) {
// Wave 1: faster and more bullets, with unpredictable horizontal movement
var speed = 8;
for (var i = 0; i < 6; ++i) {
var b = new Bullet();
b.x = ARENA_X + 120 + i * 180 + lineXOffset;
b.y = ARENA_Y + 30;
b.vx = 0;
b.vy = speed;
arr.push(b);
game.addChild(b);
}
}
}
},
// Wave 2: Bullets from left/right
{
duration: 210,
// 3.5s
spawnFunc: function spawnFunc(tick, arr) {
// Make the whole line go up and down using a vertical offset
var lineOscAmp = 120; // amplitude of up/down movement
var lineOscFreq = 0.025; // frequency of up/down movement
var lineYOffset = Math.sin(tick * lineOscFreq) * lineOscAmp;
// Center the bullet lines vertically in the arena, closer to the middle
var centerY1 = ARENA_Y + ARENA_H / 2 - 120;
var centerY2 = ARENA_Y + ARENA_H / 2 + 120;
if (tick % 24 === 0) {
// S-shape: bullets from left and right, with vy oscillating as a sine wave
var speed = 10;
var amplitude = 60; // increased vertical amplitude of S
var freq = 0.012; // lowered frequency of S even more (even slower oscillation)
// Left to right
var b1 = new Bullet();
b1.x = ARENA_X + 30;
b1.y = (tick % 2 === 0 ? centerY1 : centerY2) + lineYOffset;
b1.vx = speed;
b1.vy = amplitude * Math.sin((tick + 0) * freq);
// Store phase for S motion
b1._sPhase = (tick + 0) * freq;
b1._sDir = 1;
// Override update for S shape
b1._baseY = b1.y;
b1._baseX = b1.x;
b1._t = 0;
b1._lineOscAmp = lineOscAmp;
b1._lineOscFreq = lineOscFreq;
b1._spawnTick = tick;
b1.update = function () {
this.x += this.vx;
this._t += 1;
// S shape: y = baseY + amplitude * sin((x - baseX) * freq) + line oscillation
var lineYOffset = Math.sin((this._spawnTick + this._t) * this._lineOscFreq) * this._lineOscAmp;
this.y = this._baseY + amplitude * Math.sin((this.x - this._baseX) * freq) + (lineYOffset - Math.sin(this._spawnTick * this._lineOscFreq) * this._lineOscAmp);
};
arr.push(b1);
game.addChild(b1);
// Right to left
var b2 = new Bullet();
b2.x = ARENA_X + ARENA_W - 30;
b2.y = (tick % 2 === 0 ? centerY2 : centerY1) + lineYOffset;
b2.vx = -speed;
b2.vy = amplitude * Math.sin((tick + 60) * freq);
b2._sPhase = (tick + 60) * freq;
b2._sDir = -1;
b2._baseY = b2.y;
b2._baseX = b2.x;
b2._t = 0;
b2._lineOscAmp = lineOscAmp;
b2._lineOscFreq = lineOscFreq;
b2._spawnTick = tick;
b2.update = function () {
this.x += this.vx;
this._t += 1;
var lineYOffset = Math.sin((this._spawnTick + this._t) * this._lineOscFreq) * this._lineOscAmp;
this.y = this._baseY + amplitude * Math.sin((this.x - this._baseX) * freq) + (lineYOffset - Math.sin(this._spawnTick * this._lineOscFreq) * this._lineOscAmp);
};
arr.push(b2);
game.addChild(b2);
}
}
},
// Wave 3: Diagonal bullets from corners
{
duration: 240,
// 4s
spawnFunc: function spawnFunc(tick, arr) {
if (tick % 36 === 0) {
// Wave 3: diagonal, medium speed
var speed = 7.5;
var diag = speed / Math.sqrt(2);
// Top-left
var b1 = new Bullet();
b1.x = ARENA_X + 40;
b1.y = ARENA_Y + 40;
b1.vx = diag;
b1.vy = diag;
arr.push(b1);
game.addChild(b1);
// Top-right
var b2 = new Bullet();
b2.x = ARENA_X + ARENA_W - 40;
b2.y = ARENA_Y + 40;
b2.vx = -diag;
b2.vy = diag;
arr.push(b2);
game.addChild(b2);
// Bottom-left
var b3 = new Bullet();
b3.x = ARENA_X + 40;
b3.y = ARENA_Y + ARENA_H - 40;
b3.vx = diag;
b3.vy = -diag;
arr.push(b3);
game.addChild(b3);
// Bottom-right
var b4 = new Bullet();
b4.x = ARENA_X + ARENA_W - 40;
b4.y = ARENA_Y + ARENA_H - 40;
b4.vx = -diag;
b4.vy = -diag;
arr.push(b4);
game.addChild(b4);
}
}
},
// Wave 4: Random rain
{
duration: 210,
// 3.5s
spawnFunc: function spawnFunc(tick, arr) {
if (tick % 10 === 0) {
// Wave 4: fast random rain
var minSpeed = 12,
maxSpeed = 16;
var b = new Bullet();
b.x = ARENA_X + 80 + Math.floor(Math.random() * (ARENA_W - 160));
b.y = ARENA_Y + 30;
b.vx = 0;
b.vy = minSpeed + Math.random() * (maxSpeed - minSpeed);
arr.push(b);
game.addChild(b);
}
}
},
// Wave 5: Spiral (center out)
{
duration: 270,
// 4.5s
spawnFunc: function spawnFunc(tick, arr) {
if (tick % 12 === 0) {
// Wave 5: spiral, moderate speed
var speed = 9;
var angle = tick / 12 * 0.5;
for (var i = 0; i < 4; ++i) {
var a = angle + i * Math.PI / 2;
var b = new Bullet();
b.x = 2048 / 2;
b.y = 2732 / 2;
b.vx = Math.cos(a) * speed;
b.vy = Math.sin(a) * speed;
arr.push(b);
game.addChild(b);
}
}
}
}];
// Start first wave
function startWave(idx) {
currentWave = idx;
waveTime = 0;
waveActive = true;
waveTimer = 0;
// Remove all bullets
for (var i = bullets.length - 1; i >= 0; --i) {
bullets[i].destroy();
bullets.splice(i, 1);
}
// Update GUI
waveTxt.setText("Wave " + (currentWave + 1) + "/" + waves.length);
// Reset HP and healthbar if starting first wave (new game)
if (currentWave === 0) {
soulHP = soulMaxHP;
soulAlive = true;
updateHealthbar();
// Restore soul sprite if needed
if (soul.children && soul.children.length > 0) {
var firstChild = soul.children[0];
if (firstChild.assetId === 'warning') {
soul.removeChild(firstChild);
var newSoulSprite = LK.getAsset('soul', {
anchorX: 0.5,
anchorY: 0.5
});
soul.addChildAt(newSoulSprite, 0);
}
}
}
}
startWave(0);
// Main update loop
game.update = function () {
if (!soulAlive) return;
// Wave logic
if (waveActive) {
var wave = waves[currentWave];
wave.spawnFunc(waveTime, bullets);
waveTime++;
// Update timer GUI
var tleft = Math.max(0, Math.ceil((wave.duration - waveTime) / 60));
timerTxt.setText("Time: " + tleft + "s");
// End wave?
if (waveTime >= wave.duration) {
waveActive = false;
// Remove all bullets after short delay
LK.setTimeout(function () {
for (var i = bullets.length - 1; i >= 0; --i) {
bullets[i].destroy();
bullets.splice(i, 1);
}
// Next wave or win
if (currentWave + 1 < waves.length) {
startWave(currentWave + 1);
} else {
// Win!
LK.showYouWin();
}
}, 600);
}
}
// Update bullets
for (var i = bullets.length - 1; i >= 0; --i) {
var b = bullets[i];
b.update();
// Remove if out of arena (immediately on leaving the border)
if (b.x < ARENA_X || b.x > ARENA_X + ARENA_W || b.y < ARENA_Y || b.y > ARENA_Y + ARENA_H) {
b.destroy();
bullets.splice(i, 1);
continue;
}
// Collision with soul
var dx = b.x - soul.x,
dy = b.y - soul.y;
if (dx * dx + dy * dy < 45 * 45) {
// Hit!
soul.flash();
soulHP -= 1;
updateHealthbar();
// Remove bullet on hit
b.destroy();
bullets.splice(i, 1);
if (soulHP <= 0 && soulAlive) {
soulAlive = false;
// Delay soul's texture asset change to 2 seconds after dying
LK.setTimeout(function () {
if (soul.children && soul.children.length > 0) {
var deadSprite = LK.getAsset('warning', {
anchorX: 0.5,
anchorY: 0.5
});
var oldSprite = soul.children[0];
deadSprite.x = oldSprite.x;
deadSprite.y = oldSprite.y;
soul.removeChild(oldSprite);
soul.addChildAt(deadSprite, 0);
}
}, 2000);
LK.effects.flashScreen(0xff0000, 800);
LK.setTimeout(function () {
LK.showGameOver();
}, 5000);
break;
} else {
// Flash screen for hit, but not game over
LK.effects.flashScreen(0xff0000, 300);
}
}
}
};
// Initial GUI text
timerTxt.setText("Time: ");
waveTxt.setText("Wave 1/" + waves.length); ===================================================================
--- original.js
+++ change.js
@@ -30,8 +30,39 @@
self.y += self.vy;
};
return self;
});
+// Enemy (boss) class
+var Enemy = Container.expand(function () {
+ var self = Container.call(this);
+ // Use arenaBorder as a placeholder, but you can swap to a unique asset if available
+ var enemySprite = self.attachAsset('arenaBorder', {
+ anchorX: 0.5,
+ anchorY: 0.5,
+ width: 220,
+ height: 120,
+ color: 0xff4444
+ });
+ // Health property
+ self.maxHP = 20;
+ self.hp = self.maxHP;
+ // For hit flash
+ self.flash = function () {
+ tween(self, {
+ alpha: 0.3
+ }, {
+ duration: 80,
+ onFinish: function onFinish() {
+ tween(self, {
+ alpha: 1
+ }, {
+ duration: 120
+ });
+ }
+ });
+ };
+ return self;
+});
// Soul (player) class
var Soul = Container.expand(function () {
var self = Container.call(this);
var soulSprite = self.attachAsset('soul', {
@@ -79,8 +110,88 @@
var arenaBorder = new ArenaBorder();
arenaBorder.x = 2048 / 2;
arenaBorder.y = 2732 / 2;
game.addChild(arenaBorder);
+// Add enemy (boss) above the arena
+var enemy = new Enemy();
+enemy.x = 2048 / 2;
+enemy.y = ARENA_Y - 90; // 90px above arena top
+game.addChild(enemy);
+// Enemy healthbar GUI (styled box above arena)
+var enemyHealthbarBg = new Container();
+var enemyHealthbarFg = new Container();
+var enemyHealthbarWidth = 400;
+var enemyHealthbarHeight = 36;
+var enemyHealthbarX = 2048 / 2 - enemyHealthbarWidth / 2;
+var enemyHealthbarY = ARENA_Y - 80; // 80px above arena
+// Enemy healthbar background (rounded box, dark gray)
+var enemyHealthbarBgRect = LK.getAsset('arenaBorder', {
+ width: enemyHealthbarWidth + 8,
+ height: enemyHealthbarHeight + 8,
+ color: 0x222222,
+ anchorX: 0,
+ anchorY: 0
+});
+enemyHealthbarBg.addChild(enemyHealthbarBgRect);
+// Enemy healthbar border (white, slightly larger than fg)
+var enemyHealthbarBorderRect = LK.getAsset('arenaBorder', {
+ width: enemyHealthbarWidth + 4,
+ height: enemyHealthbarHeight + 4,
+ color: 0xffffff,
+ anchorX: 0,
+ anchorY: 0
+});
+enemyHealthbarBorderRect.x = 2;
+enemyHealthbarBorderRect.y = 2;
+enemyHealthbarBg.addChild(enemyHealthbarBorderRect);
+// Enemy healthbar foreground (red, will be resized)
+var enemyHealthbarFgRect = LK.getAsset('arenaBorder', {
+ width: enemyHealthbarWidth,
+ height: enemyHealthbarHeight,
+ color: 0xff4444,
+ anchorX: 0,
+ anchorY: 0
+});
+enemyHealthbarFg.addChild(enemyHealthbarFgRect);
+// Add to game (not GUI, so it stays above arena)
+enemyHealthbarBg.x = enemyHealthbarX - 4;
+enemyHealthbarBg.y = enemyHealthbarY - 4;
+enemyHealthbarFg.x = enemyHealthbarX;
+enemyHealthbarFg.y = enemyHealthbarY;
+game.addChild(enemyHealthbarBg);
+game.addChild(enemyHealthbarFg);
+// Enemy healthbar label (left of bar)
+var enemyHealthbarLabel = new Text2('ENEMY', {
+ size: 48,
+ fill: "#fff"
+});
+enemyHealthbarLabel.anchor.set(1, 0.5);
+enemyHealthbarLabel.x = enemyHealthbarX - 24;
+enemyHealthbarLabel.y = enemyHealthbarY + enemyHealthbarHeight / 2;
+game.addChild(enemyHealthbarLabel);
+// Enemy healthbar value text (right of bar)
+var enemyHealthbarValue = new Text2('', {
+ size: 48,
+ fill: "#fff"
+});
+enemyHealthbarValue.anchor.set(0, 0.5);
+enemyHealthbarValue.x = enemyHealthbarX + enemyHealthbarWidth + 24;
+enemyHealthbarValue.y = enemyHealthbarY + enemyHealthbarHeight / 2;
+game.addChild(enemyHealthbarValue);
+// Enemy healthbar update function
+function updateEnemyHealthbar() {
+ // Clamp HP
+ if (enemy.hp < 0) enemy.hp = 0;
+ if (enemy.hp > enemy.maxHP) enemy.hp = enemy.maxHP;
+ // Update width
+ var ratio = enemy.hp / enemy.maxHP;
+ if (enemyHealthbarFg.children && enemyHealthbarFg.children.length > 0 && enemyHealthbarFg.children[0]) {
+ enemyHealthbarFg.children[0].width = Math.max(0, enemyHealthbarWidth * ratio);
+ }
+ // Update value text
+ enemyHealthbarValue.setText(enemy.hp + "/" + enemy.maxHP);
+}
+updateEnemyHealthbar();
// Add soul (player)
var soul = new Soul();
soul.x = 2048 / 2;
soul.y = 2732 / 2;