improve game, changing background and more fix

MikixIT · Oct 21, 2023 · 0024505 · 0024505
1 parent f35a628
commit 0024505
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 4 deletions.
diff --git a/game.js b/game.js
@@ -14,10 +14,14 @@ const scoreHTML = document.querySelector("#score")
                 °Creare la schermata di gameover 🔴 ✅
                 °Serpente che esce fuori dal gioco crepa 💀  ✅
                 °Score fuori da canva 👾 ✅
+                °Serpente che quando collide su stesso crepa e non dovrebbe 💀 ✅
 
                 °Creare Classifica 🥇
                 °Tasto riprova dopo il Gameover 🔄
-                °Serpente che quando collide su stesso crepa e non dovrebbe 💀
+
+                Opzionali: 
+                °Mobile version 📱
+
 
 */
 
@@ -58,9 +62,14 @@ let drawGame = () => {
      drawSnake();
      drawFruit();
      drawScore();
+     console.log(speed)
 
      checkFruitCollision();
      setTimeout(drawGame, 1000/ speed);
+
+     if (score % 5 === 0 && score !== 0) {
+        speed += 3; // Aumenta la velocità
+    }
 }
 
 let isGameover = () => {
@@ -119,6 +128,7 @@ let drawSnake = () => {
         snakeParts.shift(); 
     }
 
+
 }
 
 let changeSnakePosition = () => {

diff --git a/index.html b/index.html
@@ -46,25 +46,34 @@
         }
         body{
             font-family: 'Pixelify Sans', cursive;
+            height: 100%;
+            width: 100%;
             margin: 0px;
             padding: 0px;
             display: flex;
             flex-direction: column;
             justify-content: center;
             align-items: center;
-            background-color: rgba(0, 0, 0, 0.754);
+            background: rgb(0,0,0);
+            background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(98,98,98,1) 50%, rgba(0,0,0,1) 100%);
+        }
+
+        html, body {
+            height: 100%;
+            width: 100%;
+            overflow: hidden;
         }
         h1{
             color: rgba(255, 255, 255, 0.331);
-            animation: rainbow 6.5s linear;
+            animation: rainbow 30.5s linear;
 		    animation-iteration-count: infinite;
         }
         canvas{
             margin-top: 5px;
             box-shadow: 20px 10px 50px black;
         }
         #score{
-            animation: rainbow 6.5s linear;
+            animation: rainbow 30.5s linear;
 		    animation-iteration-count: infinite;
             font-size: 50px;
             margin-top: 5px;