This Week in LesserPanda #10

Covering the days from 2016-06-23 to 2016-08-17.

It has been quite long since last post, but this time I'll anounce that the long-wait stable version comes.

No only tons of issues are solved, but also improvements are applied.

Tilemap and Level

Previously the Tilemap is feature ready yet hard to use, so I completely re-design it to what it looks now. To seperate things into parts also evolved a new concept "level".

Let'me introduce them in detail.

Tilemap

Tilemap is changed a lot and now seperated to several independent components. The new API is heavily inspired by impact.js framework, and contains 2 major part:

• BackgroundMap
• CollisionMap

BackgroundMap is just a single layered tilemap, while CollisionMap is a tilemap specificly for tile based collision.

Level

A method called loadLevel will be injected into Scene if you requited the engine/level module. A level is simply a list of layers of various types.

Just like impact.js users can build levels from level editor and load that in the game, you can now design levels(including map, layer and actors) by writing it down in the right format, and provide it to loadLevel method.

While the level format is quite straight-forward, here's an example:

[
  // A tile map(layer)
  {
    type: 'tile',
    tilesize: 16,
    tileset: 'pizza-boy.png',
    data: [
      [45,46,46,46,46,46,46,47],
      [ 0, 0, 0, 0, 0, 0, 0, 0],
      [ 0, 0, 0, 0, 0, 0, 0, 0],
      [ 0, 0, 0, 0, 0, 0, 0, 0],
      [45,46,46,46,46,46,46,47],
    ],
    parent: 'bottomLayer',
  },

  // A collision map
  {
    type: 'collision',
    tilesize: 16,
    data: [
      [1,1,1,1,1,1,1,1],
      [1,0,0,0,0,0,0,1],
      [1,0,0,0,0,0,0,1],
      [1,0,0,0,0,0,0,1],
      [1,1,1,1,1,1,1,1],
    ],
  },

  // An actor layer, including several actors
  {
    type: 'actor',
    container: 'bottomLayer',
    actors: [
      ['Box', 40, 40, { name: 'box' }],
    ],
  },
]

The map format is JSON capable and will be used later in the official LesserPanda editor, but you won't need that long since there's also a Tiled importer that will take Tiled JSON file and convert to be able to load by the engine.

Level from Tiled JSON

1. Add some tile layers in Tiled editor, make sure that each layer uses only one tileset.
2. Create some object layers, whose name will be also created during loading. And add some objects with type(the type should be registed as Actors before loading).
3. Export as JSON.
4. Load the map file: loader.addAsset('level01.json')
5. Convert it to built-in format: let mapData = tiledToMap('level01.json')
6. Load the converted map data: this.loadLevel(mapData)

Samples are updated to use latest version

Samples repo is kept updating to latest version of LesserPanda. And I decided to make samples along with any new features introduced to LesserPanda.

CLI

Project creating command is finally landed, now you can easily create a new project with lpanda create MyAwesomeGame.

What's Next

More samples yeah! And better support of Tiled object layer. The Tiled editor will be supported before LesserPanda editor is out. To help developers improve the game making experience, I decided to continuously improve this feature.