BlendCharacter example works great.

examples/js/BlendCharacter.js

@@ -47,6 +47,7 @@ THREE.BlendCharacter = function () {
 	this.play = function( animName, weight ) {
 
 		this.mixer.removeAllActions();
+		
 		this.mixer.play( new THREE.AnimationAction( this.animations[ animName ], 0, 1, 1, true ) );
 
 	};
@@ -54,7 +55,7 @@ THREE.BlendCharacter = function () {
 	this.crossfade = function( fromAnimName, toAnimName, duration ) {
 
 		this.mixer.removeAllActions();
-
+ 
 		var fromAction = new THREE.AnimationAction( this.animations[ fromAnimName ], 0, 1, 1, true );
 		var toAction = new THREE.AnimationAction( this.animations[ toAnimName ], 0, 1, 1, true );
 

examples/js/BlendCharacterGui.js

@@ -2,7 +2,7 @@
  * @author Michael Guerrero / http://realitymeltdown.com
  */
 
-function BlendCharacterGui( animations ) {
+function BlendCharacterGui( blendMesh ) {
 
 	var controls = {
 
@@ -18,7 +18,7 @@ function BlendCharacterGui( animations ) {
 
 	};
 
-	var animations = animations;
+	var blendMesh = blendMesh;
 
 	this.showModel = function() {
 
@@ -38,11 +38,20 @@ function BlendCharacterGui( animations ) {
 
 	};
 
-	this.update = function() {
+	this.update = function( time ) {
 
-		controls[ 'idle' ] = animations[ 'idle' ].weight;
-		controls[ 'walk' ] = animations[ 'walk' ].weight;
-		controls[ 'run' ] = animations[ 'run' ].weight;
+		var getWeight = function( actionName ) {
+			for( var i = 0; i < blendMesh.mixer.actions.length; i ++ ) {
+				var action = blendMesh.mixer.actions[i];
+				if( action.clip.name === actionName ) {
+					return action.getWeightAt( time );	
+				}
+			}
+			return 0;
+		}
+		controls[ 'idle' ] = getWeight( 'idle' );
+		controls[ 'walk' ] = getWeight( 'walk' );
+		controls[ 'run' ] = getWeight( 'run' );
 
 	};
 

examples/webgl_animation_skinning_blending.html

@@ -116,6 +116,7 @@
 				var data = event.detail;
 
 				blendMesh.stopAll();
+				blendMesh.unPauseAll();
 
 				// the blend mesh will combine 1 or more animations
 				for ( var i = 0; i < data.anims.length; ++i ) {
@@ -155,7 +156,14 @@
 				var data = event.detail;
 				for ( var i = 0; i < data.anims.length; ++i ) {
 
-					blendMesh.applyWeight(data.anims[i], data.weights[i]);
+					for( var j = 0; j < blendMesh.mixer.actions.length; j ++ ) {
+						var action = blendMesh.mixer.actions[j];
+						if( action.clip.name === data.anims[i] ) {
+							if( action.getWeightAt( blendMesh.mixer.time ) !== data.weights[i] ) {
+								action.weight = data.weights[i];
+							}
+						}
+					}
 
 				}
 
@@ -218,7 +226,7 @@
 				blendMesh.animations[ 'walk' ].weight = 1 / 3;
 				blendMesh.animations[ 'run' ].weight = 1 / 3;
 
-				gui = new BlendCharacterGui(blendMesh.animations);
+				gui = new BlendCharacterGui(blendMesh);
 
 				// Create the debug visualization
 
@@ -245,9 +253,7 @@
 
 				blendMesh.update( stepSize );
 				helper.update();
-				gui.update();
-
-				THREE.AnimationHandler.update( stepSize );
+				gui.update( blendMesh.mixer.time );
 
 				renderer.render( scene, camera );
 				stats.update();

src/animation/AnimationAction.js

@@ -15,7 +15,6 @@ THREE.AnimationAction = function ( clip, startTime, timeScale, weight, loop ) {
 	this.loop = loop || clip.loop || false;
 	this.enabled = true;	// allow for easy disabling of the action.
 
-	this.time = 0;
 	this.clipTime = 0;
 };
 
@@ -23,12 +22,12 @@ THREE.AnimationAction.prototype = {
 
 	constructor: THREE.AnimationAction,
 
-	updateTime: function( deltaTime ) {
+	updateTime: function( clipDeltaTime ) {
 
 		//console.log( 'AnimationAction[' + this.clip.name + '].toAnimationClipTime( ' + time + ' )' );
-		this.time += deltaTime;
-		this.clipTime += deltaTime * this.getTimeScaleAt( this.time );
+		this.clipTime += clipDeltaTime;
 
+		//console.log( this.clip.name, '.getTimeScaleAt( ' + this.time + ' )', this.getTimeScaleAt( this.time ) );
 		//console.log( '   clipTime: ' + clipTime );
 
 		var duration = this.clip.duration;
@@ -51,22 +50,22 @@ THREE.AnimationAction.prototype = {
 
 	   	}
 
+	
 	   	return this.clipTime;
 
 	},
 
 	init: function( time ) {
 
-		this.time = time;
 		this.clipTime = time - this.startTime;
 
 	},
 
-	update: function( deltaTime ) {
+	update: function( clipDeltaTime ) {
 
 		//console.log( 'AnimationAction[' + this.clip.name + '].getAt( ' + time + ' )' );
 
-		this.updateTime( deltaTime );
+		this.updateTime( clipDeltaTime );
 
 		var clipResults = this.clip.getAt( this.clipTime );
 

src/animation/AnimationMixer.js

@@ -110,7 +110,7 @@ THREE.AnimationMixer.prototype = {
 
 		var keys = [];
 
-		keys.push( { time: this.time, value: action.getWeightAt( this.time ) } );
+		keys.push( { time: this.time, value: 1 } );
 		keys.push( { time: this.time + duration, value: 0 } );
 		
 		action.weight = new THREE.KeyframeTrack( "weight", keys );
@@ -120,7 +120,7 @@ THREE.AnimationMixer.prototype = {
 		
 		var keys = [];
 		
-		keys.push( { time: this.time, value: action.getWeightAt( this.time ) } );
+		keys.push( { time: this.time, value: 0 } );
 		keys.push( { time: this.time + duration, value: 1 } );
 		
 		action.weight = new THREE.KeyframeTrack( "weight", keys );
@@ -138,14 +138,14 @@ THREE.AnimationMixer.prototype = {
 
 	},
 
-	crossFade: function( fadeOutAction, fadeInAction, duration, wrapTimeScales ) {
+	crossFade: function( fadeOutAction, fadeInAction, duration, warp ) {
 
 		this.fadeOut( fadeOutAction, duration );
 		this.fadeIn( fadeInAction, duration );
 
-		if( wrapTimeScales ) {
+		if( warp ) {
 	
-			var startEndRatio = fadeOutAction.duration / fadeInAction.duration;
+			var startEndRatio = fadeOutAction.clip.duration / fadeInAction.clip.duration;
 			var endStartRatio = 1.0 / startEndRatio;
 
 			this.warp( fadeOutAction, 1.0, startEndRatio, duration );
@@ -167,10 +167,14 @@ THREE.AnimationMixer.prototype = {
 			var action = this.actions[i];
 
 			var weight = action.getWeightAt( this.time );
-			
-			if( action.weight <= 0 || ! action.enabled ) continue;
+			//console.log( action.clip.name, weight, this.time );
 
-			var actionResults = action.update( mixerDeltaTime );
+			var actionTimeScale = action.getTimeScaleAt( this.time );
+			var actionDeltaTime = mixerDeltaTime * actionTimeScale;
+		
+			var actionResults = action.update( actionDeltaTime );
+
+			if( action.weight <= 0 || ! action.enabled ) continue;
 
 			for( var name in actionResults ) {
 

src/animation/KeyframeTrack.js

@@ -205,9 +205,9 @@ THREE.KeyframeTrack.prototype = {
 		}
 		newKeys.push( this.keys[ this.keys.length - 1 ] );
 
-		if( ( this.keys.length - newKeys.length ) > 0 ) {
-			console.log( '  optimizing removed keys:', ( this.keys.length - newKeys.length ), this.name );
-		}
+		//if( ( this.keys.length - newKeys.length ) > 0 ) {
+			//console.log( '  optimizing removed keys:', ( this.keys.length - newKeys.length ), this.name );
+		//}
 		this.keys = newKeys;
 
 	},
@@ -234,9 +234,8 @@ THREE.KeyframeTrack.prototype = {
 		}
 
 		// remove last keys first because it doesn't affect the position of the first keys (the otherway around doesn't work as easily)
-		// TODO: Figure out if there is an array subarray function... might be faster
 		if( ( firstKeysToRemove + lastKeysToRemove ) > 0 ) {
-			console.log(  '  triming removed keys: first and last', firstKeysToRemove, lastKeysToRemove, this.keys );
+			//console.log(  '  triming removed keys: first and last', firstKeysToRemove, lastKeysToRemove, this.keys );
 			this.keys = this.keys.splice( firstKeysToRemove, this.keys.length - lastKeysToRemove - firstKeysToRemove );;
 			//console.log(  '  result', this.keys );
 		}

src/animation/PropertyBinding.js

@@ -46,10 +46,14 @@ THREE.PropertyBinding.prototype = {
 
 		if( this.cumulativeWeight === 0 ) {
 
-			if( this.cumulativeValue === null ) {
-				this.cumulativeValue = THREE.AnimationUtils.clone( value );
+			if( weight > 0 ) {
+				
+				if( this.cumulativeValue === null ) {
+					this.cumulativeValue = THREE.AnimationUtils.clone( value );
+				}
+				this.cumulativeWeight = weight;
+
 			}
-			this.cumulativeWeight = weight;
 			//console.log( this );
 
 		}