@babylonjs/core 7.51.1 → 7.51.3

package/FlowGraph/Blocks/Execution/Animation/flowGraphEasingBlock.d.ts

@@ -0,0 +1,60 @@
+import type { EasingFunction } from "../../../../Animations/easing.js";
+import type { IFlowGraphBlockConfiguration } from "../../../flowGraphBlock.js";
+import { FlowGraphBlock } from "../../../flowGraphBlock.js";
+import type { FlowGraphContext } from "../../../flowGraphContext.js";
+import type { FlowGraphDataConnection } from "../../../flowGraphDataConnection.js";
+/**
+ * The type of the easing function.
+ */
+export declare enum EasingFunctionType {
+    CircleEase = 0,
+    BackEase = 1,
+    BounceEase = 2,
+    CubicEase = 3,
+    ElasticEase = 4,
+    ExponentialEase = 5,
+    PowerEase = 6,
+    QuadraticEase = 7,
+    QuarticEase = 8,
+    QuinticEase = 9,
+    SineEase = 10,
+    BezierCurveEase = 11
+}
+/**
+ * An easing block that generates an easingFunction object based on the data provided.
+ */
+export declare class FlowGraphEasingBlock extends FlowGraphBlock {
+    /**
+     * the configuration of the block
+     */
+    config?: IFlowGraphBlockConfiguration | undefined;
+    /**
+     * Input connection: The type of the easing function.
+     */
+    readonly type: FlowGraphDataConnection<EasingFunctionType>;
+    /**
+     * Input connection: The mode of the easing function.
+     * EasingFunction.EASINGMODE_EASEIN, EasingFunction.EASINGMODE_EASEOUT, EasingFunction.EASINGMODE_EASEINOUT
+     */
+    readonly mode: FlowGraphDataConnection<number>;
+    /**
+     * Input connection:parameters for easing. for example control points for BezierCurveEase.
+     */
+    readonly parameters: FlowGraphDataConnection<number[]>;
+    /**
+     * Output connection: The easing function object.
+     */
+    readonly easingFunction: FlowGraphDataConnection<EasingFunction>;
+    /**
+     * Internal cache of reusable easing functions.
+     * key is type-mode-properties
+     */
+    private _easingFunctions;
+    constructor(
+    /**
+     * the configuration of the block
+     */
+    config?: IFlowGraphBlockConfiguration | undefined);
+    _updateOutputs(context: FlowGraphContext): void;
+    getClassName(): string;
+}

package/FlowGraph/Blocks/Execution/Animation/flowGraphEasingBlock.js

@@ -0,0 +1,93 @@
+import { BackEase, BezierCurveEase, BounceEase, CircleEase, CubicEase, ElasticEase, ExponentialEase } from "../../../../Animations/easing.js";
+import { FlowGraphBlock } from "../../../flowGraphBlock.js";
+import { RichTypeAny, RichTypeNumber } from "../../../flowGraphRichTypes.js";
+import { RegisterClass } from "../../../../Misc/typeStore.js";
+/**
+ * The type of the easing function.
+ */
+export var EasingFunctionType;
+(function (EasingFunctionType) {
+    EasingFunctionType[EasingFunctionType["CircleEase"] = 0] = "CircleEase";
+    EasingFunctionType[EasingFunctionType["BackEase"] = 1] = "BackEase";
+    EasingFunctionType[EasingFunctionType["BounceEase"] = 2] = "BounceEase";
+    EasingFunctionType[EasingFunctionType["CubicEase"] = 3] = "CubicEase";
+    EasingFunctionType[EasingFunctionType["ElasticEase"] = 4] = "ElasticEase";
+    EasingFunctionType[EasingFunctionType["ExponentialEase"] = 5] = "ExponentialEase";
+    EasingFunctionType[EasingFunctionType["PowerEase"] = 6] = "PowerEase";
+    EasingFunctionType[EasingFunctionType["QuadraticEase"] = 7] = "QuadraticEase";
+    EasingFunctionType[EasingFunctionType["QuarticEase"] = 8] = "QuarticEase";
+    EasingFunctionType[EasingFunctionType["QuinticEase"] = 9] = "QuinticEase";
+    EasingFunctionType[EasingFunctionType["SineEase"] = 10] = "SineEase";
+    EasingFunctionType[EasingFunctionType["BezierCurveEase"] = 11] = "BezierCurveEase";
+})(EasingFunctionType || (EasingFunctionType = {}));
+/**
+ * @internal
+ * Creates an easing function object based on the type and parameters provided.
+ * This is not tree-shaking friendly, so if you need cubic bezier, use the dedicated bezier block.
+ * @param type The type of the easing function.
+ * @param controlPoint1 The first control point for the bezier curve.
+ * @param controlPoint2 The second control point for the bezier curve.
+ * @returns The easing function object.
+ */
+function CreateEasingFunction(type, ...parameters) {
+    switch (type) {
+        case 11 /* EasingFunctionType.BezierCurveEase */:
+            return new BezierCurveEase(...parameters);
+        case 0 /* EasingFunctionType.CircleEase */:
+            return new CircleEase();
+        case 1 /* EasingFunctionType.BackEase */:
+            return new BackEase(...parameters);
+        case 2 /* EasingFunctionType.BounceEase */:
+            return new BounceEase(...parameters);
+        case 3 /* EasingFunctionType.CubicEase */:
+            return new CubicEase();
+        case 4 /* EasingFunctionType.ElasticEase */:
+            return new ElasticEase(...parameters);
+        case 5 /* EasingFunctionType.ExponentialEase */:
+            return new ExponentialEase(...parameters);
+        default:
+            throw new Error("Easing type not yet implemented");
+    }
+}
+/**
+ * An easing block that generates an easingFunction object based on the data provided.
+ */
+export class FlowGraphEasingBlock extends FlowGraphBlock {
+    constructor(
+    /**
+     * the configuration of the block
+     */
+    config) {
+        super(config);
+        this.config = config;
+        /**
+         * Internal cache of reusable easing functions.
+         * key is type-mode-properties
+         */
+        this._easingFunctions = {};
+        this.type = this.registerDataInput("type", RichTypeAny, 11);
+        this.mode = this.registerDataInput("mode", RichTypeNumber, 0);
+        this.parameters = this.registerDataInput("parameters", RichTypeAny, [1, 0, 0, 1]);
+        this.easingFunction = this.registerDataOutput("easingFunction", RichTypeAny);
+    }
+    _updateOutputs(context) {
+        const type = this.type.getValue(context);
+        const mode = this.mode.getValue(context);
+        const parameters = this.parameters.getValue(context);
+        if (type === undefined || mode === undefined) {
+            return;
+        }
+        const key = `${type}-${mode}-${parameters.join("-")}`;
+        if (!this._easingFunctions[key]) {
+            const easing = CreateEasingFunction(type, ...parameters);
+            easing.setEasingMode(mode);
+            this._easingFunctions[key] = easing;
+        }
+        this.easingFunction.setValue(this._easingFunctions[key], context);
+    }
+    getClassName() {
+        return "FlowGraphEasingBlock" /* FlowGraphBlockNames.Easing */;
+    }
+}
+RegisterClass("FlowGraphEasingBlock" /* FlowGraphBlockNames.Easing */, FlowGraphEasingBlock);
+//# sourceMappingURL=flowGraphEasingBlock.js.map

package/FlowGraph/Blocks/Execution/Animation/flowGraphEasingBlock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flowGraphEasingBlock.js","sourceRoot":"","sources":["../../../../../../../dev/core/src/FlowGraph/Blocks/Execution/Animation/flowGraphEasingBlock.ts"],"names":[],"mappings":"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","sourcesContent":["import type { EasingFunction } from \"core/Animations/easing\";\nimport { BackEase, BezierCurveEase, BounceEase, CircleEase, CubicEase, ElasticEase, ExponentialEase } from \"core/Animations/easing\";\nimport type { IFlowGraphBlockConfiguration } from \"core/FlowGraph/flowGraphBlock\";\nimport { FlowGraphBlock } from \"core/FlowGraph/flowGraphBlock\";\nimport type { FlowGraphContext } from \"core/FlowGraph/flowGraphContext\";\nimport type { FlowGraphDataConnection } from \"core/FlowGraph/flowGraphDataConnection\";\nimport { RichTypeAny, RichTypeNumber } from \"core/FlowGraph/flowGraphRichTypes\";\nimport { FlowGraphBlockNames } from \"../../flowGraphBlockNames\";\nimport { RegisterClass } from \"core/Misc/typeStore\";\n\n/**\n * The type of the easing function.\n */\nexport const enum EasingFunctionType {\n    CircleEase = 0,\n    BackEase = 1,\n    BounceEase = 2,\n    CubicEase = 3,\n    ElasticEase = 4,\n    ExponentialEase = 5,\n    PowerEase = 6,\n    QuadraticEase = 7,\n    QuarticEase = 8,\n    QuinticEase = 9,\n    SineEase = 10,\n    BezierCurveEase = 11,\n}\n\n/**\n * @internal\n * Creates an easing function object based on the type and parameters provided.\n * This is not tree-shaking friendly, so if you need cubic bezier, use the dedicated bezier block.\n * @param type The type of the easing function.\n * @param controlPoint1 The first control point for the bezier curve.\n * @param controlPoint2 The second control point for the bezier curve.\n * @returns The easing function object.\n */\nfunction CreateEasingFunction(type: EasingFunctionType, ...parameters: number[]): EasingFunction {\n    switch (type) {\n        case EasingFunctionType.BezierCurveEase:\n            return new BezierCurveEase(...parameters);\n        case EasingFunctionType.CircleEase:\n            return new CircleEase();\n        case EasingFunctionType.BackEase:\n            return new BackEase(...parameters);\n        case EasingFunctionType.BounceEase:\n            return new BounceEase(...parameters);\n        case EasingFunctionType.CubicEase:\n            return new CubicEase();\n        case EasingFunctionType.ElasticEase:\n            return new ElasticEase(...parameters);\n        case EasingFunctionType.ExponentialEase:\n            return new ExponentialEase(...parameters);\n        default:\n            throw new Error(\"Easing type not yet implemented\");\n    }\n}\n\n/**\n * An easing block that generates an easingFunction object based on the data provided.\n */\nexport class FlowGraphEasingBlock extends FlowGraphBlock {\n    /**\n     * Input connection: The type of the easing function.\n     */\n    public readonly type: FlowGraphDataConnection<EasingFunctionType>;\n\n    /**\n     * Input connection: The mode of the easing function.\n     * EasingFunction.EASINGMODE_EASEIN, EasingFunction.EASINGMODE_EASEOUT, EasingFunction.EASINGMODE_EASEINOUT\n     */\n    public readonly mode: FlowGraphDataConnection<number>;\n\n    /**\n     * Input connection:parameters for easing. for example control points for BezierCurveEase.\n     */\n    public readonly parameters: FlowGraphDataConnection<number[]>;\n\n    /**\n     * Output connection: The easing function object.\n     */\n    public readonly easingFunction: FlowGraphDataConnection<EasingFunction>;\n\n    /**\n     * Internal cache of reusable easing functions.\n     * key is type-mode-properties\n     */\n    private _easingFunctions: { [key: string]: EasingFunction } = {};\n\n    constructor(\n        /**\n         * the configuration of the block\n         */\n        public override config?: IFlowGraphBlockConfiguration\n    ) {\n        super(config);\n\n        this.type = this.registerDataInput(\"type\", RichTypeAny, 11);\n        this.mode = this.registerDataInput(\"mode\", RichTypeNumber, 0);\n        this.parameters = this.registerDataInput(\"parameters\", RichTypeAny, [1, 0, 0, 1]);\n\n        this.easingFunction = this.registerDataOutput(\"easingFunction\", RichTypeAny);\n    }\n\n    public override _updateOutputs(context: FlowGraphContext) {\n        const type = this.type.getValue(context);\n        const mode = this.mode.getValue(context);\n        const parameters = this.parameters.getValue(context);\n\n        if (type === undefined || mode === undefined) {\n            return;\n        }\n\n        const key = `${type}-${mode}-${parameters.join(\"-\")}`;\n        if (!this._easingFunctions[key]) {\n            const easing = CreateEasingFunction(type, ...parameters);\n            easing.setEasingMode(mode);\n            this._easingFunctions[key] = easing;\n        }\n        this.easingFunction.setValue(this._easingFunctions[key], context);\n    }\n\n    public override getClassName(): string {\n        return FlowGraphBlockNames.Easing;\n    }\n}\n\nRegisterClass(FlowGraphBlockNames.Easing, FlowGraphEasingBlock);\n"]}

package/FlowGraph/Blocks/Execution/Animation/flowGraphInterpolationBlock.d.ts

@@ -0,0 +1,82 @@
+import type { EasingFunction } from "../../../../Animations/easing.js";
+import { FlowGraphBlock, type IFlowGraphBlockConfiguration } from "../../../flowGraphBlock.js";
+import type { FlowGraphContext } from "../../../flowGraphContext.js";
+import type { FlowGraphDataConnection } from "../../../flowGraphDataConnection.js";
+import type { FlowGraphTypes } from "../../../flowGraphRichTypes.js";
+import { Animation } from "../../../../Animations/animation.js";
+/**
+ * Configuration for the interpolation block.
+ */
+export interface IFlowGraphInterpolationBlockConfiguration extends IFlowGraphBlockConfiguration {
+    /**
+     * The number of keyframes to interpolate between.
+     * Will default to 1 if not provided (i.e. from currentValue to a provided value in the time provided)
+     */
+    keyFramesCount?: number;
+    /**
+     * The duration of the interpolation.
+     */
+    duration?: number;
+    /**
+     * The name of the property that will be interpolated.
+     */
+    propertyName?: string | string[];
+    /**
+     * The type of the animation to create.
+     * Default is ANIMATIONTYPE_FLOAT
+     * This cannot be changed after construction, so make sure to pass the right value.
+     */
+    animationType?: number | FlowGraphTypes;
+}
+/**
+ * This block is responsible for interpolating between two values.
+ * The babylon concept used is Animation, and it is the output of this block.
+ *
+ * Note that values will be parsed when the in connection is triggered. until then changing the value will not trigger a new interpolation.
+ *
+ * Internally this block uses the Animation class.
+ *
+ * Note that if the interpolation is already running a signal will be sent to stop the animation group running it.
+ */
+export declare class FlowGraphInterpolationBlock<T> extends FlowGraphBlock {
+    /**
+     * Input connection: The value to interpolate from.
+     * Optional. If not provided, the current value will be used.
+     * Note that if provided, every time the animation is created this value will be used!
+     */
+    readonly initialValue: FlowGraphDataConnection<T>;
+    /**
+     * Input connection: The value to interpolate to.
+     * Optional. This can also be set using the KeyFrames input!
+     * If provided it will be set to the last keyframe value.
+     */
+    readonly endValue: FlowGraphDataConnection<T>;
+    /**
+     * output connection: The animation that will be created when in is triggered.
+     */
+    readonly animation: FlowGraphDataConnection<Animation | Animation[]>;
+    /**
+     * Input connection: An optional easing function to use for the interpolation.
+     */
+    readonly easingFunction: FlowGraphDataConnection<EasingFunction>;
+    /**
+     * Input connection: The name of the property that will be set
+     */
+    readonly propertyName: FlowGraphDataConnection<string | string[]>;
+    /**
+     * If provided, this function will be used to create the animation object(s).
+     */
+    readonly customBuildAnimation: FlowGraphDataConnection<() => (keys: any[], fps: number, animationType: number, easingFunction?: EasingFunction) => Animation | Animation[]>;
+    /**
+     * The keyframes to interpolate between.
+     * Each keyframe has a duration input and a value input.
+     */
+    readonly keyFrames: {
+        duration: FlowGraphDataConnection<number>;
+        value: FlowGraphDataConnection<T>;
+    }[];
+    constructor(config?: IFlowGraphInterpolationBlockConfiguration);
+    _updateOutputs(context: FlowGraphContext): void;
+    private _createAnimation;
+    getClassName(): string;
+}

package/FlowGraph/Blocks/Execution/Animation/flowGraphInterpolationBlock.js

@@ -0,0 +1,105 @@
+
+import { FlowGraphBlock } from "../../../flowGraphBlock.js";
+import { getRichTypeByAnimationType, getRichTypeByFlowGraphType, RichTypeAny, RichTypeNumber } from "../../../flowGraphRichTypes.js";
+import { Animation } from "../../../../Animations/animation.js";
+import { RegisterClass } from "../../../../Misc/typeStore.js";
+/**
+ * This block is responsible for interpolating between two values.
+ * The babylon concept used is Animation, and it is the output of this block.
+ *
+ * Note that values will be parsed when the in connection is triggered. until then changing the value will not trigger a new interpolation.
+ *
+ * Internally this block uses the Animation class.
+ *
+ * Note that if the interpolation is already running a signal will be sent to stop the animation group running it.
+ */
+export class FlowGraphInterpolationBlock extends FlowGraphBlock {
+    constructor(config = {}) {
+        super(config);
+        /**
+         * The keyframes to interpolate between.
+         * Each keyframe has a duration input and a value input.
+         */
+        this.keyFrames = [];
+        const type = typeof config?.animationType === "string"
+            ? getRichTypeByFlowGraphType(config.animationType)
+            : getRichTypeByAnimationType(config?.animationType ?? 0);
+        const numberOfKeyFrames = config?.keyFramesCount ?? 1;
+        const duration = this.registerDataInput(`duration_0`, RichTypeNumber, 0);
+        const value = this.registerDataInput(`value_0`, type);
+        this.keyFrames.push({ duration, value });
+        for (let i = 1; i < numberOfKeyFrames + 1; i++) {
+            const duration = this.registerDataInput(`duration_${i}`, RichTypeNumber, i === numberOfKeyFrames ? config.duration : undefined);
+            const value = this.registerDataInput(`value_${i}`, type);
+            this.keyFrames.push({ duration, value });
+        }
+        this.initialValue = this.keyFrames[0].value;
+        this.endValue = this.keyFrames[numberOfKeyFrames].value;
+        this.easingFunction = this.registerDataInput("easingFunction", RichTypeAny);
+        this.animation = this.registerDataOutput("animation", RichTypeAny);
+        this.propertyName = this.registerDataInput("propertyName", RichTypeAny, config?.propertyName);
+        this.customBuildAnimation = this.registerDataInput("customBuildAnimation", RichTypeAny);
+    }
+    _updateOutputs(context) {
+        const interpolationAnimations = context._getGlobalContextVariable("interpolationAnimations", []);
+        const propertyName = this.propertyName.getValue(context);
+        const easingFunction = this.easingFunction.getValue(context);
+        const animation = this._createAnimation(context, propertyName, easingFunction);
+        // If an old animation exists, it will be ignored here.
+        // This is because if the animation is running and they both have the same target, the old will be stopped.
+        // This doesn't happen here, it happens in the play animation block.
+        this.animation.setValue(animation, context);
+        // to make sure no 2 interpolations are running on the same target, we will mark the animation in the context
+        if (Array.isArray(animation)) {
+            for (const anim of animation) {
+                interpolationAnimations.push(anim.uniqueId);
+            }
+        }
+        else {
+            interpolationAnimations.push(animation.uniqueId);
+        }
+        context._setGlobalContextVariable("interpolationAnimations", interpolationAnimations);
+    }
+    _createAnimation(context, propertyName, easingFunction) {
+        const type = this.initialValue.richType;
+        const keys = [];
+        // add initial value
+        const currentValue = this.initialValue.getValue(context) || type.defaultValue;
+        keys.push({ frame: 0, value: currentValue });
+        const numberOfKeyFrames = this.config?.numberOfKeyFrames ?? 1;
+        for (let i = 1; i < numberOfKeyFrames + 1; i++) {
+            const duration = this.keyFrames[i].duration?.getValue(context);
+            let value = this.keyFrames[i].value?.getValue(context);
+            if (i === numberOfKeyFrames - 1) {
+                value = value || type.defaultValue;
+            }
+            if (duration !== undefined && value) {
+                // convert duration to frames, based on 60 fps
+                keys.push({ frame: duration * 60, value });
+            }
+        }
+        const customBuildAnimation = this.customBuildAnimation.getValue(context);
+        if (customBuildAnimation) {
+            return customBuildAnimation()(keys, 60, type.animationType, easingFunction);
+        }
+        if (typeof propertyName === "string") {
+            const animation = Animation.CreateAnimation(propertyName, type.animationType, 60, easingFunction);
+            animation.setKeys(keys);
+            return [animation];
+        }
+        else {
+            const animations = propertyName.map((name) => {
+                const animation = Animation.CreateAnimation(name, type.animationType, 60, easingFunction);
+                animation.setKeys(keys);
+                return animation;
+            });
+            return animations;
+        }
+    }
+    getClassName() {
+        return "FlowGraphInterpolationBlock" /* FlowGraphBlockNames.ValueInterpolation */;
+    }
+}
+RegisterClass("FlowGraphInterpolationBlock" /* FlowGraphBlockNames.ValueInterpolation */, FlowGraphInterpolationBlock);
+// #L54P2C
+//# sourceMappingURL=flowGraphInterpolationBlock.js.map

package/FlowGraph/Blocks/Execution/Animation/flowGraphInterpolationBlock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flowGraphInterpolationBlock.js","sourceRoot":"","sources":["../../../../../../../dev/core/src/FlowGraph/Blocks/Execution/Animation/flowGraphInterpolationBlock.ts"],"names":[],"mappings":"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","sourcesContent":["import type { EasingFunction } from \"core/Animations/easing\";\nimport { Constants } from \"core/Engines/constants\";\nimport { FlowGraphBlock, type IFlowGraphBlockConfiguration } from \"core/FlowGraph/flowGraphBlock\";\nimport type { FlowGraphContext } from \"core/FlowGraph/flowGraphContext\";\nimport type { FlowGraphDataConnection } from \"core/FlowGraph/flowGraphDataConnection\";\nimport type { FlowGraphTypes } from \"core/FlowGraph/flowGraphRichTypes\";\nimport { getRichTypeByAnimationType, getRichTypeByFlowGraphType, RichTypeAny, RichTypeNumber } from \"core/FlowGraph/flowGraphRichTypes\";\nimport { Animation } from \"core/Animations/animation\";\nimport { RegisterClass } from \"core/Misc/typeStore\";\nimport { FlowGraphBlockNames } from \"../../flowGraphBlockNames\";\n\n/**\n * Configuration for the interpolation block.\n */\nexport interface IFlowGraphInterpolationBlockConfiguration extends IFlowGraphBlockConfiguration {\n    /**\n     * The number of keyframes to interpolate between.\n     * Will default to 1 if not provided (i.e. from currentValue to a provided value in the time provided)\n     */\n    keyFramesCount?: number;\n\n    /**\n     * The duration of the interpolation.\n     */\n    duration?: number;\n\n    /**\n     * The name of the property that will be interpolated.\n     */\n    propertyName?: string | string[];\n\n    /**\n     * The type of the animation to create.\n     * Default is ANIMATIONTYPE_FLOAT\n     * This cannot be changed after construction, so make sure to pass the right value.\n     */\n    animationType?: number | FlowGraphTypes;\n}\n\n/**\n * This block is responsible for interpolating between two values.\n * The babylon concept used is Animation, and it is the output of this block.\n *\n * Note that values will be parsed when the in connection is triggered. until then changing the value will not trigger a new interpolation.\n *\n * Internally this block uses the Animation class.\n *\n * Note that if the interpolation is already running a signal will be sent to stop the animation group running it.\n */\nexport class FlowGraphInterpolationBlock<T> extends FlowGraphBlock {\n    /**\n     * Input connection: The value to interpolate from.\n     * Optional. If not provided, the current value will be used.\n     * Note that if provided, every time the animation is created this value will be used!\n     */\n    public readonly initialValue: FlowGraphDataConnection<T>;\n\n    /**\n     * Input connection: The value to interpolate to.\n     * Optional. This can also be set using the KeyFrames input!\n     * If provided it will be set to the last keyframe value.\n     */\n    public readonly endValue: FlowGraphDataConnection<T>;\n\n    /**\n     * output connection: The animation that will be created when in is triggered.\n     */\n    public readonly animation: FlowGraphDataConnection<Animation | Animation[]>;\n\n    /**\n     * Input connection: An optional easing function to use for the interpolation.\n     */\n    public readonly easingFunction: FlowGraphDataConnection<EasingFunction>;\n\n    /**\n     * Input connection: The name of the property that will be set\n     */\n    public readonly propertyName: FlowGraphDataConnection<string | string[]>;\n\n    /**\n     * If provided, this function will be used to create the animation object(s).\n     */\n    public readonly customBuildAnimation: FlowGraphDataConnection<\n        () => (keys: any[], fps: number, animationType: number, easingFunction?: EasingFunction) => Animation | Animation[]\n    >;\n\n    /**\n     * The keyframes to interpolate between.\n     * Each keyframe has a duration input and a value input.\n     */\n    public readonly keyFrames: {\n        duration: FlowGraphDataConnection<number>;\n        value: FlowGraphDataConnection<T>;\n    }[] = [];\n\n    constructor(config: IFlowGraphInterpolationBlockConfiguration = {}) {\n        super(config);\n        const type =\n            typeof config?.animationType === \"string\"\n                ? getRichTypeByFlowGraphType(config.animationType)\n                : getRichTypeByAnimationType(config?.animationType ?? Constants.ANIMATIONTYPE_FLOAT);\n\n        const numberOfKeyFrames = config?.keyFramesCount ?? 1;\n        const duration = this.registerDataInput(`duration_0`, RichTypeNumber, 0);\n        const value = this.registerDataInput(`value_0`, type);\n        this.keyFrames.push({ duration, value });\n        for (let i = 1; i < numberOfKeyFrames + 1; i++) {\n            const duration = this.registerDataInput(`duration_${i}`, RichTypeNumber, i === numberOfKeyFrames ? config.duration : undefined);\n            const value = this.registerDataInput(`value_${i}`, type);\n            this.keyFrames.push({ duration, value });\n        }\n        this.initialValue = this.keyFrames[0].value;\n        this.endValue = this.keyFrames[numberOfKeyFrames].value;\n        this.easingFunction = this.registerDataInput(\"easingFunction\", RichTypeAny);\n        this.animation = this.registerDataOutput(\"animation\", RichTypeAny);\n        this.propertyName = this.registerDataInput(\"propertyName\", RichTypeAny, config?.propertyName);\n        this.customBuildAnimation = this.registerDataInput(\"customBuildAnimation\", RichTypeAny);\n    }\n\n    public override _updateOutputs(context: FlowGraphContext): void {\n        const interpolationAnimations = context._getGlobalContextVariable(\"interpolationAnimations\", []) as number[];\n        const propertyName = this.propertyName.getValue(context);\n        const easingFunction = this.easingFunction.getValue(context);\n        const animation = this._createAnimation(context, propertyName, easingFunction);\n        // If an old animation exists, it will be ignored here.\n        // This is because if the animation is running and they both have the same target, the old will be stopped.\n        // This doesn't happen here, it happens in the play animation block.\n        this.animation.setValue(animation, context);\n        // to make sure no 2 interpolations are running on the same target, we will mark the animation in the context\n        if (Array.isArray(animation)) {\n            for (const anim of animation) {\n                interpolationAnimations.push(anim.uniqueId);\n            }\n        } else {\n            interpolationAnimations.push(animation.uniqueId);\n        }\n        context._setGlobalContextVariable(\"interpolationAnimations\", interpolationAnimations);\n    }\n\n    private _createAnimation(context: FlowGraphContext, propertyName: string | string[], easingFunction: EasingFunction): Animation | Animation[] {\n        const type = this.initialValue.richType;\n        const keys: { frame: number; value: T }[] = [];\n        // add initial value\n        const currentValue = this.initialValue.getValue(context) || type.defaultValue;\n        keys.push({ frame: 0, value: currentValue });\n        const numberOfKeyFrames = this.config?.numberOfKeyFrames ?? 1;\n        for (let i = 1; i < numberOfKeyFrames + 1; i++) {\n            const duration = this.keyFrames[i].duration?.getValue(context);\n            let value = this.keyFrames[i].value?.getValue(context);\n            if (i === numberOfKeyFrames - 1) {\n                value = value || type.defaultValue;\n            }\n            if (duration !== undefined && value) {\n                // convert duration to frames, based on 60 fps\n                keys.push({ frame: duration * 60, value });\n            }\n        }\n        const customBuildAnimation = this.customBuildAnimation.getValue(context);\n        if (customBuildAnimation) {\n            return customBuildAnimation()(keys, 60, type.animationType, easingFunction);\n        }\n        if (typeof propertyName === \"string\") {\n            const animation = Animation.CreateAnimation(propertyName, type.animationType, 60, easingFunction);\n            animation.setKeys(keys);\n            return [animation];\n        } else {\n            const animations = propertyName.map((name) => {\n                const animation = Animation.CreateAnimation(name, type.animationType, 60, easingFunction);\n                animation.setKeys(keys);\n                return animation;\n            });\n            return animations;\n        }\n    }\n\n    public override getClassName(): string {\n        return FlowGraphBlockNames.ValueInterpolation;\n    }\n}\n\nRegisterClass(FlowGraphBlockNames.ValueInterpolation, FlowGraphInterpolationBlock);\n\n// #L54P2C\n"]}

package/FlowGraph/Blocks/Execution/Animation/flowGraphPauseAnimationBlock.d.ts

@@ -1,8 +1,8 @@
 import type { FlowGraphContext } from "../../../flowGraphContext";
 import type { FlowGraphDataConnection } from "../../../flowGraphDataConnection";
 import { FlowGraphExecutionBlockWithOutSignal } from "../../../flowGraphExecutionBlockWithOutSignal";
-import type { Animatable } from "../../../../Animations/animatable.core";
 import type { IFlowGraphBlockConfiguration } from "../../../flowGraphBlock";
+import type { AnimationGroup } from "../../../../Animations/animationGroup.js";
 /**
  * @experimental
  * Block that pauses a running animation
@@ -11,7 +11,7 @@ export declare class FlowGraphPauseAnimationBlock extends FlowGraphExecutionBloc
     /**
      * Input connection: The animation to pause.
      */
-    readonly animationToPause: FlowGraphDataConnection<Animatable>;
+    readonly animationToPause: FlowGraphDataConnection<AnimationGroup>;
     constructor(config?: IFlowGraphBlockConfiguration);
     _execute(context: FlowGraphContext): void;
     /**

package/FlowGraph/Blocks/Execution/Animation/flowGraphPauseAnimationBlock.js

@@ -19,8 +19,8 @@ export class FlowGraphPauseAnimationBlock extends FlowGraphExecutionBlockWithOut
      * @returns class name of the block.
      */
     getClassName() {
-        return "FGPauseAnimationBlock";
+        return "FlowGraphPauseAnimationBlock" /* FlowGraphBlockNames.PauseAnimation */;
     }
 }
-RegisterClass("FGPauseAnimationBlock", FlowGraphPauseAnimationBlock);
+RegisterClass("FlowGraphPauseAnimationBlock" /* FlowGraphBlockNames.PauseAnimation */, FlowGraphPauseAnimationBlock);
 //# sourceMappingURL=flowGraphPauseAnimationBlock.js.map

package/FlowGraph/Blocks/Execution/Animation/flowGraphPauseAnimationBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"flowGraphPauseAnimationBlock.js","sourceRoot":"","sources":["../../../../../../../dev/core/src/FlowGraph/Blocks/Execution/Animation/flowGraphPauseAnimationBlock.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,oCAAoC,EAAE,MAAM,+CAA+C,CAAC;AAErG,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAE1D,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D;;;GAGG;AACH,MAAM,OAAO,4BAA6B,SAAQ,oCAAoC;IAMlF,YAAY,MAAqC;QAC7C,KAAK,CAAC,MAAM,CAAC,CAAC;QACd,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,EAAE,WAAW,CAAC,CAAC;IACpF,CAAC;IAEM,QAAQ,CAAC,OAAyB;QACrC,MAAM,qBAAqB,GAAG,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;QACtE,qBAAqB,CAAC,KAAK,EAAE,CAAC;QAC9B,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;IACtC,CAAC;IAED;;OAEG;IACa,YAAY;QACxB,OAAO,uBAAuB,CAAC;IACnC,CAAC;CACJ;AACD,aAAa,CAAC,uBAAuB,EAAE,4BAA4B,CAAC,CAAC","sourcesContent":["import type { FlowGraphContext } from \"../../../flowGraphContext\";\r\nimport type { FlowGraphDataConnection } from \"../../../flowGraphDataConnection\";\r\nimport { FlowGraphExecutionBlockWithOutSignal } from \"../../../flowGraphExecutionBlockWithOutSignal\";\r\nimport type { Animatable } from \"../../../../Animations/animatable.core\";\r\nimport { RichTypeAny } from \"../../../flowGraphRichTypes\";\r\nimport type { IFlowGraphBlockConfiguration } from \"../../../flowGraphBlock\";\r\nimport { RegisterClass } from \"../../../../Misc/typeStore\";\r\n/**\r\n * @experimental\r\n * Block that pauses a running animation\r\n */\r\nexport class FlowGraphPauseAnimationBlock extends FlowGraphExecutionBlockWithOutSignal {\r\n    /**\r\n     * Input connection: The animation to pause.\r\n     */\r\n    public readonly animationToPause: FlowGraphDataConnection<Animatable>;\r\n\r\n    constructor(config?: IFlowGraphBlockConfiguration) {\r\n        super(config);\r\n        this.animationToPause = this.registerDataInput(\"animationToPause\", RichTypeAny);\r\n    }\r\n\r\n    public _execute(context: FlowGraphContext): void {\r\n        const animationToPauseValue = this.animationToPause.getValue(context);\r\n        animationToPauseValue.pause();\r\n        this.out._activateSignal(context);\r\n    }\r\n\r\n    /**\r\n     * @returns class name of the block.\r\n     */\r\n    public override getClassName(): string {\r\n        return \"FGPauseAnimationBlock\";\r\n    }\r\n}\r\nRegisterClass(\"FGPauseAnimationBlock\", FlowGraphPauseAnimationBlock);\r\n"]}
+{"version":3,"file":"flowGraphPauseAnimationBlock.js","sourceRoot":"","sources":["../../../../../../../dev/core/src/FlowGraph/Blocks/Execution/Animation/flowGraphPauseAnimationBlock.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,oCAAoC,EAAE,MAAM,+CAA+C,CAAC;AACrG,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAE1D,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAG3D;;;GAGG;AACH,MAAM,OAAO,4BAA6B,SAAQ,oCAAoC;IAMlF,YAAY,MAAqC;QAC7C,KAAK,CAAC,MAAM,CAAC,CAAC;QACd,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,EAAE,WAAW,CAAC,CAAC;IACpF,CAAC;IAEM,QAAQ,CAAC,OAAyB;QACrC,MAAM,qBAAqB,GAAG,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;QACtE,qBAAqB,CAAC,KAAK,EAAE,CAAC;QAC9B,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;IACtC,CAAC;IAED;;OAEG;IACa,YAAY;QACxB,+EAA0C;IAC9C,CAAC;CACJ;AACD,aAAa,0EAAqC,4BAA4B,CAAC,CAAC","sourcesContent":["import type { FlowGraphContext } from \"../../../flowGraphContext\";\r\nimport type { FlowGraphDataConnection } from \"../../../flowGraphDataConnection\";\r\nimport { FlowGraphExecutionBlockWithOutSignal } from \"../../../flowGraphExecutionBlockWithOutSignal\";\r\nimport { RichTypeAny } from \"../../../flowGraphRichTypes\";\r\nimport type { IFlowGraphBlockConfiguration } from \"../../../flowGraphBlock\";\r\nimport { RegisterClass } from \"../../../../Misc/typeStore\";\r\nimport type { AnimationGroup } from \"core/Animations/animationGroup\";\r\nimport { FlowGraphBlockNames } from \"../../flowGraphBlockNames\";\r\n/**\r\n * @experimental\r\n * Block that pauses a running animation\r\n */\r\nexport class FlowGraphPauseAnimationBlock extends FlowGraphExecutionBlockWithOutSignal {\r\n    /**\r\n     * Input connection: The animation to pause.\r\n     */\r\n    public readonly animationToPause: FlowGraphDataConnection<AnimationGroup>;\r\n\r\n    constructor(config?: IFlowGraphBlockConfiguration) {\r\n        super(config);\r\n        this.animationToPause = this.registerDataInput(\"animationToPause\", RichTypeAny);\r\n    }\r\n\r\n    public _execute(context: FlowGraphContext): void {\r\n        const animationToPauseValue = this.animationToPause.getValue(context);\r\n        animationToPauseValue.pause();\r\n        this.out._activateSignal(context);\r\n    }\r\n\r\n    /**\r\n     * @returns class name of the block.\r\n     */\r\n    public override getClassName(): string {\r\n        return FlowGraphBlockNames.PauseAnimation;\r\n    }\r\n}\r\nRegisterClass(FlowGraphBlockNames.PauseAnimation, FlowGraphPauseAnimationBlock);\r\n"]}

package/FlowGraph/Blocks/Execution/Animation/flowGraphPlayAnimationBlock.d.ts

@@ -1,28 +1,9 @@
 import type { FlowGraphContext } from "../../../flowGraphContext";
-import type { Animatable } from "../../../../Animations/animatable.core";
 import type { FlowGraphDataConnection } from "../../../flowGraphDataConnection";
 import { FlowGraphAsyncExecutionBlock } from "../../../flowGraphAsyncExecutionBlock";
 import type { IFlowGraphBlockConfiguration } from "../../../flowGraphBlock";
-import type { IPathToObjectConverter } from "../../../../ObjectModel/objectModelInterfaces";
-import { FlowGraphPathConverterComponent } from "../../../flowGraphPathConverterComponent";
-import type { IObjectAccessor } from "../../../typeDefinitions";
-/**
- * @experimental
- */
-export interface IFlowGraphPlayAnimationBlockConfiguration extends IFlowGraphBlockConfiguration {
-    /**
-     * The path to the target object that will be animated.
-     */
-    targetPath: string;
-    /**
-     * The path to the animation that will be played.
-     */
-    animationPath: string;
-    /**
-     * The path converter to use to convert the path to an object accessor.
-     */
-    pathConverter: IPathToObjectConverter<IObjectAccessor>;
-}
+import { AnimationGroup } from "../../../../Animations/animationGroup.js";
+import type { Animation } from "../../../../Animations/animation.js";
 /**
  * @experimental
  * A block that plays an animation on an animatable object.
@@ -31,21 +12,14 @@ export declare class FlowGraphPlayAnimationBlock extends FlowGraphAsyncExecution
     /**
      * the configuration of the block
      */
-    config: IFlowGraphPlayAnimationBlockConfiguration;
-    /**
-     * The substitution inputs for template strings in the target
-     */
-    readonly templateTargetComponent: FlowGraphPathConverterComponent;
-    /**
-     * The substitution inputs for template strings in the animation
-     */
-    readonly templateAnimationComponent: FlowGraphPathConverterComponent;
+    config?: IFlowGraphBlockConfiguration | undefined;
     /**
      * Input connection: The speed of the animation.
      */
     readonly speed: FlowGraphDataConnection<number>;
     /**
      * Input connection: Should the animation loop?
+     * Not in glTF specs, but useful for the engine.
      */
     readonly loop: FlowGraphDataConnection<boolean>;
     /**
@@ -56,22 +30,55 @@ export declare class FlowGraphPlayAnimationBlock extends FlowGraphAsyncExecution
      * Input connection: The ending frame of the animation.
      */
     readonly to: FlowGraphDataConnection<number>;
+    /**
+     * Output connection: The current frame of the animation.
+     */
+    readonly currentFrame: FlowGraphDataConnection<number>;
+    /**
+     * Output connection: The current time of the animation.
+     */
+    readonly currentTime: FlowGraphDataConnection<number>;
     /**
      * Output connection: The animatable that is currently running.
      */
-    readonly runningAnimatable: FlowGraphDataConnection<Animatable>;
+    readonly currentAnimationGroup: FlowGraphDataConnection<AnimationGroup>;
+    /**
+     * Input: Will be initialized if no animation group was provided in the configuration.
+     */
+    readonly animationGroup: FlowGraphDataConnection<AnimationGroup>;
+    /**
+     * Input: If provided this animation will be used. Priority will be given to the animation group input.
+     */
+    readonly animation: FlowGraphDataConnection<Animation | Animation[]>;
+    /**
+     * Input connection: The target object that will be animated. If animation group is provided this input will be ignored.
+     */
+    readonly object: FlowGraphDataConnection<any>;
     constructor(
     /**
      * the configuration of the block
      */
-    config: IFlowGraphPlayAnimationBlockConfiguration);
+    config?: IFlowGraphBlockConfiguration | undefined);
     /**
      * @internal
      * @param context
      */
     _preparePendingTasks(context: FlowGraphContext): void;
+    /**
+     * @internal
+     */
+    _executeOnTick(_context: FlowGraphContext): void;
     _execute(context: FlowGraphContext): void;
-    private _onAnimationEnd;
+    private _onAnimationGroupEnd;
+    /**
+     * The idea behind this function is to check every running animation group and check if the targeted animations it uses are interpolation animations.
+     * If they are, we want to see that they don't collide with the current interpolation animations that are starting to play.
+     * If they do, we want to stop the already-running animation group.
+     * @internal
+     */
+    private _checkInterpolationDuplications;
+    private _stopAnimationGroup;
+    private _removeFromCurrentlyRunning;
     /**
      * @internal
      * Stop any currently running animations.
@@ -81,13 +88,4 @@ export declare class FlowGraphPlayAnimationBlock extends FlowGraphAsyncExecution
      * @returns class name of the block.
      */
     getClassName(): string;
-    /**
-     * Serializes the block to a JSON object.
-     * @param serializationObject the object to serialize to.
-     */
-    serialize(serializationObject?: any): void;
-    /**
-     * Class name of the block.
-     */
-    static ClassName: string;
 }