Merge remote-tracking branch 'alteredq/dev' into dev

build/three.js

@@ -91,6 +91,12 @@ THREE.CullFaceFrontBack = 3;
 THREE.FrontFaceDirectionCW = 0;
 THREE.FrontFaceDirectionCCW = 1;
 
+// SHADOWING TYPES
+
+THREE.BasicShadowMap = 0;
+THREE.PCFShadowMap = 1;
+THREE.PCFSoftShadowMap = 2;
+
 // MATERIAL CONSTANTS
 
 // side
@@ -4296,17 +4302,8 @@ THREE.Rectangle = function () {
 
 THREE.Sphere = function ( center, radius ) {
 
-	if ( center === undefined && radius === undefined ) {
-
-		this.center = new THREE.Vector3();
-		this.radius = 0;
-
-	} else {
-
-		this.center = center.clone();
-		this.radius = radius || 0;
-
-	}
+	this.center = center === undefined ? new THREE.Vector3() : center.clone();
+	this.radius = radius === undefined ? 0 : radius;
 
 };
 
@@ -7104,30 +7101,26 @@ THREE.Geometry.prototype = {
 
 	computeBoundingBox: function () {
 
-		if ( ! this.boundingBox ) {
+		if ( this.boundingBox === null ) {
 
-			this.boundingBox = new THREE.Box3().setFromPoints( this.vertices );
-
-		} else {
-
-			this.boundingBox.setFromPoints( this.vertices );
+			this.boundingBox = new THREE.Box3();
 
 		}
 
+		this.boundingBox.setFromPoints( this.vertices );
+
 	},
 
 	computeBoundingSphere: function () {
 
-		if ( ! this.boundingSphere ) {
-
-			this.boundingSphere = new THREE.Sphere().setFromCenterAndPoints( new THREE.Vector3(), this.vertices );
-
-		} else {
+		if ( this.boundingSphere === null ) {
 
-			this.boundingSphere.setFromCenterAndPoints( this.boundingSphere.center, this.vertices );
+			this.boundingSphere = new THREE.Sphere();
 
 		}
 
+		this.boundingSphere.setFromCenterAndPoints( this.boundingSphere.center, this.vertices );
+
 	},
 
 	/*
@@ -7348,7 +7341,7 @@ THREE.BufferGeometry.prototype = {
 
 	computeBoundingBox: function () {
 
-		if ( ! this.boundingBox ) {
+		if ( this.boundingBox === null ) {
 
 			this.boundingBox = new THREE.Box3();
 
@@ -7420,8 +7413,10 @@ THREE.BufferGeometry.prototype = {
 
 	computeBoundingSphere: function () {
 
-		if ( ! this.boundingSphere ) {
+		if ( this.boundingSphere === null ) {
+
 			this.boundingSphere = new THREE.Sphere();
+
 		}
 
 		var positions = this.attributes[ "position" ].array;
@@ -7530,15 +7525,15 @@ THREE.BufferGeometry.prototype = {
 						ab.sub( pA, pB );
 						cb.crossSelf( ab );
 
-						normals[ vA * 3 ] 	  += cb.x;
+						normals[ vA * 3 ]     += cb.x;
 						normals[ vA * 3 + 1 ] += cb.y;
 						normals[ vA * 3 + 2 ] += cb.z;
 
-						normals[ vB * 3 ] 	  += cb.x;
+						normals[ vB * 3 ]     += cb.x;
 						normals[ vB * 3 + 1 ] += cb.y;
 						normals[ vB * 3 + 2 ] += cb.z;
 
-						normals[ vC * 3 ] 	  += cb.x;
+						normals[ vC * 3 ]     += cb.x;
 						normals[ vC * 3 + 1 ] += cb.y;
 						normals[ vC * 3 + 2 ] += cb.z;
 
@@ -16038,7 +16033,7 @@ THREE.ShaderChunk = {
 
 					"shadowCoord.z += shadowBias[ i ];",
 
-					"#ifdef SHADOWMAP_SOFT",
+					"#if defined( SHADOWMAP_TYPE_PCF )",
 
 						// Percentage-close filtering
 						// (9 pixel kernel)
@@ -16108,6 +16103,76 @@ THREE.ShaderChunk = {
 
 						"shadowColor = shadowColor * vec3( ( 1.0 - shadowDarkness[ i ] * shadow ) );",
 
+					"#elif defined( SHADOWMAP_TYPE_PCF_SOFT )",
+
+						// Percentage-close filtering
+						// (9 pixel kernel)
+						// http://fabiensanglard.net/shadowmappingPCF/
+
+						"float shadow = 0.0;",
+
+						"float xPixelOffset = 1.0 / shadowMapSize[ i ].x;",
+						"float yPixelOffset = 1.0 / shadowMapSize[ i ].y;",
+
+						"float dx0 = -1.0 * xPixelOffset;",
+						"float dy0 = -1.0 * yPixelOffset;",
+						"float dx1 = 1.0 * xPixelOffset;",
+						"float dy1 = 1.0 * yPixelOffset;",
+
+						"mat3 shadowKernel;",
+						"mat3 depthKernel;",
+
+						"depthKernel[0][0] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( dx0, dy0 ) ) );",
+						"if ( depthKernel[0][0] < shadowCoord.z ) shadowKernel[0][0] = 0.25;",
+						"else shadowKernel[0][0] = 0.0;",
+
+						"depthKernel[0][1] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( dx0, 0.0 ) ) );",
+						"if ( depthKernel[0][1] < shadowCoord.z ) shadowKernel[0][1] = 0.25;",
+						"else shadowKernel[0][1] = 0.0;",
+
+						"depthKernel[0][2] = unpackDepth( texture2D( shadowMap[ i], shadowCoord.xy + vec2( dx0, dy1 ) ) );",
+						"if ( depthKernel[0][2] < shadowCoord.z ) shadowKernel[0][2] = 0.25;",
+						"else shadowKernel[0][2] = 0.0;",
+
+						"depthKernel[1][0] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( 0.0, dy0 ) ) );",
+						"if ( depthKernel[1][0] < shadowCoord.z ) shadowKernel[1][0] = 0.25;",
+						"else shadowKernel[1][0] = 0.0;",
+
+						"depthKernel[1][1] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy ) );",
+						"if ( depthKernel[1][1] < shadowCoord.z ) shadowKernel[1][1] = 0.25;",
+						"else shadowKernel[1][1] = 0.0;",
+
+						"depthKernel[1][2] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( 0.0, dy1 ) ) );",
+						"if ( depthKernel[1][2] < shadowCoord.z ) shadowKernel[1][2] = 0.25;",
+						"else shadowKernel[1][2] = 0.0;",
+
+						"depthKernel[2][0] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( dx1, dy0 ) ) );",
+						"if ( depthKernel[2][0] < shadowCoord.z ) shadowKernel[2][0] = 0.25;",
+						"else shadowKernel[2][0] = 0.0;",
+
+						"depthKernel[2][1] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( dx1, 0.0 ) ) );",
+						"if ( depthKernel[2][1] < shadowCoord.z ) shadowKernel[2][1] = 0.25;",
+						"else shadowKernel[2][1] = 0.0;",
+
+						"depthKernel[2][2] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( dx1, dy1 ) ) );",
+						"if ( depthKernel[2][2] < shadowCoord.z ) shadowKernel[2][2] = 0.25;",
+						"else shadowKernel[2][2] = 0.0;",
+
+						"vec2 fractionalCoord = 1.0 - fract( shadowCoord.xy * shadowMapSize[i].xy );",
+
+						"shadowKernel[0] = mix( shadowKernel[1], shadowKernel[0], fractionalCoord.x );",
+						"shadowKernel[1] = mix( shadowKernel[2], shadowKernel[1], fractionalCoord.x );",
+
+						"vec4 shadowValues;",
+						"shadowValues.x = mix( shadowKernel[0][1], shadowKernel[0][0], fractionalCoord.y );",
+						"shadowValues.y = mix( shadowKernel[0][2], shadowKernel[0][1], fractionalCoord.y );",
+						"shadowValues.z = mix( shadowKernel[1][1], shadowKernel[1][0], fractionalCoord.y );",
+						"shadowValues.w = mix( shadowKernel[1][2], shadowKernel[1][1], fractionalCoord.y );",
+
+						"shadow = dot( shadowValues, vec4( 1.0 ) );",
+
+						"shadowColor = shadowColor * vec3( ( 1.0 - shadowDarkness[ i ] * shadow ) );",
+
 					"#else",
 
 						"vec4 rgbaDepth = texture2D( shadowMap[ i ], shadowCoord.xy );",
@@ -17006,7 +17071,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 
 	this.shadowMapEnabled = false;
 	this.shadowMapAutoUpdate = true;
-	this.shadowMapSoft = true;
+	this.shadowMapType = THREE.PCFShadowMap;
 	this.shadowMapCullFace = THREE.CullFaceFront;
 	this.shadowMapDebug = false;
 	this.shadowMapCascade = false;
@@ -21877,7 +21942,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 
 			maxShadows: maxShadows,
 			shadowMapEnabled: this.shadowMapEnabled && object.receiveShadow,
-			shadowMapSoft: this.shadowMapSoft,
+			shadowMapType: this.shadowMapType,
 			shadowMapDebug: this.shadowMapDebug,
 			shadowMapCascade: this.shadowMapCascade,
 
@@ -23180,6 +23245,18 @@ THREE.WebGLRenderer = function ( parameters ) {
 
 		}
 
+		var shadowMapTypeDefine = "SHADOWMAP_TYPE_BASIC";
+
+		if ( parameters.shadowMapType === THREE.PCFShadowMap ) {
+
+			shadowMapTypeDefine = "SHADOWMAP_TYPE_PCF";
+
+		} else if ( parameters.shadowMapType === THREE.PCFSoftShadowMap ) {
+
+			shadowMapTypeDefine = "SHADOWMAP_TYPE_PCF_SOFT";
+
+		}
+
 		//console.log( "building new program " );
 
 		//
@@ -23232,7 +23309,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 			parameters.flipSided ? "#define FLIP_SIDED" : "",
 
 			parameters.shadowMapEnabled ? "#define USE_SHADOWMAP" : "",
-			parameters.shadowMapSoft ? "#define SHADOWMAP_SOFT" : "",
+			parameters.shadowMapEnabled ? "#define " + shadowMapTypeDefine : "",
 			parameters.shadowMapDebug ? "#define SHADOWMAP_DEBUG" : "",
 			parameters.shadowMapCascade ? "#define SHADOWMAP_CASCADE" : "",
 
@@ -23331,7 +23408,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 			parameters.flipSided ? "#define FLIP_SIDED" : "",
 
 			parameters.shadowMapEnabled ? "#define USE_SHADOWMAP" : "",
-			parameters.shadowMapSoft ? "#define SHADOWMAP_SOFT" : "",
+			parameters.shadowMapEnabled ? "#define " + shadowMapTypeDefine : "",
 			parameters.shadowMapDebug ? "#define SHADOWMAP_DEBUG" : "",
 			parameters.shadowMapCascade ? "#define SHADOWMAP_CASCADE" : "",
 
@@ -35691,7 +35768,15 @@ THREE.ShadowMapPlugin = function ( ) {
 
 			if ( ! light.shadowMap ) {
 
-				var pars = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBAFormat };
+				var shadowFilter = THREE.LinearFilter;
+
+				if ( _renderer.shadowMapType === THREE.PCFSoftShadowMap ) {
+
+					shadowFilter = THREE.NearestFilter;
+
+				}
+
+				var pars = { minFilter: shadowFilter, magFilter: shadowFilter, format: THREE.RGBAFormat };
 
 				light.shadowMap = new THREE.WebGLRenderTarget( light.shadowMapWidth, light.shadowMapHeight, pars );
 				light.shadowMapSize = new THREE.Vector2( light.shadowMapWidth, light.shadowMapHeight );

docs/api/renderers/WebGLRenderer.html

@@ -110,9 +110,10 @@
 		<div>Default is true. TODO</div>
 
 
-		<h3>.[page:Boolean shadowMapSoft]</h3>
+		<h3>.[page:Integer shadowMapType]</h3>
 
-		<div>Default is true. TODO</div>
+		<div>Defines shadow map type (unfiltered, percentage close filtering, percentage close filtering with bilinear filtering in shader)</div>
+		<div>Options are THREE.BasicShadowMap, THREE.PCFShadowMap, THREE.PCFSoftShadowMap. Default is THREE.PCFShadowMap.</div>
 
 
 		<h3>.[page:Boolean shadowMapCullFrontFaces]</h3>

examples/webgl_interactive_cubes_gpu.html

@@ -50,14 +50,14 @@
 			var highlightBox;
 
 			var mouse = new THREE.Vector2();
-			var offset = new THREE.Vector3(10, 10, 10);
+			var offset = new THREE.Vector3( 10, 10, 10 );
 
 			init();
 			animate();
 
 			function init() {
 
-				container = document.getElementById("container");
+				container = document.getElementById( "container" );
 
 				camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 10000 );
 				camera.position.z = 1000;
@@ -72,126 +72,128 @@
 				controls.dynamicDampingFactor = 0.3;
 
 				scene = new THREE.Scene();
+
 				pickingScene = new THREE.Scene();
-				pickingTexture = new THREE.WebGLRenderTarget(window.innerWidth, window.innerHeight);
+				pickingTexture = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight );
 				pickingTexture.generateMipmaps = false;
 
 				scene.add( new THREE.AmbientLight( 0x555555 ) );
 
 				var light = new THREE.SpotLight( 0xffffff, 1.5 );
-
 				light.position.set( 0, 500, 2000 );
-				light.castShadow = true;
+				scene.add( light );
 
-				light.shadowCameraNear = 200;
-				light.shadowCameraFar = camera.far;
-				light.shadowCameraFov = 50;
+				var geometry = new THREE.Geometry(),
+				pickingGeometry = new THREE.Geometry(),
+				pickingMaterial = new THREE.MeshBasicMaterial( { vertexColors: THREE.VertexColors } ),
+				defaultMaterial = new THREE.MeshLambertMaterial({ color: 0xffffff, shading: THREE.FlatShading, vertexColors: THREE.VertexColors	} );
 
-				light.shadowBias = -0.00022;
-				light.shadowDarkness = 0.5;
+				function applyVertexColors( g, c ) {
 
-				light.shadowMapWidth = 1024;
-				light.shadowMapHeight = 1024;
+					g.faces.forEach( function( f ) {
 
-				scene.add( light );
+						var n = ( f instanceof THREE.Face3 ) ? 3 : 4;
+
+						for( var j = 0; j < n; j ++ ) {
+
+							f.vertexColors[ j ] = c;
 
-				var geometry = new THREE.Geometry(),
-					pickingGeometry = new THREE.Geometry(),
-					pickingMaterial = new THREE.MeshBasicMaterial({
-						vertexColors: THREE.VertexColors
-					}),
-					defaultMaterial = new THREE.MeshLambertMaterial({
-						color: 0xffffff,
-						shading: THREE.FlatShading,
-						vertexColors: THREE.VertexColors
-					});
-
-				function applyVertexColors(g, c) {
-					g.faces.forEach(function(f){
-						var n = (f instanceof THREE.Face3) ? 3 : 4;
-						for(var j=0; j<n; j++){
-							f.vertexColors[j] = c;
 						}
-					});
+
+					} );
+
 				}
-				
+
 				for ( var i = 0; i < 5000; i ++ ) {
+
 					var position = new THREE.Vector3();
+
 					position.x = Math.random() * 10000 - 5000;
 					position.y = Math.random() * 6000 - 3000;
 					position.z = Math.random() * 8000 - 4000;
 
 					var rotation = new THREE.Vector3();
-					rotation.x = ( Math.random() * 2 * Math.PI);
-					rotation.y = ( Math.random() * 2 * Math.PI);
-					rotation.z = ( Math.random() * 2 * Math.PI);
+
+					rotation.x = ( Math.random() * 2 * Math.PI );
+					rotation.y = ( Math.random() * 2 * Math.PI );
+					rotation.z = ( Math.random() * 2 * Math.PI );
 
 					var scale = new THREE.Vector3();
+
 					scale.x = Math.random() * 200 + 100;
 					scale.y = Math.random() * 200 + 100;
 					scale.z = Math.random() * 200 + 100;
-					
-					//give the geom's vertices a random color, to be displayed
-					var geom = new THREE.CubeGeometry(1, 1, 1);
-					var color = new THREE.Color(Math.random() * 0xffffff);
-					applyVertexColors(geom, color);
-					var cube = new THREE.Mesh(geom);
-					cube.position.copy(position);
-					cube.rotation.copy(rotation);
-					cube.scale.copy(scale);
-					THREE.GeometryUtils.merge(geometry, cube);
+
+					// give the geom's vertices a random color, to be displayed
+
+					var geom = new THREE.CubeGeometry( 1, 1, 1 );
+					var color = new THREE.Color( Math.random() * 0xffffff );
+					applyVertexColors( geom, color );
+
+					var cube = new THREE.Mesh( geom );
+					cube.position.copy( position );
+					cube.rotation.copy( rotation );
+					cube.scale.copy( scale );
+
+					THREE.GeometryUtils.merge( geometry, cube );
 
 					//give the pickingGeom's vertices a color corresponding to the "id"
-					var pickingGeom = new THREE.CubeGeometry(1, 1, 1);
-					var pickingColor = new THREE.Color(i);
-					applyVertexColors(pickingGeom, pickingColor);
-					var pickingCube = new THREE.Mesh(pickingGeom);
-					pickingCube.position.copy(position);
-					pickingCube.rotation.copy(rotation);
-					pickingCube.scale.copy(scale);
-					THREE.GeometryUtils.merge(pickingGeometry, pickingCube);
-
-					pickingData[i] = {
+
+					var pickingGeom = new THREE.CubeGeometry( 1, 1, 1 );
+					var pickingColor = new THREE.Color( i );
+					applyVertexColors( pickingGeom, pickingColor );
+
+					var pickingCube = new THREE.Mesh( pickingGeom );
+					pickingCube.position.copy( position );
+					pickingCube.rotation.copy( rotation );
+					pickingCube.scale.copy( scale );
+
+					THREE.GeometryUtils.merge( pickingGeometry, pickingCube );
+
+					pickingData[ i ] = {
+
 						position: position,
 						rotation: rotation,
 						scale: scale
+
 					};
+
 				}
-				var drawnObject = new THREE.Mesh(geometry, defaultMaterial);
-					//drawnObject.castShadow = true;
-					//drawnObject.receiveShadow = true;
-					scene.add(drawnObject);
-					
-				pickingScene.add(new THREE.Mesh(pickingGeometry, pickingMaterial));
-
-				highlightBox = new THREE.Mesh(new THREE.CubeGeometry(1, 1, 1), new THREE.MeshLambertMaterial({color: 0xffff00}));
-				scene.add(highlightBox);
-				
+
+				var drawnObject = new THREE.Mesh( geometry, defaultMaterial );
+				scene.add( drawnObject );
+
+				pickingScene.add( new THREE.Mesh( pickingGeometry, pickingMaterial ) );
+
+				highlightBox = new THREE.Mesh( new THREE.CubeGeometry( 1, 1, 1 ), new THREE.MeshLambertMaterial( { color: 0xffff00 } ) );
+				scene.add( highlightBox );
+
 				projector = new THREE.Projector();
 
 				renderer = new THREE.WebGLRenderer( { antialias: true, clearColor: 0xffffff } );
 				renderer.sortObjects = false;
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
-				renderer.shadowMapEnabled = true;
-				renderer.shadowMapSoft = true;
-
 				container.appendChild( renderer.domElement );
-				
+
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
 				stats.domElement.style.top = '0px';
 				container.appendChild( stats.domElement );
-				
-				renderer.domElement.addEventListener('mousemove', onMouseMove);
+
+				renderer.domElement.addEventListener( 'mousemove', onMouseMove );
+
 			}
+
 			//
 
-			function onMouseMove(e) {
+			function onMouseMove( e ) {
+
 				mouse.x = e.clientX;
 				mouse.y = e.clientY;
+
 			}
-			
+
 			function animate() {
 
 				requestAnimationFrame( animate );
@@ -202,30 +204,44 @@
 			}
 
 			function pick() {
+
 				//render the picking scene off-screen
+
+				renderer.render( pickingScene, camera, pickingTexture );
+
 				var gl = self.renderer.getContext();
-				renderer.render(pickingScene, camera, pickingTexture);
-				var pixelBuffer = new Uint8Array(4);
-				
+
 				//read the pixel under the mouse from the texture
-				gl.readPixels(mouse.x, pickingTexture.height - mouse.y, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, pixelBuffer);
-				
+
+				var pixelBuffer = new Uint8Array( 4 );
+				gl.readPixels( mouse.x, pickingTexture.height - mouse.y, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, pixelBuffer );
+
 				//interpret the pixel as an ID
-				var id = (pixelBuffer[0] << 16) | (pixelBuffer[1] << 8) | (pixelBuffer[2]);
-				var data = pickingData[id];
-				if(data){
+
+				var id = ( pixelBuffer[0] << 16 ) | ( pixelBuffer[1] << 8 ) | ( pixelBuffer[2] );
+				var data = pickingData[ id ];
+
+				if ( data) {
+
 					//move our highlightBox so that it surrounds the picked object
-					if(data.position && data.rotation && data.scale){
-						highlightBox.position.copy(data.position);
-						highlightBox.rotation.copy(data.rotation);
-						highlightBox.scale.copy(data.scale).addSelf(offset);
+
+					if ( data.position && data.rotation && data.scale ){
+
+						highlightBox.position.copy( data.position );
+						highlightBox.rotation.copy( data.rotation );
+						highlightBox.scale.copy( data.scale ).addSelf( offset );
 						highlightBox.visible = true;
+
 					}
+
 				} else {
+
 					highlightBox.visible = false;
+
 				}
+
 			}
-			
+
 			function render() {
 
 				controls.update();

examples/webgl_interactive_draggablecubes.html

@@ -111,7 +111,7 @@
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				renderer.shadowMapEnabled = true;
-				renderer.shadowMapSoft = true;
+				renderer.shadowMapType = THREE.PCFShadowMap;
 
 				container.appendChild( renderer.domElement );
 

examples/webgl_loader_utf8.html

@@ -128,6 +128,7 @@
 				renderer.physicallyBasedShading = true;
 
 				renderer.shadowMapEnabled = true;
+				renderer.shadowMapType = THREE.PCFShadowMap;
 
 				// STATS
 

examples/webgl_materials_normalmap.html

@@ -212,7 +212,7 @@
 				//
 
 				renderer.shadowMapEnabled = true;
-				renderer.shadowMapSoft = true;
+				renderer.shadowMapType = THREE.PCFShadowMap;
 
 
 				//

examples/webgl_morphtargets_md2_control.html

@@ -150,6 +150,7 @@
 				renderer.shadowMapEnabled = true;
 
 				renderer.shadowMapCascade = true;
+				renderer.shadowMapType = THREE.PCFSoftShadowMap;
 				//renderer.shadowMapDebug = true;
 
 				// STATS

examples/webgl_shading_physical.html

@@ -359,6 +359,7 @@
 
 				renderer.shadowMapAutoUpdate = false;
 				renderer.shadowMapEnabled = true;
+				renderer.shadowMapType = THREE.PCFSoftShadowMap;
 
 				//
 

examples/webgl_shadowmap.html

@@ -141,7 +141,7 @@
 				//
 
 				renderer.shadowMapEnabled = true;
-				renderer.shadowMapSoft = true;
+				renderer.shadowMapType = THREE.PCFShadowMap;
 
 				// STATS
 

examples/webgl_shadowmap_performance.html

@@ -141,7 +141,7 @@
 				//
 
 				renderer.shadowMapEnabled = true;
-				renderer.shadowMapSoft = true;
+				renderer.shadowMapType = THREE.PCFSoftShadowMap;
 
 				// STATS
 

src/Three.js

@@ -91,6 +91,12 @@ THREE.CullFaceFrontBack = 3;
 THREE.FrontFaceDirectionCW = 0;
 THREE.FrontFaceDirectionCCW = 1;
 
+// SHADOWING TYPES
+
+THREE.BasicShadowMap = 0;
+THREE.PCFShadowMap = 1;
+THREE.PCFSoftShadowMap = 2;
+
 // MATERIAL CONSTANTS
 
 // side

src/extras/renderers/plugins/ShadowMapPlugin.js

@@ -139,7 +139,15 @@ THREE.ShadowMapPlugin = function ( ) {
 
 			if ( ! light.shadowMap ) {
 
-				var pars = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBAFormat };
+				var shadowFilter = THREE.LinearFilter;
+
+				if ( _renderer.shadowMapType === THREE.PCFSoftShadowMap ) {
+
+					shadowFilter = THREE.NearestFilter;
+
+				}
+
+				var pars = { minFilter: shadowFilter, magFilter: shadowFilter, format: THREE.RGBAFormat };
 
 				light.shadowMap = new THREE.WebGLRenderTarget( light.shadowMapWidth, light.shadowMapHeight, pars );
 				light.shadowMapSize = new THREE.Vector2( light.shadowMapWidth, light.shadowMapHeight );

src/renderers/WebGLRenderer.js

@@ -53,7 +53,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 
 	this.shadowMapEnabled = false;
 	this.shadowMapAutoUpdate = true;
-	this.shadowMapSoft = true;
+	this.shadowMapType = THREE.PCFShadowMap;
 	this.shadowMapCullFace = THREE.CullFaceFront;
 	this.shadowMapDebug = false;
 	this.shadowMapCascade = false;
@@ -4924,7 +4924,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 
 			maxShadows: maxShadows,
 			shadowMapEnabled: this.shadowMapEnabled && object.receiveShadow,
-			shadowMapSoft: this.shadowMapSoft,
+			shadowMapType: this.shadowMapType,
 			shadowMapDebug: this.shadowMapDebug,
 			shadowMapCascade: this.shadowMapCascade,
 
@@ -6227,6 +6227,18 @@ THREE.WebGLRenderer = function ( parameters ) {
 
 		}
 
+		var shadowMapTypeDefine = "SHADOWMAP_TYPE_BASIC";
+
+		if ( parameters.shadowMapType === THREE.PCFShadowMap ) {
+
+			shadowMapTypeDefine = "SHADOWMAP_TYPE_PCF";
+
+		} else if ( parameters.shadowMapType === THREE.PCFSoftShadowMap ) {
+
+			shadowMapTypeDefine = "SHADOWMAP_TYPE_PCF_SOFT";
+
+		}
+
 		//console.log( "building new program " );
 
 		//
@@ -6279,7 +6291,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 			parameters.flipSided ? "#define FLIP_SIDED" : "",
 
 			parameters.shadowMapEnabled ? "#define USE_SHADOWMAP" : "",
-			parameters.shadowMapSoft ? "#define SHADOWMAP_SOFT" : "",
+			parameters.shadowMapEnabled ? "#define " + shadowMapTypeDefine : "",
 			parameters.shadowMapDebug ? "#define SHADOWMAP_DEBUG" : "",
 			parameters.shadowMapCascade ? "#define SHADOWMAP_CASCADE" : "",
 
@@ -6378,7 +6390,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 			parameters.flipSided ? "#define FLIP_SIDED" : "",
 
 			parameters.shadowMapEnabled ? "#define USE_SHADOWMAP" : "",
-			parameters.shadowMapSoft ? "#define SHADOWMAP_SOFT" : "",
+			parameters.shadowMapEnabled ? "#define " + shadowMapTypeDefine : "",
 			parameters.shadowMapDebug ? "#define SHADOWMAP_DEBUG" : "",
 			parameters.shadowMapCascade ? "#define SHADOWMAP_CASCADE" : "",
 

src/renderers/WebGLShaders.js

@@ -1547,7 +1547,7 @@ THREE.ShaderChunk = {
 
 					"shadowCoord.z += shadowBias[ i ];",
 
-					"#ifdef SHADOWMAP_SOFT",
+					"#if defined( SHADOWMAP_TYPE_PCF )",
 
 						// Percentage-close filtering
 						// (9 pixel kernel)
@@ -1617,6 +1617,76 @@ THREE.ShaderChunk = {
 
 						"shadowColor = shadowColor * vec3( ( 1.0 - shadowDarkness[ i ] * shadow ) );",
 
+					"#elif defined( SHADOWMAP_TYPE_PCF_SOFT )",
+
+						// Percentage-close filtering
+						// (9 pixel kernel)
+						// http://fabiensanglard.net/shadowmappingPCF/
+
+						"float shadow = 0.0;",
+
+						"float xPixelOffset = 1.0 / shadowMapSize[ i ].x;",
+						"float yPixelOffset = 1.0 / shadowMapSize[ i ].y;",
+
+						"float dx0 = -1.0 * xPixelOffset;",
+						"float dy0 = -1.0 * yPixelOffset;",
+						"float dx1 = 1.0 * xPixelOffset;",
+						"float dy1 = 1.0 * yPixelOffset;",
+
+						"mat3 shadowKernel;",
+						"mat3 depthKernel;",
+
+						"depthKernel[0][0] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( dx0, dy0 ) ) );",
+						"if ( depthKernel[0][0] < shadowCoord.z ) shadowKernel[0][0] = 0.25;",
+						"else shadowKernel[0][0] = 0.0;",
+
+						"depthKernel[0][1] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( dx0, 0.0 ) ) );",
+						"if ( depthKernel[0][1] < shadowCoord.z ) shadowKernel[0][1] = 0.25;",
+						"else shadowKernel[0][1] = 0.0;",
+
+						"depthKernel[0][2] = unpackDepth( texture2D( shadowMap[ i], shadowCoord.xy + vec2( dx0, dy1 ) ) );",
+						"if ( depthKernel[0][2] < shadowCoord.z ) shadowKernel[0][2] = 0.25;",
+						"else shadowKernel[0][2] = 0.0;",
+
+						"depthKernel[1][0] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( 0.0, dy0 ) ) );",
+						"if ( depthKernel[1][0] < shadowCoord.z ) shadowKernel[1][0] = 0.25;",
+						"else shadowKernel[1][0] = 0.0;",
+
+						"depthKernel[1][1] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy ) );",
+						"if ( depthKernel[1][1] < shadowCoord.z ) shadowKernel[1][1] = 0.25;",
+						"else shadowKernel[1][1] = 0.0;",
+
+						"depthKernel[1][2] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( 0.0, dy1 ) ) );",
+						"if ( depthKernel[1][2] < shadowCoord.z ) shadowKernel[1][2] = 0.25;",
+						"else shadowKernel[1][2] = 0.0;",
+
+						"depthKernel[2][0] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( dx1, dy0 ) ) );",
+						"if ( depthKernel[2][0] < shadowCoord.z ) shadowKernel[2][0] = 0.25;",
+						"else shadowKernel[2][0] = 0.0;",
+
+						"depthKernel[2][1] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( dx1, 0.0 ) ) );",
+						"if ( depthKernel[2][1] < shadowCoord.z ) shadowKernel[2][1] = 0.25;",
+						"else shadowKernel[2][1] = 0.0;",
+
+						"depthKernel[2][2] = unpackDepth( texture2D( shadowMap[ i ], shadowCoord.xy + vec2( dx1, dy1 ) ) );",
+						"if ( depthKernel[2][2] < shadowCoord.z ) shadowKernel[2][2] = 0.25;",
+						"else shadowKernel[2][2] = 0.0;",
+
+						"vec2 fractionalCoord = 1.0 - fract( shadowCoord.xy * shadowMapSize[i].xy );",
+
+						"shadowKernel[0] = mix( shadowKernel[1], shadowKernel[0], fractionalCoord.x );",
+						"shadowKernel[1] = mix( shadowKernel[2], shadowKernel[1], fractionalCoord.x );",
+
+						"vec4 shadowValues;",
+						"shadowValues.x = mix( shadowKernel[0][1], shadowKernel[0][0], fractionalCoord.y );",
+						"shadowValues.y = mix( shadowKernel[0][2], shadowKernel[0][1], fractionalCoord.y );",
+						"shadowValues.z = mix( shadowKernel[1][1], shadowKernel[1][0], fractionalCoord.y );",
+						"shadowValues.w = mix( shadowKernel[1][2], shadowKernel[1][1], fractionalCoord.y );",
+
+						"shadow = dot( shadowValues, vec4( 1.0 ) );",
+
+						"shadowColor = shadowColor * vec3( ( 1.0 - shadowDarkness[ i ] * shadow ) );",
+
 					"#else",
 
 						"vec4 rgbaDepth = texture2D( shadowMap[ i ], shadowCoord.xy );",