Improved GLTFLoader example.

examples/webgl_loader_gltf.html

@@ -37,9 +37,8 @@
 
 		<script src="../build/three.js"></script>
 
-		<script src="js/loaders/GLTFLoader.js"></script>
-
 		<script src="js/controls/OrbitControls.js"></script>
+		<script src="js/loaders/GLTFLoader.js"></script>
 
 		<script src="js/Detector.js"></script>
 		<script src="js/libs/stats.min.js"></script>
@@ -66,41 +65,8 @@
 				controls.target.set( 0, -0.2, -0.2 );
 				controls.update();
 
-				scene = new THREE.Scene();
-				scene.background = new THREE.Color( 0x443333 );
-				scene.fog = new THREE.Fog( 0x443333, 2, 10 );
-
-				light = new THREE.HemisphereLight( 0xffffff, 0x444444 );
-				light.position.set( 0, 2, 0 );
-				scene.add( light );
-
-				light = new THREE.DirectionalLight( 0xffffff );
-				light.position.set( 0, 2, 1 );
-				light.castShadow = true;
-				light.shadow.camera.top = 1.8;
-				light.shadow.camera.bottom = -1.8;
-				light.shadow.camera.left = -1.2;
-				light.shadow.camera.right = 1.2;
-				scene.add( light );
-
-				// ground
-				var plane = new THREE.Mesh(
-					new THREE.PlaneBufferGeometry( 20, 20 ),
-					new THREE.MeshPhongMaterial( { color: 0x999999, specular: 0x101010 } )
-				);
-				plane.rotation.x = - Math.PI / 2;
-				plane.position.y = -1;
-				plane.receiveShadow = true;
-				scene.add(plane);
-
-				var grid = new THREE.GridHelper( 20, 20, 0x000000, 0x000000 );
-				grid.position.y = -0.99;
-				grid.material.opacity = 0.2;
-				grid.material.transparent = true;
-				scene.add( grid );
-
 				// envmap
-				var path = 'textures/cube/skybox/';
+				var path = 'textures/cube/skyboxsun25deg/';
 				var format = '.jpg';
 				var envMap = new THREE.CubeTextureLoader().load( [
 					path + 'px' + format, path + 'nx' + format,
@@ -108,6 +74,17 @@
 					path + 'pz' + format, path + 'nz' + format
 				] );
 
+				scene = new THREE.Scene();
+				scene.background = envMap;
+
+				light = new THREE.HemisphereLight( 0xbbbbff, 0x444422 );
+				light.position.set( 0, 1, 0 );
+				scene.add( light );
+
+				light = new THREE.DirectionalLight( 0xffffff );
+				light.position.set( -10, 6, -10 );
+				scene.add( light );
+
 				// model
 				var loader = new THREE.GLTFLoader();
 				loader.load( 'models/gltf/DamagedHelmet/glTF/DamagedHelmet.gltf', function ( gltf ) {
@@ -117,8 +94,6 @@
 						if ( child.isMesh ) {
 
 							child.material.envMap = envMap;
-							child.material.needsUpdate = true;
-							child.castShadow = true;
 
 						}
 
@@ -132,8 +107,6 @@
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.gammaOutput = true;
-				renderer.shadowMap.enabled = true;
-				renderer.shadowMap.type = THREE.PCFSoftShadowMap;
 				container.appendChild( renderer.domElement );
 
 				window.addEventListener( 'resize', onWindowResize, false );