Learn to create HTML5 cross platform games using Phaser – “Ladderz” game completely commented source code available
Talking about Game development, HTML5, Javascript, Monetize and Phaser.
Learn cross platform HTML5 game development
Check my Gumroad page for commented source code, games and books.
...
...
...
// in playGame you can find the game itself
var playGame = function(game){}
playGame.prototype = {
/* create method is automatically executed once the state has been created.
we will use to set up the game and wait for player interaction */
create: function(){
/* using a ternary operator to save into savedData variable the object inside local storage, or new object with both "score" and "coins" values to zero.
basically we check if localStorage.getItem(gameOptions.localStorageName) is null (no saved data)
in this case savedData will become the object {score : 0, coins: 0}
if localStorage.getItem(gameOptions.localStorageName) is NOT null, savedData will become the object created by
decoding the JSON string saved */
this.savedData = localStorage.getItem(gameOptions.localStorageName) == null ? {score : 0, coins: 0} : JSON.parse(localStorage.getItem(gameOptions.localStorageName));
/* each game starts with some default properties such as the score at zero, the lives at three
and so on, which are defined in this case by setDefaultProperties method */
this.setDefaultProperties();
// this method will add audio to the game
this.addAudio();
/* we are using ARCADE physics in this game.
the physics engine will handle collisions, overlaps, velocities and motions */
game.physics.startSystem(Phaser.Physics.ARCADE);
/* we have to define world bounds.
a game has only one world: the abstract place in which all game objects live.
world is not bound by stage limits and can be any size.
"setBounds" updates the size of this world, and the four arguments are respectively:
x coordintate of the top left most corner of the world, in pixels.
y coordintate of the top left most corner of the world.
width of the game world in pixels.
height of the game world in pixels */
game.world.setBounds(0, - 3 * gameOptions.floorGap, game.width, game.height + 3 * gameOptions.floorGap);
/* this method will create the groups required by the game
a group is a container for display objects including sprites and images.
we will also use groups to check for collisions */
this.defineGroups();
// this method will create a particle emitter to be used when the player collects a coin
this.createParticles();
// this method will create a fixed overlay where we'll place the score
this.createOverlay();
// this method will create the menu
this.createMenu();
// this method will define the tweens to be used in game
this.defineTweens();
// this method will draw the level
this.drawLevel();
/* this is a listener which waits for a pointer - mouse or finger - to be pressed down
then fire the callback function this.handkeTap.
the "this" in the second argument is the context used in the function. */
game.input.onDown.add(this.handleTap, this);
}
...
...
...
GET THE SOURCE CODE WITH PAYPAL
or
GET THE SOURCE CODE WITH GUMROAD
Get on Gumroad
I hope you’ll enjoy studying the source code as much as I enjoyed writing it. Never miss an update! Subscribe, and I will bother you by email only when a new game or full source code comes out.