PONG html5 game pong Game

Click to Start Game

Code Initialization

Defining some constants in the beginning will help us to easily tweek the game if needed. MAXW and MAXH hold the game resolution, MAXVX is the maximum ball velocity. I will be using j5g3, my game engine.

Inline Resources

This is where we define the Spritesheet. A neat trick is to include assets using data URLs. This should probably only be done with smalls images since the strings can get pretty long.

We also cut our spritesheet and setup the game sprites and text.

The World

Here we extend the j5g3.Map to define our World class. This will render the game background.

Game Mechanics

The update function will take care of updating the ball position and resolving collissions.


This is our AI function. It will basically follow the ball, and move the paddle using an accelaration factor.

What's next

The complete source code is hosted at github. Check out my other games here.