Developing Snake Game Using Object Oriented JavaScript Programming

This project implements the classic Snake game using Object Oriented Programming in JavaScript. The game utilizes the HTML canvas element for rendering the game area and involves JavaScript files for drawing graphics and managing game logic. A key challenge was determining the player's intended movement through keyboard inputs and translating these into snake movements on the canvas. The solution includes collision detection to manage the snake's movement and game state, ensuring the game restarts when the snake hits a border. The game is designed to be played on browsers like Chrome, Firefox, Safari, and Opera, with considerations for browser compatibility, particularly regarding the support for DOMObject.addEventListener().

Running head: OBJECT ORIENTED PROGRAMMING USING JAVA SCRIPT
Object oriented programming Using Java Script
Name of the Student
Name of the University
Authors note

1OBJECT ORIENTED PROGRAMMING USING JAVA SCRIPT
Description
The developed game is the implementation of the popular Snake game in which the
player has to control the snake on the screen in order to survive in the game. Once the snake
hits any one of the borders of the game area the game starts again. The length of the snake
will increase every time it eats a food item that appears in the game area.
Implementation and Controls
In order to design the game area on HTML page, the canvas element is utilized. The
Canvas element is to very useful in drawing graphics on the simple web pages through the
use of the java scripts. This element is used as a container for the graphics which needs to
represented on the simple html page. For this project, the used scripts are snakease.js,
webhtml.js in order to draw the graphics of the snake game. In order to develop the game
faster several available methods are used in order to draw the paths, boxes for the body of the
snake and adding images.
In the next stage the of the development the main concern was determining players
intended movement for the snake which will be reflected on the game area or canvas and this
was the most challenging part of the project.
For the first section of this part, the code and algorithm is developed in order to
determine direction in which the user wants to change. This stage is completed through the
comparing the values from the user input from the key stroke to find the high or low or any
other directions of the snake.
In case the HTML page is not available on the browsers, then the user must ensure
that the path of all the JavaScript and css files are correct as well as they are in the same

2OBJECT ORIENTED PROGRAMMING USING JAVA SCRIPT
folder. The game cannot be played on the Internet explorer, the bundled browser with the
windows operating system. As it is one of the non-standards compliant browser that lacks
support for DOMObject.addEventListener() using which the user input for the game is
evaluated. Other browsers like opera, safari, chrome and Mozilla Firefox can be used to play
the game.
In case of a key stroke is received to change the direction, then the input is evaluated
in the logic implemented in the program developed using the JavaScript to find out if the user
input is valid change in the direction depending on the snakes current positions and if the
direction change is possible from that location of canvas. For example, if the user cannot
move downwards if the snake is going up therefore depending on the user input the snake
would not change directions.
After the detection of the any collision the game cycle again generated a new cycle
with the condition that the game has not finished with the three terms. Using the following
code section, the collision detection is achieved in order to manage the movement and
drawing of the snake.