Merge pull request #5276 from bghgary/morphTarget-fix

Morph target fix

sandbox/index.js

@@ -388,6 +388,7 @@ dropdownBtn.addEventListener("click", function () {
 function createDropdownLink(group, index) {
     var animation = document.createElement("a");
     animation.innerHTML = group.name;
+    animation.title = group.name;
     animation.setAttribute("id", formatId(group.name + "-" + index));
     animation.addEventListener("click", function () {
         // stop the current animation group
@@ -403,6 +404,7 @@ function createDropdownLink(group, index) {
         currentGroup.start(true);
         this.classList.add("active");
         dropdownLabel.innerHTML = currentGroup.name;
+        dropdownLabel.title = currentGroup.name;
 
         // set the slider
         slider.setAttribute("min", currentGroup.from);

src/Mesh/babylon.geometry.ts

@@ -706,6 +706,9 @@ module BABYLON {
             if (this._indexBuffer) {
                 this._indexBuffer.references = numOfMeshes;
             }
+
+            // morphTargets
+            mesh._syncGeometryWithMorphTargetManager();
         }
 
         private notifyUpdate(kind?: string) {

src/Morph/babylon.morphTarget.ts

@@ -20,6 +20,9 @@ module BABYLON {
          */
         public onInfluenceChanged = new Observable<boolean>();
 
+        /** @hidden */
+        public _onDataLayoutChanged = new Observable<void>();
+
         /**
          * Gets or sets the influence of this target (ie. its weight in the overall morphing)
          */
@@ -94,7 +97,13 @@ module BABYLON {
          * @param data defines the position data to use
          */
         public setPositions(data: Nullable<FloatArray>) {
+            const hadPositions = this.hasPositions;
+
             this._positions = data;
+
+            if (hadPositions !== this.hasPositions) {
+                this._onDataLayoutChanged.notifyObservers(undefined);
+            }
         }
 
         /**
@@ -110,7 +119,13 @@ module BABYLON {
          * @param data defines the normal data to use
          */
         public setNormals(data: Nullable<FloatArray>) {
+            const hadNormals = this.hasNormals;
+
             this._normals = data;
+
+            if (hadNormals !== this.hasNormals) {
+                this._onDataLayoutChanged.notifyObservers(undefined);
+            }
         }
 
         /**
@@ -126,7 +141,13 @@ module BABYLON {
          * @param data defines the tangent data to use
          */
         public setTangents(data: Nullable<FloatArray>) {
+            const hadTangents = this.hasTangents;
+
             this._tangents = data;
+
+            if (hadTangents !== this.hasTangents) {
+                this._onDataLayoutChanged.notifyObservers(undefined);
+            }
         }
 
         /**

src/Morph/babylon.morphTargetManager.ts

@@ -5,7 +5,8 @@ module BABYLON {
      */
     export class MorphTargetManager {
         private _targets = new Array<MorphTarget>();
-        private _targetObservable = new Array<Nullable<Observer<boolean>>>();
+        private _targetInfluenceChangedObservers = new Array<Nullable<Observer<boolean>>>();
+        private _targetDataLayoutChangedObservers = new Array<Nullable<Observer<void>>>();
         private _activeTargets = new SmartArray<MorphTarget>(16);
         private _scene: Nullable<Scene>;
         private _influences: Float32Array;
@@ -106,9 +107,12 @@ module BABYLON {
          */
         public addTarget(target: MorphTarget): void {
             this._targets.push(target);
-            this._targetObservable.push(target.onInfluenceChanged.add((needUpdate) => {
+            this._targetInfluenceChangedObservers.push(target.onInfluenceChanged.add((needUpdate) => {
                 this._syncActiveTargets(needUpdate);
             }));
+            this._targetDataLayoutChangedObservers.push(target._onDataLayoutChanged.add(() => {
+                this._syncActiveTargets(true);
+            }));
             this._syncActiveTargets(true);
         }
 
@@ -121,7 +125,8 @@ module BABYLON {
             if (index >= 0) {
                 this._targets.splice(index, 1);
 
-                target.onInfluenceChanged.remove(this._targetObservable.splice(index, 1)[0]);
+                target.onInfluenceChanged.remove(this._targetInfluenceChangedObservers.splice(index, 1)[0]);
+                target._onDataLayoutChanged.remove(this._targetDataLayoutChangedObservers.splice(index, 1)[0]);
                 this._syncActiveTargets(true);
             }
         }
@@ -150,14 +155,18 @@ module BABYLON {
             this._supportsTangents = true;
             this._vertexCount = 0;
             for (var target of this._targets) {
+                if (target.influence === 0) {
+                    continue;
+                }
+
                 this._activeTargets.push(target);
                 this._tempInfluences[influenceCount++] = target.influence;
 
+                this._supportsNormals = this._supportsNormals && target.hasNormals;
+                this._supportsTangents = this._supportsTangents && target.hasTangents;
+
                 const positions = target.getPositions();
                 if (positions) {
-                    this._supportsNormals = this._supportsNormals && target.hasNormals;
-                    this._supportsTangents = this._supportsTangents && target.hasTangents;
-
                     const vertexCount = positions.length / 3;
                     if (this._vertexCount === 0) {
                         this._vertexCount = vertexCount;