AnimComponent transition updates (playcanvas#3329)

ellthompson · web-flow · commit cfd933490931 · 2021-09-01T12:52:01.000+01:00
* update how transition trigger conditions are consumed and enable transitioning to the active state

* support single frame triggers
diff --git a/src/anim/controller/anim-controller.js b/src/anim/controller/anim-controller.js
@@ -20,13 +20,16 @@ import {
  * @param {object[]} transitions - The list of transitions used to form the controller state graph.
  * @param {object[]} parameters - The anim components parameters.
  * @param {boolean} activate - Determines whether the anim controller should automatically play once all {@link AnimNodes} are assigned animations.
+ * @param {EventHandler} eventHandler - The event handler which should be notified with anim events
+ * @param {Set} consumedTriggers - Used to set triggers back to their default state after they have been consumed by a transition
  */
 class AnimController {
-    constructor(animEvaluator, states, transitions, parameters, activate, eventHandler) {
+    constructor(animEvaluator, states, transitions, parameters, activate, eventHandler, consumedTriggers) {
         this._animEvaluator = animEvaluator;
         this._states = {};
         this._stateNames = [];
         this._eventHandler = eventHandler;
+        this._consumedTriggers = consumedTriggers;
         for (let i = 0; i < states.length; i++) {
             this._states[states[i].name] = new AnimState(
                 this,
@@ -279,10 +282,6 @@ class AnimController {
 
         // filter out transitions that don't have their conditions met
         transitions = transitions.filter(function (transition) {
-            // if the transition is moving to the already active state, ignore it
-            if (transition.to === this.activeStateName) {
-                return false;
-            }
             // when an exit time is present, we should only exit if it falls within the current frame delta time
             if (transition.hasExitTime) {
                 let progressBefore = this._getActiveStateProgressForTime(this._timeInStateBefore);
@@ -325,7 +324,7 @@ class AnimController {
             const condition = transition.conditions[i];
             const parameter = this.findParameter(condition.parameterName);
             if (parameter.type === ANIM_PARAMETER_TRIGGER) {
-                parameter.value = false;
+                this._consumedTriggers.add(condition.parameterName);
             }
         }
 
diff --git a/src/framework/components/anim/component.js b/src/framework/components/anim/component.js
@@ -40,6 +40,7 @@ class AnimComponent extends Component {
         this._layers = [];
         this._layerIndices = {};
         this._parameters = {};
+        this._consumedTriggers = new Set();
     }
 
     get stateGraphAsset() {
@@ -228,7 +229,8 @@ class AnimComponent extends Component {
             transitions,
             this._parameters,
             this._activate,
-            this
+            this,
+            this._consumedTriggers
         );
         this._layers.push(new AnimComponentLayer(name, controller, this));
         this._layerIndices[name] = order;
@@ -636,9 +638,13 @@ class AnimComponent extends Component {
      * @name AnimComponent#setTrigger
      * @description Sets the value of a trigger parameter that was defined in the animation components state graph to true.
      * @param {string} name - The name of the parameter to set.
+     * @param {boolean} [singleFrame] - If true, this trigger will be set back to false at the end of the animation update. Defaults to false.
      */
-    setTrigger(name) {
+    setTrigger(name, singleFrame = false) {
         this.setParameterValue(name, ANIM_PARAMETER_TRIGGER, true);
+        if (singleFrame) {
+            this._consumedTriggers.add(name);
+        }
     }
 
     /**
@@ -656,6 +662,16 @@ class AnimComponent extends Component {
             this.system.app.assets.get(this._stateGraphAsset).off('change', this._onStateGraphAssetChangeEvent);
         }
     }
+
+    update(dt) {
+        for (let i = 0; i < this.layers.length; i++) {
+            this.layers[i].update(dt * this.speed);
+        }
+        this._consumedTriggers.forEach((trigger) => {
+            this.parameters[trigger].value = false;
+        });
+        this._consumedTriggers.clear();
+    }
 }
 
 export { AnimComponent };
diff --git a/src/framework/components/anim/system.js b/src/framework/components/anim/system.js
@@ -58,17 +58,15 @@ class AnimComponentSystem extends ComponentSystem {
     }
 
     onAnimationUpdate(dt) {
-        var components = this.store;
+        const components = this.store;
 
-        for (var id in components) {
+        for (const id in components) {
             if (components.hasOwnProperty(id)) {
-                var component = components[id].entity.anim;
-                var componentData = component.data;
+                const component = components[id].entity.anim;
+                const componentData = component.data;
 
                 if (componentData.enabled && component.entity.enabled && component.playing) {
-                    for (var i = 0; i < component.layers.length; i++) {
-                        component.layers[i].update(dt * component.speed);
-                    }
+                    component.update(dt);
                 }
             }
         }

Original file line number	Diff line number	Diff line change
`@@ -58,17 +58,15 @@ class AnimComponentSystem extends ComponentSystem {`
`58`	`58`	`}`
`59`	`59`
`60`	`60`	`onAnimationUpdate(dt) {`
`61`		`- var components = this.store;`
	`61`	`+ const components = this.store;`
`62`	`62`
`63`		`- for (var id in components) {`
	`63`	`+ for (const id in components) {`
`64`	`64`	`if (components.hasOwnProperty(id)) {`
`65`		`- var component = components[id].entity.anim;`
`66`		`- var componentData = component.data;`
	`65`	`+ const component = components[id].entity.anim;`
	`66`	`+ const componentData = component.data;`
`67`	`67`
`68`	`68`	`if (componentData.enabled && component.entity.enabled && component.playing) {`
`69`		`- for (var i = 0; i < component.layers.length; i++) {`
`70`		`- component.layers[i].update(dt * component.speed);`
`71`		`- }`
	`69`	`+ component.update(dt);`
`72`	`70`	`}`
`73`	`71`	`}`
`74`	`72`	`}`