SEA3D Update (#8920)

* add clone asset example ( middle click to clone )

* optimization

* remove unnecessary .cullFace

* unify animation mixers

* Revert "unify animation mixers"

This reverts commit 97872707757c5eb7d454aa481b0bf0ee44183685.

* mixer.timeScale to action.setEffectiveTimeScale

* fix keyframe animation loader and clampWhenFinished

* removed not more necessary includes

* pause mixer update after finish non-loop animation

examples/js/loaders/sea3d/SEA3DLoader.js

@@ -476,6 +476,8 @@ THREE.SEA3D.Animator.prototype.update = function( dt ) {
 
 	if ( ! this.currentAnimationAction.enabled && ! this.currentAnimationData.completed ) {
 
+		this.pause();
+
 		this.currentAnimationData.completed = true;
 
 		if ( this.currentAnimationData.onComplete ) this.currentAnimationData.onComplete( this );
@@ -495,7 +497,7 @@ THREE.SEA3D.Animator.prototype.updateAnimations = function( mixer ) {
 	this.relative = false;
 	this.playing = false;
 
-	this.setTimeScale( 1 );
+	this.timeScale = 1;
 
 	this.animations = [];
 	this.animationsData = {};
@@ -551,15 +553,21 @@ THREE.SEA3D.Animator.prototype.resume = function() {
 
 THREE.SEA3D.Animator.prototype.setTimeScale = function( val ) {
 
-	this.mixer._timeScale = val;
+	this.timeScale = val;
 
-	this.mixer.timeScale = val * ( this.currentAnimation ? this.currentAnimation.timeScale : 1 );
+	if ( this.currentAnimationAction ) this.updateTimeScale();
 
 };
 
 THREE.SEA3D.Animator.prototype.getTimeScale = function() {
 
-	return this.mixer._timeScale;
+	return this.timeScale;
+
+};
+
+THREE.SEA3D.Animator.prototype.updateTimeScale = function() {
+
+	this.currentAnimationAction.setEffectiveTimeScale( this.timeScale * ( this.currentAnimation ? this.currentAnimation.timeScale : 1 ) );
 
 };
 
@@ -576,6 +584,7 @@ THREE.SEA3D.Animator.prototype.play = function( name, crossfade, offset, weight
 
 	this.previousAnimationAction = this.currentAnimationAction;
 	this.currentAnimationAction = this.mixer.clipAction( animation ).setLoop( animation.loop ? THREE.LoopRepeat : THREE.LoopOnce, Infinity ).reset();
+	this.currentAnimationAction.clampWhenFinished = true;
 
 	this.previousAnimationData = this.currentAnimationData;
 	this.currentAnimationData = this.animationsData[ name ];
@@ -584,9 +593,9 @@ THREE.SEA3D.Animator.prototype.play = function( name, crossfade, offset, weight
 
 	if ( weight !== undefined ) this.currentAnimationAction.setEffectiveWeight( weight );
 
-	this.currentAnimationAction.play();
+	this.updateTimeScale();
 
-	this.mixer.timeScale = this.mixer._timeScale * this.currentAnimation.timeScale;
+	this.currentAnimationAction.play();
 
 	if ( ! this.playing ) this.mixer.update( 0 );
 
@@ -659,9 +668,9 @@ THREE.SEA3D.Object3DAnimator.prototype.stop = function() {
 
 	if ( this.currentAnimation ) {
 
-		if ( this instanceof THREE.SEA3D.Object3DAnimator ) {
+		var animate = this.object3d.animate;
 
-			var animate = this.object3d.animate;
+		if ( animate && this instanceof THREE.SEA3D.Object3DAnimator ) {
 
 			animate.position.set( 0, 0, 0 );
 			animate.quaternion.set( 0, 0, 0, 1 );
@@ -1450,13 +1459,13 @@ THREE.SEA3D.prototype.readAnimation = function( sea ) {
 					break;
 			}
 
-			var clip = new THREE.AnimationClip( seq.name, - 1, tracks );
-			clip.loop = seq.repeat;
-			clip.timeScale = 1;
+		}
 
-			clips.push( clip );
+		var clip = new THREE.AnimationClip( seq.name, - 1, tracks );
+		clip.loop = seq.repeat;
+		clip.timeScale = 1;
 
-		}
+		clips.push( clip );
 
 	}
 

examples/webgl_loader_sea3d_hierarchy.html

@@ -118,7 +118,6 @@
 				renderer.setClearColor( 0x333333, 1 );
 				renderer.shadowMap.enabled = true;
 				renderer.shadowMap.type = THREE.PCFSoftShadowMap;
-				renderer.shadowMap.cullFace = THREE.CullFaceBack;
 				container.appendChild( renderer.domElement );
 
 				stats = new Stats();

examples/webgl_loader_sea3d_skinning.html

@@ -30,7 +30,7 @@
 		<div id="info">
 			<a href="http://threejs.org" target="_blank">three.js</a> - asset by <a href="https://github.com/sunag/sea3d" style="color:#FFFFF" target="_blank">sea3d</a>
 			<br/>BoneObject: Object3D attached in a Bone
-			<br/>Click to hidden/show the hat - Right click to run
+			<br/>Left Click to hidden/show the hat - Right click to run - Middle click to clone
 		</div>
 
 		<script src="../build/three.js"></script>
@@ -45,11 +45,6 @@
 		<script src="js/shaders/ColorCorrectionShader.js"></script>
 		<script src="js/shaders/VignetteShader.js"></script>
 
-		<script src="js/MorphAnimMesh.js"></script>
-		<script src="js/loaders/collada/Animation.js"></script>
-		<script src="js/loaders/collada/AnimationHandler.js"></script>
-		<script src="js/loaders/collada/KeyFrameAnimation.js"></script>
-
 		<script src="js/loaders/sea3d/SEA3D.js"></script>
 		<script src="js/loaders/sea3d/SEA3DLZMA.js"></script>
 		<script src="js/loaders/sea3d/SEA3DLoader.js"></script>
@@ -118,6 +113,30 @@
 
 			//
 
+			var cloneAsset = function() {
+
+				var count = 0, size = 50;
+
+				return function() {
+
+					var angle = ( Math.PI / 4 ) * count++;
+
+					var container = new THREE.Object3D();
+					container.position.z = ( size * count ) * Math.cos( angle );
+					container.position.x = ( size * count ) * Math.sin( angle );
+
+					scene.add( container );
+					
+					var domain = loader.clone( { 
+						autoPlay : true, 
+						container : container, 
+						lights : false 
+					});
+
+				}
+
+			}();
+
 			function init() {
 
 				scene = new THREE.Scene();
@@ -125,7 +144,7 @@
 				container = document.createElement( 'div' );
 				document.body.appendChild( container );
 
-				camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 2000 );
+				camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 20000 );
 				camera.position.set( 1000, - 300, 1000 );
 
 				renderer = new THREE.WebGLRenderer();
@@ -179,10 +198,15 @@
 
 			function onMouseClick( e ) {
 
-				if (e.button != 0) return;
+				if (e.button === 0) {
+
+					hat.visible = !hat.visible;
+
+				} else if (e.button === 1) {
 
-				var hat = loader.getMesh("Hat");
-				hat.visible = !hat.visible;
+					cloneAsset();
+
+				}
 
 			}
 
@@ -209,9 +233,6 @@
 				// Update SEA3D Animations
 				THREE.SEA3D.AnimationHandler.update( delta );
 
-				// Update Three.JS Animations
-				THREE.AnimationHandler.update( delta );
-
 				render( delta );
 
 				stats.update();

examples/webgl_loader_sea3d_sound.html

@@ -92,9 +92,6 @@
 		<script src="js/shaders/ColorCorrectionShader.js"></script>
 		<script src="js/shaders/VignetteShader.js"></script>
 
-		<script src="js/MorphAnimMesh.js"></script>
-		<script src="js/loaders/collada/Animation.js"></script>
-
 		<script src="js/loaders/sea3d/SEA3D.js"></script>
 		<script src="js/loaders/sea3d/SEA3DLZMA.js"></script>
 		<script src="js/loaders/sea3d/SEA3DLoader.js"></script>
@@ -151,7 +148,7 @@
 				lightOutside = loader.getLight("Light1");
 
 				soundOutside = loader.getSound3D("Point001");
-				soundOutsideAnalyser = new THREE.AudioAnalyser( soundOutside, 512 );
+				soundOutsideAnalyser = new THREE.AudioAnalyser( soundOutside, 32 );
 
 				// sound asset 2 + area
 
@@ -458,7 +455,7 @@
 				updateSoundFilter();
 
 				// light intensity from sound amplitude
-				lightOutside.intensity = soundOutsideAnalyser.getAverageFrequency() / 50;
+				lightOutside.intensity = soundOutsideAnalyser.getAverageFrequency() / 100;
 				lightArea.intensity = soundAreaAnalyser.getAverageFrequency() / 50;
 
 				// Update SEA3D Animations