Panda.js 1.14.0 development

[enpu]

I'm posting here some updates on Panda.js 1.14.0 development.

 

I have rewritten the whole system module to make it more clearer.

You can test it already from develop branch:

https://github.com/ekelokorpi/panda.js/tree/develop

 

There are now three system attributes:

 

center - Position canvas to center of window.

resize - Resize canvas to fill window.

scale - Scale canvas to fit window.

 

They can be configured from config.js file, like all class attributes:

pandaConfig = {    system: {        center: true,        resize: false,        scale: false    }}

You can combine them anyway you want, giving you 6 different combinations:

 

1. All disabled

 

 

2. Only center enabled

 

 

3. Only scale enabled

 

 

4. Only resize enabled

 

 

5. Center and scale enabled

 

 

6. Scale and resize enabled

 

 

Everything should be working exactly same on mobile and desktop.

 

How do you like it, does that make sense to you?

[icp]

This is great ! I really need the resize property! But right now 

pandaConfig = {	system : {	width : window.innerWidth,        height: window.innerHeight			}};

works fine.

[enpu]

Yep that works, but if you resize your window or go to fullscreen it wont work anymore.

[icp]

Take a look here http://html5gamedevs.com/topic/12563-touchmove/ .

You should add crossplatform controls , so mousedown and mousemove would do the same as touchdown and touchmove , without worries for developer .

[enpu]

You can already bind mouse and touch events into same function.

game.createClass('Example', {    init: function() {        this.sprite = new game.Sprite('example.png');        this.sprite.interactive = true;        this.sprite.mousedown = this.sprite.touchstart = this.mousedown.bind(this);        this.sprite.addTo(game.scene.stage);    },    mousedown: function(event) {        // This is called for both mouse and touch events    }});

[Ninjadoodle]

Hi @enpu

 

This is really amazing! I'm really happy these features have been added, so thank you

 

Panda is such an awesome framework!!

[icp]

 

You can already bind mouse and touch events into same function.

game.createClass('Example', {    init: function() {        this.sprite = new game.Sprite('example.png');        this.sprite.interactive = true;        this.sprite.mousedown = this.sprite.touchstart = this.mousedown.bind(this);        this.sprite.addTo(game.scene.stage);    },    mousedown: function(event) {        // This is called for both mouse and touch events    }});

Are you sure it does work well with graphics class too, not only sprite class?

[SkyzohKey]

Panda is the best ! http://prototype.blobswar.thanoss.fr/dev.html

[PixelPicoSean]

Now it's such easy to manage canvas scaling, thank you so much @enpu.

[Ninjadoodle]

Hi @enpu

 

Couple of things I've noticed ...

 

1. Resize doesn't work properly with 'hires' specified.

2. Everything is animating really fast, maybe double speed.

[enpu]

Thanks for the info, will take a look on those!

[enpu]

@Ninjadoodle

 

Can you test again? Resize should be now working correctly on hires mode.

[Ninjadoodle]

Hi @enpu

 

I'm now getting lots of other errors (these don't happen with the current master) ...

 

There seems to be a 'storage' issue and a 'font' problem.

 

I'm also using the same config file as before and getting errors by default.

 

I tested with both the master and the new develop and I'm only getting these errors with 'develop'.

Also these errors did not pop up with the previous 'develop', if that makes things easier.

 

[Error] SyntaxError: Unexpected identifier 'center'. Expected '}' to end a object literal.

(anonymous function) (config.js, line 21)

 

[Error] TypeError: null is not an object (evaluating 'game.storage.get')

init (main.js, line 34)

Class (core.js, line 964)

_setSceneNow (system.js, line 319)

_setSceneNow (debug.js, line 319)

(anonymous function) (core.js, line 987)

setScene (system.js, line 425)

_onLoaded (core.js, line 696)

(anonymous function) (core.js, line 435)

ready (loader.js, line 173)

update (loader.js, line 204)

run (loader.js, line 193)

(anonymous function) (core.js, line 435)

animate (core.js, line 341)

[enpu]

I think i'm getting rid of that _super function name now, thinking to rename it to just super or parent. What do you think?

(It was named _super because old Android 2.x browsers did not work at all if there was any function named super)

 

I think parent would be more clearer name, but then there is also parent variable on Pixi display objects.

[drhayes]

+1 for super.

[Ninjadoodle]

super sounds good to me too and will help avoid conflicts with Pixi.

[Neso]

Hmm I would support staying with the same interface. The biggest reason being that pandajs won't be used in large projects until interfaces are stable and changing some integral part destroys backward compatibility. Therefore, I would suggest keeping the same interface as it was initially set. Unless there is bigger architectural requirement for the change. As this is not the case. I would stick with _super.

 

Which gets me to another point. I was considering using panda in our projects. But I guess until core parts are stable I am to stick with pixijs.

 

So @enpu is there a planned lts version or something along those lines?

[PixelPicoSean]

+1 for super

 

Will that bring problems since more ES6 support are coming to browsers?