added info on how to move to menu

loglot · Oct 16, 2023 · fed973c · fed973c
1 parent 2e9e535
commit fed973c
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 5 deletions.
diff --git a/index.html b/index.html
@@ -22,8 +22,11 @@
   </head>
   <body>
     <canvas id="game_screen" width="1676" height="918"></canvas>
+    <script>   
+    </script>
     <script src="./lib/lib.js"></script>
+    <script src="./lib/keys.js"></script>
     <script src="./lib/draw.js"></script>
-    <script src="main.js"> </script>
+    <script src="main.js"></script>
   </body>
 </html>
diff --git a/lib/draw.js b/lib/draw.js
@@ -21,9 +21,11 @@ let draw = {
             var speed_option_eng = "unstable"
           }
           this.DrawStroked("yet another collectathon", 250, 200)
-          this.DrawStroked("press space to start", 260, 500)
-          this.DrawStroked(`growth on coin: ${player.GrowOnCoinOption ? "yes" : "no"} (press 1 to flip)`, 260, 600)
-          this.DrawStroked(`speed : ${speed_option_eng} (press 2 to flip)`, 260, 700)
+          this.DrawStroked("press space to start", 260, 350)
+          this.DrawStroked(`growth on coin: ${player.GrowOnCoinOption ? "yes" : "no"} (press 1 to flip)`, 260, 500)
+          this.DrawStroked(`speed : ${speed_option_eng} (press 2 to flip)`, 260, 600)
+          Keys.drawKeys() 
+          this.DrawStroked(" ==> to move", 756, 767) 
         } else {
             this.Circ(player.R, "#afbfaf", player.X, player.Y, true)
             if (coin.Exists) {

diff --git a/lib/keys.js b/lib/keys.js
@@ -0,0 +1,11 @@
+let Keys = {
+
+    drawKeys() {
+        ctx.drawImage(keyW, 580, 650) 
+        ctx.drawImage(keyS, 580, 727)  
+        ctx.drawImage(keyA, 504, 727)  
+        ctx.drawImage(keyD, 656, 727)  
+    }
+}
+
+
diff --git a/main.js b/main.js
@@ -1,13 +1,24 @@
 'use strict';
 
     const canvas = document.getElementById("game_screen");
-      const ctx = canvas.getContext("2d");
+    const ctx = canvas.getContext("2d");
 
 //-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
 const originalWidth = canvas.width;
 const originalHeight = canvas.height;
 var scaleX = 0;
 var scaleY = 0;
+
+var keyD = new Image()
+var keyW = new Image()
+var keyA = new Image()
+var keyS = new Image() 
+
+this.keyD.src = 'https://raw.githubusercontent.com/loglot/key-images/10212df9a78eeeb348d6302c3b79ac149670d2e6/Keyboard%20%26%20Mouse/Dark/D_Key_Dark.png';
+this.keyW.src = 'https://raw.githubusercontent.com/loglot/key-images/10212df9a78eeeb348d6302c3b79ac149670d2e6/Keyboard%20%26%20Mouse/Dark/W_Key_Dark.png';
+this.keyA.src = 'https://raw.githubusercontent.com/loglot/key-images/10212df9a78eeeb348d6302c3b79ac149670d2e6/Keyboard%20%26%20Mouse/Dark/A_Key_Dark.png';
+this.keyS.src = 'https://raw.githubusercontent.com/loglot/key-images/10212df9a78eeeb348d6302c3b79ac149670d2e6/Keyboard%20%26%20Mouse/Dark/S_Key_Dark.png';
+
 //-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
       window.requestAnimationFrame(gameLoop)