@babylonjs/core 5.0.0-alpha.60 → 5.0.0-alpha.64

package/Animations/animation.d.ts

@@ -345,6 +345,16 @@ export declare class Animation {
      * @returns Interpolated Color3 value
      */
     color3InterpolateFunction(startValue: Color3, endValue: Color3, gradient: number): Color3;
+    /**
+     * Interpolates a Color3 cubically
+     * @param startValue Start value of the animation curve
+     * @param outTangent End tangent of the animation
+     * @param endValue End value of the animation curve
+     * @param inTangent Start tangent of the animation curve
+     * @param gradient Scalar amount to interpolate
+     * @returns interpolated value
+     */
+    color3InterpolateFunctionWithTangents(startValue: Color3, outTangent: Color3, endValue: Color3, inTangent: Color3, gradient: number): Color3;
     /**
      * Interpolates a Color4 linearly
      * @param startValue Start value of the animation curve
@@ -353,6 +363,16 @@ export declare class Animation {
      * @returns Interpolated Color3 value
      */
     color4InterpolateFunction(startValue: Color4, endValue: Color4, gradient: number): Color4;
+    /**
+     * Interpolates a Color4 cubically
+     * @param startValue Start value of the animation curve
+     * @param outTangent End tangent of the animation
+     * @param endValue End value of the animation curve
+     * @param inTangent Start tangent of the animation curve
+     * @param gradient Scalar amount to interpolate
+     * @returns interpolated value
+     */
+    color4InterpolateFunctionWithTangents(startValue: Color4, outTangent: Color4, endValue: Color4, inTangent: Color4, gradient: number): Color4;
     /**
      * @hidden Internal use only
      */

package/Animations/animation.js

@@ -677,6 +677,18 @@ var Animation = /** @class */ (function () {
     Animation.prototype.color3InterpolateFunction = function (startValue, endValue, gradient) {
         return Color3.Lerp(startValue, endValue, gradient);
     };
+    /**
+     * Interpolates a Color3 cubically
+     * @param startValue Start value of the animation curve
+     * @param outTangent End tangent of the animation
+     * @param endValue End value of the animation curve
+     * @param inTangent Start tangent of the animation curve
+     * @param gradient Scalar amount to interpolate
+     * @returns interpolated value
+     */
+    Animation.prototype.color3InterpolateFunctionWithTangents = function (startValue, outTangent, endValue, inTangent, gradient) {
+        return Color3.Hermite(startValue, outTangent, endValue, inTangent, gradient);
+    };
     /**
      * Interpolates a Color4 linearly
      * @param startValue Start value of the animation curve
@@ -687,6 +699,18 @@ var Animation = /** @class */ (function () {
     Animation.prototype.color4InterpolateFunction = function (startValue, endValue, gradient) {
         return Color4.Lerp(startValue, endValue, gradient);
     };
+    /**
+     * Interpolates a Color4 cubically
+     * @param startValue Start value of the animation curve
+     * @param outTangent End tangent of the animation
+     * @param endValue End value of the animation curve
+     * @param inTangent Start tangent of the animation curve
+     * @param gradient Scalar amount to interpolate
+     * @returns interpolated value
+     */
+    Animation.prototype.color4InterpolateFunctionWithTangents = function (startValue, outTangent, endValue, inTangent, gradient) {
+        return Color4.Hermite(startValue, outTangent, endValue, inTangent, gradient);
+    };
     /**
      * @hidden Internal use only
      */
@@ -731,10 +755,15 @@ var Animation = /** @class */ (function () {
                 state.key = key;
                 var startKey = keys[key];
                 var startValue = this._getKeyValue(startKey.value);
+                var endValue = this._getKeyValue(endKey.value);
                 if (startKey.interpolation === AnimationKeyInterpolation.STEP) {
-                    return startValue;
+                    if (endKey.frame > currentFrame) {
+                        return startValue;
+                    }
+                    else {
+                        return endValue;
+                    }
                 }
-                var endValue = this._getKeyValue(endKey.value);
                 var useTangent = startKey.outTangent !== undefined && endKey.inTangent !== undefined;
                 var frameDelta = endKey.frame - startKey.frame;
                 // gradient : percent of currentFrame between the frame inf and the frame sup
@@ -798,21 +827,23 @@ var Animation = /** @class */ (function () {
                         }
                     // Color3
                     case Animation.ANIMATIONTYPE_COLOR3:
+                        var color3Value = useTangent ? this.color3InterpolateFunctionWithTangents(startValue, startKey.outTangent.scale(frameDelta), endValue, endKey.inTangent.scale(frameDelta), gradient) : this.color3InterpolateFunction(startValue, endValue, gradient);
                         switch (state.loopMode) {
                             case Animation.ANIMATIONLOOPMODE_CYCLE:
                             case Animation.ANIMATIONLOOPMODE_CONSTANT:
-                                return this.color3InterpolateFunction(startValue, endValue, gradient);
+                                return color3Value;
                             case Animation.ANIMATIONLOOPMODE_RELATIVE:
-                                return this.color3InterpolateFunction(startValue, endValue, gradient).add(state.offsetValue.scale(state.repeatCount));
+                                return color3Value.add(state.offsetValue.scale(state.repeatCount));
                         }
                     // Color4
                     case Animation.ANIMATIONTYPE_COLOR4:
+                        var color4Value = useTangent ? this.color4InterpolateFunctionWithTangents(startValue, startKey.outTangent.scale(frameDelta), endValue, endKey.inTangent.scale(frameDelta), gradient) : this.color4InterpolateFunction(startValue, endValue, gradient);
                         switch (state.loopMode) {
                             case Animation.ANIMATIONLOOPMODE_CYCLE:
                             case Animation.ANIMATIONLOOPMODE_CONSTANT:
-                                return this.color4InterpolateFunction(startValue, endValue, gradient);
+                                return color4Value;
                             case Animation.ANIMATIONLOOPMODE_RELATIVE:
-                                return this.color4InterpolateFunction(startValue, endValue, gradient).add(state.offsetValue.scale(state.repeatCount));
+                                return color4Value.add(state.offsetValue.scale(state.repeatCount));
                         }
                     // Matrix
                     case Animation.ANIMATIONTYPE_MATRIX:
@@ -917,6 +948,15 @@ var Animation = /** @class */ (function () {
                         }
                         key.values.push(animationKey.outTangent);
                     }
+                    if (animationKey.interpolation !== undefined) {
+                        if (animationKey.inTangent === undefined) {
+                            key.values.push(undefined);
+                        }
+                        if (animationKey.outTangent === undefined) {
+                            key.values.push(undefined);
+                        }
+                        key.values.push(animationKey.interpolation);
+                    }
                     break;
                 case Animation.ANIMATIONTYPE_QUATERNION:
                 case Animation.ANIMATIONTYPE_MATRIX:
@@ -933,6 +973,15 @@ var Animation = /** @class */ (function () {
                         }
                         key.values.push(animationKey.outTangent.asArray());
                     }
+                    if (animationKey.interpolation !== undefined) {
+                        if (animationKey.inTangent === undefined) {
+                            key.values.push(undefined);
+                        }
+                        if (animationKey.outTangent === undefined) {
+                            key.values.push(undefined);
+                        }
+                        key.values.push(animationKey.interpolation);
+                    }
                     break;
             }
             serializationObject.keys.push(key);
@@ -986,17 +1035,21 @@ var Animation = /** @class */ (function () {
         }
         for (index = 0; index < parsedAnimation.keys.length; index++) {
             var key = parsedAnimation.keys[index];
-            var inTangent;
-            var outTangent;
+            var inTangent = undefined;
+            var outTangent = undefined;
+            var interpolation = undefined;
             switch (dataType) {
                 case Animation.ANIMATIONTYPE_FLOAT:
                     data = key.values[0];
-                    if (key.values.length >= 1) {
+                    if (key.values.length >= 2) {
                         inTangent = key.values[1];
                     }
-                    if (key.values.length >= 2) {
+                    if (key.values.length >= 3) {
                         outTangent = key.values[2];
                     }
+                    if (key.values.length >= 4) {
+                        interpolation = key.values[3];
+                    }
                     break;
                 case Animation.ANIMATIONTYPE_QUATERNION:
                     data = Quaternion.FromArray(key.values);
@@ -1012,19 +1065,52 @@ var Animation = /** @class */ (function () {
                             outTangent = _outTangent;
                         }
                     }
+                    if (key.values.length >= 13) {
+                        interpolation = key.values[12];
+                    }
                     break;
                 case Animation.ANIMATIONTYPE_MATRIX:
                     data = Matrix.FromArray(key.values);
+                    if (key.values.length >= 17) {
+                        interpolation = key.values[16];
+                    }
                     break;
                 case Animation.ANIMATIONTYPE_COLOR3:
                     data = Color3.FromArray(key.values);
+                    if (key.values[3]) {
+                        inTangent = Color3.FromArray(key.values[3]);
+                    }
+                    if (key.values[4]) {
+                        outTangent = Color3.FromArray(key.values[4]);
+                    }
+                    if (key.values[5]) {
+                        interpolation = key.values[5];
+                    }
                     break;
                 case Animation.ANIMATIONTYPE_COLOR4:
                     data = Color4.FromArray(key.values);
+                    if (key.values[4]) {
+                        inTangent = Color4.FromArray(key.values[4]);
+                    }
+                    if (key.values[5]) {
+                        outTangent = Color4.FromArray(key.values[5]);
+                    }
+                    if (key.values[6]) {
+                        interpolation = Color4.FromArray(key.values[6]);
+                    }
                     break;
                 case Animation.ANIMATIONTYPE_VECTOR3:
                 default:
                     data = Vector3.FromArray(key.values);
+                    if (key.values[3]) {
+                        inTangent = Vector3.FromArray(key.values[3]);
+                    }
+                    if (key.values[4]) {
+                        outTangent = Vector3.FromArray(key.values[4]);
+                    }
+                    if (key.values[5]) {
+                        interpolation = key.values[5];
+                    }
                     break;
             }
             var keyData = {};
@@ -1036,6 +1122,9 @@ var Animation = /** @class */ (function () {
             if (outTangent != undefined) {
                 keyData.outTangent = outTangent;
             }
+            if (interpolation != undefined) {
+                keyData.interpolation = interpolation;
+            }
             keys.push(keyData);
         }
         animation.setKeys(keys);