From e94affedcb35dbeeb4fefbbc0f53dec6c844b93b Mon Sep 17 00:00:00 2001 From: Dominic DiTaranto Date: Sun, 7 Sep 2025 23:14:01 -0400 Subject: [PATCH] dpad support --- assets/img/sprites/dpad.png | Bin 0 -> 5574 bytes assets/script.js | 13 +++-- index.html | 108 ++++++++++++++++++++++++++++++++---- 3 files changed, 107 insertions(+), 14 deletions(-) create mode 100644 assets/img/sprites/dpad.png diff --git a/assets/img/sprites/dpad.png b/assets/img/sprites/dpad.png new file mode 100644 index 0000000000000000000000000000000000000000..cc9a1f3c986aaab984cd0869be77df586db18f21 GIT binary patch literal 5574 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 UK|ve5zyJUM07*qoM6N<$f^h50rT_o{ literal 0 HcmV?d00001 diff --git a/assets/script.js b/assets/script.js index a3dacc9..e789601 100644 --- a/assets/script.js +++ b/assets/script.js @@ -87,28 +87,24 @@ class Map { _listener = function (event) { var dontLoop = false; if (event.key === "h" || event.key === "a" || event.key === "ArrowLeft") { - self.playerDir = "l"; self.move("left"); } else if ( event.key === "j" || event.key === "s" || event.key === "ArrowDown" ) { - self.playerDir = "f"; self.move("down"); } else if ( event.key === "k" || event.key === "w" || event.key === "ArrowUp" ) { - self.playerDir = "b"; self.move("up"); } else if ( event.key === "l" || event.key === "d" || event.key === "ArrowRight" ) { - self.playerDir = "r"; self.move("right"); } else if (event.key === "r") { dontLoop = true; @@ -186,6 +182,15 @@ class Map { } move(direction) { + if (direction === "left") { + this.playerDir = "l"; + } else if (direction === "right") { + this.playerDir = "r"; + } else if (direction === "down") { + this.playerDir = "f"; + } else { + this.playerDir = "b"; + } g.levelMoves[this.level] += 1; g.totalMoves += 1; diff --git a/index.html b/index.html index 6148ed5..3ecbc25 100644 --- a/index.html +++ b/index.html @@ -20,6 +20,26 @@ width: 100%; } + .opts { + position: absolute; + top: 10; + right: 10; + font-size: 15px; + } + + .opts-menu { + text-align: right; + padding: 5px; + position: absolute; + top: 40; + right: 10; + font-size: 15px; + width: auto; + height: auto; + background-color: ghostwhite; + display: none; + } + #map { white-space: pre; } @@ -29,6 +49,11 @@ width: 50px; } + #dpad { + margin-top: 20px; + display: none; + } + #stats { font-size: 20px; margin-bottom: 8px; @@ -39,6 +64,12 @@ margin-bottom: -19px; } + @media (max-width: 481px) { + pre { + font-size: 17px; + } + } + a { color: black; text-decoration: none; @@ -64,9 +95,14 @@ text-decoration: none; } - +
+ settings +
+
- 
+      
 █▀ █▀█ █▄▀ █▀█ █▄▄ ▄▀█ █▄░█ █▄█ ▄▀█
 ▄█ █▄█ █░█ █▄█ █▄█ █▀█ █░▀█ ░█░ █▀█
       

@@ -75,6 +111,43 @@
     

       

     

+    

+      
+      
+        
+        Computer
+        
+        Computer
+        
+        Computer
+        
+        Computer
+      
+    

     

       [r]eset
       Arrow Keys
         
  • VIM keys [hjkl]
    • 
       
-      
    TODO:
    
-      
      
-        
    • Mobile Support
      • 
-        
    • Create a cool song and SFX
      • 
-        
    • Points system
      • 
-        
    • Steam animation when you beat a level
      • 
-        
    • Add more level sets (worlds)
      • 
-      
    
       
    Credits:
    
           
+      
    UPDATES:
    
+      
  • 
+        (09/07/25) v1.1: released mobile support via toggleable Dpad, see settings at top right of page!
+      
    • 
+      
    TODO:
    
+      
      
+        
    • Mobile Support
      • 
+        
    • Selectable levels upon completion
      • 
+        
    • Create a cool song and SFX
      • 
+        
    • Points system
      • 
+        
    • Steam animation when you beat a level
      • 
+        
    • Add more level sets (worlds)
      • 
+      
    
     
    
     
+