Pre-win animation

1 files changed, 38 insertions, 2 deletions

diff --git a/index.js b/index.js
index d83a00b..c9cc7a9 100644
--- a/index.js
+++ b/index.js
@@ -244,6 +244,11 @@ class BaseBattleMenu {
     const ctx = this.canvas.getContext('2d')
     ctx.clearRect(0, 0, this.canvas.width, this.canvas.height)
 
+    if (this.options.length === 0) {
+      // ..Well..
+      return
+    }
+
     const startIndex = this.currentOptionIndex - 1
     const endIndex = startIndex + 3
 
@@ -523,15 +528,18 @@ class Battle {
 
     // State
 
+    this.gameState = 'battle' // battle, pre-win
+
     this.currentMenu = this.actionMenu
     this.changeMenuAnim = {time: 1, direction: 1, old: null}
+    this.preWinAnim = null
   }
 
   draw() {
     const ctx = canvas.getContext('2d')
     let targetX = 0, targetY = 0
     const targetCharacter = (
-      this.currentMenu === this.targetMenu && this.targetMenu.getCurrentOption().battleCharacter ||
+      this.currentMenu === this.targetMenu && this.targetMenu.getCurrentOption() && this.targetMenu.getCurrentOption().battleCharacter ||
       this.playerCharacter.targetCharacter)
 
     ctx.save()
@@ -575,9 +583,15 @@ class Battle {
     }
     const targetOffset = this.currentMenu ? this.currentMenu.canvas.height : 0
     const oldOffset = (this.changeMenuAnim && this.changeMenuAnim.old) ? this.changeMenuAnim.old.canvas.height : 0
-    atbBar.draw()
     y -= oldOffset + (targetOffset - oldOffset) * (this.changeMenuAnim ? 1 - this.changeMenuAnim.time : 1)
     y -= 2
+    ctx.save()
+    if (this.preWinAnim) {
+      const { time } = this.preWinAnim
+      ctx.translate(0, Math.floor(-20 * (time - 1)))
+      ctx.filter = `opacity(${time * 100}%)`
+    }
+    atbBar.draw()
     ctx.drawImage(atbBar.canvas, 20, y - atbBar.canvas.height)
 
     y = canvas.height - 20
@@ -587,6 +601,7 @@ class Battle {
       ctx.drawImage(hpBar.canvas, canvas.width - 20 - hpBar.canvas.width, y)
       y -= 2
     }
+    ctx.restore()
 
     if (targetCharacter) {
       const hpBar = targetCharacter.hpBar
@@ -598,6 +613,14 @@ class Battle {
   }
 
   update(dt) {
+    if (this.gameState === 'battle') {
+      this.battleUpdate(dt)
+    } else if (this.gameState === 'pre-win') {
+      this.preWinUpdate(dt)
+    }
+  }
+
+  battleUpdate(dt) {
     for (const team of this.teams) {
       team.update(dt)
     }
@@ -610,6 +633,18 @@ class Battle {
         this.changeMenuAnim = null
       }
     }
+
+    if (!this.getAllBattleCharacters().find(c => c.team !== this.playerCharacter.team && !c.dead)) {
+      this.gameState = 'pre-win'
+      this.preWinAnim = {time: 1}
+    }
+  }
+
+  preWinUpdate(dt) {
+    this.preWinAnim.time -= dt * 3
+    if (this.preWinAnim.time <= 0) {
+      this.preWinAnim.time = null
+    }
   }
 
   showTargetMenu() {
@@ -751,6 +786,7 @@ canvas.addEventListener('keypress', evt => {
     }
   } else {
     // TODO: Backspace to cancel chain
+    // TODO: E to execute chain immediately
   }
 })