Issue with recognision of gamequerry functions

[razvan393]

Hello!

I have followed with interest the tutorial at http://gamequeryjs.com/ Still I have dificulties to run my game altough I have thouroughly followed the instructions because functions like playground are not recognised. Is this a general problem? Can you help me with some suggestions?

Thanks!

[onaluf]

Hi!

The tutorial was written for an old version of gQ. This means that some of the API has changed since then. For a migration guide you can have a look at: http://gamequeryjs.com/documentation/migration-guide-to-0-4/ and http://gamequeryjs.com/documentation/migration-guide-to-0-6/ .

Sorry about that, I should really go and update it...

Cheers

[razvan393]

Thank you for your answer. I will have a look and hope it will work.

[razvan393]

Hello again!

After "cleaning" the code to be updated I have a problem with the fact that the solution below doesn't create the respective HTML elements: " $().playground().addGroup("background", { width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT }) .addSprite("background1", { animation: background1, width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT }) .end() .addGroup("actors", { width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT }) .addGroup("player1", { posx: 150, posy: PLAYGROUND_HEIGHT / 2, width: 100, height: 100 }) .addSprite("player1Right", { animation: player1Animation["right"], posx: 0, posy: 0, width: 100, height: 100 }) .addSprite("player1Left", { posx: 0, posy: 0, width: 100, height: 100 }) .addSprite("player1Up", { posx: 0, posy: 0, width: 100, height: 100 }) .addSprite("player1Down", { posx: 0, posy: 0, width: 100, height: 100 }) .end() .addGroup("player2", { posx: 600, posy: PLAYGROUND_HEIGHT / 2, width: 100, height: 100 }) .addSprite("player2Right", { posx: 0, posy: 0, width: 100, height: 100 }) .addSprite("player2Left", { animation: player2Animation["left"], posx: 0, posy: 0, width: 100, height: 100 }) .addSprite("player2Up", { posx: 0, posy: 0, width: 100, height: 100 }) .addSprite("player2Down", { posx: 0, posy: 0, width: 100, height: 100 }) .end() .end() .addGroup("player1MissileLayer", { width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT }).end() .addGroup("player2MissileLayer", { width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT }).end() .addGroup("overlay", { width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT }).end();"

Can you take a lot over it and tell me if I miss something?

Thanks a lot!

[onaluf]

I can see two possible problem: 1) first do you assign the playground to a DOM element ?

$(“#someId”).playground({...});

2) secondly do you start the game at some point ?

$(“#startbutton”).click(function(){
    $.playground().startGame();
})

or just

$.playground().startGame();

[razvan393]

This is the call for start: $("#startbutton").click(function () { $.playground().startGame(function () { $("#welcomeScreen").fadeTo(1000, 0, function () { $(this).remove(); }); }); });

Also I've a div with the id playground.

[razvan393]

The error I get is with: $("#player1")[0].player1 = new Player1($("#player1")); Because the DOM element player1 (the group in the comment above) doesn't appear to be created.

Thanks!

[onaluf]

Do you explicitly assign a div to the playground by calling :

$("#playground"). ...

Also in you first code extract you wrote:

$().playground().addGroup("background", { width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT })

Where you should do:

$.playground().addGroup(...)

For a working version of the tutorial you can have a look at https://github.com/onaluf/gameQuery/blob/master/demos/3/tutorial.js

[razvan393]

Thank you for assistance. Sorry for responding 4 years later :(