From 5046d51f8c0b8f4506a5b8658e86f9828aeecdf7 Mon Sep 17 00:00:00 2001 From: khitermedachraf Date: Fri, 1 May 2020 18:35:58 +0100 Subject: [PATCH 1/2] adding new images of food and the feature of colors using Java Script --- img/food1.jpg | Bin 0 -> 6327 bytes img/food2.png | Bin 0 -> 13434 bytes snake.js | 121 +++++++++++++++++++++++--------------------------- 3 files changed, 56 insertions(+), 65 deletions(-) create mode 100644 img/food1.jpg create mode 100644 img/food2.png diff --git a/img/food1.jpg b/img/food1.jpg new file mode 100644 index 0000000000000000000000000000000000000000..b83c99dcba46e268b516dae33dc39703122e6700 GIT binary patch literal 6327 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 literal 0 HcmV?d00001 diff --git a/img/food2.png b/img/food2.png new file mode 100644 index 0000000000000000000000000000000000000000..85e91a0036c45de0c4caf985033f2a09499beb1e GIT binary patch literal 13434 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 lxYcJU6-@;Nlp#7unu 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 cb~LQJ{|yWfnS^<{907*qoM6N<$g8WQbdjJ3c literal 0 HcmV?d00001 diff --git a/snake.js b/snake.js index 4f50dda..460d486 100644 --- a/snake.js +++ b/snake.js @@ -38,15 +38,15 @@ down.src = "audio/down.mp3"; let snake = []; snake[0] = { - x : 9 * box, - y : 10 * box + x: 9 * box, + y: 10 * box }; // create the food let food = { - x : Math.floor(Math.random()*17+1) * box, - y : Math.floor(Math.random()*15+3) * box + x: Math.floor(Math.random() * 17 + 1) * box, + y: Math.floor(Math.random() * 15 + 3) * box } // create the score var @@ -57,29 +57,29 @@ let score = 0; let d; -document.addEventListener("keydown",direction); +document.addEventListener("keydown", direction); -function direction(event){ +function direction(event) { let key = event.keyCode; - if( key == 37 && d != "RIGHT"){ + if (key == 37 && d != "RIGHT") { left.play(); d = "LEFT"; - }else if(key == 38 && d != "DOWN"){ + } else if (key == 38 && d != "DOWN") { d = "UP"; up.play(); - }else if(key == 39 && d != "LEFT"){ + } else if (key == 39 && d != "LEFT") { d = "RIGHT"; right.play(); - }else if(key == 40 && d != "UP"){ + } else if (key == 40 && d != "UP") { d = "DOWN"; down.play(); } } // cheack collision function -function collision(head,array){ - for(let i = 0; i < array.length; i++){ - if(head.x == array[i].x && head.y == array[i].y){ +function collision(head, array) { + for (let i = 0; i < array.length; i++) { + if (head.x == array[i].x && head.y == array[i].y) { return true; } } @@ -88,83 +88,74 @@ function collision(head,array){ // draw everything to the canvas -function draw(){ - - ctx.drawImage(ground,0,0); - - for( let i = 0; i < snake.length ; i++){ - ctx.fillStyle = ( i == 0 )? "green" : "white"; - ctx.fillRect(snake[i].x,snake[i].y,box,box); - +function draw() { + + ctx.drawImage(ground, 0, 0); + + for (let i = 0; i < snake.length; i++) { + let arrColor = ["yellow", "red", "blue", "White", "Black", "Brown", "Purple", "Orange", "Gray", "Silver", "Cyan", "Khaki", "Coral", "Aquamarine", "Lime"]; + let randomColor; + randomColor = Math.floor(Math.random() * (15 - 0 + 1) + 0); + if ((i == 0)) { + ctx.fillStyle = "green"; + } else { + + ctx.fillStyle = arrColor[randomColor]; + } + + ctx.fillRect(snake[i].x, snake[i].y, box, box); + ctx.strokeStyle = "red"; - ctx.strokeRect(snake[i].x,snake[i].y,box,box); + ctx.strokeRect(snake[i].x, snake[i].y, box, box); } - + ctx.drawImage(foodImg, food.x, food.y); - + // old head position let snakeX = snake[0].x; let snakeY = snake[0].y; - + // which direction - if( d == "LEFT") snakeX -= box; - if( d == "UP") snakeY -= box; - if( d == "RIGHT") snakeX += box; - if( d == "DOWN") snakeY += box; - + if (d == "LEFT") snakeX -= box; + if (d == "UP") snakeY -= box; + if (d == "RIGHT") snakeX += box; + if (d == "DOWN") snakeY += box; + // if the snake eats the food - if(snakeX == food.x && snakeY == food.y){ + if (snakeX == food.x && snakeY == food.y) { score++; eat.play(); food = { - x : Math.floor(Math.random()*17+1) * box, - y : Math.floor(Math.random()*15+3) * box - } - // we don't remove the tail - }else{ + x: Math.floor(Math.random() * 17 + 1) * box, + y: Math.floor(Math.random() * 15 + 3) * box + } + // we don't remove the tail + } else { // remove the tail snake.pop(); } - + // add new Head - + let newHead = { - x : snakeX, - y : snakeY + x: snakeX, + y: snakeY } - + // game over - - if(snakeX < box || snakeX > 17 * box || snakeY < 3*box || snakeY > 17*box || collision(newHead,snake)){ + + if (snakeX < box || snakeX > 17 * box || snakeY < 3 * box || snakeY > 17 * box || collision(newHead, snake)) { clearInterval(game); dead.play(); } - + snake.unshift(newHead); - + ctx.fillStyle = "white"; ctx.font = "45px Changa one"; - ctx.fillText(score,2*box,1.6*box); + ctx.fillText(score, 2 * box, 1.6 * box); } // call draw function every 100 ms -let game = setInterval(draw,100); - - - - - - - - - - - - - - - - - - +let game = setInterval(draw, 100); \ No newline at end of file From 42fd3eaf89a373234c63b1be07cd3fa856f65c8d Mon Sep 17 00:00:00 2001 From: khitermedachraf Date: Sat, 2 May 2020 05:39:57 +0100 Subject: [PATCH 2/2] adding new features to the game using Java Script --- index.html | 25 +++++++------ snake.js | 103 +++++++++++++++++++++++++++++++++++++++++++++-------- 2 files changed, 103 insertions(+), 25 deletions(-) diff --git a/index.html b/index.html index bc1fd17..4ca4ef7 100644 --- a/index.html +++ b/index.html @@ -1,13 +1,16 @@ - - Snake Game - - - - + + + Snake Game + + + + + + \ No newline at end of file diff --git a/snake.js b/snake.js index 460d486..3f1d21e 100644 --- a/snake.js +++ b/snake.js @@ -52,6 +52,9 @@ let food = { // create the score var let score = 0; +let secondScore = 0; +let thirdScore = 0; +let finalSccore = 0; //control the snake @@ -76,15 +79,7 @@ function direction(event) { } } -// cheack collision function -function collision(head, array) { - for (let i = 0; i < array.length; i++) { - if (head.x == array[i].x && head.y == array[i].y) { - return true; - } - } - return false; -} + // draw everything to the canvas @@ -109,6 +104,7 @@ function draw() { ctx.strokeRect(snake[i].x, snake[i].y, box, box); } + ctx.drawImage(foodImg, food.x, food.y); // old head position @@ -121,15 +117,37 @@ function draw() { if (d == "RIGHT") snakeX += box; if (d == "DOWN") snakeY += box; + // collision with barriers part 1 + function collision1(snakeX, snakeY) { + if ((snakeX == 5 * box && snakeY == 6 * box) || (snakeX == 6 * box && snakeY == 6 * box) || (snakeX == 5 * box && snakeY == 7 * box) || (snakeX == 5 * box && snakeY == 8 * box) || (snakeX == 13 * box && snakeY == 12 * box) || (snakeX == 13 * box && snakeY == 13 * box) || (snakeX == 13 * box && snakeY == 14 * box) || (snakeX == 12 * box && snakeY == 14 * box)) { + return true; + } else { return false; } + } + // collision with barriers part 2 + function collision2(snakeX, snakeY) { + if ((snakeX == 5 * box && snakeY == 12 * box) || (snakeX == 5 * box && snakeY == 13 * box) || (snakeX == 5 * box && snakeY == 14 * box) || (snakeX == 6 * box && snakeY == 14 * box) || (snakeX == 12 * box && snakeY == 6 * box) || (snakeX == 13 * box && snakeY == 6 * box) || (snakeX == 13 * box && snakeY == 7 * box) || (snakeX == 13 * box && snakeY == 18 * box)) { + return true; + } else { return false; } + } // if the snake eats the food if (snakeX == food.x && snakeY == food.y) { score++; + if (score > 3) { + secondScore++; + if (secondScore > 4) { thirdScore++; } + } eat.play(); food = { + x: Math.floor(Math.random() * 17 + 1) * box, + y: Math.floor(Math.random() * 15 + 3) * box + } + while (collision1(food.x, food.y) || collision2(food.x, food.y)) { + food = { x: Math.floor(Math.random() * 17 + 1) * box, y: Math.floor(Math.random() * 15 + 3) * box } - // we don't remove the tail + } + // we don't remove the tail } else { // remove the tail snake.pop(); @@ -143,19 +161,76 @@ function draw() { } // game over + function gameOver() { + + alert("Game Over ! \n\n Your Score is : " + score + " / 12"); + Swal.fire({ + icon: 'error', + title: 'Oops...', + text: 'Game Over !', + footer: 'Powered By KHITER .' + }) + + } - if (snakeX < box || snakeX > 17 * box || snakeY < 3 * box || snakeY > 17 * box || collision(newHead, snake)) { + if (snakeX < box || snakeX > 17 * box || snakeY < 3 * box || snakeY > 17 * box) { clearInterval(game); dead.play(); + gameOver(); + } snake.unshift(newHead); ctx.fillStyle = "white"; - ctx.font = "45px Changa one"; - ctx.fillText(score, 2 * box, 1.6 * box); + + + if (score > 3) { + ctx.fillStyle = "blue"; + ctx.font = "45px Changa one"; + ctx.fillText("3/3.", 2 * box, 1.6 * box); + ctx.fillStyle = "#16510e" + ctx.fillRect(5 * box, 6 * box, box, 3 * box); + ctx.fillRect(5 * box, 6 * box, 2 * box, box); + ctx.fillRect(12 * box, 14 * box, 2 * box, box); + ctx.fillRect(13 * box, 12 * box, box, 3 * box); + if (collision1(snakeX, snakeY)) { + clearInterval(game); + dead.play(); + gameOver(); + + } + if (secondScore > 4) { + ctx.fillStyle = "red"; + ctx.font = "45px Changa one"; + ctx.fillText("3/3.", 2 * box, 1.6 * box); + ctx.fillText("4/4.", 7 * box, 1.6 * box); + ctx.fillText(thirdScore + "/5.", 11 * box, 1.6 * box); + ctx.fillStyle = "#16510e" + ctx.fillRect(12 * box, 6 * box, 2 * box, box); + ctx.fillRect(13 * box, 6 * box, box, 3 * box); + ctx.fillRect(5 * box, 12 * box, box, 3 * box); + ctx.fillRect(5 * box, 14 * box, 2 * box, box); + if (collision1(snakeX, snakeY) || collision2(snakeX, snakeY)) { + clearInterval(game); + gameOver(); + dead.play(); + } + } + if (secondScore <= 4) { + ctx.fillStyle = "blue"; + ctx.fillText(secondScore + "/4.", 7 * box, 1.6 * box); + } + + } else { + ctx.font = "45px Changa one"; + ctx.fillText(score + "/3.", 2 * box, 1.6 * box); + } + + + } // call draw function every 100 ms -let game = setInterval(draw, 100); \ No newline at end of file +let game = setInterval(draw, 200); \ No newline at end of file