scripts/main.js

@@ -68,6 +68,8 @@ const kitaList = Array (40).fill ().map (
       return _;
     });
 
+const upperKita = document.createElement ('canvas');
+
 const runawayGuitar = new Audio ('./assets/kita.wav');
 
 let canvasX;
@@ -104,6 +106,9 @@ preprocess ()
         runawayGuitar.play ();
       });
 
+  upperKita.width = 428;
+  upperKita.height = 240;
+
   reDraw ();
 }
 
@@ -141,18 +146,23 @@ reDraw ()
 
         if (runawayFlag)
           {
-            const l = Math.sqrt (Math.pow (((kitaData[0].x - 214)
-                                            - (nizika.x - 150)), 2)
-                                 + Math.pow (((kitaData[0].y - 120)
-                                              - (nizika.y - 150)), 2));
-            const t = Math.atan2 ((kitaData[0].y - 120) - (nizika.y - 150),
-                                  (kitaData[0].x - 214) - (nizika.x - 150));
+            const l = Math.sqrt (Math.pow (kitaData[0].x - nizika.x, 2)
+                                 + Math.pow (kitaData[0].y - nizika.y, 2));
+            const t = Math.atan2 (kitaData[0].y - nizika.y,
+                                  kitaData[0].x - nizika.x);
 
             nizika.x += nizikaVel * Math.cos (t);
             nizika.y += nizikaVel * Math.sin (t);
           }
       });
 
+  if (runawayFlag)
+    {
+      changeAlpha (upperKita, kitaList[frame % 40],
+                   Math.max (runawayFrame - frame + 85, 0) * 3);
+      ctx.drawImage (upperKita, kitaData[0].x - 214, kitaData[0].y - 120);
+    }
+
   ++frame;
 }
 
@@ -179,9 +189,8 @@ replaceColorWithTransparent (canvas)
 
 
 function
-changeAlpha (canvas, alpha)
+changeAlpha (toCanvas, canvas, alpha)
 {
-  const toCanvas  = document.createElement('canvas');
   const toCtx = toCanvas.getContext ('2d');
 
   const ctx = canvas.getContext ('2d');
@@ -192,7 +201,5 @@ changeAlpha (canvas, alpha)
     pxs[i + 3] = alpha;
 
   toCtx.putImageData (imageData, 0, 0);
-
-  return toCanvas;
 }