working on it ...

Filters

Explore Public Snippets

Sort by

Found 5 snippets

    public by PBMCube modified Jan 10, 2019  63  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  48  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");
    	

    public by PBMCube modified Jan 10, 2019  56  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  63  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  48  0  3  1

    Global Game Object

    Assigning a global namespace variable with delegation into Phaser.Game
    var game = new Phaser.Game(config);

    List Complete ( 5 snippets total )

    • Public Snippets
    • Channels Snippets