add Action loop styles, LoopOnce, LoopRepeat and LoopPingPong

examples/js/BlendCharacter.js

@@ -49,7 +49,7 @@ THREE.BlendCharacter = function () {
 
 		this.mixer.removeAllActions();
 		
-		this.mixer.play( new THREE.AnimationAction( this.clips[ animName ], 0, 1, 1, true ) );
+		this.mixer.play( new THREE.AnimationAction( this.clips[ animName ] ) );
 
 	};
 
@@ -57,8 +57,8 @@ THREE.BlendCharacter = function () {
 
 		this.mixer.removeAllActions();
  
-		var fromAction = new THREE.AnimationAction( this.clips[ fromAnimName ], 0, 1, 1, true );
-		var toAction = new THREE.AnimationAction( this.clips[ toAnimName ], 0, 1, 1, true );
+		var fromAction = new THREE.AnimationAction( this.clips[ fromAnimName ] );
+		var toAction = new THREE.AnimationAction( this.clips[ toAnimName ] );
 
 		this.mixer.play( fromAction );
 		this.mixer.play( toAction );
@@ -71,8 +71,8 @@ THREE.BlendCharacter = function () {
 
 		this.mixer.removeAllActions();
 
-		var fromAction = new THREE.AnimationAction( this.clips[ fromAnimName ], 0, 1, 1, true );
-		var toAction = new THREE.AnimationAction( this.clips[ toAnimName ], 0, 1, 1, true );
+		var fromAction = new THREE.AnimationAction( this.clips[ fromAnimName ] );
+		var toAction = new THREE.AnimationAction( this.clips[ toAnimName ] );
 
 		this.mixer.play( fromAction );
 		this.mixer.play( toAction );

examples/js/MorphAnimMesh.js

@@ -40,7 +40,7 @@ THREE.MorphAnimMesh.prototype.playAnimation = function ( label, fps ) {
 
 	if ( clip ) {
 
-		var action = new THREE.AnimationAction( clip, 0, 1, 1, true );
+		var action = new THREE.AnimationAction( clip );
 		action.timeScale = ( clip.tracks.length * fps ) / clip.duration;
 		this.mixer.addAction( action );
 		this.activeAction = action;

examples/js/UCSCharacter.js

@@ -55,7 +55,7 @@ THREE.UCSCharacter = function() {
 			mesh.castShadow = true;
 			mesh.receiveShadow = true;
 
-			scope.mixer.addAction( new THREE.AnimationAction( geometry.clips[0], 0, 1, 1, true ).setLocalRoot( mesh ) );
+			scope.mixer.addAction( new THREE.AnimationAction( geometry.clips[0] ).setLocalRoot( mesh ) );
 			
 			scope.setSkin( 0 );
 			

examples/webgl_animation_blend.html

@@ -136,7 +136,7 @@
 					var clip = blendObject.geometry.clips[0];
 					console.log( clip );
 					mixer = new THREE.AnimationMixer( blendObject );
-					mixer.addAction( new THREE.AnimationAction( clip, 0, 1, 1, true ) );
+					mixer.addAction( new THREE.AnimationAction( clip ) );
 
 				} );
 

examples/webgl_animation_scene.html

@@ -131,7 +131,7 @@
 		
 					mixer = new THREE.AnimationMixer( scene );
 			
-					mixer.addAction( new THREE.AnimationAction( sceneAnimationClip, 0, 1, 1, true ) );
+					mixer.addAction( new THREE.AnimationAction( sceneAnimationClip ) );
 
 				} );
 

examples/webgl_animation_skinning_morph.html

@@ -237,8 +237,8 @@
 				var clipBones = geometry.clips[0];
 
 				mixer = new THREE.AnimationMixer( mesh );
-				mixer.addAction( new THREE.AnimationAction( clipMorpher, 0, 1, 1, true ) );
-				mixer.addAction( new THREE.AnimationAction( clipBones, 0, 1, 1, true ) );
+				mixer.addAction( new THREE.AnimationAction( clipMorpher ) );
+				mixer.addAction( new THREE.AnimationAction( clipBones ) );
 			}
 
 			function initGUI() {

src/Three.js

@@ -265,6 +265,11 @@ THREE.RGB_PVRTC_2BPPV1_Format = 2101;
 THREE.RGBA_PVRTC_4BPPV1_Format = 2102;
 THREE.RGBA_PVRTC_2BPPV1_Format = 2103;
 
+// Loop styles for AnimationAction
+
+THREE.LoopOnce = 2200;
+THREE.LoopRepeat = 2201;
+THREE.LoopPingPong = 2202;
 
 // DEPRECATED
 

src/animation/AnimationAction.js

@@ -6,23 +6,31 @@
  * @author David Sarno / http://lighthaus.us/
  */
 
-THREE.AnimationAction = function ( clip, startTime, timeScale, weight, loop ) {
+THREE.AnimationAction = function ( clip, startTime, timeScale, weight, loopStyle ) {
 
 	if( clip === undefined ) throw new Error( 'clip is null' );
+	if( loopStyle === true || loopStyle === false ) console.error( "loopStyle isn't set properly" );
 	this.clip = clip;
 	this.localRoot = null;
 	this.startTime = startTime || 0;
 	this.timeScale = timeScale || 1;
 	this.weight = weight || 1;
-	this.loop = loop || clip.loop || true;
+	this.loopStyle = loopStyle || THREE.LoopRepeat;
 	this.loopCount = 0;
 	this.enabled = true;	// allow for easy disabling of the action.
 
+	this.actionTime = - this.startTime;
 	this.clipTime = 0;
 
 	this.propertyBindingIndices = [];
 };
 
+/*
+THREE.LoopOnce = 2200;
+THREE.LoopRepeat = 2201;
+THREE.LoopPingPing = 2202;
+*/
+
 THREE.AnimationAction.prototype = {
 
 	constructor: THREE.AnimationAction,
@@ -37,63 +45,68 @@ THREE.AnimationAction.prototype = {
 
 	updateTime: function( clipDeltaTime ) {
 
-		var newClipTime = this.clipTime + clipDeltaTime;
-		var duration = this.clip.duration;
+		var previousClipTime = this.clipTime;
+   		var previousLoopCount = this.loopCount;
+   		var previousActionTime = this.actionTime;
 
-		if( newClipTime <= 0 ) {
+		var duration = this.clip.duration;
 
-			if( this.loop ) {
+		this.actionTime = this.actionTime + clipDeltaTime * this.timeScale;
+		console.log( 'actionTime1', this.actionTime );
+		console.log( 'clipDeltaTime', clipDeltaTime );
+		console.log( 'this.timeScale', this.timeScale );
+		console.log( 'duration', duration );
 
-				newClipTime -= Math.floor( newClipTime / duration ) * duration;
-		   		this.clipTime = newClipTime % duration;
+		if( this.loopStyle === THREE.LoopOnce ) {
 
-		   		this.loopCount --;
+			this.loopCount = 0;
+			this.clipTime = Math.min( Math.max( this.actionTime, 0 ), duration );
 
-	   			this.mixer.dispatchEvent( { type: 'loop', action: this, direction: -1 } );
+			// if time is changed since last time, see if we have hit a start/end limit
+			if( this.clipTime !== previousClipTime ) {
 
-			}
-			else {
+				if( this.clipTime === duration ) {
 
-		   		if( this.clipTime > 0 ) {
+					this.mixer.dispatchEvent( { type: 'finished', action: this, direction: 1 } );
 
-		   			this.mixer.dispatchEvent( { type: 'finished', action: this, direction: -1 } );
+				}
+				else if( this.clipTime === 0 ) {
 
-		   		}
+					this.mixer.dispatchEvent( { type: 'finished', action: this, direction: -1 } );
 
-				this.clipTime = Math.min( newClipTime, Math.max( duration, 0 ) );
+				}
 
 			}
 
+		
+			return this.clipTime;
+
 		}
-		else if( newClipTime >= duration ) {
+		
+		this.loopCount = Math.floor( this.actionTime / duration );
+		var newClipTime = this.actionTime - this.loopCount * duration;
+		newClipTime = newClipTime % duration;
 
-			if( this.loop ) {
-	
-				this.clipTime = newClipTime % duration;
+		// if we are ping pong looping, ensure that we go backwards when appropriate
+		if( this.loopStyle == THREE.LoopPingPong ) {
 
-		   		this.loopCount ++;
-	
-	 			this.mixer.dispatchEvent( { type: 'loop', action: this, direction: +1 } );
+			if( Math.abs( this.loopCount % 2 ) === 1 ) {
 
-			}
-			else {
+				newClipTime = duration - newClipTime;
 
-		   		if( this.clipTime < duration ) {
+			}
 
-		   			this.mixer.dispatchEvent( { type: 'finished', action: this, direction: +1 } );
+		}
 
-		   		}
+		this.clipTime = newClipTime;
 
-				this.clipTime = Math.min( newClipTime, Math.max( duration, 0 ) );
+		console.log( 'actionTime', this.actionTime, 'loopCount', this.loopCount, 'clipTime', this.clipTime );
 
-		   	}
+   		if( this.loopCount !== previousLoopCount ) {
 
-	   	}
-	   	else {
+   			this.mixer.dispatchEvent( { type: 'loop', action: this, loopDelta: ( this.loopCount - this.loopCount ) } );
 
-	   		this.clipTime = newClipTime;
-	   		
-	   	}
+   		}
 	
 	   	return this.clipTime;