#### Create HTML5 Vertical Endless Runner cross platform games

##### Using Phaser framework and other FREE software
Endless runner games are gaining more and more popularity and they are really easy to code.
I will take you by hand through the creation of a complete HTML5 vertical endless runner cross platform game with a lot of features and room for customization.
100 pages + 31 source code examples with a free update to come in a few days.

# Hex maps creation and rollover

Emanuele Feronato

This is just a quick, uncommented snippet of code I made starting from Coordinates in Hexagon-Based Tile Maps tutorial I found at GameDev.net.

The article does not cover all hex maps, just horizontal ones. Read Understanding hexagonal tiles to know something more about hex maps.

Also, the pseudo code shown in the article has some errors, but I finally managed to have a working, full math hex maps creation and rollover.

No line comments at the moment as said, because I still have to optimize the code and write the routine to generate vertical hex maps, meanwhile take a look at it:

And see how does it work

###### Stay up to date
Follow me on the social networks and never miss a post.

#### From null to full HTML5 cross platform game

I will take you by hand from the bare bones of JavaScript programming through the creation of a full cross platform HTML5 game, with detailed explainations and source code.

If you don't know where to start, then From null to full HTML5 cross platform game is the book for you.

1. Prankard

Not sure how on earth to contact you.
I’ve converted this to AS3 code quickly (I like AS3), if you want me to email it to you I’ve left my email here so you can contact.

Some nice code, I’d like to interoperate it into a game in the future for a turn based strategy game.

1. Alx

for (x=0; x<grid_x_size; x++) {
for (y=0; y<grid_y_size; y++) {
hexagon_x_position = hexagon_width*x+(y%2)*hexagon_width/2;
hexagon_y_position = hexagon_height*y/4*3;
hexagon_number = x+y*grid_x_size;
hexagon_movieclip = attachMovie("hhexagon", "hhexagon_"+hexagon_number, hexagon_number, {_x:hexagon_x_position, _y:hexagon_y_position});
hexagon_movieclip.gotoAndStop(1);
hexagon_movieclip.txt.text = hexagon_number;
}
}
This cicle do the work. It is creating a virtual tile params, like hexagon X and Y positions, number of tile on the map, and attach movieclip from library with a tile image/animation, assigning to it all virtual params. Only thing i'm couldn't tell surelly is does "hexagon_movieclip" array, object, or just a temporal variable with movieclip pointer. Since it's not appear in further code, i'm suggest it's just temporal.

2. Alx