Bug while setting dynamic TileMap out of the playground

Freezystem

Hi everybody!

Excuse me for my english cause it's not my native language.

So, it's a bit diffucult to explain me and I think a exemple will better show what I try to mean.

I host my game on my personal website to allows you to understand my problem.

You can see a teaser of my game HERE

Actually, everything seems to work perfectly... BUT if we keep looking to animated flower and grass we will easily notice that the second generated tilemap (that one who is generated outside of screen at the beginning) is not moving.

I think it's may be a bug that why i'm notifying it to you.

Is there no solution or did I mess somewhere..?

Thanks in advance for your consideration.

Freezystem.

selim

There is an optimisation where tiles that are not visible are not animated. This could be the source of the bug, I will investigate and keep you posted!

Freezystem

thanxs a lot for the quick response, if you need some help i'm here =)

selim

Et si c'est plus facile pour toi de t'exprimer en français, n'hesite pas :) !

Freezystem

Haha merci bien! =)

Freezystem

i'm a bit confused..

why this doesn't work :

$.playground.addGroup("bg",{...})
	.addTilemap("t1",{...})
	.addTilemap("t2",{...}).end();

Instead I have to do something like this :

$.playground.addGroup("bg",{...})
	.addTilemap("t1",{...}).end();
 
$("#bg").addTilemap("t2",{...}).end();

It works but it's a bit less readable. Is there a solution for that..?

Regards.

selim

Well it's an API choice, The idea being that tile map behave like groups because they are more likely to hold sub elements (for example simple sprites to decorate the maps). That could be changed but I still thinks it makes sense.

Furthermore the first code you gave should work. The only limitation is that the outside of the 'parent' tile map is not visible since it's defined as 'overflow: hidden'. But you can change that with

$("#myTilemap").css("overflow", "display")

But that defies the purpose...

Freezystem

Well, it's good to know! =)

So if I correctly understand a Tilemap is declarable without a Group?

Thanks again for these explanations !

selim

You never really need a group. it's just a convenient way to move many object at the same time, create a clipping zone or optimize collision detection. Your tile maps and sprite can all be added directly to the playground.

selim

Ok I think I found where the problem comes from but it will require some refactoring... I should be able to publish a fix tomorrow.

The good news is that ther isn't anything wrong in your code and the API won't change :)

selim

I think I fixed this issue, could you take the last version from GitHub and test it?

Freezystem

Of course!

I'm on it! I'll post an answer in a few moments!

Freezystem

I have done some quick tests based on my current work and it don't seems to work perfectly.

You can see the result HERE

Maybe i do something wrong but I don't see what if it the case.

this.play.addGroup("background",{"width":GAME_WIDTH,"height":GAME_HEIGHT,overflow:"hidden"})
            .addTilemap("floor1", this.tiles.Floor, this.map,
            {
                width: FLOOR_WIDTH,
                height: FLOOR_HEIGHT,
                sizex: 20,
                sizey: 3,
                posx: 0,
                posy: GAME_HEIGHT - (FLOOR_HEIGHT*3 + WATER_HEIGHT*4)
            })
            .addTilemap("floor2", this.tiles.Floor, this.map,
            {
                width: FLOOR_WIDTH,
                height: FLOOR_HEIGHT,
                sizex: 20,
                sizey: 3,
                posx: GAME_WIDTH,
                posy: GAME_HEIGHT - (FLOOR_HEIGHT*3 + WATER_HEIGHT*4)
            }).end();

I'm sorry but I don't know how to post the code like you do.

selim

You should call .end() after the .addTilemap() and see how it goes.

Freezystem

you can see my former code with your revision version HERE

tiles don't animate themselves by the way.

selim

Ok I see what the problem is :) I will work on it and keep you posted !

Freezystem

Thank you a lot to working hard on it =)

I'm a bit ill-at-ease to impose you that work.. =/

selim

In the mean time I found an error in your code. You use .css("left"....) to move the groups/ tile maps around. This isn't allowed anymore in gQ 0.6 (though it was the only way with older version). For you code to work in when I'll release a fix you should use .x() .y() aso like explained in the migration guide.

Freezystem

My bad, I was using the first tutorial as guide through my discovery of the GameQuery Framework.

I didn't even notice that it was not updated since version 0.6.

=/ I'm ready this as quick as possible and I'll modify my code in function.

I'll keep you posted.

selim

I just pushed a new fix. Does it do the trick?

selim

And I'm glad to have some feedback so that I can fix those bugs :)!

Freezystem

I'm currently fixing my code but it 's works like a charm! =)

I'll post it as soon as it will be released

Freezystem

Animated tilesmap works as we can notice HERE

It maybe reveal a new bug.

We can notice that animated tilesmaps are stoping there animation randomly when you click a couple of times on PLAY/PAUSE.

And there is another bug with the animations. In order to notice it you've got to be lucky always pressing PLAY/PAUSE buttons quickly.

The rabbit currently using 2 images when he is stopped. sometimes the images displayed is that one I used for the jump animation. According that all images are on the same sprite.
I think there is a shift at this moment.

I'll try to explain me better :

this is my sprite sheet :

the animation of stopped rabbit is build with the two last frames of this spritesheet as is it written in my code :

bunnyIdle : new $.gameQuery.Animation(
            {
                imageURL: IMG_PATH+"bunny.png",
                numberOfFrame: 2,
                delta: BUNNY_WIDTH,
                rate: 2000,
                type: $.gameQuery.ANIMATION_HORIZONTAL,
                offsetx:128
            })

for an unknown reason sometimes the 4th frame is shown while the rabbit is stopped with a quick PLAY/PAUSE click.

selim

Wow that one was tricky ;) but it should be fixed on the last version from GitHub! Tell me if it works.

p.s. If you want to display you code nicely you can simply switch to the markup mode (with the last button from the toolbar) and surround it with <pre lang='Javascript'></pre>

Freezystem

I re-edit all my former posts for the channel to be more readable.

Your new revision code remove the problem of the wrong animated frame that was displayed instead of an other.

But some animations are still stoping randomly.

The result is always on the same page I gave above. =)

selim

Hi! Could you try the last revision from GitHub to see if it solve the glitches with animations ?

Freezystem

It's working perfectly! =D

selim

Nice, thanks for the feedback!

Freezystem

Thanks for the support! =)

Howdy, Stranger!

Categories