Correct use of states

[hicotech]

Hi,,

so I am wondering what is the correct use of states.. obviously as Boot, Preloader, Main Menu, Game as per examples and docs.. but can or should states be used for different game locations? for example player enters a building, different city, different map location

Imagine RPG game where player can wonder around in "free" world and at some point enters some city.. then within the city enters different bulildings (many of them).. should all those be different states or is there any other better approach for cases when world/map/screen changes completely

Example of LPC demo where you can enter buildings or go north through woods and enter different location

http://lpc.opengameart.org/static/lpc-style-guide/demo.html

Example of Diablo where player is in one location "world" and about to enter another location "castle"

[webcaetano_]

There's no "correct way" to use game states.
It is just a way to organize game data.
If you were writing D2 on Phaser.
You probably not use states for differents parts of the map (you could). 
But probably a game state for the main menu, and other for the actual game, etc..
One of the advantages of divide the game in states is being able to start/reset/reload it easier.  
Big fan of D2 too.  

[hicotech]

I am not trying to write D2 (though its great game!) in javascript but logic for those RPG games is always similar.. 

so basically it is possible to use states even for different map parts just not as common.. would then be some other approach which which I can load different map assets? I didnt see anything else

[ptdnet]

Just to follow your example, I'd probably have the following states in Diablo 2:

Boot, Preload, Menu <-- the obvious ones

BuildLevel, where I prepare whatever zone you're about to go into

PlayLevel, where you do the actual playing

Really, that's about it. "Menu" might be split into 2 or 3 different states, because there's stuff like character selection/creation, etc.

 

[hicotech]

so basically you say to use two different states for actual game, right?

if not then, how would you (technically) do actual act of player entering a building when you need to regenerate whole map.. but possibly show previous one in next couple of seconds?

because there might be different number of different building or locations.. I would then need to prepare everything what is possible to enter from that location

 

[Arcanorum]

The game I'm working on uses multiple zones you can move between, and only uses one state for the game world. Having a state for each zone gets messy and hard to maintain very quickly. States are more about separating different purposes in a game (a menu screen has a different purpose to a loading screen, or a cutscene), so if the functionality of the 'zones' of your game world are the same, then the playable game world should just be one state.

Here's my current approach:

arenas.GameWorld.prototype = {

    preload: function () {
        // Load the data for the zones.
        this.load.tilemap('zone-1', 'assets/zones/zone-1.json', null, Phaser.Tilemap.TILED_JSON);
        // ... however many zones your map has.
        this.load.tilemap('zone-33', 'assets/zone/zone-33.json', null, Phaser.Tilemap.TILED_JSON);
    },

    create: function () {
        // Good practice to keep tilemap layers in a group.
        this.mapLayersGroup = this.add.group();
        // Create zone 1. Change to the number of whatever zone you want to load.
        // Whenever a player goes through a doorway or whatever, just call createZone again and give it the number of the zone to move to.
        this.createZone(1);
    },

    createZone: function (zoneNum) {
        // Clear the tilemap data from zoneMap, if there was any.
        this.zoneMap = {};
        // Destroy the tilemap layers of the previous map.
        this.mapLayersGroup.destroy(true, true);

        // Create the tilemap for the zone, using the value of zoneNum to load the right zone, in the first case "zone-1", and
        // add the tileset images to it. This assumes every zone is using the same set of tileset images.
        this.zoneMap = this.add.tilemap('zone-' + zoneNum);
        this.zoneMap.addTilesetImage('floor',   'tileset-floor');
        // ... however many tileset images your map uses.
        this.zoneMap.addTilesetImage('trees',  'tileset-trees');

        // Add the layers to the map. These are what are displayed.
        this.layer1   = this.zoneMap.createLayer('layer1', undefined, undefined, this.mapLayersGroup);
        // ... however many layers your maps have.
        this.layer6   = this.zoneMap.createLayer('layer6', undefined, undefined, this.mapLayersGroup);

        // Resize the game world to the size of whatever the biggest layer is.
        this.layer1.resizeWorld();
    }
};

Don't worry about loading times. If your zone data is already loaded then moving from one zone to another should appear to be instant, unless your game is also doing some other crazy stuff to slow it down.

[hicotech]

ok got it.. as I am using the framework/engine I wanted to use some native functionality but obviously there is none for this kind of stuff and your solution sounds reasonable..

I will go with this approach.. thanks