From 9c287154c04428dcdb18a8b6dca53d78d62a7f58 Mon Sep 17 00:00:00 2001 From: Dawit <116512754+Dawa-22@users.noreply.github.com> Date: Fri, 8 Nov 2024 21:07:47 +0300 Subject: [PATCH] Update script.js --- js/script.js | 160 ++++++++++++++++++++++++++------------------------- 1 file changed, 83 insertions(+), 77 deletions(-) diff --git a/js/script.js b/js/script.js index fc03e52..bc08808 100644 --- a/js/script.js +++ b/js/script.js @@ -2,113 +2,119 @@ const canvas = document.querySelector(".canvas"); const ctx = canvas.getContext("2d"); const scale = 20; -const rows = canvas.height/scale; //25 -const columns = canvas.width/scale; //25 +const rows = canvas.height / scale; +const columns = canvas.width / scale; -let snake = []; -snake[0] = { - x: (Math.floor(Math.random() * columns)) * scale, - y: (Math.floor(Math.random() * rows)) * scale -} - -let food = { - x: (Math.floor(Math.random() * columns)) * scale, - y: (Math.floor(Math.random() * rows)) * scale -} +// DOM Elements +const scoreElement = document.getElementById("score_value"); +const resetButton = document.getElementById("reset"); -let d = "right"; +// Initial Variables +let snake, food, direction, score, play; +// Initialize game +function init() { + snake = [ + { + x: (Math.floor(Math.random() * columns)) * scale, + y: (Math.floor(Math.random() * rows)) * scale + } + ]; + + // Place food randomly, ensuring it's not on the snake + do { + food = { + x: (Math.floor(Math.random() * columns)) * scale, + y: (Math.floor(Math.random() * rows)) * scale + }; + } while (food.x === snake[0].x && food.y === snake[0].y); + + direction = "right"; + score = 0; + updateScore(); + + clearInterval(play); + play = setInterval(draw, 100); +} -document.onkeydown = direction; -function direction(event){ - let key = event.keyCode; - if(key == 37 && d != "right"){ - d = "left" - } - else if(key == 38 && d != "down"){ - d = "up" - } - else if(key == 39 && d != "left"){ - d = "right" - } - else if(key == 40 && d != "up"){ - d = "down" - } +// Update score display +function updateScore() { + scoreElement.innerText = score; } -let play = setInterval(drow,100); +// Event listener for direction change +document.onkeydown = (event) => { + const key = event.keyCode; + if (key == 37 && direction != "right") direction = "left"; + else if (key == 38 && direction != "down") direction = "up"; + else if (key == 39 && direction != "left") direction = "right"; + else if (key == 40 && direction != "up") direction = "down"; +}; -function drow() { - ctx.clearRect(0,0,canvas.width,canvas.height); +// Reset game when reset button is clicked +resetButton.onclick = init; - for (let i=0; i { ctx.fillStyle = "orange"; ctx.strokeStyle = "red"; - ctx.fillRect(snake[i].x,snake[i].y,scale,scale); - ctx.strokeRect(snake[i].x,snake[i].y,scale,scale); - } - + ctx.fillRect(segment.x, segment.y, scale, scale); + ctx.strokeRect(segment.x, segment.y, scale, scale); + }); - //drow food + // Draw food ctx.fillStyle = "red"; ctx.strokeStyle = "red"; ctx.fillRect(food.x, food.y, scale, scale); ctx.strokeRect(food.x, food.y, scale, scale); + // Move snake let snakex = snake[0].x; let snakey = snake[0].y; - if(d == "left") snakex -= scale; - if(d == "up") snakey -= scale; - if(d == "right") snakex += scale; - if(d == "down") snakey += scale; - if(snakex > canvas.width){ - snakex = 0; - } - if(snakey > canvas.height){ - snakey = 0; - } - if(snakex < 0){ - snakex = canvas.width; - } - if(snakey < 0){ - snakey = canvas.height; - } - - if(snakex == food.x && snakey == food.y){ + if (direction == "left") snakex -= scale; + if (direction == "up") snakey -= scale; + if (direction == "right") snakex += scale; + if (direction == "down") snakey += scale; + + // Wrap-around logic + if (snakex >= canvas.width) snakex = 0; + if (snakey >= canvas.height) snakey = 0; + if (snakex < 0) snakex = canvas.width - scale; + if (snakey < 0) snakey = canvas.height - scale; + + // Check if food is eaten + if (snakex === food.x && snakey === food.y) { + score++; + updateScore(); food = { x: (Math.floor(Math.random() * columns)) * scale, y: (Math.floor(Math.random() * rows)) * scale - } - } - else{ + }; + } else { snake.pop(); } - let newHead = { - x : snakex, - y : snakey - } + // New head + const newHead = { x: snakex, y: snakey }; - if(eatSelf(newHead,snake)) { + // Check for self-collision + if (eatSelf(newHead, snake)) { clearInterval(play); - alert("The moment before disaster"); + alert(`Game Over! Your score: ${score}`); } snake.unshift(newHead); - } +// Check if the snake eats itself +function eatSelf(head, array) { + return array.some(segment => head.x === segment.x && head.y === segment.y); +} - - -// game over -function eatSelf(head,array){ - for(let i=0; i