How to assign Multiple Actions on a Single Event

[wikiwiggs]

The below code is a snippet from the following location:

http://www.babylonjs-playground.com/#DNOLK#1

 

donut.actionManager.registerAction(new BABYLON.SetValueAction(

        { trigger: BABYLON.ActionManager.OnIntersectionEnterTrigger, parameter: sphere },

        donutMat, "emissiveColor", BABYLON.Color3.Red()))

.then(new BABYLON.SetValueAction(

        { trigger: BABYLON.ActionManager.OnIntersectionEnterTrigger, parameter: sphere },

donut, "scaling", new BABYLON.Vector3(1.2, 1.2, 1.2)));

 

donut.actionManager.registerAction(new BABYLON.SetValueAction(

        { trigger: BABYLON.ActionManager.OnIntersectionExitTrigger, parameter: sphere }

        , donutMat, "emissiveColor", new BABYLON.Color3(0.5,0.5,0.5)))

.then(new BABYLON.SetValueAction(

{ trigger: BABYLON.ActionManager.OnIntersectionExitTrigger, parameter: sphere }

, donut, "scaling", new BABYLON.Vector3(1, 1, 1)));

 

My question should clarify what I'm asking, even though the above code works (eg. doesn't throw an error).

What I was trying to accomplish was taking both actions and causing them to fire at the same time.

So far the above code sets both properties, but only by allowing it to take turns alternating each time the intersection occurs.

My question is: is there a way to change both "scaling" and "emissiveColor" during the same intersection instance?

 

Thanks in advance for the help.

[wikiwiggs]

OK, I was playing around a little bit more, and it seemed that I was able to go one step further by registering half of the actions on the sphere.actionManager.

So I ended up keeping the donut.actionManager scale as the example had it, and placing the donutMat.emissiveColor change on the the sphere.actionManager

(both for the same triggers - BABYLON.ActionManager.OnIntersectionEnterTrigger & BABYLON.ActionManager.OnIntersectionExitTrigger).

 

You can see the implementation here:

http://www.babylonjs-playground.com/#RVZ1O#2

 

This Worked!

 

This seemed like a workaround though, and in this particular case it worked as I only had two actions to pull off, and the OnIntersection(Enter/Exit)Trigger was not being used for the sphere.

If it were &/or I would have had any more actions, I don't think this would have quite worked without creating something very non-intuitive.

 

I stumbled upon this: http://doc.babylonjs.com/page.php?p=24655

However, I personally could not extrapolate what the code should look like from this.

i was hoping to get some direction/examples on the CombineAction class, as it sounds like the right thing to be using (ignorantly stated - assuming that this is what this class is for).

 

Any help is greatly appreciated.

 

Kind Regards

[amorgan]

I would use the ExecuteCodeAction, see example:

 

http://www.babylonjs-playground.com/#DNOLK#3

[wikiwiggs]

OK, that was amazing, and way more efficient from a coding perspective!

Thank you for the help!

[Vousk-prod.]

Assigning multiple actions on a single event with CombineAction is super easy :

mesh.actionManager.registerAction(    //do many actions on Pick trigger (for instance)    new BABYLON.CombineAction(BABYLON.ActionManager.OnPickTrigger,     [        new BABYLON.PlayAnimationAction(BABYLON.ActionManager.NothingTrigger, mesh, 0, 20, false),        new BABYLON.SetStateAction(BABYLON.ActionManager.NothingTrigger, mesh, "moved")    ], condition));

The "trick" is to define NothingTrigger as a trigger for each combined actions.

 

EDIT : More precisely : the "condition" parameter is optional. It's here just to let you specifiy that the action should execute on trigger only if some conditions are met.

[wikiwiggs]

I'm posting amorgan's code reference here so I can see both methods side by side.

// Intersections

    donut.actionManager = new BABYLON.ActionManager(scene);

//donutMat.actionManager = new BABYLON.ActionManager(scene);



donut.actionManager.registerAction(new BABYLON.ExecuteCodeAction(

        { trigger: BABYLON.ActionManager.OnIntersectionEnterTrigger, parameter: sphere }

        ,function () {

donut.scaling = new BABYLON.Vector3(1.5, 1.5, 1.5);

     donutMat.emissiveColor = BABYLON.Color3.Red();

}));



donut.actionManager.registerAction(new BABYLON.ExecuteCodeAction(

    { trigger: BABYLON.ActionManager.OnIntersectionExitTrigger, parameter: sphere }

    ,function () {

donutMat.emissiveColor = new BABYLON.Color3(0.5,0.5,0.5);

donut.scaling = new BABYLON.Vector3(1, 1, 1);

}));

[wikiwiggs]

Based on the code from Vousk-prod., below would be my interpretation of it, given the original example of intersection:

I tried to run it, but it failed to allow the animation to continue, am i missing something here?

 

Thank you for taking the time to help me understand.

 

donut.actionManager = new BABYLON.ActionManager(scene);donut.actionManager.registerAction(    new BABYLON.CombineAction(        {trigger: BABYLON.ActionManager.OnIntersectionEnterTrigger, parameter: sphere},        [            new BABYLON.SetValueAction(                BABYLON.ActionManager.NothingTrigger,                 donut.material,                 "emissiveColor",                 BABYLON.Color3.Red()            ),             new BABYLON.SetValueAction(                BABYLON.ActionManager.NothingTrigger,                 donut,                 "scaling",                 new BABYLON.Vector3(1.2, 1.2, 1.2)            )         ],        BABYLON.Condition    ));donut.actionManager.registerAction(    new BABYLON.CombineAction(        {trigger: BABYLON.ActionManager.OnIntersectionExitTrigger, parameter: sphere},        [            new BABYLON.SetValueAction(                BABYLON.ActionManager.NothingTrigger,                 donut.material,                 "emissiveColor",                 BABYLON.Color3.Gray()            ),             new BABYLON.SetValueAction(                BABYLON.ActionManager.NothingTrigger,                 donut,                 "scaling",                 new BABYLON.Vector3(1.0, 1.0, 1.0)            )         ],        BABYLON.Condition    ));

[wikiwiggs]

I figured this out.

Where i have 

BABYLON.Condition

 I replaced it with 

new BABYLON.Condition(donut.actionManager)

and everything worked as expected.

 

If anyone knows:

From a performance perspective, which one is considered more taxing on the frame rate?

 

From the newbie perspective, these both seem like legitimate claims to the same end.

The ExecuteCodeAction approach seemed a lot more instinctive (for me anyway) to just use an anonymous function to set/change the properties.

The CombineAction approach seemed a lot more formal (explicitly/legally defined so to speak).

 

Thanks again for both contributions you two.

[Vousk-prod.]

In fact, (as stated in the wiki on using Actions : https://github.com/BabylonJS/Babylon.js/wiki/How-to-use-Actions ), condition parameter is optionnal.

It's here just to let you specifiy that the action should execute on trigger only if some conditions are met.

 

By specifing new BABYLON.Condition(donut.actionManager)as condition, you're simply telling the action that it should only happen if donut.actionManager exist. But since you're currently registering a new action on your donut.actionManager, it actually exists, isn't it .

So you can (and you should) remove the condition parameter.