From 29313749c2b98157bb5848089adc7967719f010a Mon Sep 17 00:00:00 2001 From: Florrie Date: Sun, 12 Aug 2018 10:07:48 -0300 Subject: Target character HP bar --- index.js | 21 ++++++++++++++++++++- 1 file changed, 20 insertions(+), 1 deletion(-) (limited to 'index.js') diff --git a/index.js b/index.js index f327163..f2c7412 100644 --- a/index.js +++ b/index.js @@ -399,6 +399,8 @@ const enemyCharacter = new BattleCharacter() enemyCharacter.x = 0 enemyCharacter.y = 200 +const targetCharacter = enemyCharacter + const atbBar = battleCharacter.atbBar const hpBar = battleCharacter.hpBar //atbBar.queuedActions = [{label: 'Fire', size: 1}, {label: 'Blizz', size: 1}, {label: 'Zap', size: 1}, {label: 'Firaga', size: 3}] @@ -428,11 +430,20 @@ function drawLoop() { ctx.fillStyle = '#EEE' ctx.fillRect(0, 0, canvas.width, canvas.height) + let targetX = 0, targetY = 0 + ctx.save() ctx.translate(-camera.x, -camera.y) for (const sprite of [backdrop, enemyCharacter, battleCharacter]) { + const x = sprite.x - sprite.canvas.width / 2 + const y = sprite.y - sprite.canvas.height / 2 sprite.draw() - ctx.drawImage(sprite.canvas, sprite.x - sprite.canvas.width / 2, sprite.y - sprite.canvas.height / 2) + ctx.drawImage(sprite.canvas, x, y) + + if (targetCharacter === sprite) { + targetX = sprite.x - camera.x + targetY = y - camera.y + } } ctx.restore() @@ -452,6 +463,14 @@ function drawLoop() { hpBar.draw() ctx.drawImage(hpBar.canvas, canvas.width - 20 - hpBar.canvas.width, y) + if (targetCharacter) { + const hpBar = targetCharacter.hpBar + const x = targetX - hpBar.canvas.width / 2 + const y = targetY - hpBar.canvas.height + hpBar.draw() + ctx.drawImage(hpBar.canvas, x, y) + } + requestAnimationFrame(drawLoop) } -- cgit 1.3.0-6-gf8a5