Arithmetic Artillery

COMP 50H Final Project by Tom Nguyen

Overview

Arithmetic Artillery is a battleship game that requires you to create mathematical equations and solve equations created by the enemy player to land shots on the enemy ship.

• Online, 2 player
• Playable in a web browser
• Written in JavaScript, HTML, and CSS
• Simple to get started
• As difficult as you make it

​

How it Works

1. Player 1 and Player 2 start a game
2. Player 1 picks a heading and writes an equation to determine how far to move in that direction
3. Player 1’s heading and equation are sent to a real time database which pushes these new data to Player 2’s game
4. Player 2 solves Player 1’s equation so he/she can fire at Player 1’s next location
5. Player 2 repeats step 2

How it Works

1. Player 1 sets a heading and creates an equation that moves him/her 6 blocks to the east

• Player 2 receives Player 1’s equation and heading, and must solve for distance.

• Once Player 2 has solved Player 1’s equation, he/she can shoot 6 blocks ahead to hit Player 1

Database

In order for the game to be played between two players across the web, a database is used to facilitate the exchange of data between the players. For that purpose, I used Google’s Firebase real time database service.

• Firebase is free to use (with limited data cap)
• Offers real time capabilities
• Offers JavaScript SDK
• Stores information in JSON

Asynchronous Communication

• Locally defining a variable and setting its value:

• Reading from a database and returning the value:

//Player 1 is defined

var player1 = { name: “” };

​

//Player 1 is given a name

player1.name = “Steve”;

​

​

​

​

​

//Calling for Player 1’s name

alert(player1.name);

​

//Result: “Steve”

//Player 1 is defined

var player1 = { name: “” };

​

//Player 1’s name is read from database

return database.ref("player1/name”).once('value').then(function(snapshot){

player1.name = snapshot.val();

});

​

//Calling for Player 1’s name

alert(player1.name);

​

//Result could be “Steve” or “” as there is no guarantee that the name has been retrieved by the time alert() executes.

Why I Chose This Project

• I have always wanted to experiment more with real time communication.
• I am quite proficient at web technologies such as JavaScript, HTML, CSS, but what good are these things if my websites and apps can’t communicate with one another?
• This was an opportunity for me to learn more about Firebase and working with real time databases in general, because what better way to learn than to make a game.

Demonstration