Call a function in a class when another event in another class occurs

[Batzi]

So I have 2 classes. A & B.

 

When a specific event occurs in A, a method in B is called.

 

I don't want to create objects in the classes.

 

How else would you do it?

[jmp909]

Can you create a global object (on window?) and then use signal listener/dispatcher ?

Do either A or B know about the existence of the other?

[Skeptron]

You can make a static call from A to B. But a better design would be, to reduce coupling, to have a third object C in between. Which would watch A and trigger B's function if the event happens.

[jmp909]

here's Robert Penner's Hello World example converted to Phaser Signals (which are based on his AS3 implementation)

 

each listener needs to have the event added to it

http://phaser.io/sandbox/UebplvlN/play

 

here's a version with a dependency.. each listener listens to changes to the source passed to it 

http://phaser.io/sandbox/ucSrfKTK/play

 

and another version with multiple listeners and multiple sources

http://phaser.io/sandbox/eDwJiBiF/play

 

(they're mostly the same, I'm just constructing them a little differently)

[Batzi]

Can you create a global object (on window?) and then use signal listener/dispatcher ?

Do either A or B know about the existence of the other?

A doens't know B exists and vice versa.

 

So if I want to use signals. Who should do the dispatch? A does it? B is the listener in this case?

[drhayes]

There's a concept called a message bus that you might want to look into. It abstracts the notion of publishers and subscribers away from each other, just like you're describing. In your case, it would introduce a third class, C. C is the message bus.

 

A drops a message onto the bus and goes on with its life. It doesn't care who's listening.

 

B subscribes to certain kinds of messages. It doesn't know where they came from.

 

One way to do this in Phaser is to create a global-ish class with Signals on it. Whether the bus dispatches the signals itself or relies on callers to do it doesn't much matter. B can subscribe to any events it cares about on the bus, C. A can then dispatch those events.

[jmp909]

i've sort of implemented that here @drhayes

http://phaser.io/sandbox/jzXVruNI/play

 

it's not that well thought out, but demonstrates some of the concept anyway

 

essentially... none of the objects know about each other.. only the messageBus (controller) understands the system. the other objects only know what events they can tell the bus/controller.

 

it seems daft at first since you've written it all you know what objects do what. but when the system grows it's easier to manage what reacts to what (theoretically)

 

of course you can switch it around and make objects both dispatchers *and* receivers, which in some circumstances probably makes more sense

 

 

 

 

 

j

[drhayes]

Yeah, like that. ( =

 

I like the explicitness of the Phaser signals a lot. Other JS message bus implementations that I've seen dispatch on a string type and rely on the consumers to "know" what types are out there.

[jmp909]

Need to do a better structured example really. I tend to mix up signals as "do" commands and signals as "did" events without a clear naming format. And often I'm using them where you could probably just do a straight function call on a dependency. Feel free to contribute an example

[Batzi]

i've sort of implemented that here @drhayes

http://phaser.io/sandbox/jzXVruNI/play

 

it's not that well thought out, but demonstrates some of the concept anyway

 

essentially... none of the objects know about each other.. only the messageBus (controller) understands the system. the other objects only know what events they can tell the bus/controller.

 

it seems daft at first since you've written it all you know what objects do what. but when the system grows it's easier to manage what reacts to what (theoretically)

 

of course you can switch it around and make objects both dispatchers *and* receivers, which in some circumstances probably makes more sense

 

 

 

 

 

j

Ok so I get what you're doing in that example however I am using classes and passing parameters through constructors and I am not sure if signals still work the way you wrote it.

 

Here's an example:

class A{constructor(x,y,z){this.x = x;this.y = y;this.z = z;}function buyItem(item){//code for item purchasing goes herevar objectC = new C();objectC.totalItemBoughtCount(item);<DISPATCH TO C>....dispatch('hi C, I added an item');}}class B{constructor(x,y,z){this.x = x;this.y = y;this.z = z;}function updateWallet(){var objectC = new C();var totalItemBought = objectC.getTotalItemBoughtCount();//edits wallet here}}class C{constructor(){}function totalItemBoughtCount();//SETTERfunction getTotalItemBoughtCount();//GETTER//the bus is the classC should receive a signal once A dispatches its message.C should call updateWallet() in B once it receives A's message.Usually when the totalItemCount is changed, C should call updateWallet().}

How would you do it in this case? Is your method still applicable?

[jmp909]

do you actually want a separate instance of C for every A and every B?

 

I'm guessing that's an error? if you've already got a C as part of A, then you wouldn't need to dispatch to it.

 

I'm assuming C should actually be static/global eg .. (in which case you wouldn't need signals either)

class A {    var objectC = C.getInstance();}

anyway back to signals.. how many A's and B's will there be?.. the example below only assumes one of each. (which is why in some of my examples i start passing dependencies etc around as I move the event callback definition into the class constructor rather than the main game creation function)

 

try this

http://phaser.io/sandbox/OjusHDvJ/play (i've changed the code slightly from below)

 

[pseudocode!]

class C {    this.events = {}    this.events.onItemAdded = new Phaser.Signal();    function addItem(item) {  // not sure params are right here        ....        this.events.onItemAdded.dispatch()    }}class B {    function updateWallet()  { ... }}class A {   this.events = {}   this.events.onItemBought = new Phaser.Signal();   ..   ..   function buyItem(item)    {       this.events.onItemBought.dispatch(item)   }}class Game {     a = new A();    b = new B();    c = new C();    // actions    a.events.onItemBought.add(c.addItem, c)    c.events.onItemAdded.add(b.updateWallet, }

I could model it better if i knew what A, B and C were, and how many of each exist (ie 1 or more-than-1)

[Batzi]

So I initialized this code below in A's constructor.

this.events =  {}this.events.onItemBought = new Phaser.Signal();

and in the function in A I did

this.events.onAccept.dispatch('test');

I am testing if the syntax is correct and I get the following error

Uncaught TypeError: child.events.onAddedToGroup$dispatch is not a function

and to answer your question, there is one instance of A , B and C.

[jmp909]

have you check what "this" refers to inside your function ?

 

also i'm assuming you actually have the following.

this.events = {}this.events.onItemBought = new Phaser.Signal();this.events.onAccept = new Phaser.Signal(); // you missed thisfunction blah() {   this.events.onAccept.dispatch('test');

there is one instance of A , B and C.

 

 

then your var objectC = new C() in each class would be wrong then.... you're creating a new instance of C on A and B, so you have two separate C's not one.

[jmp909]

ps in my definition of C above as static/global i meant to refer to the singleton pattern

http://www.dofactory.com/javascript/singleton-design-pattern

[jmp909]

Ah sorry about that dispatch error.

I assume A is a extended Sprite, in which case you shouldn't use this.events = {} as you will kill off any existing internal events system, just leave that line out.

I only use that for abstract classes and groups which don't have the events object to begin with

[Batzi]

have you check what "this" refers to inside your function ?

 

also i'm assuming you actually have the following.

this.events = {}this.events.onItemBought = new Phaser.Signal();this.events.onAccept = new Phaser.Signal(); // you missed thisfunction blah() {   this.events.onAccept.dispatch('test');

then your var objectC = new C() in each class would be wrong then.... you're creating a new instance of C on A and B, so you have two separate C's not one.

I console logged 'this' inside the function and I noticed that it is referring to the class itself. And yes A is an extended sprite! B is an extended graphics.

[jmp909]

yeah the error wasn't the scope afterall.. you wiped out the onAddedToGroup event .. sorry i should've mentioned it before!

[Batzi]

Thanks for your help jmp! Everything works great!