Building a Canvas Editor - HTML5 Mobile Game Development - page 381

This code simply defines a route at /save that grabs the data that was posted in, transforms the tiles data
into numbers, and then writes out a file. By default the posted tile data comes in correctly as an array of arrays,
but each element in the array is a string, so it needs to be converted into a number.
Writing the file is as simple as calling fs.writeFile and passing the filename and the level data conver-
ted to a JSON string using JSON.stringify .
Security Warning
This code is not something you would want to deploy to a public web server but would be something you might
use internally to develop levels. Because the code lets the user write to an arbitrarily-named file, it could be used
to overwrite data files or operating system files. A production end-user-friendly editor would check the validity
of the passed in filename or save the data to a database instead of the filesystem.
If you restart the server and reload the editor, you should now have a working editor that you can use to create
and edit level tile data. This chapter doesn't cover the details to add and manipulate sprites, such as the location
of the player and the blobs, in addition to the tile data. This is something that would be game-dependent, but
the basic idea is the same: Add an interface to add and manipulate elements, and then provide a serialization
method to save that data back to the server.
Summary
This chapter went through the steps to add an interactive game tile editor to the platformer game from the last
chapter. The chapter showed you how to add a tool system and let the user select, paint, and erase tiles. It also
added support for saving the level data back to the server, which makes it easier to create and edit levels than
trying to edit JSON data files by hand. You'll continue with Node.js in the next chapters to build some more
complicated functionality for multiplayer gaming.