Programming Assignment 1
A JavaScript Game

Due on Tuesday September 25 before midnight
Worth 6% of your final grade


This project must be done individually. No copying is permitted. The goal of this project is to learn client-side web programming using JavaScript and AJAX. More specifically, you will create a Web application that displays information about movies.

This project must be done individually. No copying is permitted. Note: We will use a system for detecting software plagiarism, called Moss, which is an automatic system for determining the similarity of programs. That is, your program will be compared with the programs of the other students in class as well as with the programs submitted in previous years. This program will find similarities even if you rename variables, move code, change code structure, etc.

Note that, if you use a Search Engine to find similar programs on the web, we will find these programs too. So don't do it because you will get caught and you will get an F in the course (this is cheating). Don't look for code to use for your project on the web or from other students (current or past). Just do your project alone using the help given in this project description and from your instructor and GTA only. Finally, you should not post your code nor deploy your project on a public web site.


You will do this project on your own PC/laptop. You have to use the Mozilla Firefox web browser to run and debug your JavaScript code. You need to activate the Debugger from the browser Developer tools. You may click on "Show in Separate Window" to get the debugger on a separate window.
Note: You should not use any JavaScript library, such as JQuery or d3.js. You should not use the JavaScript canvas object nor svg graphics.


The following web pages contain various tutorials. Use them as a reference only. The class slides contain enough information on JavaScript and DOM.

Project Description

You need to write a JavaScript file pong.js, used in the file pong.html, that implements the following actions:

Please watch the video pong.mp4 for a demo of how your game should look like.

The pong court is 800x500px, the pong ball is 20x20px, and the paddle is 102x14px. When you click on the Start button or left-click on the court, the ball must start from a random place at the left border of the court at a random angle between -π/4 and π/4. The paddle can move up and down on the right border by just moving the mouse (without clicking the mouse). The ball bounces on the left, top, and bottom borders of the court. Everytime you hit the ball with the paddle, you add one strike. If the ball crosses the right border (the dotted line), the game is suspended and the strikes so far becomes your score. You would need to click on the Start button or click on the court to restart with a zero number of strikes. So the goal of this game is to move the paddle to protect the right border by hitting the ball.


Note: You should use plain JavaScript. You should not use any JavaScript library, such as JQuery and d3.js. You should not use the JavaScript canvas object or svg graphics.

What to Submit

Use the form below to submit your pong.html and pong.js files. We do not accept email or hardcopy submissions. These files are automatically uploaded directly into your personal class account for this particular project, so you don't have to include your name or student ID or project number in the file name. You may submit your files as many times as you like, but only the most recently submitted files will be retained and evaluated (newly submitted files replace the old files under the same file name). After you submit the files, please double-check that your submitted files are correct by clicking on the Status link and by playing your game on your browser.

Submit Project #1:

Last modified: 09/12/2018 by Leonidas Fegaras