« get me outta code hell

csb-game - Pixelly spin-off of the Command Synergy Battle system used in Final Fantasy XIII
summary refs log tree commit diff
diff options
context:
space:
mode:
-rw-r--r--index.js57
1 files changed, 45 insertions, 12 deletions
diff --git a/index.js b/index.js
index 692aacf..b87cbcb 100644
--- a/index.js
+++ b/index.js
@@ -657,11 +657,26 @@ class BattleCharacter extends Sprite {
     // controlled characters are the ones which the cooldown mechanic was
     // designed for in the first place.
     this.cooldownTimers = {}
+
+    // Multiplier for how far to get knocked back by, well, any action that
+    // knocks a character back.
+    this.knockbackMultiplier = 1.0
+
+    // Boring physics stuff
+    this.xvel = 0
+    this.yvel = 0
+    this.x = 0
+    this.y = 0
   }
 
   update(dt) {
     this.hpBar.update(dt)
 
+    this.xvel *= 0.9
+    this.yvel *= 0.9
+    this.x += dt * this.xvel
+    this.y += dt * this.yvel
+
     if (this.dead) {
       this.deadUpdate(dt)
     } else {
@@ -850,7 +865,7 @@ class Battle {
 
     this.backdrop = new Backdrop()
 
-    this.camera = new BattleCamera()
+    this.camera = new BattleCamera(this)
     this.camera.follow(this.playerCharacter)
 
     this.slideacrossMessage = new SlideacrossMessage()
@@ -867,6 +882,13 @@ class Battle {
     this.changeMenuAnim = {time: 1, direction: 1, old: null}
     this.nearlyDeadAnim = null
     this.preEndAnim = null
+
+    this.battlefieldCenterX = 40
+    this.battlefieldCenterY = 220
+    this.battlefieldMinX = -180
+    this.battlefieldMaxX = 180
+    this.battlefieldMinY = 180
+    this.battlefieldMaxY = 220
   }
 
   draw() {
@@ -1006,8 +1028,8 @@ class Battle {
 
     for (const { x, y, battleCharacter } of overlayHPBars) {
       const hpBar = battleCharacter.hpBar
-      const drawX = x - hpBar.canvas.width / 2
-      const drawY = y - hpBar.canvas.height
+      const drawX = Math.round(x - hpBar.canvas.width / 2)
+      const drawY = Math.round(y - hpBar.canvas.height)
       hpBar.draw()
       ctx.drawImage(hpBar.canvas, drawX, drawY)
       ctx.drawImage(hpBar.labelCanvas, drawX - hpBar.labelCanvas.width - 2, drawY - 1)
@@ -1036,6 +1058,12 @@ class Battle {
       team.update(dt)
     }
 
+    // Don't let the characters go out of bounds
+    for (const character of this.getAllBattleCharacters()) {
+      character.x = Math.min(this.battlefieldMaxX, Math.max(this.battlefieldMinX, character.x))
+      character.y = Math.min(this.battlefieldMaxY, Math.max(this.battlefieldMinY, character.y))
+    }
+
     this.camera.update(dt)
 
     if (this.changeMenuAnim) {
@@ -1226,17 +1254,16 @@ class Camera extends Sprite {
 }
 
 class BattleCamera extends Camera {
-  constructor() {
+  constructor(battle) {
     super()
 
-    this.battlefieldCenterX = 40
-    this.battlefieldCenterY = 220
+    this.battle = battle
   }
 
   getSpriteFollowCoords(sprite) {
-    const bx = this.battlefieldCenterX
-    const by = this.battlefieldCenterY
-    return {x: bx + (sprite.x - bx) / 5, y: by + (sprite.y - by) / 5}
+    const bx = this.battle.battlefieldCenterX
+    const by = this.battle.battlefieldCenterY
+    return {x: bx + (sprite.x - bx) / 3, y: by + (sprite.y - by) / 3}
   }
 }
 
@@ -1255,8 +1282,10 @@ class MagicProjectile {
 
   update(dt) {
     // TODO: Good animation, make distance affect acceleration, not velocity
-    this.x += dt * 5 * (this.target.x - this.x)
-    this.y += dt * 5 * (this.target.y - this.y)
+    const xvel = 5 * (this.target.x - this.x)
+    const yvel = 5 * (this.target.y - this.y)
+    this.x += dt * xvel
+    this.y += dt * yvel
 
     if (Math.abs(this.target.x - this.x) <= 5 && Math.abs(this.target.y - this.y) <= 5) {
       if (this.action.target === 'enemy') {
@@ -1267,6 +1296,10 @@ class MagicProjectile {
         const { healRelativeToDamageTaken: rel } = this.action
         if (rel) this.target.recoverHP(rel * (this.target.maxHP - this.target.hp))
       }
+
+      this.target.xvel += 2 * xvel * this.target.knockbackMultiplier
+      this.target.yvel += 2 * yvel * this.target.knockbackMultiplier
+
       this.discarded = true
     }
   }
@@ -1390,7 +1423,7 @@ const battle = new Battle({
       {x: -75, y: 225, name: 'Fie', hp: 375, maxHP: 375, knownActions: ['fire', 'blizz', 'blizzara', 'blizzaga', 'aqua', 'aquara', 'curasa'], determineChain: basicAI}
     ]},
     {characterData: [
-      {x: 80, y: 200, name: 'Manasvin Warmech', hp: 1200, maxHP: 1200, knownActions: ['aqua', 'aquaga', 'manasvinSwipe', 'manasvinRecover'], determineChain: basicAI}
+      {x: 80, y: 200, name: 'Manasvin Warmech', hp: 1200, maxHP: 1200, knownActions: ['aqua', 'aquaga', 'manasvinSwipe', 'manasvinRecover'], determineChain: basicAI, knockbackMultiplier: 0}
     ]}
   ]
 })