Win an Ipad
  Developer   Tutorials   Breakout   Game scene
Lesson 0

Game scene

The game scene extended from PhysicsScene creates physical backgorund for all other objects, which are created as an instance of PhysicsSprite class, which provides all features of box2d body. All objects which are not connected with physical engine are created in init function.

All objects which are connected with physical engine (like ball, paddle or bariers) are created in after init function.

Exaple: after init function create all objects from physical engine

// after physics world initialization
function afterInit()
{
    super.afterInit();     // load sounds
    this._loadGameSounds();
    // create walls which prevent the ball to leave the playground
    this._createMantinels();
    this._createBall();
    this._createPaddle();
}

The physics scene also manages contacts which appears between the bodies in the scene. The contacts caused two events onBeginContact and onEndContact. This events can by manage directly but they are also mapped to the PhysicsScene member methods called _onBeginContactHandler and _onEndContactHandler. In this game can appear contacts between the ball and a brick, the ball and a ground or the ball and a paddle. If the ball hits the paddle it is not needed to do anything, because everything is managed by physical engine. It bounce the ball acording to its impact angle. In the other two cases the ball or brick is removed from the scene. However the body can not be removed or inactived in box2d call-back functions. Because of this restriction we only pushed all bodies which should be destroyed and then remove it in process method. 

Example: manage onBeginContact event 

function _onBeginContactHandler(sender, contact)

{
    // if the ball do not exists the contact is irrelevant - do nothing
    if (!this._ball) return;
    // get the first contact
    var current = contact;
    while (current) {
        // get the bodies in the contact
        var bodyA = current.getBodyA();
        var bodyB = current.getBodyB();
        // check if something hit the ground (it can be only ball)
        if (bodyA == this._ground || bodyB == this._ground)
            // destroy the ball
            this._bodiesToDestory.push(this._ball);
        // get the next contact (they can be more contacts during the one step)
        current = current.getNext();
    }
}

As I wrote earlier all operations which can not be done in call-back methods (inactive or remove the body) are done in process function. In process function is also done time step in physics engine. This step caused that position of all bodies are recalculated. It's done by step function which first parameter is time between two steps.

Example: process function make time step and remove bodies

function process()
{
    var timeStep = 1.0 / 40.0;
    // recalculate physics world. All objects are moved about timeStep
    if (!this.paused)
        this.step(timeStep, 4, 8);
  
    // remove bricks from the world
    if (this._bodiesToDestory.length != 0)
        this._removeBricks();
   
    // inactive bricks in the world
    if (this._bodiesToInactive.length != 0)
        this._inactiveBricks();
 
    // if user finished the level move to the next level
    if (this.brickCount == 0 && this.paused == false) {
        this._nextLevel();
        this.paused = true;
    }
}

Removing the body is done in separate function. This function search the array and removes all bodies from it. 

Example: remove bodies

function _removeBricks()
{
    // Remove touched bricks
    for(var body in this._bodiesToDestory) {
        var existing = this._bricks.filter(:x { return x == body; });
        if (existing.length != 0)
            this._bricks.removeByValue(body);
            // GAME OVER
             if (this._ball == body) {
                this._gameStarted = false;
                this._createBall();
                this._paddle.setPosition( this._paddleX, this._paddleY);
            }
            this.destroyBody(body);
    }
    // zero the array
    this._bodiesToDestory = [];
}

 Physical engine   Game scene   Brick 
Tutorial details and chapters
Technology:
Difficulty:
Completion:
Breakout chapters