From 7db6a857ea69f55c0c72eb48806cedc61cfaec92 Mon Sep 17 00:00:00 2001
From: miteruzo <matuda.miteruzo@gmail.com>
Date: Thu, 25 May 2023 22:48:06 +0900
Subject: [PATCH] =?UTF-8?q?=E9=80=83=E3=81=92=E3=81=9F=E3=82=AE=E3=82=BF?=
 =?UTF-8?q?=E3=83=BC=E3=81=B8=E3=81=AE=E5=9C=A7=E3=82=92=E6=9C=80=E5=A4=A7?=
 =?UTF-8?q?=E3=81=AB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 scripts/main.js | 33 ++++++++++++++++++++-------------
 1 file changed, 20 insertions(+), 13 deletions(-)

diff --git a/scripts/main.js b/scripts/main.js
index 6b538bd..72bf714 100644
--- a/scripts/main.js
+++ b/scripts/main.js
@@ -4,7 +4,7 @@ const ctx = canvas.getContext ('2d');
 const bg = (
     function ()
     {
-      const _ = document.createElement('canvas');
+      const _ = document.createElement ('canvas');
       const img = new Image ();
 
       _.width = 1920;
@@ -26,7 +26,7 @@ const bg = (
 const nizikaList = Array (24).fill ().map (
     function (__, i)
     {
-      const _ = document.createElement('canvas');
+      const _ = document.createElement ('canvas');
       const img = new Image ();
 
       _.width = 300;
@@ -49,7 +49,7 @@ const nizikaList = Array (24).fill ().map (
 const kitaList = Array (40).fill ().map (
     function (__, i)
     {
-      const _ = document.createElement('canvas');
+      const _ = document.createElement ('canvas');
       const img = new Image ();
 
       _.width = 428;
@@ -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;
 }