Match 3 Bejeweled HTML5 prototype made with Phaser – detecting combos

The Bejeweled prototype made with Phaser gets a new update with a new feature.

Last time I showed you how to suggest moves and now it’s time to reward matches of four jewels by removing the entire row or column, and to reward match of five jewels by removing all jewels with the same color as matched jewels.

Have a look and try to do some four or five jewels long matches.

Do you want to see how you can do this? Have a look at the source code, I highlighted the lines of code added since the previous version.

We are about to have a complete Bejeweled prototype, next time we’ll see how to detect multiple matches, meanwhile you can get the source code of the full project.

  • This is a totally awesome tutorial! I downloaded the source code and made some modifications. I started by changing the sprite sheet. I also increased the field size and used a couple lines of code from your dungeon raid game to scale the graphics and make selecting the jewels more precise. My sprites are grayscale, so I used Phaser’s tint property to randomly color them when they are created. This is really cool to look at, but makes it very difficult to find matches. I have a few questions which will greatly improve my game when implemented.

    1. I have an array of a dozen colors I used to tint my sprites. How would I choose seven out of the array?
    2. After these colors have been chosen, how would I assign them to a specific frame in my sprite sheet?

    I am still a beginner at game programming, so it would be a great help if you would please tell me where and in which functions my answers should be in? Than

    I look forward to seeing more of your Phaser tutorials!