Problem between menu state with button and game state with tilemap

[Rslnautic]

Could you help me out with a problem that I have with the game im making. Between the menu and game state (witch has a button

 that sends me to the gam menu) and game state with tilemap (in witch if you press the enter key it sends me back to the menu).

My problem consists in the fact that when I press the enter key in the game state to go back to the menu, the menu button disappears, I've tried to do it from the menu with a game state without tilemap and the button doesn't disappear.

As a possible solution Ive thought about if while pressing the enter key apart from redirecting the user to the menu, it destroys the map with the method destroy(), which supposedly  eliminates the map and its corresponding layers.

As a conclusion, I think that the object map ends up getting deleted, but not its layers.

 

Problem example Link: http://button.ramonserrano.info <---------------------

Github Assets Link: https://github.com/r...m-Button-Phaser

Full game: https://googledrive....Cd0E/index.html

 

CODE

State Menu

(function() {

  'use strict';

 

  function Menu() {

    this.titleTxt = null;

    this.startTxt = null;

  }

 

  Menu.prototype = {

 

    create: function () {

      var x = this.game.width / 2

        , y = this.game.height / 2;

 

      this.add.sprite(0, 0, 'menufondo');

      this.text = this.add.text(this.world.centerX-650, 500, "PRESS BUTTON PLAY TO GO TO THE GAME", {

        font: "65px Arial",

        fill: "#ff0044",

        align: "center"

    });

 

      this.playbutton=this.add.button(this.world.centerX - 90, 700, 'play',

        function () {

          this.game.state.start('game');

        }, this, 2, 1, 0);

 

 

      console.log(this.playbutton);

    },

 

    update: function () {

    }

  };

 

  window['button-problem'] = window['button-problem'] || {};

  window['button-problem'].Menu = Menu;

 

}());

 

 

 

State Game

(function() {

  'use strict';

 

  function Game() {

    this.player = null;

    this.map;

    this.layer;

    this.cursors;

    this.music;

    this.moneytext;

    this.sounddeath;

    this.soundcoin;

  }

 

  Game.prototype = {

 

    create: function () {

      var x = this.game.width / 2

        , y = this.game.height / 2;

 

      this.map = this.game.add.tilemap('estomago');

      this.map.addTilesetImage('tiles');

      this.layer = this.map.createLayer('layer1');

      this.layer.resizeWorld();

 

      this.camera.x=3600;

      this.camera.y=4800;

      

      this.text = this.add.text(4200, 4800, "PRESS ENTER to return to menu", {

        font: "65px Arial",

        fill: "#ff0044",

        align: "center"

    });

 

    this.text.anchor.setTo(0.5, 0.5);

    },

 

    update: function () {

        if (this.input.keyboard.isDown(Phaser.Keyboard.ENTER)) {

          this.game.state.start('menu');

        }

    },

 

  };

 

  window['button-problem'] = window['button-problem'] || {};

  window['button-problem'].Game = Game;

 

}());

[Heppell08]

I think you need to stack your creation and create with a variable result.

I use a mapnumber variable in my boot.js and as soon as my game loads its set up and creates based on the variable result.

I also used json localstorage but that was only for game save data.

There are a range of ways to do what you need though.

[Rslnautic]

Im very newbie I dont understand your solution very well. Can you explain with an example?

[Heppell08]

My best example is a post I made a while ago and fixed a while ago. Read it and see:

http://www.html5gamedevs.com/topic/4466-help-on-something-probably-quite-simple/