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.

Bejeweled AS3 engine with array rotation

Emanuele Feronato Actionscript 3, Flash, Game design

I wanted to have a look at a Bejeweled game featuring the 90 degrees array rotation I explained yesterday.

So I took the script made by Brook Jordan in the complete Bejeweled game in less than 2KB – legible version and added some quick and dirty code to make it work:

My code is written mainly at lines 197-218

To save coding time, I only rotate the two-dimensional array, then remove all jewels and recreate them in their new position.

This is the result:

I wonder if it could be interesting to create a real game out of it. Any idea?

No need to download anything, replace the source code of the original prototype with the one on this page.

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

Official Emanuele Feronato Facebook page

Official Emanuele Feronato Twitter account

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.

Comments 11

  1. junus

    I follow your blog more than 2 years, this blog inspire me for many games. I want to say just “thank you” :)

    Also, this game needs smooth collapse effect.

  2. Billy Bateman

    I was thinking about maybe doing a twister version of bejeweled. It would be something close to this, I like the concept of rotating the entire board, how about rotating rotating 4 gems to make a match, kinda what I was thinking. Love your site and love the demos.

  3. Pingback: Bejeweled AS3 engine with array rotation – Emanuele Feronato « eaflash

  4. saratogacoach

    Brilliant tutorial!

    Is there any way to center the gemCanvas (on a bigger,1024X768 stage) and have the selectorBox still work in the new location?

  5. RePlay


    What exactly does this line 80 do? I assumed that it moves down the gem that is located above the empty space so that the gem can replace the empty space.
    To test it, I comment it out but the game still works well.

Leave a Reply

Your email address will not be published. Required fields are marked *