Scenes Template for Phaser 3

[semwalhritvik]

//Here is a template for scenes in Phaser3.

//This can be used to ease the development of Phaser 3 games. New scenes can be added in a similar manner and existing scenes can be removed easily.
//For any changes in the number of scenes do not forget to make appropriate changes in the scene:[ ] in the config settings at the end of the code.

//Each scene is labelled with corresponding scene number.

//The scenes can be switched to the next scene using the next button.
//The main menu button can bring you back to GameScene1 from any other page.

//Each Gamescene has 4 functions.
//    -The GameScene function calls the scene. 
//    -The preload function is where you load all the media. 
//    -The create function can be used to call items and events when the scene is invoked.
//   -The update function calls the methods inside it once per frame.

var mainbtn;
var GameScene1 = new Phaser.Class({

    //The scene is noted.
    Extends: Phaser.Scene,
    initialize:

    function GameScene1 ()
    {
       //GameScene1 is called
        Phaser.Scene.call(this, { key: 'GameScene1' });
    },

    preload: function ()
    {
        //preload media for GameScene1 here
    },

    create: function ()
    {
       var gs = this.add.text(500,500, 'GameScene1');
        var txt1 = this.add.text(400,300, 'next');
        
        txt1.setInteractive().on('pointerdown', function() {
            
            this.scene.scene.start('GameScene2');
        });        
        
    },
    update:function(){  
          
   
       
    }

});

//create a scene with class
var GameScene2 = new Phaser.Class({
    Extends: Phaser.Scene,
    initialize:
    function GameScene () {
        Phaser.Scene.call(this, { key: 'GameScene2' });
    },

    preload: function ()
    {
        //preload media for GameScene2 here
    },
    
    create: function ()
    {     
      var gs2 = this.add.text(500,500, 'GameScene2');
      mainbtn = this.add.text(400,50, 'main menu');
      var txt2 = this.add.text(400,320, 'next');
        
        txt2.setInteractive().on('pointerdown', function() {
            
            this.scene.scene.start('GameScene3');
        });
        mainbtn.setInteractive().on('pointerdown', function() {    
            this.scene.scene.start('GameScene1');    
             
           });
    },

    update:function(){  
          
   
       
    }

});

var GameScene3 = new Phaser.Class({
    Extends: Phaser.Scene,
    initialize:
    function GameScene () {
        Phaser.Scene.call(this, { key: 'GameScene3' });
    },

    preload: function ()
    {
        //preload media for GameScene3 here
    },
    
    create: function ()
    {     
        var gs3 = this.add.text(500,500, 'GameScene3');
      mainbtn = this.add.text(400,50, 'main menu');
      var txt3 = this.add.text(400,340, 'next');
        
        txt3.setInteractive().on('pointerdown', function() {
            
            this.scene.scene.start('GameScene4');
        });
       
        mainbtn.setInteractive().on('pointerdown', function() {    
            this.scene.scene.start('GameScene1');    
             
           });
     
    },

    update:function(){  
          
   
       
    }

});
var GameScene4 = new Phaser.Class({
    Extends: Phaser.Scene,
    initialize:
    function GameScene () {
        Phaser.Scene.call(this, { key: 'GameScene4' });
    },

    preload: function ()
    {
        //preload media for GameScene4 here
    },
    
    create: function ()
    {     
        var gs4 = this.add.text(500,500, 'GameScene4');
      mainbtn = this.add.text(400,50, 'main menu');
      var mainbtn1 = this.add.text(400,360, 'next');
        
      mainbtn1.setInteractive().on('pointerdown', function() {
          
          this.scene.scene.start('GameScene5');
      });
      mainbtn.setInteractive().on('pointerdown', function() {    
        this.scene.scene.start('GameScene1');    
         
       });
     
    },

    update:function(){  
          
   
       
    }

});

var GameScene5 = new Phaser.Class({
    Extends: Phaser.Scene,
    initialize:
    function GameScene () {
        Phaser.Scene.call(this, { key: 'GameScene5' });
    },

    preload: function ()
    {
        //preload media for GameScene5 here
    },
    
    create: function ()
    {     
        var gs5 = this.add.text(500,500, 'GameScene5');
      mainbtn = this.add.text(400,50, 'main menu');
      var txt5 = this.add.text(400,380, 'next');
      
      txt5.setInteractive().on('pointerdown', function() {
          
          this.scene.scene.start('GameScene6');
      });
     
      mainbtn.setInteractive().on('pointerdown', function() {    
        this.scene.scene.start('GameScene1');    
         
       });
    },

    update:function(){  
          
    
       
    }

});
var GameScene6 = new Phaser.Class({
    Extends: Phaser.Scene,
    initialize:
    function GameScene () {
        Phaser.Scene.call(this, { key: 'GameScene6' });
    },

    preload: function ()
    {
        //preload media for GameScene6 here
    },
    
    create: function ()
    { var gs6 = this.add.text(500,500, 'GameScene6');    
      mainbtn = this.add.text(400,50, 'main menu');
      var txt6 = this.add.text(400,400, 'next');
      
      txt6.setInteractive().on('pointerdown', function() {
          
          this.scene.scene.start('GameScene7');
      });
      mainbtn.setInteractive().on('pointerdown', function() {    
        this.scene.scene.start('GameScene1');    
         
       });
     
     
    },

    update:function(){  
          

       
    }

});

var GameScene7 = new Phaser.Class({
    Extends: Phaser.Scene,
    initialize:
    function GameScene () {
        Phaser.Scene.call(this, { key: 'GameScene7' });
    },

    preload: function ()
    {
        //preload media for GameScene7 here
    },
    
    create: function ()
    {     var gs7 = this.add.text(500,500, 'GameScene7');
      mainbtn = this.add.text(400,50, 'main menu');
      var txt7 = this.add.text(400,420, 'next');
      
      txt7.setInteractive().on('pointerdown', function() {
          
          this.scene.scene.start('GameScene8');
      });

      mainbtn.setInteractive().on('pointerdown', function() {    
        this.scene.scene.start('GameScene1');    
         
       });
     
    },

    update:function(){  
          
    
       
    }

});

var GameScene8 = new Phaser.Class({
    Extends: Phaser.Scene,
    initialize:
    function GameScene () {
        Phaser.Scene.call(this, { key: 'GameScene8' });
    },

    preload: function ()
    {
        //preload media for GameScene8 here
    },
    
    create: function ()
    {     var gs8 = this.add.text(500,500, 'GameScene8');
      mainbtn = this.add.text(400,50, 'main menu');
      var txt8 = this.add.text(400,440, 'next');
      
      txt8.setInteractive().on('pointerdown', function() {
          
          this.scene.scene.start('GameScene9');
      });
      
      mainbtn.setInteractive().on('pointerdown', function() {    
        this.scene.scene.start('GameScene1');    
         
       });
    },

    update:function(){  
          
   
       
    }

});

var GameScene9 = new Phaser.Class({
    Extends: Phaser.Scene,
    initialize:
    function GameScene () {
        Phaser.Scene.call(this, { key: 'GameScene9' });
    },

    preload: function ()
    {
        //preload media for GameScene9 here
    },
    
    create: function ()
    {     var gs9 = this.add.text(500,500, 'GameScene9');
      mainbtn = this.add.text(400,50, 'main menu');
      var txt9 = this.add.text(400,460, 'next');
      
      txt9.setInteractive().on('pointerdown', function() {
          
          this.scene.scene.start('GameScene10');
      });

      mainbtn.setInteractive().on('pointerdown', function() {    
        this.scene.scene.start('GameScene1');    
         
       });
    },

    update:function(){  
          
   
       
    }

});
var GameScene10 = new Phaser.Class({
    Extends: Phaser.Scene,
    initialize:
    function GameScene () {
        Phaser.Scene.call(this, { key: 'GameScene10' });
    },

    preload: function ()
    {
        //preload media for GameScene10 here
    },
    
    create: function ()
    {     
      mainbtn = this.add.text(400,50, 'main menu');
      var gs10 = this.add.text(500,500, 'GameScene10');
          
      mainbtn.setInteractive().on('pointerdown', function() {    
           this.scene.scene.start('GameScene1');    
            
          });
     
    },

    update:function(){  
       
       
    }

});

//settings required to configure the game are as follows
//the physics type applied is arcade. 
// the resolution is set to 800 x 600 pixels.
// the background color is set to brick red.

//Make changes in the scene[ ]  attribute for any corresponding change in the number of scenes.

var config = {
    type: Phaser.AUTO,   
    width: 800,
    height:  600,
    physics: {
        default: 'arcade'
    },
    //set background color
    backgroundColor: 0x841F27 ,
    scale: {
        //we place it in the middle of the page.
        autoCenter: Phaser.Scale.CENTER_BOTH
    },

    //set scenes
    scene:[GameScene1,GameScene2,GameScene3,GameScene4,GameScene5,GameScene6,GameScene7,GameScene8,GameScene9,GameScene10]
    
};


var game = new Phaser.Game(config);