THREE.ShaderExtras['film'] to THREE.FilmShader.

@alteredq: I think ShaderExtras.js is starting to become bulky and messy... What do you think about splitting ShaderExtras into single files? Contributing new shaders would then feel more welcoming. And the examples would show the dependencies clearer.

I was unsure on what style use... THREE.WebGLShaders['film'], THREE.FilmWebGLShader or THREE.FilmShader. The later seemed the nicest

examples/js/ShaderExtras.js

@@ -7,7 +7,6 @@
  *
  *  screen
  *  convolution
- *  film
  *  bokeh
  *  sepia
  *  dotscreen
@@ -147,38 +146,21 @@ THREE.ShaderExtras = {
 	},
 
 	/* -------------------------------------------------------------------------
-
-	// Film grain & scanlines shader
-
-	//	- ported from HLSL to WebGL / GLSL
-	//	  http://www.truevision3d.com/forums/showcase/staticnoise_colorblackwhite_scanline_shaders-t18698.0.html
-
-	// Screen Space Static Postprocessor
-	//
-	// Produces an analogue noise overlay similar to a film grain / TV static
-	//
-	// Original implementation and noise algorithm
-	// Pat 'Hawthorne' Shearon
-	//
-	// Optimized scanlines + noise version with intensity scaling
-	// Georg 'Leviathan' Steinrohder
-
-	// This version is provided under a Creative Commons Attribution 3.0 License
-	// http://creativecommons.org/licenses/by/3.0/
+	//	Depth-of-field shader with bokeh
+	//	ported from GLSL shader by Martins Upitis
+	//	http://artmartinsh.blogspot.com/2010/02/glsl-lens-blur-filter-with-bokeh.html
 	 ------------------------------------------------------------------------- */
 
-	'film': {
+	'bokeh'	: {
 
 		uniforms: {
-
-			tDiffuse:   { type: "t", value: null },
-			time: 	    { type: "f", value: 0.0 },
-			nIntensity: { type: "f", value: 0.5 },
-			sIntensity: { type: "f", value: 0.05 },
-			sCount: 	{ type: "f", value: 4096 },
-			grayscale:  { type: "i", value: 1 }
-
-		},
+			tColor:   { type: "t", value: null },
+			tDepth:   { type: "t", value: null },
+			focus:    { type: "f", value: 1.0 },
+			aspect:   { type: "f", value: 1.0 },
+			aperture: { type: "f", value: 0.025 },
+			maxblur:  { type: "f", value: 1.0 }
+		  },
 
 		vertexShader: [
 
@@ -195,54 +177,80 @@ THREE.ShaderExtras = {
 
 		fragmentShader: [
 
-			// control parameter
-			"uniform float time;",
-
-			"uniform bool grayscale;",
-
-			// noise effect intensity value (0 = no effect, 1 = full effect)
-			"uniform float nIntensity;",
-
-			// scanlines effect intensity value (0 = no effect, 1 = full effect)
-			"uniform float sIntensity;",
-
-			// scanlines effect count value (0 = no effect, 4096 = full effect)
-			"uniform float sCount;",
-
-			"uniform sampler2D tDiffuse;",
-
 			"varying vec2 vUv;",
 
-			"void main() {",
-
-				// sample the source
-				"vec4 cTextureScreen = texture2D( tDiffuse, vUv );",
-
-				// make some noise
-				"float x = vUv.x * vUv.y * time *  1000.0;",
-				"x = mod( x, 13.0 ) * mod( x, 123.0 );",
-				"float dx = mod( x, 0.01 );",
-
-				// add noise
-				"vec3 cResult = cTextureScreen.rgb + cTextureScreen.rgb * clamp( 0.1 + dx * 100.0, 0.0, 1.0 );",
-
-				// get us a sine and cosine
-				"vec2 sc = vec2( sin( vUv.y * sCount ), cos( vUv.y * sCount ) );",
-
-				// add scanlines
-				"cResult += cTextureScreen.rgb * vec3( sc.x, sc.y, sc.x ) * sIntensity;",
-
-				// interpolate between source and result by intensity
-				"cResult = cTextureScreen.rgb + clamp( nIntensity, 0.0,1.0 ) * ( cResult - cTextureScreen.rgb );",
+			"uniform sampler2D tColor;",
+			"uniform sampler2D tDepth;",
 
-				// convert to grayscale if desired
-				"if( grayscale ) {",
+			"uniform float maxblur;",  	// max blur amount
+			"uniform float aperture;",	// aperture - bigger values for shallower depth of field
 
-					"cResult = vec3( cResult.r * 0.3 + cResult.g * 0.59 + cResult.b * 0.11 );",
+			"uniform float focus;",
+			"uniform float aspect;",
 
-				"}",
+			"void main() {",
 
-				"gl_FragColor =  vec4( cResult, cTextureScreen.a );",
+				"vec2 aspectcorrect = vec2( 1.0, aspect );",
+
+				"vec4 depth1 = texture2D( tDepth, vUv );",
+
+				"float factor = depth1.x - focus;",
+
+				"vec2 dofblur = vec2 ( clamp( factor * aperture, -maxblur, maxblur ) );",
+
+				"vec2 dofblur9 = dofblur * 0.9;",
+				"vec2 dofblur7 = dofblur * 0.7;",
+				"vec2 dofblur4 = dofblur * 0.4;",
+
+				"vec4 col = vec4( 0.0 );",
+
+				"col += texture2D( tColor, vUv.xy );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,   0.4  ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.15,  0.37 ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.29,  0.29 ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.37,  0.15 ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.40,  0.0  ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.37, -0.15 ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.29, -0.29 ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.15, -0.37 ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,  -0.4  ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.15,  0.37 ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.29,  0.29 ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.37,  0.15 ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.4,   0.0  ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.37, -0.15 ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.29, -0.29 ) * aspectcorrect ) * dofblur );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.15, -0.37 ) * aspectcorrect ) * dofblur );",
+
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.15,  0.37 ) * aspectcorrect ) * dofblur9 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.37,  0.15 ) * aspectcorrect ) * dofblur9 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.37, -0.15 ) * aspectcorrect ) * dofblur9 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.15, -0.37 ) * aspectcorrect ) * dofblur9 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.15,  0.37 ) * aspectcorrect ) * dofblur9 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.37,  0.15 ) * aspectcorrect ) * dofblur9 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.37, -0.15 ) * aspectcorrect ) * dofblur9 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.15, -0.37 ) * aspectcorrect ) * dofblur9 );",
+
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.29,  0.29 ) * aspectcorrect ) * dofblur7 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.40,  0.0  ) * aspectcorrect ) * dofblur7 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.29, -0.29 ) * aspectcorrect ) * dofblur7 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,  -0.4  ) * aspectcorrect ) * dofblur7 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.29,  0.29 ) * aspectcorrect ) * dofblur7 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.4,   0.0  ) * aspectcorrect ) * dofblur7 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.29, -0.29 ) * aspectcorrect ) * dofblur7 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,   0.4  ) * aspectcorrect ) * dofblur7 );",
+
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.29,  0.29 ) * aspectcorrect ) * dofblur4 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.4,   0.0  ) * aspectcorrect ) * dofblur4 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.29, -0.29 ) * aspectcorrect ) * dofblur4 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,  -0.4  ) * aspectcorrect ) * dofblur4 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.29,  0.29 ) * aspectcorrect ) * dofblur4 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.4,   0.0  ) * aspectcorrect ) * dofblur4 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2( -0.29, -0.29 ) * aspectcorrect ) * dofblur4 );",
+				"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,   0.4  ) * aspectcorrect ) * dofblur4 );",
+
+				"gl_FragColor = col / 41.0;",
+				"gl_FragColor.a = 1.0;",
 
 			"}"
 
@@ -250,119 +258,6 @@ THREE.ShaderExtras = {
 
 	},
 
-
-	/* -------------------------------------------------------------------------
-	//	Depth-of-field shader with bokeh
-	//	ported from GLSL shader by Martins Upitis
-	//	http://artmartinsh.blogspot.com/2010/02/glsl-lens-blur-filter-with-bokeh.html
-	 ------------------------------------------------------------------------- */
-
-	'bokeh'	: {
-
-	uniforms: { tColor:   { type: "t", value: null },
-				tDepth:   { type: "t", value: null },
-				focus:    { type: "f", value: 1.0 },
-				aspect:   { type: "f", value: 1.0 },
-				aperture: { type: "f", value: 0.025 },
-				maxblur:  { type: "f", value: 1.0 }
-			  },
-
-	vertexShader: [
-
-	"varying vec2 vUv;",
-
-	"void main() {",
-
-		"vUv = uv;",
-		"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
-
-	"}"
-
-	].join("\n"),
-
-	fragmentShader: [
-
-	"varying vec2 vUv;",
-
-	"uniform sampler2D tColor;",
-	"uniform sampler2D tDepth;",
-
-	"uniform float maxblur;",  	// max blur amount
-	"uniform float aperture;",	// aperture - bigger values for shallower depth of field
-
-	"uniform float focus;",
-	"uniform float aspect;",
-
-	"void main() {",
-
-		"vec2 aspectcorrect = vec2( 1.0, aspect );",
-
-		"vec4 depth1 = texture2D( tDepth, vUv );",
-
-		"float factor = depth1.x - focus;",
-
-		"vec2 dofblur = vec2 ( clamp( factor * aperture, -maxblur, maxblur ) );",
-
-		"vec2 dofblur9 = dofblur * 0.9;",
-		"vec2 dofblur7 = dofblur * 0.7;",
-		"vec2 dofblur4 = dofblur * 0.4;",
-
-		"vec4 col = vec4( 0.0 );",
-
-		"col += texture2D( tColor, vUv.xy );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,   0.4  ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.15,  0.37 ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.29,  0.29 ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.37,  0.15 ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.40,  0.0  ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.37, -0.15 ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.29, -0.29 ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.15, -0.37 ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,  -0.4  ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.15,  0.37 ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.29,  0.29 ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.37,  0.15 ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.4,   0.0  ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.37, -0.15 ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.29, -0.29 ) * aspectcorrect ) * dofblur );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.15, -0.37 ) * aspectcorrect ) * dofblur );",
-
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.15,  0.37 ) * aspectcorrect ) * dofblur9 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.37,  0.15 ) * aspectcorrect ) * dofblur9 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.37, -0.15 ) * aspectcorrect ) * dofblur9 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.15, -0.37 ) * aspectcorrect ) * dofblur9 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.15,  0.37 ) * aspectcorrect ) * dofblur9 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.37,  0.15 ) * aspectcorrect ) * dofblur9 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.37, -0.15 ) * aspectcorrect ) * dofblur9 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.15, -0.37 ) * aspectcorrect ) * dofblur9 );",
-
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.29,  0.29 ) * aspectcorrect ) * dofblur7 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.40,  0.0  ) * aspectcorrect ) * dofblur7 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.29, -0.29 ) * aspectcorrect ) * dofblur7 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,  -0.4  ) * aspectcorrect ) * dofblur7 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.29,  0.29 ) * aspectcorrect ) * dofblur7 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.4,   0.0  ) * aspectcorrect ) * dofblur7 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.29, -0.29 ) * aspectcorrect ) * dofblur7 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,   0.4  ) * aspectcorrect ) * dofblur7 );",
-
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.29,  0.29 ) * aspectcorrect ) * dofblur4 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.4,   0.0  ) * aspectcorrect ) * dofblur4 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.29, -0.29 ) * aspectcorrect ) * dofblur4 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,  -0.4  ) * aspectcorrect ) * dofblur4 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.29,  0.29 ) * aspectcorrect ) * dofblur4 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.4,   0.0  ) * aspectcorrect ) * dofblur4 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2( -0.29, -0.29 ) * aspectcorrect ) * dofblur4 );",
-		"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,   0.4  ) * aspectcorrect ) * dofblur4 );",
-
-		"gl_FragColor = col / 41.0;",
-		"gl_FragColor.a = 1.0;",
-
-	"}"
-
-	].join("\n")
-
-	},
-
 	/* -------------------------------------------------------------------------
 	//	Depth-of-field shader using mipmaps
 	//	- from Matt Handley @applmak

examples/js/postprocessing/FilmPass.js

@@ -4,7 +4,7 @@
 
 THREE.FilmPass = function ( noiseIntensity, scanlinesIntensity, scanlinesCount, grayscale ) {
 
-	var shader = THREE.ShaderExtras[ "film" ];
+	var shader = THREE.FilmShader;
 
 	this.uniforms = THREE.UniformsUtils.clone( shader.uniforms );
 

examples/js/shaders/FilmShader.js

@@ -0,0 +1,104 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ *
+ * Film grain & scanlines shader
+ *
+ * - ported from HLSL to WebGL / GLSL
+ * http://www.truevision3d.com/forums/showcase/staticnoise_colorblackwhite_scanline_shaders-t18698.0.html
+ *
+ * Screen Space Static Postprocessor
+ *
+ * Produces an analogue noise overlay similar to a film grain / TV static
+ *
+ * Original implementation and noise algorithm
+ * Pat 'Hawthorne' Shearon
+ *
+ * Optimized scanlines + noise version with intensity scaling
+ * Georg 'Leviathan' Steinrohder
+ *
+ * This version is provided under a Creative Commons Attribution 3.0 License
+ * http://creativecommons.org/licenses/by/3.0/
+ */
+
+THREE.FilmShader = {
+
+	uniforms: {
+
+		tDiffuse:   { type: "t", value: null },
+		time: 	    { type: "f", value: 0.0 },
+		nIntensity: { type: "f", value: 0.5 },
+		sIntensity: { type: "f", value: 0.05 },
+		sCount: 	{ type: "f", value: 4096 },
+		grayscale:  { type: "i", value: 1 }
+
+	},
+
+	vertexShader: [
+
+		"varying vec2 vUv;",
+
+		"void main() {",
+
+			"vUv = uv;",
+			"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
+
+		"}"
+
+	].join("\n"),
+
+	fragmentShader: [
+
+		// control parameter
+		"uniform float time;",
+
+		"uniform bool grayscale;",
+
+		// noise effect intensity value (0 = no effect, 1 = full effect)
+		"uniform float nIntensity;",
+
+		// scanlines effect intensity value (0 = no effect, 1 = full effect)
+		"uniform float sIntensity;",
+
+		// scanlines effect count value (0 = no effect, 4096 = full effect)
+		"uniform float sCount;",
+
+		"uniform sampler2D tDiffuse;",
+
+		"varying vec2 vUv;",
+
+		"void main() {",
+
+			// sample the source
+			"vec4 cTextureScreen = texture2D( tDiffuse, vUv );",
+
+			// make some noise
+			"float x = vUv.x * vUv.y * time *  1000.0;",
+			"x = mod( x, 13.0 ) * mod( x, 123.0 );",
+			"float dx = mod( x, 0.01 );",
+
+			// add noise
+			"vec3 cResult = cTextureScreen.rgb + cTextureScreen.rgb * clamp( 0.1 + dx * 100.0, 0.0, 1.0 );",
+
+			// get us a sine and cosine
+			"vec2 sc = vec2( sin( vUv.y * sCount ), cos( vUv.y * sCount ) );",
+
+			// add scanlines
+			"cResult += cTextureScreen.rgb * vec3( sc.x, sc.y, sc.x ) * sIntensity;",
+
+			// interpolate between source and result by intensity
+			"cResult = cTextureScreen.rgb + clamp( nIntensity, 0.0,1.0 ) * ( cResult - cTextureScreen.rgb );",
+
+			// convert to grayscale if desired
+			"if( grayscale ) {",
+
+				"cResult = vec3( cResult.r * 0.3 + cResult.g * 0.59 + cResult.b * 0.11 );",
+
+			"}",
+
+			"gl_FragColor =  vec4( cResult, cTextureScreen.a );",
+
+		"}"
+
+	].join("\n")
+
+};

examples/misc_camera_fly.html

@@ -35,6 +35,7 @@
 
 		<script src="../build/three.min.js"></script>
 
+		<script src="js/shaders/FilmShader.js"></script>
 		<script src="js/ShaderExtras.js"></script>
 
 		<script src="js/postprocessing/EffectComposer.js"></script>

examples/webgl_geometry_text.html

@@ -40,6 +40,7 @@
 
 		<script src="../build/three.min.js"></script>
 
+		<script src="js/shaders/FilmShader.js"></script>
 		<script src="js/ShaderExtras.js"></script>
 
 		<script src="js/postprocessing/EffectComposer.js"></script>

examples/webgl_hdr.html

@@ -211,8 +211,6 @@
 
 				materialHDR.uniforms.exposure.value += sign * rate * delta;
 
-				// Render final scene to the screen with film shader
-
 				renderer.render( scene, camera );
 
 			}

examples/webgl_materials_bumpmap_skin.html

@@ -49,10 +49,6 @@
 
 		<script src="js/postprocessing/EffectComposer.js"></script>
 		<script src="js/postprocessing/RenderPass.js"></script>
-		<script src="js/postprocessing/BloomPass.js"></script>
-		<script src="js/postprocessing/FilmPass.js"></script>
-		<script src="js/postprocessing/DotScreenPass.js"></script>
-		<script src="js/postprocessing/TexturePass.js"></script>
 		<script src="js/postprocessing/ShaderPass.js"></script>
 		<script src="js/postprocessing/MaskPass.js"></script>
 

examples/webgl_materials_normalmap2.html

@@ -59,10 +59,6 @@
 
 		<script src="js/postprocessing/EffectComposer.js"></script>
 		<script src="js/postprocessing/RenderPass.js"></script>
-		<script src="js/postprocessing/BloomPass.js"></script>
-		<script src="js/postprocessing/FilmPass.js"></script>
-		<script src="js/postprocessing/DotScreenPass.js"></script>
-		<script src="js/postprocessing/TexturePass.js"></script>
 		<script src="js/postprocessing/ShaderPass.js"></script>
 		<script src="js/postprocessing/MaskPass.js"></script>
 

examples/webgl_particles_dynamic.html

@@ -42,6 +42,7 @@
 
 		<script src="../build/three.min.js"></script>
 
+		<script src="js/shaders/FilmShader.js"></script>
 		<script src="js/ShaderExtras.js"></script>
 
 		<script src="js/postprocessing/EffectComposer.js"></script>

examples/webgl_particles_shapes.html

@@ -23,7 +23,9 @@
 		<script src="js/Tween.js"></script>
 		<script src="js/Sparks.js"></script>
 
+		<script src="js/shaders/FilmShader.js"></script>
 		<script src="js/ShaderExtras.js"></script>
+
 		<script src="js/postprocessing/EffectComposer.js"></script>
 		<script src="js/postprocessing/RenderPass.js"></script>
 		<script src="js/postprocessing/ShaderPass.js"></script>

examples/webgl_postprocessing.html

@@ -42,7 +42,7 @@
 
 		<script src="../build/three.min.js"></script>
 
-
+		<script src="js/shaders/FilmShader.js"></script>
 		<script src="js/ShaderExtras.js"></script>
 
 		<script src="js/postprocessing/EffectComposer.js"></script>

examples/webgl_shader_lava.html

@@ -38,6 +38,7 @@
 
 		<script src="../build/three.min.js"></script>
 
+		<script src="js/shaders/FilmShader.js"></script>
 		<script src="js/ShaderExtras.js"></script>
 
 		<script src="js/postprocessing/EffectComposer.js"></script>