Explore Public Snippets

var game = new Phaser.Game(config);

var config = {
        type: graphics_mode,
        width: game_width,
        height: game_height,
        parent: 'div-tag-name',
        scene: [nameOfScene]
    };											

// ============
//Example 4.1: Prototyping Graphics begins
// ============
//create a character avatar using the box prototype method 
player = box({who: this, whereX: 150, whereY: 100,length:32, width:32, color: 0x0000FF,border: 0xFFFFFF});
this.physics.add.existing(player);
player.body.velocity.x = 10; //see update function
player.body.velocity.y = 50;
console.log("Stationary Blue character avatar created as 'player' variable.");
// ------------  
// OR the direct method using either rectangle or graphics
//    and set movement velocities. 
var avatar =  this.add.rectangle(100, 100, 32, 32, 0x0000FF).setStrokeStyle(5, 0x3399CC);
console.log("Moving Blue character avatar created as 'player' variable.");
var graphics = this.add.graphics({ fillStyle: { color: 0xFF0000 } });
graphics.lineStyle(10,0xFF9900,0);
graphics.strokeRect(100, 100, 32, 32);
	
//non-controlled movement (usage AI bot; see Chapter 6)
graphics.fillRectShape(avatar);
this.physics.add.existing(avatar);
avatar.body.velocity.x = 50;
avatar.body.velocity.y = 10;
//non-controlled movement (usage AI bot; see Chapter 6)
this.physics.add.existing(graphics);
graphics.body.velocity.x = 50;
graphics.body.velocity.y = 50;
console.log("Moving Red avatar created as 'avatar' variable.\n Movement velocity set.");
// ------------
//create an opponent - direct method 
var monster = this.add.rectangle(180, 60, 32, 32, 0x00FF00).setStrokeStyle(5, 0xFF9900);
console.log("Green monster avatar created as 'monster' variable.");
//Example 4.1: ends
// ============

// ============
// Example 3.4: Additional Phaser Properties begins
// ============
// remote URL to game assets
// Cross-origin resource sharing (CORS)
	this.load.setCORS = 'anonymous';
// Setting base URL path
	this.load.setBaseURL('http://makingbrowsergames.com/p3devcourse/_p3demos/imgages/');
// Preload a gfx asset
	this.load.image("face", "face.png");
	

//Phaser III - clicking on a doorway  
// ============
// Example 4.6:  Doors as Buttons
// ============
// Creating door rectangles; review console in this experiment  
//placed on a wall with 2px extended into the room
doorN = this.add.rectangle(35,0,60,18,0x000000)  
        .setInteractive()  
        .setOrigin(0);