Breakout Game - need help

[Mike]

So I need your help to finish, and polish the Breakout game with Phaser.

 

http://mihail.ilinov.eu/games/PhaserBreakout/

In short i make it for this: http://city41.github.io/breakouts/

I've made like 50% i think, what's left is:

- Start, Game Over Screen
- Display Lives, Level, Score
- Display the Countdown
- Make powerups and powerdown fall from predefined random bricks (if you press "Z" you trigger the powerdown and paddle become smaller)
- All sound related (here i wait for final version of Phaser)


But there are some problems i met during the development:

- I think that justPressed and justReleased doesn't work as expected i tried fixed it but failed...
The problem is that even with one quick press, the update calls justPressed and execute code several times:

Just press "V" to spawn a ball.

Sam thing with "X" and "C" for switching levels, here i tried a bit hackish for me thing to set the duration as 22 ms... 11ms fails, and 44ms trigger multiple


- I don't quite understand the

paddle.immovable = true;

but as i tested and read from flixel without it collision goes nuts and don't do what "expected imho"
I'll be glad if Rich point me to some reading, or example

- Still think how to implement the different play states Start scree, Playing, and Game over


Here is the TS source:

http://mihail.ilinov.eu/games/PhaserBreakout/app.ts



Also I'll be happy if someone takes a time the restructure the game to not be in one big .js


And of course when this is finished it will be added to the Breakout projects, and i think it's going to be useful for all
new comers to Phaser
 

[rich]

Look at the "sprite align" test case code for a good example of how to react to a single mouse click. Basically you register a function to the input signal.

 

You'll need 'immovable' set to true, because if you don't when the ball and paddle collide they will exchange velocities and the paddle will fly off!

 

And oh man! That's hilarious when you press V and get like hundreds of balls all flying around

[Mike]

Ok, tnx for the info,

and anything about the game states ... ? i saw in the "Caveman Calamity" Hsaka use them... but its a bit more complex

and will be very nice to have an example for state (thre states, start screen, playing and game over )

 

First thing tomorrow morning is to try it cause I really want to finish this.

[rich]

States are pretty easy to implement really, there is a States folder in the Test Suite which shows how to use them from both JS and TS (you have to browse to the folder, it doesn't appear in via the index.php).

[Mike]

ОК it's weekend time so I can fiddle with this game and hopefully finish it.

 

In the moment there is something quite strange:

 

When the ball leaves the world area i have this check:

 

        if(ball.y > game.world.height) {

            ball.x = 120;

            ball.y = 240;

            ball.body.velocity.x = ballSpeed;

            ball.body.velocity.y = ballSpeed;

        }

 

And this way i restart the ball... but strangely if the paddle is situated at the same "x" coordinate the collision system fire a collision ...

I assume that maybe it's bug or I must somewhat "kill"/"make the sprite "dead" move it to the ,x,y coordinate and alive it again so this way no collision will be checked and performed

 

Check the console.log when the paddle is under the start point of the ball and when the ball goes to the bottom.

 

But still i didn't get the right way to do it I tried sprite.exists = false ...

 

End to be cool you can check the game and the source here:

http://mihail.ilinov.eu/games/PhaserBreakoutJS/

http://mihail.ilinov.eu/games/PhaserBreakoutJS/game.js

 

Also I'm using a custom Process function cause i want to implement a bit more complicated collision resolution.

Like if it hit the left part the balls goes to left, and vise versa also if it hit the paddle on the left/right vertical border if is the top half it counts as "save" but if it hits the bottom half the ball reflects and goes down and it's missed.

 

I already made some progress with the described collision logic in the older TS version here:

and now I'm going to improve it but still bump in some problems.

[rich]

I actually finished off the Breakout game in 1.0.5 to add scoring, lives, proper rebound, etc. So might be worth having a peek at that?

[Mike]

Yep, i already check the sample game,but my implementation has some differences like after the ball drops out I want to restart it and also i want to make my own collideCallback and processCallback (mostly to practice and understand deeper the collision logic).

 

Also I made a version with ball as single sprite just to check if it was sprite to group problem or sprite to sprite...

http://mihail.ilinov.eu/games/PhaserBreakoutJSSingleBallSprite/

 

also a screenshot if i didn't explain well before when problem arise:

 

And in sprite vs sprite the problem still persist, at the moment a localized it in the "separateY" function from this check:

 

this._result = (this.separateX(body1, body2) || this.separateY(body1, body2));

 

removing the second condition part and then there is no strane collision but of course there is no Y check then...

 

edit:

One more thing found, if I restart the ball before it reaches the bottom, for example 10px over the paddle, there is no collision problem.

My thoughts are that there is something wrong with the DeltaY, because after when the problem exist (when the ball pass the "y" cordinate of the paddle (when they are on absolutely different "x" cordinate) and ball.y is called then the ball.body deltaY is:

 

body2 delta = -206.9999999999709

 

and the paddle is

 

body1 delta = 0

 

... well I may be completely wrong also... but still that's what I know in the moment.

[rich]

Have you positioned your Group at all? I.e. by setting it to have an x/y other than zero? If so that is the issue (you can see it in the invaders demo, it highlights the quad tree bug I found).

[Mike]

Nope, I didn't set group x/y and in the second test I don't use a group at all, just two sprites paddle and ball.

 

Is it normal to have deltaY with negative value ?

[rich]

Yes of course

[Mike]

Ok here is the bug in his glory

 

http://mihail.ilinov.eu/games/phaser/examples/collision/sprite%20vs%20sprite-BUG.php

 

I used the sprite vs sprite example to reproduced it... and I'm still digging it...

 

edit:

 

And one more example with the modified quadtree example

 

http://mihail.ilinov.eu/games/phaser/examples/quadtree/quadtree2-BUG.php

 

EDIT:

Аll of this is fixed in Phaser 1.0.7