How to make a html5 breakout game in JavaScript
In this tutorial i will walk through the process of developing a simple breakout game in JavaScript using html5 canvas I'll be using craters.js a compact html5 game engine. in every step i will first explain the procedure in a less technical method later I'll include the snippets of the actual game , a link to the github repository and a live working demo. Game world is 2d space with zero friction and zero gravity in order to avoid applying acceleration to the entities periodically maybe this will be changed later. First entity is a ball an entity with zero friction that upon colliding with an obstacle such as a block, paddle or the the screen boundaries bounces back in the opposite direction the bouncing from left to the right side of the screen is implemented by if(position.x + radius < 0) // bounce if(velocity > 0) return; // moving velocity *= -1; // change direction direction is only changed if the ball tries to move beyond the zero position. i have touched