Create a Flash game like Talesworth Adventure

Recently I got addicted to Talesworth.

It’s a great tile based puzzle game with 30 levels I recommend you to play, but it’s also a game I am recreating with a tutorial series.

So let’s start… since it’s a tile based game, the barebones are very similar to Create a Flash game like Rebuild Chile.

So we have a tiled map, keyboard listeners and all the old thing we already know.

Just let me introduce a couple of new features… first the walkable tiles are defined by value 2 in map array, and second I defined two new variables: tile_size, holding the width/height of tiles, and steps, with the amount of intermediate steps the hero has to make to cross from a tile to another.

If you are not familiar with tile crossing, refer to Create a Flash game like Rebuild Chile – Step 3: smooth movement.

So this is the first version of the script:

and this is the result…

As you can see I recreated the level you can see in the snapshot… I just added two walls to close the map since I don’t have doors yet. You can move the hero with arrow keys.

But… wait… in the original game you can’t move your hero… he runs straight until he hits a wall, then he turns right by 90° until he finds a walkable tile, and keeps on running.

So I have to code this kind of “artificial intelligence”. I need a variable to hold the current direction of the hero… let me call it walk_dir and let’s say it has four values:

0: left
1: up
2: right
3: down

So at the beginning, since the hero tries to run to the right, its starting value is 2, as you can see at line 16 of the following script:

There are no more keyboard listeners as I can’t control the hero with arrow keys, and the switch statement in the on_enter_frame function is no longer based upon the value of the last key pressed but the value of walk_dir variable.

Then, in walk function, if the player cannot move in the current direction, because he’s in front of a wall, I simply increase walk_dir value, setting it to zero if it reaches 4 (line 83).

This is the result:

As you can see, the hero runs according to the “turn right” rule I described before.

There is only one last issue left: in the frame in which the hero hits a wall, and walk_dir is increased, the hero stops for a frame for every wall he finds.

This means if the hero is going to the right and finds a wall, he stops for a frame while he turns by 90 degrees, facing down, and if he finds another wall and must turn by 90° again to face left, he loses another frame. If you look at the movie above, you will see a little pause before the hero turns.

I suppose this can be part of the gameplay, because in real world when an hero turns by 90 degrees he wastes a “turn”, but I don’t want my hero to do that.

So next step is using walk function in a recursive way modifying its arguments to make the hero turn right until he finds a walkable tile.

This may lead to an infinite loop if it’s trapped into some kind of “cage”, surrounded by walkable tiles, but I’ll show you how to prevent it later.

This is the new script:

I just modified a bit walk function to change its arguments and call it again in case the hero can’t walk, and here he is our hero turning smoothly:

Download the source code.

  • MC

    I like these tutorial posts :)

  • Me

    Nice one, thanks :)

  • Kaustav

    Hey Emanuele, i just found a really nice physics game that you might enjoy.

    Its called Gluey
    http://www.kongregate.com/games/KingDotCom/gluey

    Im not asking for a tut or anything, just thought you might enjoy the soft-body physics =)

  • Pingback: Create a Flash game like Talesworth – Step 2: Line of sight - Emanuele Feronato()

  • I see this series of tutorials will be very detailed, can’t wait to read them all! Thanks.

  • A very good tutorial, full of valuable information and experience what is most important.

  • Pingback: Create a Flash game like Talesworth – Step 3: The loot - Emanuele Feronato()

  • My son says he’s played this game before…. its okay, but it gets boring… and hard…. Maybe we can improve upon that

  • Orange

    i’m trying to take the first part out of the tutorial, so i can walk freely throughout, but whatever i do nothing shows up, i took the files directly out of the source coding and had just the fla, flash document, and the code but nothing showed up, i’m using flash cs4 if that helps, all the other work, but not the first, which just happens to be the one i want…

  • NoneOfYourBusiness

    Honestly your tutorials are flat out zero help, stop just posting the code why don’t you put some effort forth and actually explain things.

  • Ricky

    NoneOfYourBusiness, knock it off, lots of people appreciate these tutorials, don’t be a jerk.

  • Nice tutorial, but can you make some tutorial about board game like monopoly?

  • make an platform game tutorial

  • Dhaval

    Hi Emanuele,

    Thanks for sharing your procedure here. How would you edit your script to have keyboard input, so that if the block is moving right, and when I press the down arrow key, it will start moving downwards, if the downward path is a walkable path ?

  • kristian

    Great tut but I have a few questions :P

    1. what does it mean?

    if ((hero.x+hero.y)%tile_size==0 (especially that % – I couldn’t find it anywhere)

    2. Could you explain it in more detailed way please?

    if (hero_is_moving) {
    hero.x+=tile_size/steps*hero_x_dir;
    hero.y+=tile_size/steps*hero_y_dir;
    if ((hero.x+hero.y)%tile_size==0) {
    hero_is_moving=false;
    hero_pos[0]+=hero_x_dir;
    hero_pos[1]+=hero_y_dir;
    }
    }
    }
    function walk(px,py):void {
    if (map[hero_pos[1]+py][hero_pos[0]+px]==2) {
    hero_is_moving=true;
    hero_x_dir=px;
    hero_y_dir=py;

    Great job, cya ;)