Specify the animatables to retarget in the parameters of mergeAnimationsTo

Clean up unused stuff
Other minor changes

inspector/src/components/actionTabs/tabs/toolsTabComponent.tsx

@@ -244,7 +244,7 @@ export class ToolsTabComponent extends PaneComponent {
                     }} />
                     {
                         sceneImportDefaults["overwriteAnimations"] === false &&
-                        <OptionsLineComponent label="Old animation groups loading mode" options={animationGroupLoadingModes} target={sceneImportDefaults} propertyName="animationGroupLoadingMode" />
+                        <OptionsLineComponent label="Animation merge mode" options={animationGroupLoadingModes} target={sceneImportDefaults} propertyName="animationGroupLoadingMode" />
                     }
                 </LineContainerComponent>
                 <LineContainerComponent globalState={this.props.globalState} title="SCENE EXPORT">

loaders/src/glTF/2.0/Extensions/KHR_lights_punctual.ts

@@ -39,10 +39,6 @@ interface ILights {
     lights: ILight[];
 }
 
-interface ObjectWithMetadata {
-    metadata: any;
-}
-
 /**
  * [Specification](https://github.com/KhronosGroup/glTF/blob/master/extensions/2.0/Khronos/KHR_lights_punctual/README.md)
  */

sandbox/animation.js

@@ -45,8 +45,8 @@ dropdownBtn.addEventListener("click", function() {
 });
 
 function selectCurrentGroup(group, index, animation) {
-    for (var i = 0; i < dropdownContent.children.length; i++) {
-        dropdownContent.children[i].classList.remove("active");
+    if (currentGroupIndex !== undefined) {
+        document.getElementById(formatId(currentGroup.name + "-" + currentGroupIndex)).classList.remove("active");
     }
     playBtn.classList.remove("play");
     playBtn.classList.add("pause");

sandbox/index.css

@@ -129,10 +129,6 @@ a:visited {
     height: var(--footer-height);
 }
 
-.custom-upload-animation {
-    background:url(./Assets/Icon_OpenAnimFile.png) center right no-repeat;
-}
-
 .custom-upload input[type=file]
 {
     outline:none;

sandbox/index.html

@@ -66,9 +66,8 @@
                 </a>
                 <a href="javascript:void(null);" id="btnInspector" class="hidden"><img src="./Assets/Icon_EditModel.svg"
                         alt="Display inspector" title="Display inspector" /></a>
-                <a href="javascript:void(null);" id="animationFilesButton" class="hidden">
-                    <div id="dropdownContent-env" class="hidden">
-                    </div>
+                <div id="dropdownContent-env" class="hidden">
+                </div>
             </div>
         </div>
         <div id="logoContainer">

sandbox/index.js

@@ -48,7 +48,6 @@ if (BABYLON.Engine.isSupported()) {
     var btnInspector = document.getElementById("btnInspector");
     var errorZone = document.getElementById("errorZone");
     var filesInput;
-    var filesInputAnimation;
     var currentScene;
     var currentSkybox;
     var currentPluginName;

src/abstractScene.ts

@@ -208,7 +208,7 @@ export abstract class AbstractScene {
         nodes = nodes.concat(this.lights);
         nodes = nodes.concat(this.cameras);
         nodes = nodes.concat(this.transformNodes); // dummies
-        this.skeletons.forEach(skeleton => nodes = nodes.concat(skeleton.bones));
+        this.skeletons.forEach((skeleton) => nodes = nodes.concat(skeleton.bones));
         return nodes;
     }
 }

src/assetContainer.ts

@@ -4,6 +4,7 @@ import { Mesh } from "./Meshes/mesh";
 import { TransformNode } from './Meshes/transformNode';
 import { Skeleton } from './Bones/skeleton';
 import { AnimationGroup } from './Animations/animationGroup';
+import { Animatable } from './Animations/animatable';
 import { AbstractMesh } from './Meshes/abstractMesh';
 import { MultiMaterial } from './Materials/multiMaterial';
 import { Material } from './Materials/material';
@@ -462,26 +463,27 @@ export class AssetContainer extends AbstractScene {
     /**
      * Merge animations from this asset container into a scene
      * @param scene is the instance of BABYLON.Scene to append to (default: last created scene)
+     * @param animatables set of animatables to retarget to a node from the scene
      * @param targetConverter defines a function used to convert animation targets from the asset container to the scene (default: search node by name)
      */
-    public mergeAnimationsTo(scene: Nullable<Scene> = EngineStore.LastCreatedScene, targetConverter: Nullable<(target: any) => Nullable<Node>> = null): void {
+    public mergeAnimationsTo(scene: Nullable<Scene> = EngineStore.LastCreatedScene, animatables: Animatable[], targetConverter: Nullable<(target: any) => Nullable<Node>> = null): void {
         if (!scene) {
             Logger.Error("No scene available to merge animations to");
             return;
         }
 
-        let _targetConverter = targetConverter ? targetConverter : (target: any) => { return scene.getBoneByName(target.name) || scene.getNodeByName(target.name) };
+        let _targetConverter = targetConverter ? targetConverter : (target: any) => { return scene.getBoneByName(target.name) || scene.getNodeByName(target.name); };
 
-        // Copy node animations
+        // Copy new node animations
         let nodesInAC = this.getNodes();
-        nodesInAC.forEach(nodeInAC => {
+        nodesInAC.forEach((nodeInAC) => {
             let nodeInScene = _targetConverter(nodeInAC);
-            if (nodeInScene != null) {
+            if (nodeInScene !== null) {
                 // Remove old animations with same target property as a new one
                 for (let animationInAC of nodeInAC.animations) {
                     // Doing treatment on an array for safety measure
-                    let animationsWithSameProperty = nodeInScene.animations.filter(animationInScene => {
-                        return animationInScene.targetProperty === animationInAC.targetProperty
+                    let animationsWithSameProperty = nodeInScene.animations.filter((animationInScene) => {
+                        return animationInScene.targetProperty === animationInAC.targetProperty;
                     });
                     for (let animationWithSameProperty of animationsWithSameProperty) {
                         const index = nodeInScene.animations.indexOf(animationWithSameProperty, 0);
@@ -496,23 +498,22 @@ export class AssetContainer extends AbstractScene {
             }
         });
 
-        // Copy animation groups
-        this.animationGroups.slice().forEach(animationGroupInAC => {
+        // Copy new animation groups
+        this.animationGroups.slice().forEach((animationGroupInAC) => {
             // Clone the animation group and all its animatables
             animationGroupInAC.clone(animationGroupInAC.name, _targetConverter);
 
             // Remove animatables related to the asset container
-            animationGroupInAC.animatables.forEach(animatable => {
+            animationGroupInAC.animatables.forEach((animatable) => {
                 animatable.stop();
-            })
+            });
         });
 
-        // Copy animatables
-        scene.animatables.slice().forEach(animatable => {
+        // Retarget animatables
+        animatables.forEach((animatable) => {
             let target = _targetConverter(animatable.target);
 
-            // If the animatable has just been loaded
-            if (target && target !== animatable.target) {
+            if (target) {
                 // Clone the animatable and retarget it
                 scene.beginAnimation(target, animatable.fromFrame, animatable.toFrame, animatable.loopAnimation, animatable.speedRatio, animatable.onAnimationEnd ? animatable.onAnimationEnd : undefined, undefined, true, undefined, animatable.onAnimationLoop ? animatable.onAnimationLoop : undefined);