Essentials plugin

[enpu]

Just released new Essentials plugin.

It contains essential classes needed in most games. Like buttons, animated text etc. I will keep updating it with more elements.

Preview: https://www.panda2.io/plugins/essentials

Documentation: https://www.panda2.io/plugins/essentials/docs

Download: https://www.panda2.io/plugins

[Ninjadoodle]

Hi @enpu

This is a REALLY awesome idea! Do you mind if we post some suggestions?

[enpu]

@Ninjadoodle Of course i don't mind

[Ninjadoodle]

@enpu

Awesome! I'm gonna start with a few and add more when I think of them - I LOVE this idea (it will help keep our code free of any unnecessary / repeating stuff).

- Basic Transitions (Fade In/Out (with color options?) + other simple transitions if possible.

- Shake Screen Effect + Shake Sprite Effect

- Flash Sprite On / Off (Visible/Invisible)

- More Animated Text Styles

- An Overlay / Popup class for Messages / Menus

- Flash Sprite (Color Options) and tween back to normal

- Anchor to Screen would be awesome (eg Top Left etc.)

Thanks for the cool plugin!

 

[enpu]

1.1.0 released

• Added CircleText class
• Added Fader class

Demo: https://www.panda2.io/plugins/essentials

[Ninjadoodle]

Hi @enpu

I really like the idea of this plugin and I was just wondering whether additions like 'screen shake', 'flash sprite on/off'' and 'flash sprite white and fade back to normal' are possible.

I currently have all of the above working in my game, but it would be awesome to have an official plugin with all these bits and pieces

I think with enough time, this could become a really cool library,  similar to behaviors in Construct 2/3.

Keep up the good work, Panda 2 is looking really awesome!

Thanks

[enpu]

@Ninjadoodle

Sure those would be absolutely possible to add. Will put them on my list and get them done when i got time on this one.

Currently working on Mobile Ads plugin.

[Ninjadoodle]

Hi @enpu

Awesome, no hurry - just wanted to know whether it’s something you’d be happy to add. Wicked about the ads plugin, can’t wait

Thanks again!

[enpu]

Essentials plugin 1.2.0 released

• Added shake function to Container
• Added flash function to Sprite

Download: https://www.panda2.io/plugins
Documentation: https://www.panda2.io/plugins/essentials/docs

Note that there is new scene in the example project to show how those new functions work.

What else would you like to see on Essentials?

[Ninjadoodle]

Hi @enpu

Awesome, love these additions! Thanks heaps

You asked what else we would like to see, so I think these would be really useful ...

- Flash sprite visible/invisible

- Some non physics hittests ( eg. Circle against rotating rectangle )

- More various text animations

Thanks again for the awesomeness!

[Ninjadoodle]

Hi @enpu

I've noticed that with the new Flash function, a Flash wont start until a previous one has been completed.

Is there any way to include a flag where every time a tap a sprite, it will start a new Flash / override the old one, even if it hasn't finished?

Thanks heaps

PS. Both the new functions are fantastic - love them!

[enpu]

@Ninjadoodle

Sorry that was a small bug in the code, should be now fixed!

Thanks for letting me know.

[pstrejczek]

Hi @enpu

Thanks for the container shake - it is awesome!

What I think could be useful as part of the essential plugin:

Actually, a great example of an essential set of features is Flixel Power Tools for old Flash Flixel game engine http://www.photonstorm.com/flixel-power-tools. Some of the features from this set we already have, but it would be great to have some more of them. 

- Very simple collisions when no physics is used, or you use your own simple physics. I have coded myself some simple collisions for my game, but it would be awesome to have circle and rectangle collisions in all combinations in the plugin.

- Pixel perfect collision would be a nice addon. Also, most of the functions like in old FlxVelocity would be great: http://www.photonstorm.com/flixel-power-tools/flxvelocity

 

- Maybe a customizable bar? Like in fpt http://www.photonstorm.com/flixel-power-tools/flxbar

 

And one more thing, which is not plugin related but I think could be useful. Would it be possible to add some kind of watch table to the debugger? I mean, you could add some variables with some function in the code and the variables values would be shown somewhere in the debugger on the game window. I know you can do this with console output, but sometimes it is useful to have some variables shown in the game window when you prototype features.

And also about 3D. There is Three.js plugin which works nice - I have done some simple testing, but how about a babylon.js plugin? Would it be even possible?
 

[enpu]

@pstrejczek

Thanks for all the suggestions!

I'm not sure if it's possible to use Babylon.js as a plugin in Panda 2, but i will take a look.

There is now new static updatePanel function in Debug class, which allows you to modify the content of the debug panel. You can insert text or any variables etc there:

https://www.panda2.io/examples#debug-updatePanel

 

 

[Ninjadoodle]

Hi @enpu - the new debug panel function is awesome! Thanks for the addition.

I just thought of one other feature for essentials that would be really cool.

In Construct, there is a behaviour called ‘anchor’, which lets you anchor objects to the extremities of the screen.

You can for example anchor something to the top left of the screen and it will stay there no matter what the screen size is.

Some of the options are top center / left / right and same for the bottom.

Maybe this would be possible in Panda?

[pstrejczek]

Thanks @enpu !

The debug instant variable update is awesome. This will help me a lot with the game I am working on .. I just need to get to work :).

@Ninjadoodle This is very easy to be done just with coordinates for the container. You have game.width and game.height which you can use and should be independent of the screen size.

[Ninjadoodle]

Hi @pstrejczek 

You're right, it should be pretty straight forward and I do have a version working, but it seems to be quite messy and I feel like there might be a better way.

I think in my case it gets a little complicated because I'm centering my containers and using 'resize'.

I think it would be quite nice to have something along the lines of - sprite.align('topRight'); This would be really useful for menu / UI items etc.

This might be difficult for @enpu to do however, as he doesn't know whether my sprite is inside a container and how that container is being positioned.

 

 

[enpu]

@Ninjadoodle @pstrejczek

That really would be useful only when using 'resize' on desktop, so it's a pretty specific situation.

 

[Ninjadoodle]

@enpu - It is a bit of a special case one  I'll see if I can tidy up my code a bit lol.

[enpu]

Essentials plugin updated to 1.3.0 version: https://www.panda2.io/plugins#essentials

• Added blink function to Sprite

Example usage:

// Blink sprite 4 times with speed of 200ms
sprite.blink(200, 4, function() {
    console.log('Blink ended');
});

[Ninjadoodle]

@enpu - Yay! Thank you!!

[greencoder]

Can the buttons created with essentials be manually scaled with x and y?

 

 

Edited December 21, 2019 by greencoder

[Stephan]

yes you can:

 

var button = new game.Button('button.png', game.width / 2, 120, function() {
    console.log('Button clicked');
});
button.rotate(true);
button.addTo(this.stage);
var text = new game.Text('Button');
text.x = game.width / 2 - text.width / 2;
text.y = 20;
text.addTo(this.stage);

//scale the button up
button.sprite.scale.set(2, 2)

//make sure this one is disabled!!!!
//button.scaleIn();