working on it ...
Explore Public Snippets
Found 5 snippets matching: phaser3
public by PBMCube modified Jan 10, 2019 77 0 3 1
Global Game Object
Assigning a global namespace variable with delegation into Phaser.Game
var game = new Phaser.Game(config);
public by PBMCube modified Jan 10, 2019 117 1 3 1
Game Config File
This is a config file example to pass into the Phaser.Game. It is a barebones Phaser3 configuration object
var config = {
type: graphics_mode,
width: game_width,
height: game_height,
parent: 'div-tag-name',
scene: [nameOfScene]
}; public by PBMCube modified Jan 10, 2019 101 0 3 1
Doors as Buttons
Dungeon doorways should be both clickable and sense collisions.
//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);
public by PBMCube modified Jan 10, 2019 95 0 3 1
Game Box Prototype
command combinations
Description: Quickly create operational games using simple box graphics from Phaser3 shapes (v3.13.x). This test game mechanics for enjoyment. Final Artwork added to game mechanisms, prototypes and mechanics as the final pipeline product phase.
// ============
//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
// ============
public by PBMCube modified Jan 10, 2019 90 0 3 1
Scene Preload an Image
command format: Example:this.load.image("key", "path");
Description:Use this in the scene.preload function. .png are the default images. You can also set the "base URL"
// ============
// 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");
