Bouncing ball in isometric scene

Simple bouncing ball in isometric scene in Phaser.

by Juwal Bose

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/phaser/2.6.2/phaser.min.js"></script>
<div id="TutContainer"></div>

JavaScript

/* activity shows a bouncing ball */

var game = new Phaser.Game(600, 400, Phaser.AUTO, 'TutContainer', { preload: preload, create: create, update:update });

//level array
var levelData=
[[1,1,1,1,1,1],
[1,0,0,0,0,1],
[1,0,0,0,0,1],
[1,0,0,0,0,1],
[1,0,0,0,0,1],
[1,1,1,1,1,1]];

var tileWidth=50;// the width of a tile
var borderOffset = new Phaser.Point(250,50);//to centralise the isometric level display
var wallGraphicHeight=98;
var floorGraphicWidth=103;
var floorGraphicHeight=53;
var wallHeight=wallGraphicHeight-floorGraphicHeight; 
var ballOffset=new Phaser.Point(30,12);
var shadowOffset=new Phaser.Point(30,16);
var ball2DVolume=new Phaser.Point(30,30);
var bmpText;//title text
var normText;//text to display hero coordinates
var gameScene;//we do not need a render texture here, we could just add items are sprites once & totally get rid of the redraw for this example
var floorSprite;
var wallSprite;
var ballSprite;
var ballShadowSprite;
var ballMapTile=new Phaser.Point(2,2);
var ballMapPos;

var zValue=100;
var gravity=-1;
var incrementValue=0;

function preload() {
		game.load.crossOrigin='Anonymous';
    //load all necessary assets
    game.load.bitmapFont('font', 'https://dl.dropboxusercontent.com/s/z4riz6hymsiimam/font.png?dl=0', 'https://dl.dropboxusercontent.com/s/7caqsovjw5xelp0/font.xml?dl=0');
    game.load.image('ballShadow', 'https://dl.dropboxusercontent.com/s/sq6deec9ddm2635/ball_shadow.png?dl=0');
    game.load.image('floor', 'https://dl.dropboxusercontent.com/s/h5n5usz8ejjlcxk/floor.png?dl=0');
    game.load.image('wall', 'https://dl.dropboxusercontent.com/s/uhugfdq1xcwbm91/block.png?dl=0');
    game.load.image('ball', 'https://dl.dropboxusercontent.com/s/pf574jtx7tlmkj6/ball.png?dl=0');
}

function create() {
    bmpText = game.add.bitmapText(10, 10, 'font', 'Projectile Tutorial', 18);
    normText=game.add.text(10,360,"Press X to bounce again.");
    game.stage.backgroundColor = '#cccccc';
    //we draw the depth sorted scene into this render...