The Phaser 3 Wishlist Thread :)

[DavidPesta]

I must say, I've become very impressed with the React/Flux paradigm. How well does Phaser 3 lend itself to that approach?

[rich]

I must say, I've become very impressed with the React/Flux paradigm. How well does Phaser 3 lend itself to that approach?

 

Could you try and sum that up in a paragraph please.

 

(although do remember what is good for web development doesn't naturally translate to game development, even if the platform is the same)

[DavidPesta]

Could you try and sum that up in a paragraph please.

 

(although do remember what is good for web development doesn't naturally translate to game development, even if the platform is the same)

 

ReactJS is an open source Facebook technology relatively new to the public that essentially guarantees a consistency in its component-based views given their current states of data regardless of what paths that may have brought them to that state. Because of the way the the technology works, it is impossible for the view to exist in some unlikely odd state as a result of some strange and hard to predict sequence of data state mutations along the path that got it there. That is the essential ingredient that is so appealing about this. They also make it very easy to define this consistent view rendering based on the data state using a declarative approach. As for Flux, it is not a framework as much as it is a one-way data flow architecture between user interaction (or other sources of change) and model updates so that large applications can be scaled in a way that prevents data states from being confusing and hard to reason about. It prevents the business level spaghetti from happening. I imagine Flux as something that would take place outside of Phaser 3 (you might correct me) in the same way that it takes place outside of ReactJS and is the developer's responsibility to provide that architecture. In practice, React and Flux are a natural fit for one another. Together, the data state is easy to reason about and there is an assurance that it is rendered correctly. Everything is component based and all of it is easily unit tested. The Facebook development team has been evangelizing these technologies ever since they open sourced them starting a few years ago. And now, very recently, they have released something called Relay, based on their GraphQL that they are using to replace REST. Very compelling stuff, but the main thing in all of this is ReactJS, because I think that may be what Phaser 3 is swapping out in this arrangement of technologies. However, you would know best what Phaser 3 provides in all this.

[jmp909]

Don't forget the loyal TS users who will suddenly have meaningless defs .

Not if you have new defs where events are Typed as well, AS3 does this. In fact it's the one place where objects make sense I think

doneClick(e:MouseEvent) { ... }

But Typing a GameParams object would seem pointless. I prefer passing params to constructors since I'm using Intellisense etc

[jmp909]

I'd quite like to see something like ColorMatrix / Filters applicable to BitmapData / RenderTextures as per here http://code.tutsplus.com/tutorials/quick-tip-add-a-blurry-trail-effect-to-your-bullets--active-11064

 

it might fix this issue.. but I'm not sure: http://www.html5gamedevs.com/topic/17676-double-buffered-rendertexture-trail-never-reaches-0-alpha/

 

Corona SDK shows the same issue using the same technique, so I can't tell if that Flash AS3 approach allows for something entirely different than just taking alpha'd snapshots, due to the way ColorMatrix works.. or whether it's down to clamping values internally

 

I think PIXI filters such as this were removed currently? I'm not sure if they were applicable to RenderTexture/BitmapData anyway?

 

but yes anything for fast rendering of bitmap effects (not just particles) would be good. (as discussed here http://www.html5gamedevs.com/topic/11783-phaser-3-development-log-we-jan-16th/?p=99666)

 

thanks

J

[Firenibbler]

I know this is a tall request, but this just feels more "Javascripty" to me, and I think it will be easier for new people to learn.

 

I wish the API looked more like this:

var text = new PHASER.Text({     x:0,     y:0,     text:"Hello World!",     style:"32px Arial"});game.addChild(text);

[jmp909]

I think Rich already stated he was against that (http://www.html5gamedevs.com/topic/7949-the-phaser-3-wishlist-thread/page-11#entry85038)

 

... anyway what would happen to my nice argument popup?

[MattMcFarland]

I would like to see some chaining:

 

var mySprite = game.add(etc).setAlpha(0.5).setScale(0.5).setShadow().doSomethingElse();

 

Really all that is needed is whenever you call a setter have it return the sprite itself, so the LHS can always be assigned.  

[MattMcFarland]

 

I know this is a tall request, but this just feels more "Javascripty" to me, and I think it will be easier for new people to learn.

 

I wish the API looked more like this:

var text = new PHASER.Text({     x:0,     y:0,     text:"Hello World!",     style:"32px Arial"});game.addChild(text);

 

 

Hey but something cooler would be:

 

var foo = PHASER.Text.extend({x:0,y:0,text:"Hello World!",style:"32px Arial"}, initialize: function () { console.log(text) });bar = new foo();

then when foo is made it logs the text.

not a real world example but there are lots of use cases. 

[jmp909]

It would be great to support more tilemap options... specifically allowing for larger images than the tile grid to allow for 2.5D maps.. and also hence support for the various rendering orders (Right Up, Right Down, Left Up, Left Down.. see my accompanying screenshot - using seancolumbo's tile design as an example)

 

the main issue I can see with this though is z-indexing, and presumably would need some fundamental changes to how tiles & sprites were rendered together

 

It's been discussed recently in various forms on the forums recently so I thought I'd add it here.

 

(although if the new renderer improves sprite performance i guess we could use createFromObjects for tiles needing z-sorting?)

 

 

thanks

J

 

[image credit: SeanColumbo, Danc's PlanetCute]

 

forum references:

2D Side Scroller with Fake Depth http://www.html5gamedevs.com/topic/17900-2d-side-scroller-with-fake-depth/

Tile layer z-index issue http://www.html5gamedevs.com/topic/18122-tilelayer-z-index-issue/

Rendering order/tilemaps http://www.html5gamedevs.com/topic/1488-rendering-ordertilemaps/

[nogridbag]

Hi all, I'm new to Phaser. Right now I'm creating a small mini game in ES6 with Phaser (using Babel) and code-wise it's working flawlessly. I would imagine this works out of the box due to how Phaser was written as far as using prototypes. Has there been any architectural changes in Phaser 3 that would make it incompatible with ES6 classes?

[rich]

Phaser 3 is written entirely in ES6, so no, it won't be incompatible in that sense.

[nogridbag]

Awesome, thanks. Loving phaser thus far.

[jmp909]

any chance we might see support for rectangles, ellipses and triangles from Tiled object layers? currently only polylines seem to be parsed. 

 

(update: sorry, it seems the code is there in https://github.com/photonstorm/phaser/blob/master/src/tilemap/TilemapParser.js but it is not working due to being absent from https://github.com/photonstorm/phaser/blob/master/src/physics/p2/World.js#L1651 .... i'll raise an issue https://github.com/photonstorm/phaser/issues/2182)

[jasonb]

I had a dream, where Richard was on an webcam telling the FGL team that Phaser 3 might be out by years end!

 

*Crossing fingers dream comes true* muhahahahaha:)

[WombatTurkey]

Similar system to D3.js's forced layout that works inside Phaser 

[jclamap]

To align with SOLID principles, I think Phaser should have a dependency injection mechanism like Angular 2. (more or less). I miss ir when I work with Phaser 2.

 

I have been viewing how implement it in Phaser 2 and this is a tiny and stupid example:

 

Phaser.js Line 28780   add method of StateManager.

add: function (key, state, autoStart) {//...}

We can change its signature to add a new parameter called "dependencies" (array)

add: function (key, state, autoStart, dependencies) { //..}

These dependencies can be injected through class constructor here:

 

     else if (typeof state === 'function')        {// Iterate dependencies            newState = new state(this.game);        }

Phaser.d.ts

add(key: string, state: any, autoStart?: boolean, dependencies?:any[]): void;

Dependencies should be singletons, so, before inject them, Phaser must check if they are instantited. (implement example)

// An object can save instances. constructor name can be used like index

var realDependencies = []for (var i = 0; i < dependencies.length; ++i ){var depen = dependencies[i];var className = /* Extract class name from prototype.constructor with a regexp */if (!dependenciesObject.hasOwnProperty(className)){dependenciesObject[className] =  new depen();}realDependencies.push(dependenciesObject[className])}else if (typeof state === 'function') { // Iterate realDependencies to pass as arguments to constructor newState = new state(this.game); }

 

So, our code can result (TS):

class Service{}this.game.states.add("Play", Play, false, [Service])class Play extends Phaser.State{constructor(public game: Phaser.Game, private service : Service)super(game)}

We can think about it and you can say me: Wait a moment, you can add a instance as state, so you could do this:

this.game.state.add("Boot",new Boot(/*dependencies*/));

Yeah, we can, but this is the other thing I wanted to comment. I think its much cleaner if we use classes, singletons. Because this way we have to do this:

this.game.state.add("Boot",new Boot(Service.getInstance()));

And force to programmer to implement a Singleton on every class that he uses like dependency.

 

 

The other way (or antother wat, simply) It would be inject through Game to include all states:

new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update, render: render }, [dependencies]);

Sorry. My english is not good. I expect you can understand what I am trying to tell you. Sorry if code has errors, too.

 

 

mechanism

[ekeimaja]

Not sure if somebody is already asked this.

 

PLEASE make overlap collision check to p2 physics! CollisionGroups does not fit to all kind of types of games!

 

By far I have not any positive to say about P2 collision checks.

[jmp909]

@ekeimaja, p2 overlap can already be done using a body's shape as a sensor or by using setPostBroadphaseCallback

http://www.html5gamedevs.com/topic/18375-is-object-in-zone/

[jmp909]

camera lag option would be nice.. eg if my sprite is moving around quickly, have the camera slowly pan to it (configurable time) rather than update straight away.

 

they have it in here

https://forums.coronalabs.com/topic/42355-dusk-engine/page-3

map.setCameraFocus(player)map.setTrackingLevel(0.1)

map.setTrackingLevel() sets the "fluidity" of the camera. That's the measure of how "smooth" the camera's tracking is. Try playing around with it in the sample and seeing the result. Higher values (those approaching 1.0) make the camera more rigid and tight, while lower values (approaching 0.0) make the camera slower and more "buttery".

 

i guess it's probably something we could override & implement ourselves somehow though.

 

thanks

j

[mtmckenna]

Here's another vote for promises! I think it'd be handy to chain tweens with promises:

this.game.add.tween(this.player).to({ x: '+1', y: '+2' }).then((tween) => { return tween.to({ x: '+10', y: '+2' }); });

[jmp909]

Something akin to Greensock's timeline might be useful there. A neat way of Asynchronous chaining has come up a bit recently

I don't know how well it currently integrates with Phaser though

https://greensock.com/timelinemax

[rich]

I will absolutely be making it easier to use GSAP in your games, and have some work on this and chatted to Jack at Greensock about it. The issue with GSAP is that I cannot (and don't want) to tightly bind it into Phaser 3 because of the license issues - but I will be making it much easier to use for those of you who have paid for a GSAP license, or don't fall under its terms.

[jmp909]

I think if the Phaser tween manager chain function returns the chain, rather than the initial tween, and exposes onStart, onUpdate (with cursor/step/index parameter in callback) and onComplete events for the chain, that would solve a lot of people's basic issues? Without getting into a full timeline implementation . Chained events presumably need not be on the same object , as it is currently anyway. That could be done by multiple .to().to() ...umm... chains. It's not far off the current implementation.. It just gives a few more options that are currently assumed but missing.

There's been some talk of promises, but I assume that would be for more complex setups than above (and likely slower?)

[anaibol]

Hi, I was thinking that tile based movement would be an improvement to manage easily movement in games where the movement of a player is in a grid of tiles.