Saving game data

[ForgeableSum]

I've found a bunch of threads about saving game data using Local Storage, but no actual code examples. What if I place a bunch of objects in the game world, modify those game objects during the game and want to save everything in a JSON file? Is there an easy way to do this? My particular need is to save them to a file with a server-side script... but first thing is to figure out how to save/load all the data. 

[d13]

 Is there an easy way to do this?

Here's the easiest:

 

https://www.firebase.com/how-it-works.html

 

Or:

 

https://parse.com

[ForgeableSum]

Can you explain what you mean by your answer? The first one says "Build realtime mobile and web apps in minutes using client-side code and our powerful API."

 

What does that have to do with saving?

[spencerTL]

If you read below that bit it does show how Firebase is used for saving Json. Seems like a useful option to me.

[ForgeableSum]

Ah but even if it did work it seems a bit too expensive. Does anyone know of any free solutions? I'm just trying to save game state at and given time into a JSON that can be stored locally. Then the JSON can be uploaded and the game state restored. I would think this would be a common thing. 

[Horizonicblue]

You can save/load data by using

localStorage.setItem('myItemKey', 'myContent');localStorage.getItem('myItemKey');

You may find something more in the below thread

http://www.html5gamedevs.com/topic/3456-save-game-data-locally/

[ForgeableSum]

I had looked into that. The problem is that you can't use JSON.stringify on the game object or game.world (or window or document, etc), because the object contains a "circular structure." Is there some other object I should be using it on to save the current game state? 

 

Even if I can save to localStorage, it's not a file the user can choose where to save it to, then upload it later. It's essentially browser-cache. Still, if I can get the entire game state in localStorage, I'm sure it won't be too much trouble to get it to a file which goes into a destination the user selects. 

[rsadwick]

You can build a json object of what you want to save.  From there, use ajax and call a post route to your server to save the object.  You don't necessarily have to save the json object to your database as a string - the server could unroll it and save it to a table.   By using ajax, you won't have to reload your game and you can have callback functions fire to do something after the user saves/loads

 

When you load a game, you can use ajax to call a get method from your server to return the data as json.  On your ajax callback function, you can load the json data into your game.  Consider the simple jquery ajax example below:

$.ajax(    '/saveMyGame/, {        type: 'get',        context: this,        dataType: 'json',        success: function(data, status, xhr) {            if (data)                //load data into your game        },        error: function(xhr, status, error) {            //oh snap - handle this error        }    });

On your backend is where you would deal with the object to save it.  I'm not sure what server-side you're using but any backend can handle this (django, c#, java, php, etc).  

 

The important thing to this is: you will need to have a unique identifier to this saved data - like a username or email address.

 

If you're looking for a free service to try out - I'd recommend Google App Engine  -https://cloud.google.com/appengine/docs.  There is a lot of documentation and has the ability to scale out if needed.  It's fairly easy to learn and supports a variety of languages.  It's a good place to start and if you decide to stand up your own server or VPS, it wouldn't be that hard to port over assuming you pick the backend language you're most conformable in.  It also has a Users Service framework to take advantage of.

 

A side caveat - it's easy to inject stuff in javascript.  When building any sort of save system, it is a good idea for the server to validate game state before saving and not let the game client do any decisions making.  Here is a great side video from Google.io on this type of validation: https://www.youtube.com/watch?v=Prkyd5n0P7k.  Optimizing your game to do this takes time so just think about it and maybe build that later if cheating becomes a problem.

[ForgeableSum]

Thanks for the info. But I'm actually trying to save the data from the browser directly to the client's computer (not being uploaded or processed by the server at all). So essentially save the entire canvas and any game data generated by Phaser into a single file which can be re-uploaded.

[rsadwick]

Sorry, I misread that - I thought you were saving data to a server.

 

I would do something similar to what @Horizonicblue mentioned but don't try to save Phaser's game state or canvas directly:

 

Pick which data you want to save and push all of that into a json object and convert it to a string and save.  I'm doing something like this

    FEATHERWEIGHT: {        velocity: -250,        gravity: 500,        creation: 2,        duration: 7,        chance: -1,        tint: 0xff9900    },    NORMAL: {        velocity: -350,        gravity: 1000    },    SHIELD: {        duration: 7,        currentTime: 0,        chance: -1,        blendMode: Phaser.blendModes.ADD    },    BOMBOS: {        velocity: -350,        gravity: 2500,        creation: 5,        duration: 7,        chance: 0.100,        tint: 0x999999,        graphic: 'assets/bomb.png'    }

I load this object.  The player interacts in the game and some of these are updated.  Then I save it.  For example, when I load the object - I can create the shield how the player last left it - with the blendMode, gravity, and all those other parameters intact.  You could also add a level parameter in there to save things like current level, the x/y cords where the player was, background image, etc.  

[ForgeableSum]

I suppose I'll have to go through the game objects and cherry pick what data I want to save. I guess I knew I might have to do that eventually, but I was hoping there was some sort of magic bullet which would save the entire canvas and Phaser.Game object. I mean, you'd think that there would be, no? Everything that's inside the canvas is inside objects. Why shouldn't this be an easy thing to do? Is the circular structure the only thing standing in the way of that? Doesn't make sense it can't be saved in some sort of blob format - it's all just text after all.  

[GrindheadGames]

the best way to handle this is to save specific data to the users machine using local storage as mentioned above, and then allowing the user to load this data through a load screen. There is no way to dump the current game to local storage - from a development point of view this would be really horrible! 

[ForgeableSum]

Two things. 

 

1. Doesn't local storage go directly into browser cache?

 

2. Why is it horrible? That's really what I'm getting at. 

[rsadwick]

1.  local storage is an implementation of the Storage Interface.  Check out http://dev.w3.org/html5/webstorage/#storage-0 for specs.  You can keep a "cache" reference to things like DOM selectors and objects, sure.

 

Data is stored with no expiration date unlike cookies.   You can remove local storage through javascript and/or clearing browser cache.

 

2.  local storage has a size limit and it varies from browser to browser.  Also, the limit can be set by the user.  I believe Grindhead mentioned it was bad because there is a lot of data you don't need to save/load and passing game states into storage may even hit the limit at some point.

 

Are you trying to save a lot of data at once? For example:  sprite rotations, whether a sprite was alive or not, and more stuff like that?  Or are you trying to save the level, position of the player, lives, and score data?

 

I see what you mean by dumping the entire state of the game into storage would be easy but most of it doesn't need to be saved given what your game needs to save.

[grumpygamer]

Would saving to a cookie be completely stupid?

[ZoomBox]

Local storage is like cookies but more reliable.

It's the way I usually do (works on PC and phones).

[rsadwick]

@grumpygamer - I wouldn't save anything that has to do with score, number of lives, player stats, and stuff like that because cookies can easily be manipulated by someone else.  The flip side of that is a player would have to have the "need" the cheat.  You could store things like the player's nickname / id, boolean stuff like isDaytime = true, or an array of powerups the player has already used.

 

The size limitation of a single cookie is far smaller than local storage - around 4kb.  You can get around this by using multiple cookies or a super cookie but you wouldn't want to manage that for a game - local storage is a better option and the API is easy to use.  Personally, I'd only use cookies for webdev and only if I really needed one

 

What I recommend is experiment with your game.  You may not be worried about cheaters so you could try out cookies.  You may want to stuff a level object into local storage - try it out and see how it works in your game.  

 

If you plan on having a monetary value in your game, for example: win $100 if you are number 1 on our leaderboard.  That will invite the cheaters!  A feature like that is where using cookies and local storage is not a good idea.  Hope that helps, cheers.

[grumpygamer]

@grumpygamer - I wouldn't save anything that has to do with score, number of lives, player stats, and stuff like that because cookies can easily be manipulated by someone else.  The flip side of that is a player would have to have the "need" the cheat.  You could store things like the player's nickname / id, boolean stuff like isDaytime = true, or an array of powerups the player has already used.

 

The size limitation of a single cookie is far smaller than local storage - around 4kb.  You can get around this by using multiple cookies or a super cookie but you wouldn't want to manage that for a game - local storage is a better option and the API is easy to use.  Personally, I'd only use cookies for webdev and only if I really needed one

 

What I recommend is experiment with your game.  You may not be worried about cheaters so you could try out cookies.  You may want to stuff a level object into local storage - try it out and see how it works in your game.  

 

If you plan on having a monetary value in your game, for example: win $100 if you are number 1 on our leaderboard.  That will invite the cheaters!  A feature like that is where using cookies and local storage is not a good idea.  Hope that helps, cheers.

ah! Had forgotten about cheating!

[ForgeableSum]

My need is to save maybe a few hundred sprites/images and there positions. I think if I just put them all into a JSON file, I could save them any way I want. So, you're right, it probably doesn't make sense to save the entire game anyway. 

 

The data specifically is that of game maps. I want the user to be able to share the maps with other people, so localStorage isn't an option. I'm sure it won't be too hard to get the user to download a JSON into a directory they choose... just gotta experiment. 

[rsadwick]

feudalwars, here are some ideas if you want to try something server side.

 

You could have a simple web service setup that returns your json data into the game.  Something like mygame.com/maps/{{ id }} where id is the identifier of the map.  This would return the json object from your backend into your game.  So the backend could do something like:

 

Let's say you table is setup like this - keep in mind this is pseudo code:

map_id : primary key

map_name: name of the map for display

json_output: json object of map

select json_output from map_table where map_id = 4365

In your game, you could load the map like this:

$.ajax(    '/maps/4365', {        type: 'get',        dataType: 'json',        success: function(data, status, xhr) {            if (data)                loadMapData(data)        },        error: function(xhr, status, error) {            //oh snap - handle this error        }    });

Then your players could share the url in game easily instead of trying to exchange json files.  It would require some work though but if sharing maps is a big feature in your game it would be worth trying out.