Hello World Phaser Example

Kudos Thomas Palef: http://www.lessmilk.com/ http://blog.lessmilk.com/how-to-make-flappy-bird-in-html5-1/

by Dillybob

HTML

<script src="http://cdn.jsdelivr.net/phaser/2.4.3/phaser.min.js"></script>
<div id="game_div"> </div>

CSS

#game_div {
      width: 400px;
      margin: auto;
      margin-top: 50px;
    }

JavaScript

// Initialize Phaser, and creates a 400x490px game
var game = new Phaser.Game(333, 333, Phaser.WebGL, 'game_div');
var game_state = {};

// Creates a new 'main' state that wil contain the game
game_state.main = function() { };  
game_state.main.prototype = {

    preload: function() { 
		// Function called first to load all the assets
        //game.load.image('hello', 'https://s3.amazonaws.com/uploads-1969f46zwpmbh5cm3kr2/hello.png');
 
    },

    create: function() { 
    		//	This is the BitmapData we're going to be drawing to
        /*
	bmd = game.add.bitmapData(game.width, game.height);
      bmd.context.beginPath();
      bmd.context.rect(0, 0, 155, 155);
      bmd.context.fillStyle = '#fff';
      bmd.context.fill();
    	bmd.addToWorld(0,5);
        */
        
        /*Health Orb 
ctx.rect(50,50, 90, 10);

ctx.lineWidth = 2;
ctx.fillStyle="#e81957";
ctx.fillText('hello', 25, 25, 60);
ctx.fillRect(50,50, 55, 10);

//ctx.globalCompositeOperation = 'destination-atop';
ctx.stroke();

*/
        
       var HP_ORB_WIDTH = 155;
       var HP_ORB_HEIGHT = 135;
        
        
 	 var bmd = game.add.bitmapData((this.game.width, this.game.height));
	 
bmd.context.rect(50,50, HP_ORB_WIDTH, HP_ORB_HEIGHT);

bmd.context.lineWidth = 2;
bmd.context.fillStyle="#e81957";
bmd.context.fillRect(50,50, HP_ORB_WIDTH, HP_ORB_HEIGHT);

//ctx.globalCompositeOperation = 'destination-atop';
bmd.context.stroke();
 
	  var HPORB = game.add.sprite(0,0, bmd);
        
        	
      
        
  	game.add.tween(HPORB).to( { height: 1 }, 5000, Phaser.Easing.Cubic.Out, true);
       
        
        
        
        
        
        
        
        
        
    },
    
    update: function() {
		// Function called 60 times per second
       // this.hello_sprite.angle += 1;
    },
};

// Add and start the 'main' state to start the game
game.state.add('main', game_state.main);  
game.state.start('main');