Saltsman's tutorial is more of an intro to Flex Builder IDE than Flixel, but the window-by-window detail is pretty reassuring for a first timer. Now I'm moving on to Seifer Tim's tutorial, which was recently updated to reflect the changes in Flixel 1.47. This tutorial is intended to walk a new Flixel coder through a basic game where you have ninjas throwing stars at each other. The tutorial also has a couple of handy tilemaps and sprite sheets for the new demo characters, simplifying the process of identifying which frames you need to use for running/attacking/dying, and setting up some basic logic for Mario Bros-style inertial physics.

Once bitten, twice shy

A quick check to the github tells me that Flixel was updated again. Seifer Tim's tutorial is already out of date, because Flixel is now at 1.48! Thankfully, the changes are minor, and don't appear to affect Tim's instructions for steps I through IV. I check out my project in Perforce and start to edit my old code.

When it comes to editing the level, however, there's one problem: Tim's tutorial points me at Mappy, which is a Windows-based tile editor. It looks great, but I'm on a Mac! Also, no one seems to have uploaded any examples of what a Flixel map file actually looks like, so I can't even use a text editor to start creating it instead. A quick search through the Flixel forums yields Flan, which is a Flixel-specific, square grid editor. It's more complex than I expected -- Flan has a button for each function, so there are a LOT of buttons, hidden between different screens of options. It employs a Photoshop-like concept of "layers" of tilemaps, based on Flixel's own FlxLayer abstraction. So I create a new layer, try to set it to 40x30 as Tim's tutorial recommends, but the new map size never seems to take. Turns out that there's an "Apply Changes" button at the bottom of the Layer options window, but you've got to resize the window to see it.

Eventually, I figure out how to import Tim's demo tile images, draw out a map, and export it as a CSV. Flan auto-generates a filename and creates a CSV file with the following data:

1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1
1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1
1,1,1,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1

... etc. This goes on for a while. That's my map! And now you know what a Flixel map looks like.

Retyping Tim's code line by line, I realize that it prescribes a fairly large chunk of coding before I'll be able to compile and see any results. This is a little scary; I like to verify that my code is compiler-clean as often as possible, and generating a class that doesn't get used until I significantly edit another class is like walking blindfolded. However, once I've typed in enough, my little ninja appears on screen! I can even steer him a little before he drops off into nothingness.

Where's the level?

I pull out a line of code from Saltsman's old tutorial to throw the string on screen, and nothing shows up. I try to poke around the code that embeds map.txt in the game, learning a bit about taking a class loaded as an octet-stream and turning it into a string, but something very weird starts to happen with Flex. It begins insisting that I hadn't closed a brace, but I squint and squint and can't find where that missing brace would go. Recopying and pasting Tim's code from the wiki into my project solves that problem. (Shrug)

Now the 1's and 0's are showing up on my screen, and I can turn the text-drawing routine off. The map is still nowhere to be found, and my ninja still falls off the screen. Wondering if my Player class might be at fault, I turn off gravity for a moment. That stops the ninja falling, and now he can jump up. A few jumps and I realize that I was starting the ninja far too low! The map was there all the time, but Tim's code kept spawning the ninja several screenfuls below the map and automatically centering the camera on the ninja instead of the map. Tweaking the spawn point puts the ninja inside the map instead, and it works!

Other than struggling a little bit with Perforce, the rest comes pretty easy. My hastily-drawn map turns out to be quite an obstacle course for Tim's default character-moving routines, which seem a little pokey for a ninja. So I double the acceleration, add a routine so that it quadruples dedeceleration, so the ninja can take off like a Ferrari but pivot on a dime. The map is still a challenge, but not frustratingly so.

Now my ninja has a world to run and jump in, but no way to die. Next step: Enemies.