Answered You can hire a professional tutor to get the answer.
Please I'am in desperate need of help. I need help with adding another food item (red square) and a countdown timer to the snake game. I need to
Please I'am in desperate need of help. I need help with adding another food item (red square) and a countdown timer to the snake game. I need to design and implement a snake game that allows the player to hit two food items (red squares) and earn a point (one point for each square hit) and display the score (add both scores) and display the total score. Use a countdown time to see whether the player earn a total of 10 points with 2 minutes. if the player doesn't earn 10 points within 2 minutes the game is over. I really need help figuring this out I would greatly appreciate it.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Simple Snake Game</title>
<!-- Basic styling, centering of the canvas. -->
<style>
canvas {
display: block;
position: absolute;
border: 1px solid #000;
margin: auto;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
</style>
</head>
<body>
<script>
var
/**
* Constats
*/
COLS = 26,
ROWS = 26,
EMPTY = 0,
SNAKE = 1,
FRUIT = 2,
LEFT = 0,
UP = 1,
RIGHT = 2,
DOWN = 3,
KEY_LEFT = 37,
KEY_UP = 38,
KEY_RIGHT = 39,
KEY_DOWN = 40,
/**
* Game objects
*/
canvas, /* HTMLCanvas */
ctx, /* CanvasRenderingContext2d */
keystate, /* Object, used for keyboard inputs */
frames, /* number, used for animation */
score; /* number, keep track of the player score */
/**
* Grid datastructor, usefull in games where the game world is
* confined in absolute sized chunks of data or information.
*
* @type {Object}
*/
grid = {
width: null, /* number, the number of columns */
height: null, /* number, the number of rows */
_grid: null, /* Array<any>, data representation */
/**
* Initiate and fill a c x r grid with the value of d
* @param {any} d default value to fill with
* @param {number} c number of columns
* @param {number} r number of rows
*/
init: function(d, c, r) {
this.width = c;
this.height = r;
this._grid = [];
for (var x=0; x < c; x++) {
this._grid.push([]);
for (var y=0; y < r; y++) {
this._grid[x].push(d);
}
}
},
/**
* Set the value of the grid cell at (x, y)
*
* @param {any} val what to set
* @param {number} x the x-coordinate
* @param {number} y the y-coordinate
*/
set: function(val, x, y) {
this._grid[x][y] = val;
},
/**
* Get the value of the cell at (x, y)
*
* @param {number} x the x-coordinate
* @param {number} y the y-coordinate
* @return {any} the value at the cell
*/
get: function(x, y) {
return this._grid[x][y];
}
}
/**
* The snake, works as a queue (FIFO, first in first out) of data
* with all the current positions in the grid with the snake id
*
* @type {Object}
*/
snake = {
direction: null, /* number, the direction */
last: null,
