Merge pull request #11660 from Mugen87/collada2

Examples: Improved collada skinning example

examples/models/collada/elf/elf.dae

@@ -49,7 +49,7 @@
               <texture texture="ce_jpg-sampler" texcoord="UVMap"/>
             </diffuse>
             <specular>
-              <color sid="specular">0.5 0.5 0.5 1</color>
+              <color sid="specular">0.05 0.05 0.05 1</color>
             </specular>
             <shininess>
               <float sid="shininess">50</float>
@@ -91,7 +91,7 @@
               <texture texture="Body_tex_003_jpg-sampler" texcoord="UVMap"/>
             </diffuse>
             <specular>
-              <color sid="specular">0.5 0.5 0.5 1</color>
+              <color sid="specular">0.1 0.1 0.1 1</color>
             </specular>
             <shininess>
               <float sid="shininess">50</float>
@@ -133,7 +133,7 @@
               <texture texture="Face_tex_002_toObj_jpg-sampler" texcoord="UVMap"/>
             </diffuse>
             <specular>
-              <color sid="specular">0.5 0.5 0.5 1</color>
+              <color sid="specular">0.05 0.05 0.05 1</color>
             </specular>
             <shininess>
               <float sid="shininess">50</float>
@@ -175,7 +175,7 @@
               <texture texture="Hair_tex_001_jpg-sampler" texcoord="UVMap"/>
             </diffuse>
             <specular>
-              <color sid="specular">0.5 0.5 0.5 1</color>
+              <color sid="specular">0.05 0.05 0.05 1</color>
             </specular>
             <shininess>
               <float sid="shininess">50</float>

examples/webgl_loader_collada.html

@@ -84,11 +84,11 @@
 
 				//
 
-				var ambientLight = new THREE.AmbientLight( 0xcccccc );
+				var ambientLight = new THREE.AmbientLight( 0xcccccc, 0.4 );
 				scene.add( ambientLight );
 
-				var directionalLight = new THREE.DirectionalLight( 0xffffff );
-				directionalLight.position.set( 0, 1, -1 ).normalize();
+				var directionalLight = new THREE.DirectionalLight( 0xffffff, 0.8 );
+				directionalLight.position.set( 1, 1, 0 ).normalize();
 				scene.add( directionalLight );
 
 				//

examples/webgl_loader_collada_skinning.html

@@ -33,6 +33,7 @@
 		<div id="container"></div>
 		<div id="info">
 			<a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> collada loader - skinning
+			| Dancing Stormtrooper <a href="https://sketchfab.com/strykerdoesgames" target="_blank" rel="noopener">StrykerDoesAnimation</a> is licensed under <a href="https://creativecommons.org/licenses/by/4.0/" target="_blank" rel="noopener">CC Attribution</a>
 		</div>
 
 		<script src="../build/three.js"></script>
@@ -56,7 +57,7 @@
 				container = document.getElementById( 'container' );
 
 				camera = new THREE.PerspectiveCamera( 25, window.innerWidth / window.innerHeight, 1, 10000 );
-				camera.position.set( - 7, 4, 7 );
+				camera.position.set( 15, 10, - 15 );
 
 				scene = new THREE.Scene();
 
@@ -66,7 +67,7 @@
 
 				var loader = new THREE.ColladaLoader();
 				loader.options.convertUpAxis = true;
-				loader.load( "./models/collada/avatar.dae", function ( collada ) {
+				loader.load( './models/collada/stormtrooper/stormtrooper.dae', function ( collada ) {
 
 					var animations = collada.animations;
 					var avatar = collada.scene;
@@ -80,14 +81,18 @@
 
 				//
 
-				var gridHelper = new THREE.GridHelper( 5, 20 );
+				var gridHelper = new THREE.GridHelper( 10, 20 );
 				scene.add( gridHelper );
 
 				//
 
-				var ambientLight = new THREE.AmbientLight( 0xcccccc );
+				var ambientLight = new THREE.AmbientLight( 0xffffff, 0.2 );
 				scene.add( ambientLight );
 
+				var directionalLight = new THREE.DirectionalLight( 0xffffff, 0.8 );
+				directionalLight.position.set( 1, 1, - 1 );
+				scene.add( directionalLight );
+
 				//
 
 				renderer = new THREE.WebGLRenderer( { antialias: true } );
@@ -99,6 +104,8 @@
 				//
 
 				controls = new THREE.OrbitControls( camera, renderer.domElement );
+				controls.target.set( 0, 2, 0 );
+				controls.update();
 
 				//