Jump to content

Help I m lost in my code [Bejeweled like]


Recommended Posts

Hello everyone

I m an Phaser newbie. I m discovering day by day the possibilities offered by the Phaser engine. My project that I m building currently is an Bejeweled like but it lacks of animation for the moment.
I can't manage to implement the animations of the blocks/tiles before destroying them when there is a match of same block type. I would like to share the project with you and get some insights on my code.

I cant find ways to refactor my code. Adding animations seems impossible at this stage. I tried several stuff but because of how I build up my game, it just loop endlessely.
You can find my project joined in description. 

Here is what I m currently doing ( or thinking doing )

  • Load several stages
  • Once in the playStage, initiate a grid of X*X tiles
  • For each spot, generate a Tile. A tile is a random selected sprite with input option. it is saved in an multidimesional array to find it back.
  • While thereAreChangesInTheGrid(Deletion, adding or moving tiles) we are going to check for possible matches in the grid
  • Checkmatches does the following: Iterate over the whole grid, pushing each tile to a sameColorBlocks array. Why? Because each block is a potential match.
    While iterating over the grid, each spot needs to check if there are same color neighbhours around him. If the computer found a neighbhour, propagate the search to this new neighbhour. That one is pushed to the sameColorBlocks array.
  • Still in checkMatches; after doing the propagateSearch, we have found all possible color neighbhours. If there are more then 3( could be any value) We delete them. It is a match.
  • To delete a tile. Iterate over the whole grid and find the tile corresponding to the sameColorBlockArray. 
  • Once we found all matching colors we can execute TileDown(). TileDown can do two things. Push a tile down or generating a new one depending on his situation in the grid
  • If we did all this do checkmatches again. Else there is no more matches so we can go out of the loop
  • Score is being updated

Next part of the game in development is the switchBlock functionality. it is still not finished but it does the job.


How I see it is adding the fade out animations in the deleteTileFromTileGrid() function. 

                                alpha: 0
                            }, 1000, Phaser.Easing.Linear.None, true, 0, 1000, true);

While this animation is going on, I delay the destroying and nullyfing of the tile in the tileGrid with something like

game.time.events.add(Phaser.Timer.SECOND * 1, this.destroyThis, this, theTile);

destroyThis: function (theTile) {


The game.time.method.... would be executed in the deleteTileFromTileGrid function.  But I think I m having issues in other functions like checkMatches() because they are running a Do while loop, looking for changes in the grid (deletion/adding/moving in the grid).

Like I said, I would like to get some insights on my code because Im getting frustrated as hell the way I organized my code but I dont know where to start. Also, where would you place the animations? It seems the impossible step to achieve because of the way I coded this project.

The play.js file can you find here 

https://gist.github.com/anonymous/2bf44e5009edc0bc83ae all the other files are in the zip

Thanks guys







Link to comment
Share on other sites

I'm pretty noob with Phaser also, I'd say we have +- the same experience and for disclosure, I haven't checked your source code.

Given this, here are my two cents.

Use the onComplete callback, instead of a timer.

Also, I'd add a propriety to each tile upon creation (tile.alive = true), change it to false when the combo is done and use an if condition (if(tile.alive)) in helper functions like checkMatches() etc.


Hope it helps!

Link to comment
Share on other sites


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...