Handling multiple Stages with multiple .js files
<p>So basically, i want to create a platformer or labyrinth game(Yes, very basic since im still learning, there wont be much stuff anyway).</p>

<p>I want to have multiple .js files, each handling different tasks, for example:</p>

<ul>
<li>main.js - Game menu</li>
<li>level1.js - Level 1 of the game</li>
<li>level2.js - Level 2 of the game</li>
<li>winlose.js - Similar to game menu, just showing if you win or lose the game(Possible Restart -> swap back to main.js)</li>
</ul>

<p>What i got so far is the basic game(currently still in the main.js)</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>var mainState = {
  preload: function() {
    game.load.image("player", "assets/player.png");
    game.load.image("wall", "assets/wall.png");
    game.load.image("coin", "assets/coin.png");
    game.load.image("enemy", "assets/lava.png");
  },

  create: function() {
    game.stage.backgroundColor = "#3598db";
    game.physics.startSystem(Phaser.Physics.ARCADE);
    game.world.enableBody = true;

    this.player = game.add.sprite(150, 50, "player");

    this.walls = game.add.group();
    this.coins = game.add.group();
    this.enemies = game.add.group();

    var level = [
      "xxxxxxxxxxxxxxxx",
      "x   x  x x     x",
      "x xxx xx   xxx x",
      "x xx     xxx x x",
      "x  x  xx     x x",
      "xx x x  x xxx  x",
      "x      x  x!  xx",
      "xxxxxxxxxxxxxxxx",
    ]

    for(var i = 0; i &lt; level.length; i++) {
      for(var j = 0; j &lt; level[i].length; j++) {
        if(level[i][j] == "x") {
          var wall = game.add.sprite(50*j, 50*i, "wall");
          this.walls.add(wall);
          wall.body.immovable = true;
        }
        else if(level[i][j] == "o") {
          var coin = game.add.sprite(50*j, 50*i, "coin");
          this.coins.add(coin);
        }
        else if(level[i][j] == "!") {
          var enemy = game.add.sprite(50*j, 50*i, "enemy");
          this.enemies.add(enemy);
        }
      }
    }

    cursors = game.input.keyboard.createCursorKeys();
  },

  update: function() {
    this.player.body.velocity.y = 0;
    this.player.body.velocity.x = 0;

    if (cursors.left.isDown) {
      this.player.body.velocity.x = -200;
    }
    if (cursors.right.isDown) {
      this.player.body.velocity.x = +200;
    }
    if (cursors.up.isDown) {
      this.player.body.velocity.y = -200;
    }
    if (cursors.down.isDown) {
      this.player.body.velocity.y = 200;
    }

    game.physics.arcade.collide(this.player, this.walls);
    game.physics.arcade.overlap(this.player, this.coins, this.takeCoins, null, this);
    game.physics.arcade.overlap(this.player, this.enemies, this.changeStage, null, this);
  },

  changeStage: function() {
    game.state.start("main"); //Swap to Level 2
    console.log("u win!");
  },
};

var game = new Phaser.Game(800, 400);
game.state.add("main", mainState);
game.state.start("main");</code></pre>
</div>
</div>
</p>

<p>Currently coded into a "labyrinth" style game, before it was a platformer, thats why theres probably some unused code.
Now, the problem is, i have no clue how to use multiple .js files and change stages within Phaser.
I hope everything i've written is understandable, if not, feel free to ask and i'll try my best to explain more! :)</p>

<p>Thank you in advance.</p>