Docs: More JSDoc. (#30727)

examples/jsm/postprocessing/AfterimagePass.js

@@ -10,67 +10,109 @@ import { Pass, FullScreenQuad } from './Pass.js';
 import { CopyShader } from '../shaders/CopyShader.js';
 import { AfterimageShader } from '../shaders/AfterimageShader.js';
 
+/**
+ * Pass for a basic after image effect.
+ *
+ * ```js
+ * const afterimagePass = new AfterimagePass( 0.9 );
+ * composer.addPass( afterimagePass );
+ * ```
+ *
+ * @augments Pass
+ */
 class AfterimagePass extends Pass {
 
+	/**
+	 * Constructs a new after image pass.
+	 *
+	 * @param {number} [damp=0.96] - The damping intensity. A higher value means a stronger after image effect.
+	 */
 	constructor( damp = 0.96 ) {
 
 		super();
 
-		this.shader = AfterimageShader;
-
-		this.uniforms = UniformsUtils.clone( this.shader.uniforms );
+		/**
+		 * The pass uniforms. Use this object if you want to update the
+		 * `damp` value at runtime.
+		 * ```js
+		 * pass.uniforms.damp.value = 0.9;
+		 * ```
+		 *
+		 * @type {Object}
+		 */
+		this.uniforms = UniformsUtils.clone( AfterimageShader.uniforms );
 
 		this.uniforms[ 'damp' ].value = damp;
 
-		this.textureComp = new WebGLRenderTarget( window.innerWidth, window.innerHeight, {
-			magFilter: NearestFilter,
-			type: HalfFloatType
-		} );
-
-		this.textureOld = new WebGLRenderTarget( window.innerWidth, window.innerHeight, {
-			magFilter: NearestFilter,
-			type: HalfFloatType
-		} );
-
+		/**
+		 * The composition material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
 		this.compFsMaterial = new ShaderMaterial( {
 
 			uniforms: this.uniforms,
-			vertexShader: this.shader.vertexShader,
-			fragmentShader: this.shader.fragmentShader
+			vertexShader: AfterimageShader.vertexShader,
+			fragmentShader: AfterimageShader.fragmentShader
 
 		} );
 
-		this.compFsQuad = new FullScreenQuad( this.compFsMaterial );
-
-		const copyShader = CopyShader;
-
+		/**
+		 * The copy material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
 		this.copyFsMaterial = new ShaderMaterial( {
-			uniforms: UniformsUtils.clone( copyShader.uniforms ),
-			vertexShader: copyShader.vertexShader,
-			fragmentShader: copyShader.fragmentShader,
+			uniforms: UniformsUtils.clone( CopyShader.uniforms ),
+			vertexShader: CopyShader.vertexShader,
+			fragmentShader: CopyShader.fragmentShader,
 			blending: NoBlending,
 			depthTest: false,
 			depthWrite: false
 		} );
 
-		this.copyFsQuad = new FullScreenQuad( this.copyFsMaterial );
+		// internals
+
+		this._textureComp = new WebGLRenderTarget( window.innerWidth, window.innerHeight, {
+			magFilter: NearestFilter,
+			type: HalfFloatType
+		} );
+
+		this._textureOld = new WebGLRenderTarget( window.innerWidth, window.innerHeight, {
+			magFilter: NearestFilter,
+			type: HalfFloatType
+		} );
+
+		this._compFsQuad = new FullScreenQuad( this.compFsMaterial );
+		this._copyFsQuad = new FullScreenQuad( this.copyFsMaterial );
 
 	}
 
+	/**
+	 * Performs the after image pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer/*, deltaTime, maskActive*/ ) {
 
-		this.uniforms[ 'tOld' ].value = this.textureOld.texture;
+		this.uniforms[ 'tOld' ].value = this._textureOld.texture;
 		this.uniforms[ 'tNew' ].value = readBuffer.texture;
 
-		renderer.setRenderTarget( this.textureComp );
-		this.compFsQuad.render( renderer );
+		renderer.setRenderTarget( this._textureComp );
+		this._compFsQuad.render( renderer );
 
-		this.copyFsQuad.material.uniforms.tDiffuse.value = this.textureComp.texture;
+		this._copyFsQuad.material.uniforms.tDiffuse.value = this._textureComp.texture;
 
 		if ( this.renderToScreen ) {
 
 			renderer.setRenderTarget( null );
-			this.copyFsQuad.render( renderer );
+			this._copyFsQuad.render( renderer );
 
 		} else {
 
@@ -78,35 +120,45 @@ class AfterimagePass extends Pass {
 
 			if ( this.clear ) renderer.clear();
 
-			this.copyFsQuad.render( renderer );
+			this._copyFsQuad.render( renderer );
 
 		}
 
 		// Swap buffers.
-		const temp = this.textureOld;
-		this.textureOld = this.textureComp;
-		this.textureComp = temp;
+		const temp = this._textureOld;
+		this._textureOld = this._textureComp;
+		this._textureComp = temp;
 		// Now textureOld contains the latest image, ready for the next frame.
 
 	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
 	setSize( width, height ) {
 
-		this.textureComp.setSize( width, height );
-		this.textureOld.setSize( width, height );
+		this._textureComp.setSize( width, height );
+		this._textureOld.setSize( width, height );
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
-		this.textureComp.dispose();
-		this.textureOld.dispose();
+		this._textureComp.dispose();
+		this._textureOld.dispose();
 
 		this.compFsMaterial.dispose();
 		this.copyFsMaterial.dispose();
 
-		this.compFsQuad.dispose();
-		this.copyFsQuad.dispose();
+		this._compFsQuad.dispose();
+		this._copyFsQuad.dispose();
 
 	}
 

examples/jsm/postprocessing/BloomPass.js

@@ -9,25 +9,47 @@ import {
 import { Pass, FullScreenQuad } from './Pass.js';
 import { ConvolutionShader } from '../shaders/ConvolutionShader.js';
 
+/**
+ * A pass for a basic Bloom effect.
+ *
+ * {@link UnrealBloomPass} produces a more advanced Bloom but is also
+ * more expensive.
+ *
+ * ```js
+ * const effectBloom = new BloomPass( 0.75 );
+ * composer.addPass( effectBloom );
+ * ```
+ *
+ * @augments Pass
+ */
 class BloomPass extends Pass {
 
+	/**
+	 * Constructs a new Bloom pass.
+	 *
+	 * @param {number} [strength=1] - The Bloom strength.
+	 * @param {number} [kernelSize=25] - The kernel size.
+	 * @param {number} [sigma=4] - The sigma.
+	 */
 	constructor( strength = 1, kernelSize = 25, sigma = 4 ) {
 
 		super();
 
-		// render targets
-
-		this.renderTargetX = new WebGLRenderTarget( 1, 1, { type: HalfFloatType } ); // will be resized later
-		this.renderTargetX.texture.name = 'BloomPass.x';
-		this.renderTargetY = new WebGLRenderTarget( 1, 1, { type: HalfFloatType } ); // will be resized later
-		this.renderTargetY.texture.name = 'BloomPass.y';
-
 		// combine material
 
+		/**
+		 * The combine pass uniforms.
+		 *
+		 * @type {Object}
+		 */
 		this.combineUniforms = UniformsUtils.clone( CombineShader.uniforms );
-
 		this.combineUniforms[ 'strength' ].value = strength;
 
+		/**
+		 * The combine pass material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
 		this.materialCombine = new ShaderMaterial( {
 
 			name: CombineShader.name,
@@ -43,11 +65,21 @@ class BloomPass extends Pass {
 
 		const convolutionShader = ConvolutionShader;
 
+		/**
+		 * The convolution pass uniforms.
+		 *
+		 * @type {Object}
+		 */
 		this.convolutionUniforms = UniformsUtils.clone( convolutionShader.uniforms );
 
 		this.convolutionUniforms[ 'uImageIncrement' ].value = BloomPass.blurX;
 		this.convolutionUniforms[ 'cKernel' ].value = ConvolutionShader.buildKernel( sigma );
 
+		/**
+		 * The convolution pass material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
 		this.materialConvolution = new ShaderMaterial( {
 
 			name: convolutionShader.name,
@@ -61,67 +93,101 @@ class BloomPass extends Pass {
 
 		} );
 
+		/**
+		 * Overwritten to disable the swap.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.needsSwap = false;
 
-		this.fsQuad = new FullScreenQuad( null );
+		// internals
+
+		this._renderTargetX = new WebGLRenderTarget( 1, 1, { type: HalfFloatType } ); // will be resized later
+		this._renderTargetX.texture.name = 'BloomPass.x';
+		this._renderTargetY = new WebGLRenderTarget( 1, 1, { type: HalfFloatType } ); // will be resized later
+		this._renderTargetY.texture.name = 'BloomPass.y';
+
+		this._fsQuad = new FullScreenQuad( null );
 
 	}
 
+	/**
+	 * Performs the Bloom pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer, deltaTime, maskActive ) {
 
 		if ( maskActive ) renderer.state.buffers.stencil.setTest( false );
 
 		// Render quad with blurred scene into texture (convolution pass 1)
 
-		this.fsQuad.material = this.materialConvolution;
+		this._fsQuad.material = this.materialConvolution;
 
 		this.convolutionUniforms[ 'tDiffuse' ].value = readBuffer.texture;
 		this.convolutionUniforms[ 'uImageIncrement' ].value = BloomPass.blurX;
 
-		renderer.setRenderTarget( this.renderTargetX );
+		renderer.setRenderTarget( this._renderTargetX );
 		renderer.clear();
-		this.fsQuad.render( renderer );
+		this._fsQuad.render( renderer );
 
 
 		// Render quad with blurred scene into texture (convolution pass 2)
 
-		this.convolutionUniforms[ 'tDiffuse' ].value = this.renderTargetX.texture;
+		this.convolutionUniforms[ 'tDiffuse' ].value = this._renderTargetX.texture;
 		this.convolutionUniforms[ 'uImageIncrement' ].value = BloomPass.blurY;
 
-		renderer.setRenderTarget( this.renderTargetY );
+		renderer.setRenderTarget( this._renderTargetY );
 		renderer.clear();
-		this.fsQuad.render( renderer );
+		this._fsQuad.render( renderer );
 
 		// Render original scene with superimposed blur to texture
 
-		this.fsQuad.material = this.materialCombine;
+		this._fsQuad.material = this.materialCombine;
 
-		this.combineUniforms[ 'tDiffuse' ].value = this.renderTargetY.texture;
+		this.combineUniforms[ 'tDiffuse' ].value = this._renderTargetY.texture;
 
 		if ( maskActive ) renderer.state.buffers.stencil.setTest( true );
 
 		renderer.setRenderTarget( readBuffer );
 		if ( this.clear ) renderer.clear();
-		this.fsQuad.render( renderer );
+		this._fsQuad.render( renderer );
 
 	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
 	setSize( width, height ) {
 
-		this.renderTargetX.setSize( width, height );
-		this.renderTargetY.setSize( width, height );
+		this._renderTargetX.setSize( width, height );
+		this._renderTargetY.setSize( width, height );
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
-		this.renderTargetX.dispose();
-		this.renderTargetY.dispose();
+		this._renderTargetX.dispose();
+		this._renderTargetY.dispose();
 
 		this.materialCombine.dispose();
 		this.materialConvolution.dispose();
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 

examples/jsm/postprocessing/BokehPass.js

@@ -13,16 +13,44 @@ import { Pass, FullScreenQuad } from './Pass.js';
 import { BokehShader } from '../shaders/BokehShader.js';
 
 /**
- * Depth-of-field post-process with bokeh shader
+ * Pass for creating depth of field (DOF) effect.
+ *
+ * ```js
+ * const bokehPass = new BokehPass( scene, camera, {
+ * 	focus: 500
+ * 	aperture: 5,
+ * 	maxblur: 0.01
+ * } );
+ * composer.addPass( bokehPass );
+ * ```
+ *
+ * @augments Pass
  */
-
 class BokehPass extends Pass {
 
+	/**
+	 * Constructs a new Bokeh pass.
+	 *
+	 * @param {Scene} scene - The scene to render the DOF for.
+	 * @param {Camera} camera - The camera.
+	 * @param {BokehPass~Options} params - The pass options.
+	 */
 	constructor( scene, camera, params ) {
 
 		super();
 
+		/**
+		 * The scene to render the DOF for.
+		 *
+		 * @type {Scene}
+		 */
 		this.scene = scene;
+
+		/**
+		 * The camera.
+		 *
+		 * @type {Camera}
+		 */
 		this.camera = camera;
 
 		const focus = ( params.focus !== undefined ) ? params.focus : 1.0;
@@ -31,26 +59,25 @@ class BokehPass extends Pass {
 
 		// render targets
 
-		this.renderTargetDepth = new WebGLRenderTarget( 1, 1, { // will be resized later
+		this._renderTargetDepth = new WebGLRenderTarget( 1, 1, { // will be resized later
 			minFilter: NearestFilter,
 			magFilter: NearestFilter,
 			type: HalfFloatType
 		} );
 
-		this.renderTargetDepth.texture.name = 'BokehPass.depth';
+		this._renderTargetDepth.texture.name = 'BokehPass.depth';
 
 		// depth material
 
-		this.materialDepth = new MeshDepthMaterial();
-		this.materialDepth.depthPacking = RGBADepthPacking;
-		this.materialDepth.blending = NoBlending;
+		this._materialDepth = new MeshDepthMaterial();
+		this._materialDepth.depthPacking = RGBADepthPacking;
+		this._materialDepth.blending = NoBlending;
 
 		// bokeh material
 
-		const bokehShader = BokehShader;
-		const bokehUniforms = UniformsUtils.clone( bokehShader.uniforms );
+		const bokehUniforms = UniformsUtils.clone( BokehShader.uniforms );
 
-		bokehUniforms[ 'tDepth' ].value = this.renderTargetDepth.texture;
+		bokehUniforms[ 'tDepth' ].value = this._renderTargetDepth.texture;
 
 		bokehUniforms[ 'focus' ].value = focus;
 		bokehUniforms[ 'aspect' ].value = camera.aspect;
@@ -59,26 +86,56 @@ class BokehPass extends Pass {
 		bokehUniforms[ 'nearClip' ].value = camera.near;
 		bokehUniforms[ 'farClip' ].value = camera.far;
 
+		/**
+		 * The pass bokeh material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
 		this.materialBokeh = new ShaderMaterial( {
-			defines: Object.assign( {}, bokehShader.defines ),
+			defines: Object.assign( {}, BokehShader.defines ),
 			uniforms: bokehUniforms,
-			vertexShader: bokehShader.vertexShader,
-			fragmentShader: bokehShader.fragmentShader
+			vertexShader: BokehShader.vertexShader,
+			fragmentShader: BokehShader.fragmentShader
 		} );
 
+		/**
+		 * The pass uniforms.  Use this object if you want to update the
+		 * `focus`, `aperture` or `maxblur` values at runtime.
+		 *
+		 * ```js
+		 * pass.uniforms.focus.value = focus;
+		 * pass.uniforms.aperture.value = aperture;
+		 * pass.uniforms.maxblur.value = maxblur;
+		 * ```
+		 *
+		 * @type {Object}
+		 */
 		this.uniforms = bokehUniforms;
 
-		this.fsQuad = new FullScreenQuad( this.materialBokeh );
+		// internals
+
+		this._fsQuad = new FullScreenQuad( this.materialBokeh );
 
 		this._oldClearColor = new Color();
 
 	}
 
+	/**
+	 * Performs the Bokeh pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer/*, deltaTime, maskActive*/ ) {
 
 		// Render depth into texture
 
-		this.scene.overrideMaterial = this.materialDepth;
+		this.scene.overrideMaterial = this._materialDepth;
 
 		renderer.getClearColor( this._oldClearColor );
 		const oldClearAlpha = renderer.getClearAlpha();
@@ -87,7 +144,7 @@ class BokehPass extends Pass {
 
 		renderer.setClearColor( 0xffffff );
 		renderer.setClearAlpha( 1.0 );
-		renderer.setRenderTarget( this.renderTargetDepth );
+		renderer.setRenderTarget( this._renderTargetDepth );
 		renderer.clear();
 		renderer.render( this.scene, this.camera );
 
@@ -100,13 +157,13 @@ class BokehPass extends Pass {
 		if ( this.renderToScreen ) {
 
 			renderer.setRenderTarget( null );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		} else {
 
 			renderer.setRenderTarget( writeBuffer );
 			renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 
@@ -117,25 +174,44 @@ class BokehPass extends Pass {
 
 	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
 	setSize( width, height ) {
 
 		this.materialBokeh.uniforms[ 'aspect' ].value = width / height;
 
-		this.renderTargetDepth.setSize( width, height );
+		this._renderTargetDepth.setSize( width, height );
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
-		this.renderTargetDepth.dispose();
+		this._renderTargetDepth.dispose();
 
-		this.materialDepth.dispose();
+		this._materialDepth.dispose();
 		this.materialBokeh.dispose();
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 
 }
 
+/**
+ * Constructor options of `BokehPass`.
+ *
+ * @typedef {Object} BokehPass~Options
+ * @property {number} [focus=1] - Defines the effect's focus which is the distance along the camera's look direction in world units.
+ * @property {number} [aperture=0.025] - Defines the effect's aperture.
+ * @property {number} [maxblur=1] - Defines the effect's maximum blur.
+ **/
+
 export { BokehPass };

examples/jsm/postprocessing/ClearPass.js

@@ -3,20 +3,70 @@ import {
 } from 'three';
 import { Pass } from './Pass.js';
 
+/**
+ * This class can be used to force a clear operation for the current read or
+ * default framebuffer (when rendering to screen).
+ *
+ * ```js
+ * const clearPass = new ClearPass();
+ * composer.addPass( clearPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class ClearPass extends Pass {
 
-	constructor( clearColor, clearAlpha ) {
+	/**
+	 * Constructs a new clear pass.
+	 *
+	 * @param {(number|Color|string)} [clearColor=0x000000] - The clear color.
+	 * @param {number} [clearAlpha=0] - The clear alpha.
+	 */
+	constructor( clearColor = 0x000000, clearAlpha = 0 ) {
 
 		super();
 
+		/**
+		 * Overwritten to disable the swap.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.needsSwap = false;
 
-		this.clearColor = ( clearColor !== undefined ) ? clearColor : 0x000000;
-		this.clearAlpha = ( clearAlpha !== undefined ) ? clearAlpha : 0;
+		/**
+		 * The clear color.
+		 *
+		 * @type {(number|Color|string)}
+		 * @default 0x000000
+		 */
+		this.clearColor = clearColor;
+
+		/**
+		 * The clear alpha.
+		 *
+		 * @type {number}
+		 * @default 0
+		 */
+		this.clearAlpha = clearAlpha;
+
+		// internals
+
 		this._oldClearColor = new Color();
 
 	}
 
+	/**
+	 * Performs the clear operation. This affects the current read or the default framebuffer.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer /*, deltaTime, maskActive */ ) {
 
 		let oldClearAlpha;

examples/jsm/postprocessing/CubeTexturePass.js

@@ -10,30 +10,78 @@ import {
 } from 'three';
 import { Pass } from './Pass.js';
 
+/**
+ * This pass can be used to render a cube texture over the entire screen.
+ *
+ * ```js
+ * const cubeMap = new THREE.CubeTextureLoader().load( urls );
+ *
+ * const cubeTexturePass = new CubeTexturePass( camera, cubemap );
+ * composer.addPass( cubeTexturePass );
+ * ```
+ *
+ * @augments Pass
+ */
 class CubeTexturePass extends Pass {
 
+	/**
+	 * Constructs a new cube texture pass.
+	 *
+	 * @param {PerspectiveCamera} camera - The camera.
+	 * @param {CubeTexture} tCube - The cube texture to render.
+	 * @param {number} [opacity=1] - The opacity.
+	 */
 	constructor( camera, tCube, opacity = 1 ) {
 
 		super();
 
+		/**
+		 * The camera.
+		 *
+		 * @type {PerspectiveCamera}
+		 */
 		this.camera = camera;
 
+		/**
+		 * The cube texture to render.
+		 *
+		 * @type {CubeTexture}
+		 */
+		this.tCube = tCube;
+
+		/**
+		 * The opacity.
+		 *
+		 * @type {number}
+		 * @default 1
+		 */
+		this.opacity = opacity;
+
+		/**
+		 * Overwritten to disable the swap.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.needsSwap = false;
 
-		this.cubeShader = ShaderLib[ 'cube' ];
-		this.cubeMesh = new Mesh(
+		// internals
+
+		const cubeShader = ShaderLib[ 'cube' ];
+
+		this._cubeMesh = new Mesh(
 			new BoxGeometry( 10, 10, 10 ),
 			new ShaderMaterial( {
-				uniforms: UniformsUtils.clone( this.cubeShader.uniforms ),
-				vertexShader: this.cubeShader.vertexShader,
-				fragmentShader: this.cubeShader.fragmentShader,
+				uniforms: UniformsUtils.clone( cubeShader.uniforms ),
+				vertexShader: cubeShader.vertexShader,
+				fragmentShader: cubeShader.fragmentShader,
 				depthTest: false,
 				depthWrite: false,
 				side: BackSide
 			} )
 		);
 
-		Object.defineProperty( this.cubeMesh.material, 'envMap', {
+		Object.defineProperty( this._cubeMesh.material, 'envMap', {
 
 			get: function () {
 
@@ -43,40 +91,52 @@ class CubeTexturePass extends Pass {
 
 		} );
 
-		this.tCube = tCube;
-		this.opacity = opacity;
-
-		this.cubeScene = new Scene();
-		this.cubeCamera = new PerspectiveCamera();
-		this.cubeScene.add( this.cubeMesh );
+		this._cubeScene = new Scene();
+		this._cubeCamera = new PerspectiveCamera();
+		this._cubeScene.add( this._cubeMesh );
 
 	}
 
+	/**
+	 * Performs the cube texture pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer/*, deltaTime, maskActive*/ ) {
 
 		const oldAutoClear = renderer.autoClear;
 		renderer.autoClear = false;
 
-		this.cubeCamera.projectionMatrix.copy( this.camera.projectionMatrix );
-		this.cubeCamera.quaternion.setFromRotationMatrix( this.camera.matrixWorld );
+		this._cubeCamera.projectionMatrix.copy( this.camera.projectionMatrix );
+		this._cubeCamera.quaternion.setFromRotationMatrix( this.camera.matrixWorld );
 
-		this.cubeMesh.material.uniforms.tCube.value = this.tCube;
-		this.cubeMesh.material.uniforms.tFlip.value = ( this.tCube.isCubeTexture && this.tCube.isRenderTargetTexture === false ) ? - 1 : 1;
-		this.cubeMesh.material.uniforms.opacity.value = this.opacity;
-		this.cubeMesh.material.transparent = ( this.opacity < 1.0 );
+		this._cubeMesh.material.uniforms.tCube.value = this.tCube;
+		this._cubeMesh.material.uniforms.tFlip.value = ( this.tCube.isCubeTexture && this.tCube.isRenderTargetTexture === false ) ? - 1 : 1;
+		this._cubeMesh.material.uniforms.opacity.value = this.opacity;
+		this._cubeMesh.material.transparent = ( this.opacity < 1.0 );
 
 		renderer.setRenderTarget( this.renderToScreen ? null : readBuffer );
 		if ( this.clear ) renderer.clear();
-		renderer.render( this.cubeScene, this.cubeCamera );
+		renderer.render( this._cubeScene, this._cubeCamera );
 
 		renderer.autoClear = oldAutoClear;
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
-		this.cubeMesh.geometry.dispose();
-		this.cubeMesh.material.dispose();
+		this._cubeMesh.geometry.dispose();
+		this._cubeMesh.material.dispose();
 
 	}
 

examples/jsm/postprocessing/DotScreenPass.js

@@ -5,33 +5,77 @@ import {
 import { Pass, FullScreenQuad } from './Pass.js';
 import { DotScreenShader } from '../shaders/DotScreenShader.js';
 
+/**
+ * Pass for creating a dot-screen effect.
+ *
+ * ```js
+ * const pass = new DotScreenPass( new THREE.Vector2( 0, 0 ), 0.5, 0.8 );
+ * composer.addPass( pass );
+ * ```
+ *
+ * @augments Pass
+ */
 class DotScreenPass extends Pass {
 
+	/**
+	 * Constructs a new dot screen pass.
+	 *
+	 * @param {Vector2} center - The center point.
+	 * @param {number} angle - The rotation of the effect in radians.
+	 * @param {number} scale - The scale of the effect. A higher value means smaller dots.
+	 */
 	constructor( center, angle, scale ) {
 
 		super();
 
-		const shader = DotScreenShader;
-
-		this.uniforms = UniformsUtils.clone( shader.uniforms );
+		/**
+		 * The pass uniforms. Use this object if you want to update the
+		 * `center`, `angle` or `scale` values at runtime.
+		 * ```js
+		 * pass.uniforms.center.value.copy( center );
+		 * pass.uniforms.angle.value = 0;
+		 * pass.uniforms.scale.value = 0.5;
+		 * ```
+		 *
+		 * @type {Object}
+		 */
+		this.uniforms = UniformsUtils.clone( DotScreenShader.uniforms );
 
 		if ( center !== undefined ) this.uniforms[ 'center' ].value.copy( center );
 		if ( angle !== undefined ) this.uniforms[ 'angle' ].value = angle;
 		if ( scale !== undefined ) this.uniforms[ 'scale' ].value = scale;
 
+		/**
+		 * The pass material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
 		this.material = new ShaderMaterial( {
 
-			name: shader.name,
+			name: DotScreenShader.name,
 			uniforms: this.uniforms,
-			vertexShader: shader.vertexShader,
-			fragmentShader: shader.fragmentShader
+			vertexShader: DotScreenShader.vertexShader,
+			fragmentShader: DotScreenShader.fragmentShader
 
 		} );
 
-		this.fsQuad = new FullScreenQuad( this.material );
+		// internals
+
+		this._fsQuad = new FullScreenQuad( this.material );
 
 	}
 
+	/**
+	 * Performs the dot screen pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer /*, deltaTime, maskActive */ ) {
 
 		this.uniforms[ 'tDiffuse' ].value = readBuffer.texture;
@@ -40,23 +84,27 @@ class DotScreenPass extends Pass {
 		if ( this.renderToScreen ) {
 
 			renderer.setRenderTarget( null );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		} else {
 
 			renderer.setRenderTarget( writeBuffer );
 			if ( this.clear ) renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		this.material.dispose();
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 

examples/jsm/postprocessing/EffectComposer.js

@@ -9,10 +9,51 @@ import { CopyShader } from '../shaders/CopyShader.js';
 import { ShaderPass } from './ShaderPass.js';
 import { ClearMaskPass, MaskPass } from './MaskPass.js';
 
+/**
+ * Used to implement post-processing effects in three.js.
+ * The class manages a chain of post-processing passes to produce the final visual result.
+ * Post-processing passes are executed in order of their addition/insertion.
+ * The last pass is automatically rendered to screen.
+ *
+ * This module can only be used with {@link WebGLRenderer}.
+ *
+ * ```js
+ * const composer = new EffectComposer( renderer );
+ *
+ * // adding some passes
+ * const renderPass = new RenderPass( scene, camera );
+ * composer.addPass( renderPass );
+ *
+ * const glitchPass = new GlitchPass();
+ * composer.addPass( glitchPass );
+ *
+ * const outputPass = new OutputPass()
+ * composer.addPass( outputPass );
+ *
+ * function animate() {
+ *
+ * 	composer.render(); // instead of renderer.render()
+ *
+ * }
+ * ```
+ */
 class EffectComposer {
 
+	/**
+	 * Constructs a new effect composer.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} [renderTarget] - This render target and a clone will
+	 * be used as the internal read and write buffers. If not given, the composer creates
+	 * the buffers automatically.
+	 */
 	constructor( renderer, renderTarget ) {
 
+		/**
+		 * The renderer.
+		 *
+		 * @type {WebGLRenderer}
+		 */
 		this.renderer = renderer;
 
 		this._pixelRatio = renderer.getPixelRatio();
@@ -37,20 +78,59 @@ class EffectComposer {
 		this.renderTarget2 = renderTarget.clone();
 		this.renderTarget2.texture.name = 'EffectComposer.rt2';
 
+		/**
+		 * A reference to the internal write buffer. Passes usually write
+		 * their result into this buffer.
+		 *
+		 * @type {WebGLRenderTarget}
+		 */
 		this.writeBuffer = this.renderTarget1;
+
+		/**
+		 * A reference to the internal read buffer. Passes usually read
+		 * the previous render result from this buffer.
+		 *
+		 * @type {WebGLRenderTarget}
+		 */
 		this.readBuffer = this.renderTarget2;
 
+		/**
+		 * Whether the final pass is rendered to the screen (default framebuffer) or not.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
 		this.renderToScreen = true;
 
+		/**
+		 * An array representing the (ordered) chain of post-processing passes.
+		 *
+		 * @type {Array<Pass>}
+		 */
 		this.passes = [];
 
+		/**
+		 * A copy pass used for internal swap operations.
+		 *
+		 * @private
+		 * @type {ShaderPass}
+		 */
 		this.copyPass = new ShaderPass( CopyShader );
 		this.copyPass.material.blending = NoBlending;
 
+		/**
+		 * The intenral clock for managing time data.
+		 *
+		 * @private
+		 * @type {Clock}
+		 */
 		this.clock = new Clock();
 
 	}
 
+	/**
+	 * Swaps the internal read/write buffers.
+	 */
 	swapBuffers() {
 
 		const tmp = this.readBuffer;
@@ -59,6 +139,11 @@ class EffectComposer {
 
 	}
 
+	/**
+	 * Adds the given pass to the pass chain.
+	 *
+	 * @param {Pass} pass - The pass to add.
+	 */
 	addPass( pass ) {
 
 		this.passes.push( pass );
@@ -66,6 +151,12 @@ class EffectComposer {
 
 	}
 
+	/**
+	 * Inserts the given pass at a given index.
+	 *
+	 * @param {Pass} pass - The pass to insert.
+	 * @param {number} index - The index into the pass chain.
+	 */
 	insertPass( pass, index ) {
 
 		this.passes.splice( index, 0, pass );
@@ -73,6 +164,11 @@ class EffectComposer {
 
 	}
 
+	/**
+	 * Removes the given pass from the pass chain.
+	 *
+	 * @param {Pass} pass - The pass to remove.
+	 */
 	removePass( pass ) {
 
 		const index = this.passes.indexOf( pass );
@@ -85,6 +181,12 @@ class EffectComposer {
 
 	}
 
+	/**
+	 * Returns `true` if the pass for the given index is the last enabled pass in the pass chain.
+	 *
+	 * @param {number} passIndex - The pass index.
+	 * @return {boolean} Whether the the pass for the given index is the last pass in the pass chain.
+	 */
 	isLastEnabledPass( passIndex ) {
 
 		for ( let i = passIndex + 1; i < this.passes.length; i ++ ) {
@@ -101,6 +203,12 @@ class EffectComposer {
 
 	}
 
+	/**
+	 * Executes all enabled post-processing passes in order to produce the final frame.
+	 *
+	 * @param {number} deltaTime - The delta time in seconds. If not given, the composer computes
+	 * its own time delta value.
+	 */
 	render( deltaTime ) {
 
 		// deltaTime value is in seconds
@@ -165,6 +273,12 @@ class EffectComposer {
 
 	}
 
+	/**
+	 * Resets the internal state of the EffectComposer.
+	 *
+	 * @param {WebGLRenderTarget} [renderTarget] - This render target has the same purpose like
+	 * the one from the constructor. If set, it is used to setup the read and write buffers.
+	 */
 	reset( renderTarget ) {
 
 		if ( renderTarget === undefined ) {
@@ -189,6 +303,13 @@ class EffectComposer {
 
 	}
 
+	/**
+	 * Resizes the internal read and write buffers as well as all passes. Similar to {@link WebGLRenderer#setSize},
+	 * this method honors the current pixel ration.
+	 *
+	 * @param {number} width - The width in logical pixels.
+	 * @param {number} height - The height in logical pixels.
+	 */
 	setSize( width, height ) {
 
 		this._width = width;
@@ -208,6 +329,12 @@ class EffectComposer {
 
 	}
 
+	/**
+	 * Sets device pixel ratio. This is usually used for HiDPI device to prevent blurring output.
+	 * Setting the pixel ratio will automatically resize the composer.
+	 *
+	 * @param {number} pixelRatio - The pixel ratio to set.
+	 */
 	setPixelRatio( pixelRatio ) {
 
 		this._pixelRatio = pixelRatio;
@@ -216,6 +343,10 @@ class EffectComposer {
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the composer is no longer used in your app.
+	 */
 	dispose() {
 
 		this.renderTarget1.dispose();

examples/jsm/postprocessing/FilmPass.js

@@ -5,16 +5,47 @@ import {
 import { Pass, FullScreenQuad } from './Pass.js';
 import { FilmShader } from '../shaders/FilmShader.js';
 
+/**
+ * This pass can be used to create a film grain effect.
+ *
+ * ```js
+ * const filmPass = new FilmPass();
+ * composer.addPass( filmPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class FilmPass extends Pass {
 
+	/**
+	 * Constructs a new film pass.
+	 *
+	 * @param {number} [intensity=0.5] - The grain intensity in the range `[0,1]` (0 = no effect, 1 = full effect).
+	 * @param {boolean} [grayscale=false] - Whether to apply a grayscale effect or not.
+	 */
 	constructor( intensity = 0.5, grayscale = false ) {
 
 		super();
 
 		const shader = FilmShader;
 
+		/**
+		 * The pass uniforms. Use this object if you want to update the
+		 * `intensity` or `grayscale` values at runtime.
+		 * ```js
+		 * pass.uniforms.intensity.value = 1;
+		 * pass.uniforms.grayscale.value = true;
+		 * ```
+		 *
+		 * @type {Object}
+		 */
 		this.uniforms = UniformsUtils.clone( shader.uniforms );
 
+		/**
+		 * The pass material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
 		this.material = new ShaderMaterial( {
 
 			name: shader.name,
@@ -24,13 +55,26 @@ class FilmPass extends Pass {
 
 		} );
 
-		this.uniforms.intensity.value = intensity; // (0 = no effect, 1 = full effect)
+		this.uniforms.intensity.value = intensity;
 		this.uniforms.grayscale.value = grayscale;
 
-		this.fsQuad = new FullScreenQuad( this.material );
+		// internals
+
+		this._fsQuad = new FullScreenQuad( this.material );
 
 	}
 
+	/**
+	 * Performs the film pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer, deltaTime /*, maskActive */ ) {
 
 		this.uniforms[ 'tDiffuse' ].value = readBuffer.texture;
@@ -39,23 +83,27 @@ class FilmPass extends Pass {
 		if ( this.renderToScreen ) {
 
 			renderer.setRenderTarget( null );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		} else {
 
 			renderer.setRenderTarget( writeBuffer );
 			if ( this.clear ) renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		this.material.dispose();
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 

examples/jsm/postprocessing/GTAOPass.js

@@ -26,28 +26,118 @@ import { generatePdSamplePointInitializer, PoissonDenoiseShader } from '../shade
 import { CopyShader } from '../shaders/CopyShader.js';
 import { SimplexNoise } from '../math/SimplexNoise.js';
 
+/**
+ * A pass for an GTAO effect.
+ *
+ * `GTAOPass` provides better quality than {@link SSAOPass} but is also more expensive.
+ *
+ * ```js
+ * const gtaoPass = new GTAOPass( scene, camera, width, height );
+ * gtaoPass.output = GTAOPass.OUTPUT.Denoise;
+ * composer.addPass( gtaoPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class GTAOPass extends Pass {
 
-	constructor( scene, camera, width, height, parameters, aoParameters, pdParameters ) {
+	/**
+	 * Constructs a new GTAO pass.
+	 *
+	 * @param {Scene} scene - The scene to compute the AO for.
+	 * @param {Camera} camera - The camera.
+	 * @param {number} [width=512] - The width of the effect.
+	 * @param {number} [height=512] - The height of the effect.
+	 * @param {Object} [parameters] - The pass parameters.
+	 * @param {Object} [aoParameters] - The AO parameters.
+	 * @param {Object} [pdParameters] - The denoise parameters.
+	 */
+	constructor( scene, camera, width = 512, height = 512, parameters, aoParameters, pdParameters ) {
 
 		super();
 
-		this.width = ( width !== undefined ) ? width : 512;
-		this.height = ( height !== undefined ) ? height : 512;
+		/**
+		 * The width of the effect.
+		 *
+		 * @type {number}
+		 * @default 512
+		 */
+		this.width = width;
+
+		/**
+		 * The height of the effect.
+		 *
+		 * @type {number}
+		 * @default 512
+		 */
+		this.height = height;
+
+		/**
+		 * Overwritten to perform a clear operation by default.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
 		this.clear = true;
+
+		/**
+		 * The camera.
+		 *
+		 * @type {Camera}
+		 */
 		this.camera = camera;
+
+		/**
+		 * The scene to render the AO for.
+		 *
+		 * @type {Scene}
+		 */
 		this.scene = scene;
+
+		/**
+		 * The output configuration.
+		 *
+		 * @type {number}
+		 * @default 0
+		 */
 		this.output = 0;
 		this._renderGBuffer = true;
 		this._visibilityCache = new Map();
+
+		/**
+		 * The AO blend intensity.
+		 *
+		 * @type {number}
+		 * @default 1
+		 */
 		this.blendIntensity = 1.;
 
+		/**
+		 * The number of Poisson Denoise rings.
+		 *
+		 * @type {number}
+		 * @default 2
+		 */
 		this.pdRings = 2.;
+
+		/**
+		 * The Poisson Denoise radius exponent.
+		 *
+		 * @type {number}
+		 * @default 2
+		 */
 		this.pdRadiusExponent = 2.;
+
+		/**
+		 * The Poisson Denoise sample count.
+		 *
+		 * @type {number}
+		 * @default 16
+		 */
 		this.pdSamples = 16;
 
 		this.gtaoNoiseTexture = generateMagicSquareNoise();
-		this.pdNoiseTexture = this.generateNoise();
+		this.pdNoiseTexture = this._generateNoise();
 
 		this.gtaoRenderTarget = new WebGLRenderTarget( this.width, this.height, { type: HalfFloatType } );
 		this.pdRenderTarget = this.gtaoRenderTarget.clone();
@@ -127,9 +217,9 @@ class GTAOPass extends Pass {
 			blendEquationAlpha: AddEquation
 		} );
 
-		this.fsQuad = new FullScreenQuad( null );
+		this._fsQuad = new FullScreenQuad( null );
 
-		this.originalClearColor = new Color();
+		this._originalClearColor = new Color();
 
 		this.setGBuffer( parameters ? parameters.depthTexture : undefined, parameters ? parameters.normalTexture : undefined );
 
@@ -147,6 +237,34 @@ class GTAOPass extends Pass {
 
 	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
+	setSize( width, height ) {
+
+		this.width = width;
+		this.height = height;
+
+		this.gtaoRenderTarget.setSize( width, height );
+		this.normalRenderTarget.setSize( width, height );
+		this.pdRenderTarget.setSize( width, height );
+
+		this.gtaoMaterial.uniforms.resolution.value.set( width, height );
+		this.gtaoMaterial.uniforms.cameraProjectionMatrix.value.copy( this.camera.projectionMatrix );
+		this.gtaoMaterial.uniforms.cameraProjectionMatrixInverse.value.copy( this.camera.projectionMatrixInverse );
+
+		this.pdMaterial.uniforms.resolution.value.set( width, height );
+		this.pdMaterial.uniforms.cameraProjectionMatrixInverse.value.copy( this.camera.projectionMatrixInverse );
+
+	}
+
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		this.gtaoNoiseTexture.dispose();
@@ -158,16 +276,30 @@ class GTAOPass extends Pass {
 		this.pdMaterial.dispose();
 		this.copyMaterial.dispose();
 		this.depthRenderMaterial.dispose();
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 
+	/**
+	 * A texture holding the computed AO.
+	 *
+	 * @type {Texture}
+	 * @readonly
+	 */
 	get gtaoMap() {
 
 		return this.pdRenderTarget.texture;
 
 	}
 
+	/**
+	 * Configures the GBuffer of this pass. If no arguments are passed,
+	 * the pass creates an internal render target for holding depth
+	 * and normal data.
+	 *
+	 * @param {DepthTexture} [depthTexture] - The depth texture.
+	 * @param {DepthTexture} [normalTexture] - The normal texture.
+	 */
 	setGBuffer( depthTexture, normalTexture ) {
 
 		if ( depthTexture !== undefined ) {
@@ -209,6 +341,12 @@ class GTAOPass extends Pass {
 
 	}
 
+	/**
+	 * Configures the clip box of the GTAO shader with the given AABB.
+	 *
+	 * @param {?Box3} box - The AABB enclosing the scene that should receive AO. When passing
+	 * `null`, to clip box is used.
+	 */
 	setSceneClipBox( box ) {
 
 		if ( box ) {
@@ -227,6 +365,11 @@ class GTAOPass extends Pass {
 
 	}
 
+	/**
+	 * Updates the GTAO material from the given paramter object.
+	 *
+	 * @param {Object} parameters - The GTAO material parameters.
+	 */
 	updateGtaoMaterial( parameters ) {
 
 		if ( parameters.radius !== undefined ) {
@@ -276,6 +419,11 @@ class GTAOPass extends Pass {
 
 	}
 
+	/**
+	 * Updates the Denoise material from the given paramter object.
+	 *
+	 * @param {Object} parameters - The denoise parameters.
+	 */
 	updatePdMaterial( parameters ) {
 
 		let updateShader = false;
@@ -335,15 +483,26 @@ class GTAOPass extends Pass {
 
 	}
 
+	/**
+	 * Performs the GTAO pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer /*, deltaTime, maskActive */ ) {
 
 		// render normals and depth (honor only meshes, points and lines do not contribute to AO)
 
 		if ( this._renderGBuffer ) {
 
-			this.overrideVisibility();
-			this.renderOverride( renderer, this.normalMaterial, this.normalRenderTarget, 0x7777ff, 1.0 );
-			this.restoreVisibility();
+			this._overrideVisibility();
+			this._renderOverride( renderer, this.normalMaterial, this.normalRenderTarget, 0x7777ff, 1.0 );
+			this._restoreVisibility();
 
 		}
 
@@ -354,12 +513,12 @@ class GTAOPass extends Pass {
 		this.gtaoMaterial.uniforms.cameraProjectionMatrix.value.copy( this.camera.projectionMatrix );
 		this.gtaoMaterial.uniforms.cameraProjectionMatrixInverse.value.copy( this.camera.projectionMatrixInverse );
 		this.gtaoMaterial.uniforms.cameraWorldMatrix.value.copy( this.camera.matrixWorld );
-		this.renderPass( renderer, this.gtaoMaterial, this.gtaoRenderTarget, 0xffffff, 1.0 );
+		this._renderPass( renderer, this.gtaoMaterial, this.gtaoRenderTarget, 0xffffff, 1.0 );
 
 		// render poisson denoise
 
 		this.pdMaterial.uniforms.cameraProjectionMatrixInverse.value.copy( this.camera.projectionMatrixInverse );
-		this.renderPass( renderer, this.pdMaterial, this.pdRenderTarget, 0xffffff, 1.0 );
+		this._renderPass( renderer, this.pdMaterial, this.pdRenderTarget, 0xffffff, 1.0 );
 
 		// output result to screen
 
@@ -372,7 +531,7 @@ class GTAOPass extends Pass {
 
 				this.copyMaterial.uniforms.tDiffuse.value = readBuffer.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 				break;
 
@@ -380,7 +539,7 @@ class GTAOPass extends Pass {
 
 				this.copyMaterial.uniforms.tDiffuse.value = this.gtaoRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 				break;
 
@@ -388,7 +547,7 @@ class GTAOPass extends Pass {
 
 				this.copyMaterial.uniforms.tDiffuse.value = this.pdRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 				break;
 
@@ -396,7 +555,7 @@ class GTAOPass extends Pass {
 
 				this.depthRenderMaterial.uniforms.cameraNear.value = this.camera.near;
 				this.depthRenderMaterial.uniforms.cameraFar.value = this.camera.far;
-				this.renderPass( renderer, this.depthRenderMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.depthRenderMaterial, this.renderToScreen ? null : writeBuffer );
 
 				break;
 
@@ -404,7 +563,7 @@ class GTAOPass extends Pass {
 
 				this.copyMaterial.uniforms.tDiffuse.value = this.normalRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 				break;
 
@@ -412,11 +571,11 @@ class GTAOPass extends Pass {
 
 				this.copyMaterial.uniforms.tDiffuse.value = readBuffer.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 				this.blendMaterial.uniforms.intensity.value = this.blendIntensity;
 				this.blendMaterial.uniforms.tDiffuse.value = this.pdRenderTarget.texture;
-				this.renderPass( renderer, this.blendMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.blendMaterial, this.renderToScreen ? null : writeBuffer );
 
 				break;
 
@@ -427,10 +586,12 @@ class GTAOPass extends Pass {
 
 	}
 
-	renderPass( renderer, passMaterial, renderTarget, clearColor, clearAlpha ) {
+	// internals
+
+	_renderPass( renderer, passMaterial, renderTarget, clearColor, clearAlpha ) {
 
 		// save original state
-		renderer.getClearColor( this.originalClearColor );
+		renderer.getClearColor( this._originalClearColor );
 		const originalClearAlpha = renderer.getClearAlpha();
 		const originalAutoClear = renderer.autoClear;
 
@@ -446,19 +607,19 @@ class GTAOPass extends Pass {
 
 		}
 
-		this.fsQuad.material = passMaterial;
-		this.fsQuad.render( renderer );
+		this._fsQuad.material = passMaterial;
+		this._fsQuad.render( renderer );
 
 		// restore original state
 		renderer.autoClear = originalAutoClear;
-		renderer.setClearColor( this.originalClearColor );
+		renderer.setClearColor( this._originalClearColor );
 		renderer.setClearAlpha( originalClearAlpha );
 
 	}
 
-	renderOverride( renderer, overrideMaterial, renderTarget, clearColor, clearAlpha ) {
+	_renderOverride( renderer, overrideMaterial, renderTarget, clearColor, clearAlpha ) {
 
-		renderer.getClearColor( this.originalClearColor );
+		renderer.getClearColor( this._originalClearColor );
 		const originalClearAlpha = renderer.getClearAlpha();
 		const originalAutoClear = renderer.autoClear;
 
@@ -481,30 +642,12 @@ class GTAOPass extends Pass {
 		this.scene.overrideMaterial = null;
 
 		renderer.autoClear = originalAutoClear;
-		renderer.setClearColor( this.originalClearColor );
+		renderer.setClearColor( this._originalClearColor );
 		renderer.setClearAlpha( originalClearAlpha );
 
 	}
 
-	setSize( width, height ) {
-
-		this.width = width;
-		this.height = height;
-
-		this.gtaoRenderTarget.setSize( width, height );
-		this.normalRenderTarget.setSize( width, height );
-		this.pdRenderTarget.setSize( width, height );
-
-		this.gtaoMaterial.uniforms.resolution.value.set( width, height );
-		this.gtaoMaterial.uniforms.cameraProjectionMatrix.value.copy( this.camera.projectionMatrix );
-		this.gtaoMaterial.uniforms.cameraProjectionMatrixInverse.value.copy( this.camera.projectionMatrixInverse );
-
-		this.pdMaterial.uniforms.resolution.value.set( width, height );
-		this.pdMaterial.uniforms.cameraProjectionMatrixInverse.value.copy( this.camera.projectionMatrixInverse );
-
-	}
-
-	overrideVisibility() {
+	_overrideVisibility() {
 
 		const scene = this.scene;
 		const cache = this._visibilityCache;
@@ -519,7 +662,7 @@ class GTAOPass extends Pass {
 
 	}
 
-	restoreVisibility() {
+	_restoreVisibility() {
 
 		const scene = this.scene;
 		const cache = this._visibilityCache;
@@ -535,7 +678,7 @@ class GTAOPass extends Pass {
 
 	}
 
-	generateNoise( size = 64 ) {
+	_generateNoise( size = 64 ) {
 
 		const simplex = new SimplexNoise();
 

examples/jsm/postprocessing/GlitchPass.js

@@ -9,41 +9,86 @@ import {
 import { Pass, FullScreenQuad } from './Pass.js';
 import { DigitalGlitch } from '../shaders/DigitalGlitch.js';
 
+/**
+ * Pass for creating a glitch effect.
+ *
+ * ```js
+ * const glitchPass = new GlitchPass();
+ * composer.addPass( glitchPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class GlitchPass extends Pass {
 
+	/**
+	 * Constructs a new glitch pass.
+	 *
+	 * @param {number} [dt_size=64] - The size of the displacement texture
+	 * for digital glitch squares.
+	 */
 	constructor( dt_size = 64 ) {
 
 		super();
 
-		const shader = DigitalGlitch;
+		/**
+		 * The pass uniforms.
+		 *
+		 * @type {Object}
+		 */
+		this.uniforms = UniformsUtils.clone( DigitalGlitch.uniforms );
+
+		/**
+		 * The pass material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
+		this.material = new ShaderMaterial( {
+			uniforms: this.uniforms,
+			vertexShader: DigitalGlitch.vertexShader,
+			fragmentShader: DigitalGlitch.fragmentShader
+		} );
 
-		this.uniforms = UniformsUtils.clone( shader.uniforms );
+		/**
+		 * Whether to noticeably increase the effect instensity or not.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
+		this.goWild = false;
 
-		this.heightMap = this.generateHeightmap( dt_size );
+		// internals
 
+		this._heightMap = this._generateHeightmap( dt_size );
 		this.uniforms[ 'tDisp' ].value = this.heightMap;
 
-		this.material = new ShaderMaterial( {
-			uniforms: this.uniforms,
-			vertexShader: shader.vertexShader,
-			fragmentShader: shader.fragmentShader
-		} );
+		this._fsQuad = new FullScreenQuad( this.material );
 
-		this.fsQuad = new FullScreenQuad( this.material );
+		this._curF = 0;
+		this._randX = 0;
 
-		this.goWild = false;
-		this.curF = 0;
-		this.generateTrigger();
+		this._generateTrigger();
 
 	}
 
+	/**
+	 * Performs the glitch pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer /*, deltaTime, maskActive */ ) {
 
 		this.uniforms[ 'tDiffuse' ].value = readBuffer.texture;
-		this.uniforms[ 'seed' ].value = Math.random();//default seeding
+		this.uniforms[ 'seed' ].value = Math.random(); // default seeding
 		this.uniforms[ 'byp' ].value = 0;
 
-		if ( this.curF % this.randX == 0 || this.goWild == true ) {
+		if ( this._curF % this._randX == 0 || this.goWild == true ) {
 
 			this.uniforms[ 'amount' ].value = Math.random() / 30;
 			this.uniforms[ 'angle' ].value = MathUtils.randFloat( - Math.PI, Math.PI );
@@ -51,10 +96,10 @@ class GlitchPass extends Pass {
 			this.uniforms[ 'seed_y' ].value = MathUtils.randFloat( - 1, 1 );
 			this.uniforms[ 'distortion_x' ].value = MathUtils.randFloat( 0, 1 );
 			this.uniforms[ 'distortion_y' ].value = MathUtils.randFloat( 0, 1 );
-			this.curF = 0;
-			this.generateTrigger();
+			this._curF = 0;
+			this._generateTrigger();
 
-		} else if ( this.curF % this.randX < this.randX / 5 ) {
+		} else if ( this._curF % this._randX < this._randX / 5 ) {
 
 			this.uniforms[ 'amount' ].value = Math.random() / 90;
 			this.uniforms[ 'angle' ].value = MathUtils.randFloat( - Math.PI, Math.PI );
@@ -69,30 +114,46 @@ class GlitchPass extends Pass {
 
 		}
 
-		this.curF ++;
+		this._curF ++;
 
 		if ( this.renderToScreen ) {
 
 			renderer.setRenderTarget( null );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		} else {
 
 			renderer.setRenderTarget( writeBuffer );
 			if ( this.clear ) renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 
 	}
 
-	generateTrigger() {
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
+	dispose() {
 
-		this.randX = MathUtils.randInt( 120, 240 );
+		this.material.dispose();
+
+		this.heightMap.dispose();
+
+		this._fsQuad.dispose();
 
 	}
 
-	generateHeightmap( dt_size ) {
+	// internals
+
+	_generateTrigger() {
+
+		this._randX = MathUtils.randInt( 120, 240 );
+
+	}
+
+	_generateHeightmap( dt_size ) {
 
 		const data_arr = new Float32Array( dt_size * dt_size );
 		const length = dt_size * dt_size;
@@ -110,16 +171,6 @@ class GlitchPass extends Pass {
 
 	}
 
-	dispose() {
-
-		this.material.dispose();
-
-		this.heightMap.dispose();
-
-		this.fsQuad.dispose();
-
-	}
-
 }
 
 export { GlitchPass };

examples/jsm/postprocessing/HalftonePass.js

@@ -6,25 +6,56 @@ import { Pass, FullScreenQuad } from './Pass.js';
 import { HalftoneShader } from '../shaders/HalftoneShader.js';
 
 /**
- * RGB Halftone pass for three.js effects composer. Requires HalftoneShader.
+ * Pass for creating a RGB halftone effect.
+ *
+ * ```js
+ * const params = {
+ * 	shape: 1,
+ * 	radius: 4,
+ * 	rotateR: Math.PI / 12,
+ * 	rotateB: Math.PI / 12 * 2,
+ * 	rotateG: Math.PI / 12 * 3,
+ * 	scatter: 0,
+ * 	blending: 1,
+ * 	blendingMode: 1,
+ * 	greyscale: false,
+ * 	disable: false
+ * };
+ * const halftonePass = new HalftonePass( params );
+ * composer.addPass( halftonePass );
+ * ```
+ *
+ * @augments Pass
  */
-
 class HalftonePass extends Pass {
 
-	constructor( width, height, params ) {
+	/**
+	 * Constructs a new halftone pass.
+	 *
+	 * @param {Object} params - The halftone shader parameter.
+	 */
+	constructor( params ) {
 
 		super();
 
+		/**
+		 * The pass uniforms.
+		 *
+		 * @type {Object}
+		 */
 	 	this.uniforms = UniformsUtils.clone( HalftoneShader.uniforms );
+
+		/**
+		 * The pass material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
 	 	this.material = new ShaderMaterial( {
 	 		uniforms: this.uniforms,
 	 		fragmentShader: HalftoneShader.fragmentShader,
 	 		vertexShader: HalftoneShader.vertexShader
 	 	} );
 
-		// set params
-		this.uniforms.width.value = width;
-		this.uniforms.height.value = height;
 
 		for ( const key in params ) {
 
@@ -36,10 +67,23 @@ class HalftonePass extends Pass {
 
 		}
 
-		this.fsQuad = new FullScreenQuad( this.material );
+		// internals
+
+		this._fsQuad = new FullScreenQuad( this.material );
 
 	}
 
+	/**
+	 * Performs the halftone pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer/*, deltaTime, maskActive*/ ) {
 
  		this.material.uniforms[ 'tDiffuse' ].value = readBuffer.texture;
@@ -47,18 +91,24 @@ class HalftonePass extends Pass {
  		if ( this.renderToScreen ) {
 
  			renderer.setRenderTarget( null );
- 			this.fsQuad.render( renderer );
+ 			this._fsQuad.render( renderer );
 
 		} else {
 
  			renderer.setRenderTarget( writeBuffer );
  			if ( this.clear ) renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 
  	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
  	setSize( width, height ) {
 
  		this.uniforms.width.value = width;
@@ -66,11 +116,15 @@ class HalftonePass extends Pass {
 
  	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		this.material.dispose();
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 

examples/jsm/postprocessing/LUTPass.js

@@ -56,8 +56,45 @@ const LUTShader = {
 
 };
 
+/**
+ * Pass for color grading via lookup tables.
+ *
+ * ```js
+ * const lutPass = new LUTPass( { lut: lut.texture3D } );
+ * composer.addPass( lutPass );
+ * ```
+ *
+ * @augments ShaderPass
+ */
 class LUTPass extends ShaderPass {
 
+	/**
+	 * Constructs a LUT pass.
+	 *
+	 * @param {{lut:Data3DTexture,intensity:number}} [options={}] - The pass options.
+	 */
+	constructor( options = {} ) {
+
+		super( LUTShader );
+
+		/**
+		 * The LUT as a 3D texture.
+		 *
+		 * @type {?Data3DTexture}
+		 * @default null
+		 */
+		this.lut = options.lut || null;
+
+		/**
+		 * The intensity.
+		 *
+		 * @type {?number}
+		 * @default 1
+		 */
+		this.intensity = 'intensity' in options ? options.intensity : 1;
+
+	}
+
 	set lut( v ) {
 
 		const material = this.material;
@@ -95,14 +132,6 @@ class LUTPass extends ShaderPass {
 
 	}
 
-	constructor( options = {} ) {
-
-		super( LUTShader );
-		this.lut = options.lut || null;
-		this.intensity = 'intensity' in options ? options.intensity : 1;
-
-	}
-
 }
 
 export { LUTPass };

examples/jsm/postprocessing/MaskPass.js

@@ -1,21 +1,81 @@
 import { Pass } from './Pass.js';
 
+/**
+ * This pass can be used to define a mask during post processing.
+ * Meaning only areas of subsequent post processing are affected
+ * which lie in the masking area of this pass. Internally, the masking
+ * is implemented with the stencil buffer.
+ *
+ * ```js
+ * const maskPass = new MaskPass( scene, camera );
+ * composer.addPass( maskPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class MaskPass extends Pass {
 
+	/**
+	 * Constructs a new mask pass.
+	 *
+	 * @param {Scene} scene - The 3D objects in this scene will define the mask.
+	 * @param {Camera} camera - The camera.
+	 */
 	constructor( scene, camera ) {
 
 		super();
 
+		/**
+		 * The scene that defines the mask.
+		 *
+		 * @type {Scene}
+		 */
 		this.scene = scene;
+
+		/**
+		 * The camera.
+		 *
+		 * @type {Camera}
+		 */
 		this.camera = camera;
 
+		/**
+		 * Overwritten to perform a clear operation by default.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
 		this.clear = true;
+
+		/**
+		 * Overwritten to disable the swap.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.needsSwap = false;
 
+		/**
+		 * Whether to inverse the mask or not.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.inverse = false;
 
 	}
 
+	/**
+	 * Performs a mask pass with the configured scene and camera.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer /*, deltaTime, maskActive */ ) {
 
 		const context = renderer.getContext();
@@ -82,16 +142,46 @@ class MaskPass extends Pass {
 
 }
 
+/**
+ * This pass can be used to clear a mask previously defined with {@link MaskPass}.
+ *
+ * ```js
+ * const clearPass = new ClearMaskPass();
+ * composer.addPass( clearPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class ClearMaskPass extends Pass {
 
+	/**
+	 * Constructs a new clear mask pass.
+	 */
 	constructor() {
 
 		super();
 
+		/**
+		 * Overwritten to disable the swap.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.needsSwap = false;
 
 	}
 
+	/**
+	 * Performs the clear of the currently defined mask.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer /*, writeBuffer, readBuffer, deltaTime, maskActive */ ) {
 
 		renderer.state.buffers.stencil.setLocked( false );

examples/jsm/postprocessing/OutlinePass.js

@@ -16,27 +16,137 @@ import {
 import { Pass, FullScreenQuad } from './Pass.js';
 import { CopyShader } from '../shaders/CopyShader.js';
 
+/**
+ * A pass for rendering outlines around selected objects.
+ *
+ * ```js
+ * const resolution = new THREE.Vector2( window.innerWidth, window.innerHeight );
+ * const outlinePass = new OutlinePass( resolution, scene, camera );
+ * composer.addPass( outlinePass );
+ * ```
+ *
+ * @augments Pass
+ */
 class OutlinePass extends Pass {
 
+	/**
+	 * Constructs a new outline pass.
+	 *
+	 * @param {Vector2} [resolution] - The effect's resolution.
+	 * @param {Scene} scene - The scene to render.
+	 * @param {Camera} camera - The camera.
+	 * @param {Array<Object3D>} [selectedObjects] - The selected 3D objects that should receive an outline.
+	 *
+	 */
 	constructor( resolution, scene, camera, selectedObjects ) {
 
 		super();
 
+		/**
+		 * The scene to render.
+		 *
+		 * @type {Object}
+		 */
 		this.renderScene = scene;
+
+		/**
+		 * The camera.
+		 *
+		 * @type {Object}
+		 */
 		this.renderCamera = camera;
+
+		/**
+		 * The selected 3D objects that should receive an outline.
+		 *
+		 * @type {Array<Object3D>}
+		 */
 		this.selectedObjects = selectedObjects !== undefined ? selectedObjects : [];
+
+		/**
+		 * The visible edge color.
+		 *
+		 * @type {Color}
+		 * @default (1,1,1)
+		 */
 		this.visibleEdgeColor = new Color( 1, 1, 1 );
+
+		/**
+		 * The hidden edge color.
+		 *
+		 * @type {Color}
+		 * @default (0.1,0.04,0.02)
+		 */
 		this.hiddenEdgeColor = new Color( 0.1, 0.04, 0.02 );
+
+		/**
+		 * Can be used for an animated glow/pulse effect.
+		 *
+		 * @type {number}
+		 * @default 0
+		 */
 		this.edgeGlow = 0.0;
+
+		/**
+		 * Whether to use a pattern texture for to highlight selected
+		 * 3D objects or not.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.usePatternTexture = false;
+
+		/**
+		 * Can be used to highlight selected 3D objects. Requires to set
+		 * {@link OutlinePass#usePatternTexture} to `true`.
+		 *
+		 * @type {?Texture}
+		 * @default null
+		 */
+		this.patternTexture = null;
+
+		/**
+		 * The edge thickness.
+		 *
+		 * @type {number}
+		 * @default 1
+		 */
 		this.edgeThickness = 1.0;
+
+		/**
+		 * The edge strength.
+		 *
+		 * @type {number}
+		 * @default 3
+		 */
 		this.edgeStrength = 3.0;
+
+		/**
+		 * The downsample ratio. The effect can be rendered in a much
+		 * lower resolution than the beauty pass.
+		 *
+		 * @type {number}
+		 * @default 2
+		 */
 		this.downSampleRatio = 2;
+
+		/**
+		 * The pulse period.
+		 *
+		 * @type {number}
+		 * @default 0
+		 */
 		this.pulsePeriod = 0;
 
 		this._visibilityCache = new Map();
 		this._selectionCache = new Set();
 
+		/**
+		 * The effect's resolution.
+		 *
+		 * @type {Vector2}
+		 * @default (256,256)
+		 */
 		this.resolution = ( resolution !== undefined ) ? new Vector2( resolution.x, resolution.y ) : new Vector2( 256, 256 );
 
 		const resx = Math.round( this.resolution.x / this.downSampleRatio );
@@ -51,7 +161,7 @@ class OutlinePass extends Pass {
 		this.depthMaterial.depthPacking = RGBADepthPacking;
 		this.depthMaterial.blending = NoBlending;
 
-		this.prepareMaskMaterial = this.getPrepareMaskMaterial();
+		this.prepareMaskMaterial = this._getPrepareMaskMaterial();
 		this.prepareMaskMaterial.side = DoubleSide;
 		this.prepareMaskMaterial.fragmentShader = replaceDepthToViewZ( this.prepareMaskMaterial.fragmentShader, this.renderCamera );
 
@@ -70,7 +180,7 @@ class OutlinePass extends Pass {
 		this.renderTargetBlurBuffer2.texture.name = 'OutlinePass.blur2';
 		this.renderTargetBlurBuffer2.texture.generateMipmaps = false;
 
-		this.edgeDetectionMaterial = this.getEdgeDetectionMaterial();
+		this.edgeDetectionMaterial = this._getEdgeDetectionMaterial();
 		this.renderTargetEdgeBuffer1 = new WebGLRenderTarget( resx, resy, { type: HalfFloatType } );
 		this.renderTargetEdgeBuffer1.texture.name = 'OutlinePass.edge1';
 		this.renderTargetEdgeBuffer1.texture.generateMipmaps = false;
@@ -81,15 +191,15 @@ class OutlinePass extends Pass {
 		const MAX_EDGE_THICKNESS = 4;
 		const MAX_EDGE_GLOW = 4;
 
-		this.separableBlurMaterial1 = this.getSeparableBlurMaterial( MAX_EDGE_THICKNESS );
+		this.separableBlurMaterial1 = this._getSeparableBlurMaterial( MAX_EDGE_THICKNESS );
 		this.separableBlurMaterial1.uniforms[ 'texSize' ].value.set( resx, resy );
 		this.separableBlurMaterial1.uniforms[ 'kernelRadius' ].value = 1;
-		this.separableBlurMaterial2 = this.getSeparableBlurMaterial( MAX_EDGE_GLOW );
+		this.separableBlurMaterial2 = this._getSeparableBlurMaterial( MAX_EDGE_GLOW );
 		this.separableBlurMaterial2.uniforms[ 'texSize' ].value.set( Math.round( resx / 2 ), Math.round( resy / 2 ) );
 		this.separableBlurMaterial2.uniforms[ 'kernelRadius' ].value = MAX_EDGE_GLOW;
 
 		// Overlay material
-		this.overlayMaterial = this.getOverlayMaterial();
+		this.overlayMaterial = this._getOverlayMaterial();
 
 		// copy material
 
@@ -112,7 +222,7 @@ class OutlinePass extends Pass {
 		this._oldClearColor = new Color();
 		this.oldClearAlpha = 1;
 
-		this.fsQuad = new FullScreenQuad( null );
+		this._fsQuad = new FullScreenQuad( null );
 
 		this.tempPulseColor1 = new Color();
 		this.tempPulseColor2 = new Color();
@@ -128,6 +238,10 @@ class OutlinePass extends Pass {
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		this.renderTargetMaskBuffer.dispose();
@@ -146,10 +260,16 @@ class OutlinePass extends Pass {
 		this.overlayMaterial.dispose();
 		this.materialCopy.dispose();
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
 	setSize( width, height ) {
 
 		this.renderTargetMaskBuffer.setSize( width, height );
@@ -172,108 +292,17 @@ class OutlinePass extends Pass {
 
 	}
 
-	updateSelectionCache() {
-
-		const cache = this._selectionCache;
-
-		function gatherSelectedMeshesCallBack( object ) {
-
-			if ( object.isMesh ) cache.add( object );
-
-		}
-
-		cache.clear();
-
-		for ( let i = 0; i < this.selectedObjects.length; i ++ ) {
-
-			const selectedObject = this.selectedObjects[ i ];
-			selectedObject.traverse( gatherSelectedMeshesCallBack );
-
-		}
-
-	}
-
-	changeVisibilityOfSelectedObjects( bVisible ) {
-
-		const cache = this._visibilityCache;
-
-		for ( const mesh of this._selectionCache ) {
-
-			if ( bVisible === true ) {
-
-				mesh.visible = cache.get( mesh );
-
-			} else {
-
-				cache.set( mesh, mesh.visible );
-				mesh.visible = bVisible;
-
-			}
-
-		}
-
-	}
-
-	changeVisibilityOfNonSelectedObjects( bVisible ) {
-
-		const visibilityCache = this._visibilityCache;
-		const selectionCache = this._selectionCache;
-
-		function VisibilityChangeCallBack( object ) {
-
-			if ( object.isMesh || object.isSprite ) {
-
-				// only meshes and sprites are supported by OutlinePass
-
-				if ( ! selectionCache.has( object ) ) {
-
-					const visibility = object.visible;
-
-					if ( bVisible === false || visibilityCache.get( object ) === true ) {
-
-						object.visible = bVisible;
-
-					}
-
-					visibilityCache.set( object, visibility );
-
-				}
-
-			} else if ( object.isPoints || object.isLine ) {
-
-				// the visibility of points and lines is always set to false in order to
-				// not affect the outline computation
-
-				if ( bVisible === true ) {
-
-					object.visible = visibilityCache.get( object ); // restore
-
-				} else {
-
-					visibilityCache.set( object, object.visible );
-					object.visible = bVisible;
-
-				}
-
-			}
-
-		}
-
-		this.renderScene.traverse( VisibilityChangeCallBack );
-
-	}
-
-	updateTextureMatrix() {
-
-		this.textureMatrix.set( 0.5, 0.0, 0.0, 0.5,
-			0.0, 0.5, 0.0, 0.5,
-			0.0, 0.0, 0.5, 0.5,
-			0.0, 0.0, 0.0, 1.0 );
-		this.textureMatrix.multiply( this.renderCamera.projectionMatrix );
-		this.textureMatrix.multiply( this.renderCamera.matrixWorldInverse );
-
-	}
-
+	/**
+	 * Performs the Outline pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer, deltaTime, maskActive ) {
 
 		if ( this.selectedObjects.length > 0 ) {
@@ -288,10 +317,10 @@ class OutlinePass extends Pass {
 
 			renderer.setClearColor( 0xffffff, 1 );
 
-			this.updateSelectionCache();
+			this._updateSelectionCache();
 
 			// Make selected objects invisible
-			this.changeVisibilityOfSelectedObjects( false );
+			this._changeVisibilityOfSelectedObjects( false );
 
 			const currentBackground = this.renderScene.background;
 			const currentOverrideMaterial = this.renderScene.overrideMaterial;
@@ -304,14 +333,14 @@ class OutlinePass extends Pass {
 			renderer.render( this.renderScene, this.renderCamera );
 
 			// Make selected objects visible
-			this.changeVisibilityOfSelectedObjects( true );
+			this._changeVisibilityOfSelectedObjects( true );
 			this._visibilityCache.clear();
 
 			// Update Texture Matrix for Depth compare
-			this.updateTextureMatrix();
+			this._updateTextureMatrix();
 
 			// Make non selected objects invisible, and draw only the selected objects, by comparing the depth buffer of non selected objects
-			this.changeVisibilityOfNonSelectedObjects( false );
+			this._changeVisibilityOfNonSelectedObjects( false );
 			this.renderScene.overrideMaterial = this.prepareMaskMaterial;
 			this.prepareMaskMaterial.uniforms[ 'cameraNearFar' ].value.set( this.renderCamera.near, this.renderCamera.far );
 			this.prepareMaskMaterial.uniforms[ 'depthTexture' ].value = this.renderTargetDepthBuffer.texture;
@@ -319,7 +348,7 @@ class OutlinePass extends Pass {
 			renderer.setRenderTarget( this.renderTargetMaskBuffer );
 			renderer.clear();
 			renderer.render( this.renderScene, this.renderCamera );
-			this.changeVisibilityOfNonSelectedObjects( true );
+			this._changeVisibilityOfNonSelectedObjects( true );
 			this._visibilityCache.clear();
 			this._selectionCache.clear();
 
@@ -327,11 +356,11 @@ class OutlinePass extends Pass {
 			this.renderScene.overrideMaterial = currentOverrideMaterial;
 
 			// 2. Downsample to Half resolution
-			this.fsQuad.material = this.materialCopy;
+			this._fsQuad.material = this.materialCopy;
 			this.copyUniforms[ 'tDiffuse' ].value = this.renderTargetMaskBuffer.texture;
 			renderer.setRenderTarget( this.renderTargetMaskDownSampleBuffer );
 			renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 			this.tempPulseColor1.copy( this.visibleEdgeColor );
 			this.tempPulseColor2.copy( this.hiddenEdgeColor );
@@ -345,44 +374,44 @@ class OutlinePass extends Pass {
 			}
 
 			// 3. Apply Edge Detection Pass
-			this.fsQuad.material = this.edgeDetectionMaterial;
+			this._fsQuad.material = this.edgeDetectionMaterial;
 			this.edgeDetectionMaterial.uniforms[ 'maskTexture' ].value = this.renderTargetMaskDownSampleBuffer.texture;
 			this.edgeDetectionMaterial.uniforms[ 'texSize' ].value.set( this.renderTargetMaskDownSampleBuffer.width, this.renderTargetMaskDownSampleBuffer.height );
 			this.edgeDetectionMaterial.uniforms[ 'visibleEdgeColor' ].value = this.tempPulseColor1;
 			this.edgeDetectionMaterial.uniforms[ 'hiddenEdgeColor' ].value = this.tempPulseColor2;
 			renderer.setRenderTarget( this.renderTargetEdgeBuffer1 );
 			renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 			// 4. Apply Blur on Half res
-			this.fsQuad.material = this.separableBlurMaterial1;
+			this._fsQuad.material = this.separableBlurMaterial1;
 			this.separableBlurMaterial1.uniforms[ 'colorTexture' ].value = this.renderTargetEdgeBuffer1.texture;
 			this.separableBlurMaterial1.uniforms[ 'direction' ].value = OutlinePass.BlurDirectionX;
 			this.separableBlurMaterial1.uniforms[ 'kernelRadius' ].value = this.edgeThickness;
 			renderer.setRenderTarget( this.renderTargetBlurBuffer1 );
 			renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 			this.separableBlurMaterial1.uniforms[ 'colorTexture' ].value = this.renderTargetBlurBuffer1.texture;
 			this.separableBlurMaterial1.uniforms[ 'direction' ].value = OutlinePass.BlurDirectionY;
 			renderer.setRenderTarget( this.renderTargetEdgeBuffer1 );
 			renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 			// Apply Blur on quarter res
-			this.fsQuad.material = this.separableBlurMaterial2;
+			this._fsQuad.material = this.separableBlurMaterial2;
 			this.separableBlurMaterial2.uniforms[ 'colorTexture' ].value = this.renderTargetEdgeBuffer1.texture;
 			this.separableBlurMaterial2.uniforms[ 'direction' ].value = OutlinePass.BlurDirectionX;
 			renderer.setRenderTarget( this.renderTargetBlurBuffer2 );
 			renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 			this.separableBlurMaterial2.uniforms[ 'colorTexture' ].value = this.renderTargetBlurBuffer2.texture;
 			this.separableBlurMaterial2.uniforms[ 'direction' ].value = OutlinePass.BlurDirectionY;
 			renderer.setRenderTarget( this.renderTargetEdgeBuffer2 );
 			renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 			// Blend it additively over the input texture
-			this.fsQuad.material = this.overlayMaterial;
+			this._fsQuad.material = this.overlayMaterial;
 			this.overlayMaterial.uniforms[ 'maskTexture' ].value = this.renderTargetMaskBuffer.texture;
 			this.overlayMaterial.uniforms[ 'edgeTexture1' ].value = this.renderTargetEdgeBuffer1.texture;
 			this.overlayMaterial.uniforms[ 'edgeTexture2' ].value = this.renderTargetEdgeBuffer2.texture;
@@ -395,7 +424,7 @@ class OutlinePass extends Pass {
 			if ( maskActive ) renderer.state.buffers.stencil.setTest( true );
 
 			renderer.setRenderTarget( readBuffer );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 			renderer.setClearColor( this._oldClearColor, this.oldClearAlpha );
 			renderer.autoClear = oldAutoClear;
@@ -404,16 +433,120 @@ class OutlinePass extends Pass {
 
 		if ( this.renderToScreen ) {
 
-			this.fsQuad.material = this.materialCopy;
+			this._fsQuad.material = this.materialCopy;
 			this.copyUniforms[ 'tDiffuse' ].value = readBuffer.texture;
 			renderer.setRenderTarget( null );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
+
+		}
+
+	}
+
+	// internals
+
+	_updateSelectionCache() {
+
+		const cache = this._selectionCache;
+
+		function gatherSelectedMeshesCallBack( object ) {
+
+			if ( object.isMesh ) cache.add( object );
+
+		}
+
+		cache.clear();
+
+		for ( let i = 0; i < this.selectedObjects.length; i ++ ) {
+
+			const selectedObject = this.selectedObjects[ i ];
+			selectedObject.traverse( gatherSelectedMeshesCallBack );
+
+		}
+
+	}
+
+	_changeVisibilityOfSelectedObjects( bVisible ) {
+
+		const cache = this._visibilityCache;
+
+		for ( const mesh of this._selectionCache ) {
+
+			if ( bVisible === true ) {
+
+				mesh.visible = cache.get( mesh );
+
+			} else {
+
+				cache.set( mesh, mesh.visible );
+				mesh.visible = bVisible;
+
+			}
 
 		}
 
 	}
 
-	getPrepareMaskMaterial() {
+	_changeVisibilityOfNonSelectedObjects( bVisible ) {
+
+		const visibilityCache = this._visibilityCache;
+		const selectionCache = this._selectionCache;
+
+		function VisibilityChangeCallBack( object ) {
+
+			if ( object.isMesh || object.isSprite ) {
+
+				// only meshes and sprites are supported by OutlinePass
+
+				if ( ! selectionCache.has( object ) ) {
+
+					const visibility = object.visible;
+
+					if ( bVisible === false || visibilityCache.get( object ) === true ) {
+
+						object.visible = bVisible;
+
+					}
+
+					visibilityCache.set( object, visibility );
+
+				}
+
+			} else if ( object.isPoints || object.isLine ) {
+
+				// the visibility of points and lines is always set to false in order to
+				// not affect the outline computation
+
+				if ( bVisible === true ) {
+
+					object.visible = visibilityCache.get( object ); // restore
+
+				} else {
+
+					visibilityCache.set( object, object.visible );
+					object.visible = bVisible;
+
+				}
+
+			}
+
+		}
+
+		this.renderScene.traverse( VisibilityChangeCallBack );
+
+	}
+
+	_updateTextureMatrix() {
+
+		this.textureMatrix.set( 0.5, 0.0, 0.0, 0.5,
+			0.0, 0.5, 0.0, 0.5,
+			0.0, 0.0, 0.5, 0.5,
+			0.0, 0.0, 0.0, 1.0 );
+		this.textureMatrix.multiply( this.renderCamera.projectionMatrix );
+		this.textureMatrix.multiply( this.renderCamera.matrixWorldInverse );
+
+	}
+
+	_getPrepareMaskMaterial() {
 
 		return new ShaderMaterial( {
 
@@ -475,7 +608,7 @@ class OutlinePass extends Pass {
 
 	}
 
-	getEdgeDetectionMaterial() {
+	_getEdgeDetectionMaterial() {
 
 		return new ShaderMaterial( {
 
@@ -522,7 +655,7 @@ class OutlinePass extends Pass {
 
 	}
 
-	getSeparableBlurMaterial( maxRadius ) {
+	_getSeparableBlurMaterial( maxRadius ) {
 
 		return new ShaderMaterial( {
 
@@ -579,7 +712,7 @@ class OutlinePass extends Pass {
 
 	}
 
-	getOverlayMaterial() {
+	_getOverlayMaterial() {
 
 		return new ShaderMaterial( {
 

examples/jsm/postprocessing/OutputPass.js

@@ -14,34 +14,69 @@ import {
 import { Pass, FullScreenQuad } from './Pass.js';
 import { OutputShader } from '../shaders/OutputShader.js';
 
+/**
+ * This pass is responsible for including tone mapping and color space conversion
+ * into your pass chain. In most cases, this pass should be included at the end
+ * of each pass chain. If a pass requires sRGB input (e.g. like FXAA), the pass
+ * must follow `OutputPass` in the pass chain.
+ *
+ * The tone mapping and color space settings are extracted from the renderer.
+ *
+ * ```js
+ * const outputPass = new OutputPass();
+ * composer.addPass( outputPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class OutputPass extends Pass {
 
+	/**
+	 * Constructs a new output pass.
+	 */
 	constructor() {
 
 		super();
 
-		//
-
-		const shader = OutputShader;
-
-		this.uniforms = UniformsUtils.clone( shader.uniforms );
-
+		/**
+		 * The pass uniforms.
+		 *
+		 * @type {Object}
+		 */
+		this.uniforms = UniformsUtils.clone( OutputShader.uniforms );
+
+		/**
+		 * The pass material.
+		 *
+		 * @type {RawShaderMaterial}
+		 */
 		this.material = new RawShaderMaterial( {
-			name: shader.name,
+			name: OutputShader.name,
 			uniforms: this.uniforms,
-			vertexShader: shader.vertexShader,
-			fragmentShader: shader.fragmentShader
+			vertexShader: OutputShader.vertexShader,
+			fragmentShader: OutputShader.fragmentShader
 		} );
 
-		this.fsQuad = new FullScreenQuad( this.material );
+		// internals
 
-		// internal cache
+		this._fsQuad = new FullScreenQuad( this.material );
 
 		this._outputColorSpace = null;
 		this._toneMapping = null;
 
 	}
 
+	/**
+	 * Performs the output pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer/*, deltaTime, maskActive */ ) {
 
 		this.uniforms[ 'tDiffuse' ].value = readBuffer.texture;
@@ -75,22 +110,26 @@ class OutputPass extends Pass {
 		if ( this.renderToScreen === true ) {
 
 			renderer.setRenderTarget( null );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		} else {
 
 			renderer.setRenderTarget( writeBuffer );
 			if ( this.clear ) renderer.clear( renderer.autoClearColor, renderer.autoClearDepth, renderer.autoClearStencil );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		this.material.dispose();
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 

examples/jsm/postprocessing/Pass.js

@@ -5,34 +5,97 @@ import {
 	Mesh
 } from 'three';
 
+/**
+ * Abstract base class for all post processing passes.
+ *
+ * This module is only relevant for post processing with {@link WebGLRenderer}.
+ *
+ * @abstract
+ */
 class Pass {
 
+	/**
+	 * Constructs a new pass.
+	 */
 	constructor() {
 
+		/**
+		 * This flag can be used for type testing.
+		 *
+		 * @type {boolean}
+		 * @readonly
+		 * @default true
+		 */
 		this.isPass = true;
 
-		// if set to true, the pass is processed by the composer
+		/**
+		 * If set to `true`, the pass is processed by the composer.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
 		this.enabled = true;
 
-		// if set to true, the pass indicates to swap read and write buffer after rendering
+		/**
+		 * If set to `true`, the pass indicates to swap read and write buffer after rendering.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
 		this.needsSwap = true;
 
-		// if set to true, the pass clears its buffer before rendering
+		/**
+		 * If set to `true`, the pass clears its buffer before rendering
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.clear = false;
 
-		// if set to true, the result of the pass is rendered to screen. This is set automatically by EffectComposer.
+		/**
+		 * If set to `true`, the result of the pass is rendered to screen. The last pass in the composers
+		 * pass chain gets automatically rendered to screen, no matter how this property is configured.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.renderToScreen = false;
 
 	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @abstract
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
 	setSize( /* width, height */ ) {}
 
+	/**
+	 * This method holds the render logic of a pass. It must be implemented in all derived classes.
+	 *
+	 * @abstract
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( /* renderer, writeBuffer, readBuffer, deltaTime, maskActive */ ) {
 
 		console.error( 'THREE.Pass: .render() must be implemented in derived pass.' );
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 *
+	 * @abstract
+	 */
 	dispose() {}
 
 }
@@ -58,26 +121,57 @@ class FullscreenTriangleGeometry extends BufferGeometry {
 
 const _geometry = new FullscreenTriangleGeometry();
 
+
+/**
+ * This module is a helper for passes which need to render a full
+ * screen effect which is quite common in context of post processing.
+ *
+ * The intended usage is to reuse a single full screen quad for rendering
+ * subsequent passes by just reassigning the `material` reference.
+ *
+ * This module can only be used with {@link WebGLRenderer}.
+ *
+ * @augments Mesh
+ */
 class FullScreenQuad {
 
+	/**
+	 * Constructs a new full screen quad.
+	 *
+	 * @param {?Material} material - The material to render te full screen quad with.
+	 */
 	constructor( material ) {
 
 		this._mesh = new Mesh( _geometry, material );
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the instance is no longer used in your app.
+	 */
 	dispose() {
 
 		this._mesh.geometry.dispose();
 
 	}
 
+	/**
+	 * Renders the full screen quad.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 */
 	render( renderer ) {
 
 		renderer.render( this._mesh, _camera );
 
 	}
 
+	/**
+	 * The quad's material.
+	 *
+	 * @type {?Material}
+	 */
 	get material() {
 
 		return this._mesh.material;

examples/jsm/postprocessing/RenderPass.js

@@ -3,27 +3,110 @@ import {
 } from 'three';
 import { Pass } from './Pass.js';
 
+/**
+ * This class represents a render pass. It takes a camera and a scene and produces
+ * a beauty pass for subsequent post processing effects.
+ *
+ * ```js
+ * const renderPass = new RenderPass( scene, camera );
+ * composer.addPass( renderPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class RenderPass extends Pass {
 
+	/**
+	 * Constructs a new render pass.
+	 *
+	 * @param {Scene} scene - The scene to render.
+	 * @param {Camera} camera - The camera.
+	 * @param {?Material} [overrideMaterial=null] - The override material. If set, this material is used
+	 * for all objects in the scene.
+	 * @param {?(number|Color|string)} [clearColor=null] - The clear color of the render pass.
+	 * @param {?number} [clearAlpha=null] - The clear alpha of the render pass.
+	 */
 	constructor( scene, camera, overrideMaterial = null, clearColor = null, clearAlpha = null ) {
 
 		super();
 
+		/**
+		 * The scene to render.
+		 *
+		 * @type {Scene}
+		 */
 		this.scene = scene;
+
+		/**
+		 * The camera.
+		 *
+		 * @type {Camera}
+		 */
 		this.camera = camera;
 
+		/**
+		 * The override material. If set, this material is used
+		 * for all objects in the scene.
+		 *
+		 * @type {?Material}
+		 * @default null
+		 */
 		this.overrideMaterial = overrideMaterial;
 
+		/**
+		 * The clear color of the render pass.
+		 *
+		 * @type {?(number|Color|string)}
+		 * @default null
+		 */
 		this.clearColor = clearColor;
+
+		/**
+		 * The clear alpha of the render pass.
+		 *
+		 * @type {?number}
+		 * @default null
+		 */
 		this.clearAlpha = clearAlpha;
 
+		/**
+		 * Overwritten to perform a clear operation by default.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
 		this.clear = true;
+
+		/**
+		 * If set to `true`, only the depth can be cleared when `clear` is to `false`.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.clearDepth = false;
+
+		/**
+		 * Overwritten to disable the swap.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.needsSwap = false;
 		this._oldClearColor = new Color();
 
 	}
 
+	/**
+	 * Performs a beauty pass with the configured scene and camera.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer /*, deltaTime, maskActive */ ) {
 
 		const oldAutoClear = renderer.autoClear;

examples/jsm/postprocessing/RenderPixelatedPass.js

@@ -10,87 +10,170 @@ import {
 } from 'three';
 import { Pass, FullScreenQuad } from './Pass.js';
 
+/**
+ * A special type of render pass that produces a pixelated beauty pass.
+ *
+ * ```js
+ * const renderPixelatedPass = new RenderPixelatedPass( 6, scene, camera );
+ * composer.addPass( renderPixelatedPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class RenderPixelatedPass extends Pass {
 
+	/**
+	 * Constructs a new render pixelated pass.
+	 *
+	 * @param {number} pixelSize - The effect's pixel size.
+	 * @param {Scene} scene - The scene to render.
+	 * @param {Camera} camera - The camera.
+	 * @param {{normalEdgeStrength:number,depthEdgeStrength:number}} options - The pass options.
+	 */
 	constructor( pixelSize, scene, camera, options = {} ) {
 
 		super();
 
+		/**
+		 * The effect's pixel size.
+		 *
+		 * @type {number}
+		 */
 		this.pixelSize = pixelSize;
-		this.resolution = new Vector2();
-		this.renderResolution = new Vector2();
 
-		this.pixelatedMaterial = this.createPixelatedMaterial();
-		this.normalMaterial = new MeshNormalMaterial();
-
-		this.fsQuad = new FullScreenQuad( this.pixelatedMaterial );
+		/**
+		 * The scene to render.
+		 *
+		 * @type {Scene}
+		 */
 		this.scene = scene;
+
+		/**
+		 * The camera.
+		 *
+		 * @type {Camera}
+		 */
 		this.camera = camera;
 
+		/**
+		 * The normal edge strength.
+		 *
+		 * @type {number}
+		 * @default 0.3
+		 */
 		this.normalEdgeStrength = options.normalEdgeStrength || 0.3;
+
+		/**
+		 * The normal edge strength.
+		 *
+		 * @type {number}
+		 * @default 0.4
+		 */
 		this.depthEdgeStrength = options.depthEdgeStrength || 0.4;
 
-		this.beautyRenderTarget = new WebGLRenderTarget();
-		this.beautyRenderTarget.texture.minFilter = NearestFilter;
-		this.beautyRenderTarget.texture.magFilter = NearestFilter;
-		this.beautyRenderTarget.texture.type = HalfFloatType;
-		this.beautyRenderTarget.depthTexture = new DepthTexture();
+		/**
+		 * The pixelated material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
+		this.pixelatedMaterial = this._createPixelatedMaterial();
+
+		// internals
+
+		this._resolution = new Vector2();
+		this._renderResolution = new Vector2();
 
-		this.normalRenderTarget = new WebGLRenderTarget();
-		this.normalRenderTarget.texture.minFilter = NearestFilter;
-		this.normalRenderTarget.texture.magFilter = NearestFilter;
-		this.normalRenderTarget.texture.type = HalfFloatType;
+		this._normalMaterial = new MeshNormalMaterial();
+
+		this._beautyRenderTarget = new WebGLRenderTarget();
+		this._beautyRenderTarget.texture.minFilter = NearestFilter;
+		this._beautyRenderTarget.texture.magFilter = NearestFilter;
+		this._beautyRenderTarget.texture.type = HalfFloatType;
+		this._beautyRenderTarget.depthTexture = new DepthTexture();
+
+		this._normalRenderTarget = new WebGLRenderTarget();
+		this._normalRenderTarget.texture.minFilter = NearestFilter;
+		this._normalRenderTarget.texture.magFilter = NearestFilter;
+		this._normalRenderTarget.texture.type = HalfFloatType;
+
+		this._fsQuad = new FullScreenQuad( this.pixelatedMaterial );
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
-		this.beautyRenderTarget.dispose();
-		this.normalRenderTarget.dispose();
+		this._beautyRenderTarget.dispose();
+		this._normalRenderTarget.dispose();
 
 		this.pixelatedMaterial.dispose();
-		this.normalMaterial.dispose();
+		this._normalMaterial.dispose();
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
 	setSize( width, height ) {
 
-		this.resolution.set( width, height );
-		this.renderResolution.set( ( width / this.pixelSize ) | 0, ( height / this.pixelSize ) | 0 );
-		const { x, y } = this.renderResolution;
-		this.beautyRenderTarget.setSize( x, y );
-		this.normalRenderTarget.setSize( x, y );
-		this.fsQuad.material.uniforms.resolution.value.set( x, y, 1 / x, 1 / y );
+		this._resolution.set( width, height );
+		this._renderResolution.set( ( width / this.pixelSize ) | 0, ( height / this.pixelSize ) | 0 );
+		const { x, y } = this._renderResolution;
+		this._beautyRenderTarget.setSize( x, y );
+		this._normalRenderTarget.setSize( x, y );
+		this._fsQuad.material.uniforms.resolution.value.set( x, y, 1 / x, 1 / y );
 
 	}
 
+	/**
+	 * Sets the effect's pixel size.
+	 *
+	 * @param {number} pixelSize - The pixel size to set.
+	 */
 	setPixelSize( pixelSize ) {
 
 		this.pixelSize = pixelSize;
-		this.setSize( this.resolution.x, this.resolution.y );
+		this.setSize( this._resolution.x, this._resolution.y );
 
 	}
 
-	render( renderer, writeBuffer ) {
-
-		const uniforms = this.fsQuad.material.uniforms;
+	/**
+	 * Performs the pixelation pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
+	render( renderer, writeBuffer/*, readBuffer , deltaTime, maskActive */ ) {
+
+		const uniforms = this._fsQuad.material.uniforms;
 		uniforms.normalEdgeStrength.value = this.normalEdgeStrength;
 		uniforms.depthEdgeStrength.value = this.depthEdgeStrength;
 
-		renderer.setRenderTarget( this.beautyRenderTarget );
+		renderer.setRenderTarget( this._beautyRenderTarget );
 		renderer.render( this.scene, this.camera );
 
 		const overrideMaterial_old = this.scene.overrideMaterial;
-		renderer.setRenderTarget( this.normalRenderTarget );
-		this.scene.overrideMaterial = this.normalMaterial;
+		renderer.setRenderTarget( this._normalRenderTarget );
+		this.scene.overrideMaterial = this._normalMaterial;
 		renderer.render( this.scene, this.camera );
 		this.scene.overrideMaterial = overrideMaterial_old;
 
-		uniforms.tDiffuse.value = this.beautyRenderTarget.texture;
-		uniforms.tDepth.value = this.beautyRenderTarget.depthTexture;
-		uniforms.tNormal.value = this.normalRenderTarget.texture;
+		uniforms.tDiffuse.value = this._beautyRenderTarget.texture;
+		uniforms.tDepth.value = this._beautyRenderTarget.depthTexture;
+		uniforms.tNormal.value = this._normalRenderTarget.texture;
 
 		if ( this.renderToScreen ) {
 
@@ -104,25 +187,20 @@ class RenderPixelatedPass extends Pass {
 
 		}
 
-		this.fsQuad.render( renderer );
+		this._fsQuad.render( renderer );
 
 	}
 
-	createPixelatedMaterial() {
+	// internals
+
+	_createPixelatedMaterial() {
 
 		return new ShaderMaterial( {
 			uniforms: {
 				tDiffuse: { value: null },
 				tDepth: { value: null },
 				tNormal: { value: null },
-				resolution: {
-					value: new Vector4(
-						this.renderResolution.x,
-						this.renderResolution.y,
-						1 / this.renderResolution.x,
-						1 / this.renderResolution.y,
-					)
-				},
+				resolution: { value: new Vector4() },
 				normalEdgeStrength: { value: 0 },
 				depthEdgeStrength: { value: 0 }
 			},

examples/jsm/postprocessing/RenderTransitionPass.js

@@ -5,68 +5,159 @@ import {
 } from 'three';
 import { FullScreenQuad, Pass } from './Pass.js';
 
+/**
+ * A special type of render pass for implementing transition effects.
+ * When active, the pass will transition from scene A to scene B.
+ *
+ * ```js
+ * const renderTransitionPass = new RenderTransitionPass( fxSceneA.scene, fxSceneA.camera, fxSceneB.scene, fxSceneB.camera );
+ * renderTransitionPass.setTexture( textures[ 0 ] );
+ * composer.addPass( renderTransitionPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class RenderTransitionPass extends Pass {
 
+	/**
+	 * Constructs a render transition pass.
+	 *
+	 * @param {Scene} sceneA - The first scene.
+	 * @param {Camera} cameraA - The camera of the first scene.
+	 * @param {Scene} sceneB - The second scene.
+	 * @param {Camera} cameraB - The camera of the second scene.
+	 */
 	constructor( sceneA, cameraA, sceneB, cameraB ) {
 
 		super();
 
-		this.material = this.createMaterial();
-		this.fsQuad = new FullScreenQuad( this.material );
-
+		/**
+		 * The first scene.
+		 *
+		 * @type {Scene}
+		 */
 		this.sceneA = sceneA;
+
+
+		/**
+		 * The camera of the first scene.
+		 *
+		 * @type {Camera}
+		 */
 		this.cameraA = cameraA;
+
+		/**
+		 * The second scene.
+		 *
+		 * @type {Scene}
+		 */
 		this.sceneB = sceneB;
+
+		/**
+		 * The camera of the second scene.
+		 *
+		 * @type {Camera}
+		 */
 		this.cameraB = cameraB;
 
-		this.renderTargetA = new WebGLRenderTarget();
-		this.renderTargetA.texture.type = HalfFloatType;
-		this.renderTargetB = new WebGLRenderTarget();
-		this.renderTargetB.texture.type = HalfFloatType;
+		/**
+		 * The pass material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
+		this.material = this._createMaterial();
+
+		// internals
+
+		this._renderTargetA = new WebGLRenderTarget();
+		this._renderTargetA.texture.type = HalfFloatType;
+		this._renderTargetB = new WebGLRenderTarget();
+		this._renderTargetB.texture.type = HalfFloatType;
+
+		this._fsQuad = new FullScreenQuad( this.material );
 
 	}
 
+	/**
+	 * Sets the transition factor. Must be in the range `[0,1]`.
+	 * This value determines to what degree both scenes are mixed.
+	 *
+	 * @param {boolenumberan} value - The transition factor.
+	 */
 	setTransition( value ) {
 
 		this.material.uniforms.mixRatio.value = value;
 
 	}
 
+	/**
+	 * Toggles the usage of a texture for the effect.
+	 *
+	 * @param {boolean} value - Whether to use a texture for the transition effect or not.
+	 */
 	useTexture( value ) {
 
 		this.material.uniforms.useTexture.value = value ? 1 : 0;
 
 	}
 
+	/**
+	 * Sets the effect texture.
+	 *
+	 * @param {Texture} value - The effect texture.
+	 */
 	setTexture( value ) {
 
 		this.material.uniforms.tMixTexture.value = value;
 
 	}
 
+	/**
+	 * Sets the texture threshold. This value defined how strong the texture effects
+	 * the transition. Must be in the range `[0,1]` (0 means full effect, 1 means no effect).
+	 *
+	 * @param {boolenumberan} value - The threshold value.
+	 */
 	setTextureThreshold( value ) {
 
 		this.material.uniforms.threshold.value = value;
 
 	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
 	setSize( width, height ) {
 
-		this.renderTargetA.setSize( width, height );
-		this.renderTargetB.setSize( width, height );
+		this._renderTargetA.setSize( width, height );
+		this._renderTargetB.setSize( width, height );
 
 	}
 
-	render( renderer, writeBuffer ) {
-
-		renderer.setRenderTarget( this.renderTargetA );
+	/**
+	 * Performs the transition pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
+	render( renderer, writeBuffer/*, readBuffer , deltaTime, maskActive */ ) {
+
+		renderer.setRenderTarget( this._renderTargetA );
 		renderer.render( this.sceneA, this.cameraA );
-		renderer.setRenderTarget( this.renderTargetB );
+		renderer.setRenderTarget( this._renderTargetB );
 		renderer.render( this.sceneB, this.cameraB );
 
-		const uniforms = this.fsQuad.material.uniforms;
-		uniforms.tDiffuse1.value = this.renderTargetA.texture;
-		uniforms.tDiffuse2.value = this.renderTargetB.texture;
+		const uniforms = this._fsQuad.material.uniforms;
+		uniforms.tDiffuse1.value = this._renderTargetA.texture;
+		uniforms.tDiffuse2.value = this._renderTargetB.texture;
 
 		if ( this.renderToScreen ) {
 
@@ -80,20 +171,27 @@ class RenderTransitionPass extends Pass {
 
 		}
 
-		this.fsQuad.render( renderer );
+		this._fsQuad.render( renderer );
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
-		this.renderTargetA.dispose();
-		this.renderTargetB.dispose();
 		this.material.dispose();
-		this.fsQuad.dispose();
+
+		this._renderTargetA.dispose();
+		this._renderTargetB.dispose();
+		this._fsQuad.dispose();
 
 	}
 
-	createMaterial() {
+	// internals
+
+	_createMaterial() {
 
 		return new ShaderMaterial( {
 			uniforms: {

examples/jsm/postprocessing/SAOPass.js

@@ -23,25 +23,69 @@ import { BlurShaderUtils, DepthLimitedBlurShader } from '../shaders/DepthLimited
 import { CopyShader } from '../shaders/CopyShader.js';
 
 /**
- * SAO implementation inspired from bhouston previous SAO work
+ * A SAO implementation inspired from @bhouston previous SAO work.
+ *
+ * `SAOPass` provides better quality than {@link SSAOPass} but is also more expensive.
+ *
+ * ```js
+ * const saoPass = new SAOPass( scene, camera );
+ * composer.addPass( saoPass );
+ * ```
+ *
+ * @augments Pass
  */
-
 class SAOPass extends Pass {
 
+	/**
+	 * Constructs a new SAO pass.
+	 *
+	 * @param {Scene} scene - The scene to compute the AO for.
+	 * @param {Camera} camera - The camera.
+	 * @param {Vector2} [resolution] - The effect's resolution.
+	 */
 	constructor( scene, camera, resolution = new Vector2( 256, 256 ) ) {
 
 		super();
 
+		/**
+		 * The scene to render the AO for.
+		 *
+		 * @type {Scene}
+		 */
 		this.scene = scene;
+
+		/**
+		 * The camera.
+		 *
+		 * @type {Camera}
+		 */
 		this.camera = camera;
 
+		/**
+		 * Overwritten to perform a clear operation by default.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
 		this.clear = true;
+
+		/**
+		 * Overwritten to disable the swap.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.needsSwap = false;
 
-		this.originalClearColor = new Color();
+		this._originalClearColor = new Color();
 		this._oldClearColor = new Color();
-		this.oldClearAlpha = 1;
+		this._oldClearAlpha = 1;
 
+		/**
+		 * The SAO paramter.
+		 *
+		 * @type {Object}
+		 */
 		this.params = {
 			output: 0,
 			saoBias: 0.5,
@@ -55,6 +99,12 @@ class SAOPass extends Pass {
 			saoBlurDepthCutoff: 0.01
 		};
 
+		/**
+		 * The effect's resolution.
+		 *
+		 * @type {Vector2}
+		 * @default (256,256)
+		 */
 		this.resolution = new Vector2( resolution.x, resolution.y );
 
 		this.saoRenderTarget = new WebGLRenderTarget( this.resolution.x, this.resolution.y, { type: HalfFloatType } );
@@ -135,6 +185,17 @@ class SAOPass extends Pass {
 
 	}
 
+	/**
+	 * Performs the SAO pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer/*, deltaTime, maskActive*/ ) {
 
 		// Rendering readBuffer first when rendering to screen
@@ -143,12 +204,12 @@ class SAOPass extends Pass {
 			this.materialCopy.blending = NoBlending;
 			this.materialCopy.uniforms[ 'tDiffuse' ].value = readBuffer.texture;
 			this.materialCopy.needsUpdate = true;
-			this.renderPass( renderer, this.materialCopy, null );
+			this._renderPass( renderer, this.materialCopy, null );
 
 		}
 
 		renderer.getClearColor( this._oldClearColor );
-		this.oldClearAlpha = renderer.getClearAlpha();
+		this._oldClearAlpha = renderer.getClearAlpha();
 		const oldAutoClear = renderer.autoClear;
 		renderer.autoClear = false;
 
@@ -181,16 +242,16 @@ class SAOPass extends Pass {
 		}
 
 		// render normal and depth
-		this.renderOverride( renderer, this.normalMaterial, this.normalRenderTarget, 0x7777ff, 1.0 );
+		this._renderOverride( renderer, this.normalMaterial, this.normalRenderTarget, 0x7777ff, 1.0 );
 
 		// Rendering SAO texture
-		this.renderPass( renderer, this.saoMaterial, this.saoRenderTarget, 0xffffff, 1.0 );
+		this._renderPass( renderer, this.saoMaterial, this.saoRenderTarget, 0xffffff, 1.0 );
 
 		// Blurring SAO texture
 		if ( this.params.saoBlur ) {
 
-			this.renderPass( renderer, this.vBlurMaterial, this.blurIntermediateRenderTarget, 0xffffff, 1.0 );
-			this.renderPass( renderer, this.hBlurMaterial, this.saoRenderTarget, 0xffffff, 1.0 );
+			this._renderPass( renderer, this.vBlurMaterial, this.blurIntermediateRenderTarget, 0xffffff, 1.0 );
+			this._renderPass( renderer, this.hBlurMaterial, this.saoRenderTarget, 0xffffff, 1.0 );
 
 		}
 
@@ -221,17 +282,64 @@ class SAOPass extends Pass {
 		}
 
 		// Rendering SAOPass result on top of previous pass
-		this.renderPass( renderer, outputMaterial, this.renderToScreen ? null : readBuffer );
+		this._renderPass( renderer, outputMaterial, this.renderToScreen ? null : readBuffer );
 
-		renderer.setClearColor( this._oldClearColor, this.oldClearAlpha );
+		renderer.setClearColor( this._oldClearColor, this._oldClearAlpha );
 		renderer.autoClear = oldAutoClear;
 
 	}
 
-	renderPass( renderer, passMaterial, renderTarget, clearColor, clearAlpha ) {
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
+	setSize( width, height ) {
+
+		this.saoRenderTarget.setSize( width, height );
+		this.blurIntermediateRenderTarget.setSize( width, height );
+		this.normalRenderTarget.setSize( width, height );
+
+		this.saoMaterial.uniforms[ 'size' ].value.set( width, height );
+		this.saoMaterial.uniforms[ 'cameraInverseProjectionMatrix' ].value.copy( this.camera.projectionMatrixInverse );
+		this.saoMaterial.uniforms[ 'cameraProjectionMatrix' ].value = this.camera.projectionMatrix;
+		this.saoMaterial.needsUpdate = true;
+
+		this.vBlurMaterial.uniforms[ 'size' ].value.set( width, height );
+		this.vBlurMaterial.needsUpdate = true;
+
+		this.hBlurMaterial.uniforms[ 'size' ].value.set( width, height );
+		this.hBlurMaterial.needsUpdate = true;
+
+	}
+
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
+	dispose() {
+
+		this.saoRenderTarget.dispose();
+		this.blurIntermediateRenderTarget.dispose();
+		this.normalRenderTarget.dispose();
+
+		this.normalMaterial.dispose();
+		this.saoMaterial.dispose();
+		this.vBlurMaterial.dispose();
+		this.hBlurMaterial.dispose();
+		this.materialCopy.dispose();
+
+		this.fsQuad.dispose();
+
+	}
+
+	// internal
+
+	_renderPass( renderer, passMaterial, renderTarget, clearColor, clearAlpha ) {
 
 		// save original state
-		renderer.getClearColor( this.originalClearColor );
+		renderer.getClearColor( this._originalClearColor );
 		const originalClearAlpha = renderer.getClearAlpha();
 		const originalAutoClear = renderer.autoClear;
 
@@ -252,14 +360,14 @@ class SAOPass extends Pass {
 
 		// restore original state
 		renderer.autoClear = originalAutoClear;
-		renderer.setClearColor( this.originalClearColor );
+		renderer.setClearColor( this._originalClearColor );
 		renderer.setClearAlpha( originalClearAlpha );
 
 	}
 
-	renderOverride( renderer, overrideMaterial, renderTarget, clearColor, clearAlpha ) {
+	_renderOverride( renderer, overrideMaterial, renderTarget, clearColor, clearAlpha ) {
 
-		renderer.getClearColor( this.originalClearColor );
+		renderer.getClearColor( this._originalClearColor );
 		const originalClearAlpha = renderer.getClearAlpha();
 		const originalAutoClear = renderer.autoClear;
 
@@ -282,46 +390,11 @@ class SAOPass extends Pass {
 
 		// restore original state
 		renderer.autoClear = originalAutoClear;
-		renderer.setClearColor( this.originalClearColor );
+		renderer.setClearColor( this._originalClearColor );
 		renderer.setClearAlpha( originalClearAlpha );
 
 	}
 
-	setSize( width, height ) {
-
-		this.saoRenderTarget.setSize( width, height );
-		this.blurIntermediateRenderTarget.setSize( width, height );
-		this.normalRenderTarget.setSize( width, height );
-
-		this.saoMaterial.uniforms[ 'size' ].value.set( width, height );
-		this.saoMaterial.uniforms[ 'cameraInverseProjectionMatrix' ].value.copy( this.camera.projectionMatrixInverse );
-		this.saoMaterial.uniforms[ 'cameraProjectionMatrix' ].value = this.camera.projectionMatrix;
-		this.saoMaterial.needsUpdate = true;
-
-		this.vBlurMaterial.uniforms[ 'size' ].value.set( width, height );
-		this.vBlurMaterial.needsUpdate = true;
-
-		this.hBlurMaterial.uniforms[ 'size' ].value.set( width, height );
-		this.hBlurMaterial.needsUpdate = true;
-
-	}
-
-	dispose() {
-
-		this.saoRenderTarget.dispose();
-		this.blurIntermediateRenderTarget.dispose();
-		this.normalRenderTarget.dispose();
-
-		this.normalMaterial.dispose();
-		this.saoMaterial.dispose();
-		this.vBlurMaterial.dispose();
-		this.hBlurMaterial.dispose();
-		this.materialCopy.dispose();
-
-		this.fsQuad.dispose();
-
-	}
-
 }
 
 SAOPass.OUTPUT = {

examples/jsm/postprocessing/SSAARenderPass.js

@@ -10,41 +10,102 @@ import { Pass, FullScreenQuad } from './Pass.js';
 import { CopyShader } from '../shaders/CopyShader.js';
 
 /**
-*
-* Supersample Anti-Aliasing Render Pass
-*
-* This manual approach to SSAA re-renders the scene ones for each sample with camera jitter and accumulates the results.
-*
-* References: https://en.wikipedia.org/wiki/Supersampling
-*
-*/
-
+ * Supersample Anti-Aliasing Render Pass.
+ *
+ * This manual approach to SSAA re-renders the scene ones for each sample with camera jitter and accumulates the results.
+ *
+ * ```js
+ * const ssaaRenderPass = new SSAARenderPass( scene, camera );
+ * ssaaRenderPass.sampleLevel = 3;
+ * composer.addPass( ssaaRenderPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class SSAARenderPass extends Pass {
 
-	constructor( scene, camera, clearColor, clearAlpha ) {
+	/**
+	 * Constructs a new SSAA render pass.
+	 *
+	 * @param {Scene} scene - The scene to render.
+	 * @param {Camera} camera - The camera.
+	 * @param {?(number|Color|string)} [clearColor=0x000000] - The clear color of the render pass.
+	 * @param {?number} [clearAlpha=0] - The clear alpha of the render pass.
+	 */
+	constructor( scene, camera, clearColor = 0x000000, clearAlpha = 0 ) {
 
 		super();
 
+		/**
+		 * The scene to render.
+		 *
+		 * @type {Scene}
+		 */
 		this.scene = scene;
+
+		/**
+		 * The camera.
+		 *
+		 * @type {Camera}
+		 */
 		this.camera = camera;
 
-		this.sampleLevel = 4; // specified as n, where the number of samples is 2^n, so sampleLevel = 4, is 2^4 samples, 16.
+		/**
+		 * The sample level. Specified as n, where the number of
+		 * samples is 2^n, so sampleLevel = 4, is 2^4 samples, 16.
+		 *
+		 * @type {number}
+		 * @default 4
+		 */
+		this.sampleLevel = 4;
+
+		/**
+		 * Whether the pass should be unbiased or not. This property has the most
+		 * visible effect when rendering to a RGBA8 buffer because it mitigates
+		 * rounding errors. By default RGBA16F is used.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
 		this.unbiased = true;
 
+		/**
+		 * Whether to use a stencil buffer or not. This property can't
+		 * be changed after the first render.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.stencilBuffer = false;
 
-		// as we need to clear the buffer in this pass, clearColor must be set to something, defaults to black.
-		this.clearColor = ( clearColor !== undefined ) ? clearColor : 0x000000;
-		this.clearAlpha = ( clearAlpha !== undefined ) ? clearAlpha : 0;
+		/**
+		 * The clear color of the render pass.
+		 *
+		 * @type {?(number|Color|string)}
+		 * @default 0x000000
+		 */
+		this.clearColor = clearColor;
+
+		/**
+		 * The clear alpha of the render pass.
+		 *
+		 * @type {?number}
+		 * @default 0
+		 */
+		this.clearAlpha = clearAlpha;
+
+		// internals
+
+		this._sampleRenderTarget = null;
+
 		this._oldClearColor = new Color();
 
-		const copyShader = CopyShader;
-		this.copyUniforms = UniformsUtils.clone( copyShader.uniforms );
+		this._copyUniforms = UniformsUtils.clone( CopyShader.uniforms );
 
-		this.copyMaterial = new ShaderMaterial(	{
-			uniforms: this.copyUniforms,
-			vertexShader: copyShader.vertexShader,
-			fragmentShader: copyShader.fragmentShader,
+		this._copyMaterial = new ShaderMaterial(	{
+			uniforms: this._copyUniforms,
+			vertexShader: CopyShader.vertexShader,
+			fragmentShader: CopyShader.fragmentShader,
 			transparent: true,
 			depthTest: false,
 			depthWrite: false,
@@ -52,37 +113,58 @@ class SSAARenderPass extends Pass {
 			blending: AdditiveBlending
 		} );
 
-		this.fsQuad = new FullScreenQuad( this.copyMaterial );
+		this._fsQuad = new FullScreenQuad( this._copyMaterial );
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
-		if ( this.sampleRenderTarget ) {
+		if ( this._sampleRenderTarget ) {
 
-			this.sampleRenderTarget.dispose();
-			this.sampleRenderTarget = null;
+			this._sampleRenderTarget.dispose();
+			this._sampleRenderTarget = null;
 
 		}
 
-		this.copyMaterial.dispose();
+		this._copyMaterial.dispose();
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
 	setSize( width, height ) {
 
-		if ( this.sampleRenderTarget )	this.sampleRenderTarget.setSize( width, height );
+		if ( this._sampleRenderTarget )	this._sampleRenderTarget.setSize( width, height );
 
 	}
 
-	render( renderer, writeBuffer, readBuffer ) {
+	/**
+	 * Performs the SSAA render pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
+	render( renderer, writeBuffer, readBuffer/*, deltaTime, maskActive */ ) {
 
-		if ( ! this.sampleRenderTarget ) {
+		if ( ! this._sampleRenderTarget ) {
 
-			this.sampleRenderTarget = new WebGLRenderTarget( readBuffer.width, readBuffer.height, { type: HalfFloatType, stencilBuffer: this.stencilBuffer } );
-			this.sampleRenderTarget.texture.name = 'SSAARenderPass.sample';
+			this._sampleRenderTarget = new WebGLRenderTarget( readBuffer.width, readBuffer.height, { type: HalfFloatType, stencilBuffer: this.stencilBuffer } );
+			this._sampleRenderTarget.texture.name = 'SSAARenderPass.sample';
 
 		}
 
@@ -96,7 +178,7 @@ class SSAARenderPass extends Pass {
 
 		const baseSampleWeight = 1.0 / jitterOffsets.length;
 		const roundingRange = 1 / 32;
-		this.copyUniforms[ 'tDiffuse' ].value = this.sampleRenderTarget.texture;
+		this._copyUniforms[ 'tDiffuse' ].value = this._sampleRenderTarget.texture;
 
 		const viewOffset = {
 
@@ -145,9 +227,9 @@ class SSAARenderPass extends Pass {
 
 			}
 
-			this.copyUniforms[ 'opacity' ].value = sampleWeight;
+			this._copyUniforms[ 'opacity' ].value = sampleWeight;
 			renderer.setClearColor( this.clearColor, this.clearAlpha );
-			renderer.setRenderTarget( this.sampleRenderTarget );
+			renderer.setRenderTarget( this._sampleRenderTarget );
 			renderer.clear();
 			renderer.render( this.scene, this.camera );
 
@@ -160,7 +242,7 @@ class SSAARenderPass extends Pass {
 
 			}
 
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 

examples/jsm/postprocessing/SSAOPass.js

@@ -27,35 +27,123 @@ import { SimplexNoise } from '../math/SimplexNoise.js';
 import { SSAOBlurShader, SSAODepthShader, SSAOShader } from '../shaders/SSAOShader.js';
 import { CopyShader } from '../shaders/CopyShader.js';
 
+/**
+ * A pass for a basic SSAO effect.
+ *
+ * {@link SAOPass} and {@link GTAPass} produce a more advanced AO but are also
+ * more expensive.
+ *
+ * ```js
+ * const ssaoPass = new SSAOPass( scene, camera, width, height );
+ * composer.addPass( ssaoPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class SSAOPass extends Pass {
 
-	constructor( scene, camera, width, height, kernelSize = 32 ) {
+	/**
+	 * Constructs a new SSAO pass.
+	 *
+	 * @param {Scene} scene - The scene to compute the AO for.
+	 * @param {Camera} camera - The camera.
+	 * @param {number} [width=512] - The width of the effect.
+	 * @param {number} [height=512] - The height of the effect.
+	 * @param {number} [kernelSize=32] - The kernel size.
+	 */
+	constructor( scene, camera, width = 512, height = 512, kernelSize = 32 ) {
 
 		super();
 
-		this.width = ( width !== undefined ) ? width : 512;
-		this.height = ( height !== undefined ) ? height : 512;
+		/**
+		 * The width of the effect.
+		 *
+		 * @type {number}
+		 * @default 512
+		 */
+		this.width = width;
+
+		/**
+		 * The height of the effect.
+		 *
+		 * @type {number}
+		 * @default 512
+		 */
+		this.height = height;
 
+		/**
+		 * Overwritten to perform a clear operation by default.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
 		this.clear = true;
+
+		/**
+		 * Overwritten to disable the swap.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.needsSwap = false;
 
+		/**
+		 * The camera.
+		 *
+		 * @type {Camera}
+		 */
 		this.camera = camera;
+
+		/**
+		 * The scene to render the AO for.
+		 *
+		 * @type {Scene}
+		 */
 		this.scene = scene;
 
+		/**
+		 * The kernel radius controls how wide the
+		 * AO spreads.
+		 *
+		 * @type {number}
+		 * @default 8
+		 */
 		this.kernelRadius = 8;
 		this.kernel = [];
 		this.noiseTexture = null;
+
+		/**
+		 * The output configuration.
+		 *
+		 * @type {number}
+		 * @default 0
+		 */
 		this.output = 0;
 
+		/**
+		 * Defines the minimum distance that should be
+		 * affected by the AO.
+		 *
+		 * @type {number}
+		 * @default 0.005
+		 */
 		this.minDistance = 0.005;
+
+		/**
+		 * Defines the maximum distance that should be
+		 * affected by the AO.
+		 *
+		 * @type {number}
+		 * @default 0.1
+		 */
 		this.maxDistance = 0.1;
 
 		this._visibilityCache = new Map();
 
 		//
 
-		this.generateSampleKernel( kernelSize );
-		this.generateRandomKernelRotations();
+		this._generateSampleKernel( kernelSize );
+		this._generateRandomKernelRotations();
 
 		// depth texture
 
@@ -146,12 +234,18 @@ class SSAOPass extends Pass {
 			blendEquationAlpha: AddEquation
 		} );
 
-		this.fsQuad = new FullScreenQuad( null );
+		// internals
+
+		this._fsQuad = new FullScreenQuad( null );
 
-		this.originalClearColor = new Color();
+		this._originalClearColor = new Color();
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		// dispose render targets
@@ -169,28 +263,39 @@ class SSAOPass extends Pass {
 
 		// dispose full screen quad
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 
+	/**
+	 * Performs the SSAO pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer /*, deltaTime, maskActive */ ) {
 
 		// render normals and depth (honor only meshes, points and lines do not contribute to SSAO)
 
-		this.overrideVisibility();
-		this.renderOverride( renderer, this.normalMaterial, this.normalRenderTarget, 0x7777ff, 1.0 );
-		this.restoreVisibility();
+		this._overrideVisibility();
+		this._renderOverride( renderer, this.normalMaterial, this.normalRenderTarget, 0x7777ff, 1.0 );
+		this._restoreVisibility();
 
 		// render SSAO
 
 		this.ssaoMaterial.uniforms[ 'kernelRadius' ].value = this.kernelRadius;
 		this.ssaoMaterial.uniforms[ 'minDistance' ].value = this.minDistance;
 		this.ssaoMaterial.uniforms[ 'maxDistance' ].value = this.maxDistance;
-		this.renderPass( renderer, this.ssaoMaterial, this.ssaoRenderTarget );
+		this._renderPass( renderer, this.ssaoMaterial, this.ssaoRenderTarget );
 
 		// render blur
 
-		this.renderPass( renderer, this.blurMaterial, this.blurRenderTarget );
+		this._renderPass( renderer, this.blurMaterial, this.blurRenderTarget );
 
 		// output result to screen
 
@@ -200,7 +305,7 @@ class SSAOPass extends Pass {
 
 				this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.ssaoRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
 
 				break;
 
@@ -208,13 +313,13 @@ class SSAOPass extends Pass {
 
 				this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.blurRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
 
 				break;
 
 			case SSAOPass.OUTPUT.Depth:
 
-				this.renderPass( renderer, this.depthRenderMaterial, this.renderToScreen ? null : readBuffer );
+				this._renderPass( renderer, this.depthRenderMaterial, this.renderToScreen ? null : readBuffer );
 
 				break;
 
@@ -222,7 +327,7 @@ class SSAOPass extends Pass {
 
 				this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.normalRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
 
 				break;
 
@@ -230,7 +335,7 @@ class SSAOPass extends Pass {
 
 				this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.blurRenderTarget.texture;
 				this.copyMaterial.blending = CustomBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : readBuffer );
 
 				break;
 
@@ -241,10 +346,35 @@ class SSAOPass extends Pass {
 
 	}
 
-	renderPass( renderer, passMaterial, renderTarget, clearColor, clearAlpha ) {
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
+	setSize( width, height ) {
+
+		this.width = width;
+		this.height = height;
+
+		this.ssaoRenderTarget.setSize( width, height );
+		this.normalRenderTarget.setSize( width, height );
+		this.blurRenderTarget.setSize( width, height );
+
+		this.ssaoMaterial.uniforms[ 'resolution' ].value.set( width, height );
+		this.ssaoMaterial.uniforms[ 'cameraProjectionMatrix' ].value.copy( this.camera.projectionMatrix );
+		this.ssaoMaterial.uniforms[ 'cameraInverseProjectionMatrix' ].value.copy( this.camera.projectionMatrixInverse );
+
+		this.blurMaterial.uniforms[ 'resolution' ].value.set( width, height );
+
+	}
+
+	// internals
+
+	_renderPass( renderer, passMaterial, renderTarget, clearColor, clearAlpha ) {
 
 		// save original state
-		renderer.getClearColor( this.originalClearColor );
+		renderer.getClearColor( this._originalClearColor );
 		const originalClearAlpha = renderer.getClearAlpha();
 		const originalAutoClear = renderer.autoClear;
 
@@ -260,19 +390,19 @@ class SSAOPass extends Pass {
 
 		}
 
-		this.fsQuad.material = passMaterial;
-		this.fsQuad.render( renderer );
+		this._fsQuad.material = passMaterial;
+		this._fsQuad.render( renderer );
 
 		// restore original state
 		renderer.autoClear = originalAutoClear;
-		renderer.setClearColor( this.originalClearColor );
+		renderer.setClearColor( this._originalClearColor );
 		renderer.setClearAlpha( originalClearAlpha );
 
 	}
 
-	renderOverride( renderer, overrideMaterial, renderTarget, clearColor, clearAlpha ) {
+	_renderOverride( renderer, overrideMaterial, renderTarget, clearColor, clearAlpha ) {
 
-		renderer.getClearColor( this.originalClearColor );
+		renderer.getClearColor( this._originalClearColor );
 		const originalClearAlpha = renderer.getClearAlpha();
 		const originalAutoClear = renderer.autoClear;
 
@@ -297,29 +427,12 @@ class SSAOPass extends Pass {
 		// restore original state
 
 		renderer.autoClear = originalAutoClear;
-		renderer.setClearColor( this.originalClearColor );
+		renderer.setClearColor( this._originalClearColor );
 		renderer.setClearAlpha( originalClearAlpha );
 
 	}
 
-	setSize( width, height ) {
-
-		this.width = width;
-		this.height = height;
-
-		this.ssaoRenderTarget.setSize( width, height );
-		this.normalRenderTarget.setSize( width, height );
-		this.blurRenderTarget.setSize( width, height );
-
-		this.ssaoMaterial.uniforms[ 'resolution' ].value.set( width, height );
-		this.ssaoMaterial.uniforms[ 'cameraProjectionMatrix' ].value.copy( this.camera.projectionMatrix );
-		this.ssaoMaterial.uniforms[ 'cameraInverseProjectionMatrix' ].value.copy( this.camera.projectionMatrixInverse );
-
-		this.blurMaterial.uniforms[ 'resolution' ].value.set( width, height );
-
-	}
-
-	generateSampleKernel( kernelSize ) {
+	_generateSampleKernel( kernelSize ) {
 
 		const kernel = this.kernel;
 
@@ -342,7 +455,7 @@ class SSAOPass extends Pass {
 
 	}
 
-	generateRandomKernelRotations() {
+	_generateRandomKernelRotations() {
 
 		const width = 4, height = 4;
 
@@ -368,7 +481,7 @@ class SSAOPass extends Pass {
 
 	}
 
-	overrideVisibility() {
+	_overrideVisibility() {
 
 		const scene = this.scene;
 		const cache = this._visibilityCache;
@@ -383,7 +496,7 @@ class SSAOPass extends Pass {
 
 	}
 
-	restoreVisibility() {
+	_restoreVisibility() {
 
 		const scene = this.scene;
 		const cache = this._visibilityCache;

examples/jsm/postprocessing/SSRPass.js

@@ -19,32 +19,138 @@ import { Pass, FullScreenQuad } from './Pass.js';
 import { SSRBlurShader, SSRDepthShader, SSRShader } from '../shaders/SSRShader.js';
 import { CopyShader } from '../shaders/CopyShader.js';
 
+/**
+ * A pass for a basic SSR effect.
+ *
+ * ```js
+ * const ssrPass = new SSRPass( {
+ * 	renderer,
+ * 	scene,
+ * 	camera,
+ * 	width: innerWidth,
+ * 	height: innerHeight
+ * } );
+ * composer.addPass( ssrPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class SSRPass extends Pass {
 
-	constructor( { renderer, scene, camera, width, height, selects, bouncing = false, groundReflector } ) {
+	/**
+	 * Constructs a new SSR pass.
+	 *
+	 * @param {SSRPass~Options} options - The pass options.
+	 */
+	constructor( { renderer, scene, camera, width = 512, height = 512, selects = null, bouncing = false, groundReflector = null } ) {
 
 		super();
 
-		this.width = ( width !== undefined ) ? width : 512;
-		this.height = ( height !== undefined ) ? height : 512;
+		/**
+		 * The width of the effect.
+		 *
+		 * @type {number}
+		 * @default 512
+		 */
+		this.width = width;
+
+		/**
+		 * The height of the effect.
+		 *
+		 * @type {number}
+		 * @default 512
+		 */
+		this.height = height;
 
+		/**
+		 * Overwritten to perform a clear operation by default.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
 		this.clear = true;
 
+		/**
+		 * The renderer.
+		 *
+		 * @type {WebGLRenderer}
+		 */
 		this.renderer = renderer;
+
+		/**
+		 * The scene to render.
+		 *
+		 * @type {Scene}
+		 */
 		this.scene = scene;
+
+		/**
+		 * The camera.
+		 *
+		 * @type {Camera}
+		 */
 		this.camera = camera;
+
+		/**
+		 * The ground reflector.
+		 *
+		 * @type {?ReflectorForSSRPass}
+		 * @default 0
+		 */
 		this.groundReflector = groundReflector;
 
+		/**
+		 * The opactiy.
+		 *
+		 * @type {number}
+		 * @default 0.5
+		 */
 		this.opacity = SSRShader.uniforms.opacity.value;
+
+		/**
+		 * The output configuration.
+		 *
+		 * @type {number}
+		 * @default 0
+		 */
 		this.output = 0;
 
+		/**
+		 * Controls how far a fragment can reflect.
+		 *
+		 * @type {number}
+		 * @default 180
+		 */
 		this.maxDistance = SSRShader.uniforms.maxDistance.value;
+
+		/**
+		 * Controls the cutoff between what counts as a
+		 * possible reflection hit and what does not.
+		 *
+		 * @type {number}
+		 * @default .018
+		 */
 		this.thickness = SSRShader.uniforms.thickness.value;
 
 		this.tempColor = new Color();
 
 		this._selects = selects;
+
+		/**
+		 * Whether the pass is selective or not.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.selective = Array.isArray( this._selects );
+
+		/**
+		 * Which 3D objects should be affected by SSR. If not set, the entire scene is affected.
+		 *
+		 * @name SSRPass#selects
+		 * @type {?Array<Object3D>}
+		 * @default null
+		 */
 		Object.defineProperty( this, 'selects', {
 			get() {
 
@@ -73,6 +179,14 @@ class SSRPass extends Pass {
 		} );
 
 		this._bouncing = bouncing;
+
+		/**
+		 * Whether bouncing is enabled or not.
+		 *
+		 * @name SSRPass#bouncing
+		 * @type {boolean}
+		 * @default false
+		 */
 		Object.defineProperty( this, 'bouncing', {
 			get() {
 
@@ -96,9 +210,23 @@ class SSRPass extends Pass {
 			}
 		} );
 
+		/**
+		 * Whether to blur reflections or not.
+		 *
+		 * @type {boolean}
+		 * @default true
+		 */
 		this.blur = true;
 
 		this._distanceAttenuation = SSRShader.defines.DISTANCE_ATTENUATION;
+
+		/**
+		 * Whether to use distance attenutation or not.
+		 *
+		 * @name SSRPass#distanceAttenuation
+		 * @type {boolean}
+		 * @default true
+		 */
 		Object.defineProperty( this, 'distanceAttenuation', {
 			get() {
 
@@ -117,6 +245,14 @@ class SSRPass extends Pass {
 
 
 		this._fresnel = SSRShader.defines.FRESNEL;
+
+		/**
+		 * Whether to use fresnel or not.
+		 *
+		 * @name SSRPass#fresnel
+		 * @type {boolean}
+		 * @default true
+		 */
 		Object.defineProperty( this, 'fresnel', {
 			get() {
 
@@ -134,6 +270,14 @@ class SSRPass extends Pass {
 		} );
 
 		this._infiniteThick = SSRShader.defines.INFINITE_THICK;
+
+		/**
+		 * Whether to use infinite thickness or not.
+		 *
+		 * @name SSRPass#infiniteThick
+		 * @type {boolean}
+		 * @default false
+		 */
 		Object.defineProperty( this, 'infiniteThick', {
 			get() {
 
@@ -312,6 +456,10 @@ class SSRPass extends Pass {
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		// dispose render targets
@@ -341,6 +489,17 @@ class SSRPass extends Pass {
 
 	}
 
+	/**
+	 * Performs the SSR pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer /*, readBuffer, deltaTime, maskActive */ ) {
 
 		// render beauty and depth
@@ -360,13 +519,13 @@ class SSRPass extends Pass {
 
 		// render normals
 
-		this.renderOverride( renderer, this.normalMaterial, this.normalRenderTarget, 0, 0 );
+		this._renderOverride( renderer, this.normalMaterial, this.normalRenderTarget, 0, 0 );
 
 		// render metalnesses
 
 		if ( this.selective ) {
 
-			this.renderMetalness( renderer, this.metalnessOnMaterial, this.metalnessRenderTarget, 0, 0 );
+			this._renderMetalness( renderer, this.metalnessOnMaterial, this.metalnessRenderTarget, 0, 0 );
 
 		}
 
@@ -375,16 +534,16 @@ class SSRPass extends Pass {
 		this.ssrMaterial.uniforms[ 'opacity' ].value = this.opacity;
 		this.ssrMaterial.uniforms[ 'maxDistance' ].value = this.maxDistance;
 		this.ssrMaterial.uniforms[ 'thickness' ].value = this.thickness;
-		this.renderPass( renderer, this.ssrMaterial, this.ssrRenderTarget );
+		this._renderPass( renderer, this.ssrMaterial, this.ssrRenderTarget );
 
 
 		// render blur
 
 		if ( this.blur ) {
 
-			this.renderPass( renderer, this.blurMaterial, this.blurRenderTarget );
-			this.renderPass( renderer, this.blurMaterial2, this.blurRenderTarget2 );
-			// this.renderPass(renderer, this.blurMaterial3, this.blurRenderTarget3);
+			this._renderPass( renderer, this.blurMaterial, this.blurRenderTarget );
+			this._renderPass( renderer, this.blurMaterial2, this.blurRenderTarget2 );
+			// this._renderPass(renderer, this.blurMaterial3, this.blurRenderTarget3);
 
 		}
 
@@ -398,31 +557,31 @@ class SSRPass extends Pass {
 
 					this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.beautyRenderTarget.texture;
 					this.copyMaterial.blending = NoBlending;
-					this.renderPass( renderer, this.copyMaterial, this.prevRenderTarget );
+					this._renderPass( renderer, this.copyMaterial, this.prevRenderTarget );
 
 					if ( this.blur )
 						this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.blurRenderTarget2.texture;
 					else
 						this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.ssrRenderTarget.texture;
 					this.copyMaterial.blending = NormalBlending;
-					this.renderPass( renderer, this.copyMaterial, this.prevRenderTarget );
+					this._renderPass( renderer, this.copyMaterial, this.prevRenderTarget );
 
 					this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.prevRenderTarget.texture;
 					this.copyMaterial.blending = NoBlending;
-					this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+					this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 				} else {
 
 					this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.beautyRenderTarget.texture;
 					this.copyMaterial.blending = NoBlending;
-					this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+					this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 					if ( this.blur )
 						this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.blurRenderTarget2.texture;
 					else
 						this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.ssrRenderTarget.texture;
 					this.copyMaterial.blending = NormalBlending;
-					this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+					this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 				}
 
@@ -434,7 +593,7 @@ class SSRPass extends Pass {
 				else
 					this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.ssrRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 				if ( this.bouncing ) {
 
@@ -443,11 +602,11 @@ class SSRPass extends Pass {
 					else
 						this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.beautyRenderTarget.texture;
 					this.copyMaterial.blending = NoBlending;
-					this.renderPass( renderer, this.copyMaterial, this.prevRenderTarget );
+					this._renderPass( renderer, this.copyMaterial, this.prevRenderTarget );
 
 					this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.ssrRenderTarget.texture;
 					this.copyMaterial.blending = NormalBlending;
-					this.renderPass( renderer, this.copyMaterial, this.prevRenderTarget );
+					this._renderPass( renderer, this.copyMaterial, this.prevRenderTarget );
 
 				}
 
@@ -457,13 +616,13 @@ class SSRPass extends Pass {
 
 				this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.beautyRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 				break;
 
 			case SSRPass.OUTPUT.Depth:
 
-				this.renderPass( renderer, this.depthRenderMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.depthRenderMaterial, this.renderToScreen ? null : writeBuffer );
 
 				break;
 
@@ -471,7 +630,7 @@ class SSRPass extends Pass {
 
 				this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.normalRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 				break;
 
@@ -479,7 +638,7 @@ class SSRPass extends Pass {
 
 				this.copyMaterial.uniforms[ 'tDiffuse' ].value = this.metalnessRenderTarget.texture;
 				this.copyMaterial.blending = NoBlending;
-				this.renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
+				this._renderPass( renderer, this.copyMaterial, this.renderToScreen ? null : writeBuffer );
 
 				break;
 
@@ -490,7 +649,40 @@ class SSRPass extends Pass {
 
 	}
 
-	renderPass( renderer, passMaterial, renderTarget, clearColor, clearAlpha ) {
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
+	setSize( width, height ) {
+
+		this.width = width;
+		this.height = height;
+
+		this.ssrMaterial.defines.MAX_STEP = Math.sqrt( width * width + height * height );
+		this.ssrMaterial.needsUpdate = true;
+		this.beautyRenderTarget.setSize( width, height );
+		this.prevRenderTarget.setSize( width, height );
+		this.ssrRenderTarget.setSize( width, height );
+		this.normalRenderTarget.setSize( width, height );
+		this.metalnessRenderTarget.setSize( width, height );
+		this.blurRenderTarget.setSize( width, height );
+		this.blurRenderTarget2.setSize( width, height );
+		// this.blurRenderTarget3.setSize(width, height);
+
+		this.ssrMaterial.uniforms[ 'resolution' ].value.set( width, height );
+		this.ssrMaterial.uniforms[ 'cameraProjectionMatrix' ].value.copy( this.camera.projectionMatrix );
+		this.ssrMaterial.uniforms[ 'cameraInverseProjectionMatrix' ].value.copy( this.camera.projectionMatrixInverse );
+
+		this.blurMaterial.uniforms[ 'resolution' ].value.set( width, height );
+		this.blurMaterial2.uniforms[ 'resolution' ].value.set( width, height );
+
+	}
+
+	// internals
+
+	_renderPass( renderer, passMaterial, renderTarget, clearColor, clearAlpha ) {
 
 		// save original state
 		this.originalClearColor.copy( renderer.getClearColor( this.tempColor ) );
@@ -519,7 +711,7 @@ class SSRPass extends Pass {
 
 	}
 
-	renderOverride( renderer, overrideMaterial, renderTarget, clearColor, clearAlpha ) {
+	_renderOverride( renderer, overrideMaterial, renderTarget, clearColor, clearAlpha ) {
 
 		this.originalClearColor.copy( renderer.getClearColor( this.tempColor ) );
 		const originalClearAlpha = renderer.getClearAlpha( this.tempColor );
@@ -551,7 +743,7 @@ class SSRPass extends Pass {
 
 	}
 
-	renderMetalness( renderer, overrideMaterial, renderTarget, clearColor, clearAlpha ) {
+	_renderMetalness( renderer, overrideMaterial, renderTarget, clearColor, clearAlpha ) {
 
 		this.originalClearColor.copy( renderer.getClearColor( this.tempColor ) );
 		const originalClearAlpha = renderer.getClearAlpha( this.tempColor );
@@ -606,33 +798,22 @@ class SSRPass extends Pass {
 
 	}
 
-	setSize( width, height ) {
-
-		this.width = width;
-		this.height = height;
-
-		this.ssrMaterial.defines.MAX_STEP = Math.sqrt( width * width + height * height );
-		this.ssrMaterial.needsUpdate = true;
-		this.beautyRenderTarget.setSize( width, height );
-		this.prevRenderTarget.setSize( width, height );
-		this.ssrRenderTarget.setSize( width, height );
-		this.normalRenderTarget.setSize( width, height );
-		this.metalnessRenderTarget.setSize( width, height );
-		this.blurRenderTarget.setSize( width, height );
-		this.blurRenderTarget2.setSize( width, height );
-		// this.blurRenderTarget3.setSize(width, height);
-
-		this.ssrMaterial.uniforms[ 'resolution' ].value.set( width, height );
-		this.ssrMaterial.uniforms[ 'cameraProjectionMatrix' ].value.copy( this.camera.projectionMatrix );
-		this.ssrMaterial.uniforms[ 'cameraInverseProjectionMatrix' ].value.copy( this.camera.projectionMatrixInverse );
-
-		this.blurMaterial.uniforms[ 'resolution' ].value.set( width, height );
-		this.blurMaterial2.uniforms[ 'resolution' ].value.set( width, height );
-
-	}
-
 }
 
+/**
+ * Constructor options of `SSRPass`.
+ *
+ * @typedef {Object} SSRPass~Options
+ * @property {WebGLRenderer} renderer - The renderer.
+ * @property {Scene} scene - The scene to render.
+ * @property {Camera} camera - The camera.
+ * @property {number} [width=512] - The width of the effect.
+ * @property {number} [height=512] - The width of the effect.
+ * @property {?Array<Object3D>} [selects=null] - Which 3D objects should be affected by SSR. If not set, the entire scene is affected.
+ * @property {boolean} [bouncing=false] - Whether bouncing is enabled or not.
+ * @property {?ReflectorForSSRPass} [groundReflector=null] - A ground reflector.
+ **/
+
 SSRPass.OUTPUT = {
 	'Default': 0,
 	'SSR': 1,

examples/jsm/postprocessing/SavePass.js

@@ -8,27 +8,54 @@ import {
 import { Pass, FullScreenQuad } from './Pass.js';
 import { CopyShader } from '../shaders/CopyShader.js';
 
+/**
+ * A pass that saves the contents of the current read buffer in a render target.
+ *
+ * ```js
+ * const savePass = new SavePass( customRenderTarget );
+ * composer.addPass( savePass );
+ * ```
+ *
+ * @augments Pass
+ */
 class SavePass extends Pass {
 
+	/**
+	 * Constructs a new save pass.
+	 *
+	 * @param {WebGLRenderTarget} [renderTarget] - The render target for saving the read buffer.
+	 * If not provided, the pass automatically creates a render target.
+	 */
 	constructor( renderTarget ) {
 
 		super();
 
-		const shader = CopyShader;
-
-		this.textureID = 'tDiffuse';
-
-		this.uniforms = UniformsUtils.clone( shader.uniforms );
-
+		/**
+		 * The pass uniforms.
+		 *
+		 * @type {Object}
+		 */
+		this.uniforms = UniformsUtils.clone( CopyShader.uniforms );
+
+		/**
+		 * The pass material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
 		this.material = new ShaderMaterial( {
 
 			uniforms: this.uniforms,
-			vertexShader: shader.vertexShader,
-			fragmentShader: shader.fragmentShader,
+			vertexShader: CopyShader.vertexShader,
+			fragmentShader: CopyShader.fragmentShader,
 			blending: NoBlending
 
 		} );
 
+		/**
+		 * The render target which is used to save the read buffer.
+		 *
+		 * @type {WebGLRenderTarget}
+		 */
 		this.renderTarget = renderTarget;
 
 		if ( this.renderTarget === undefined ) {
@@ -38,39 +65,64 @@ class SavePass extends Pass {
 
 		}
 
+		/**
+		 * Overwritten to disable the swap.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.needsSwap = false;
 
-		this.fsQuad = new FullScreenQuad( this.material );
+		// internals
+
+		this._fsQuad = new FullScreenQuad( this.material );
 
 	}
 
+	/**
+	 * Performs the save pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer/*, deltaTime, maskActive */ ) {
 
-		if ( this.uniforms[ this.textureID ] ) {
-
-			this.uniforms[ this.textureID ].value = readBuffer.texture;
-
-		}
+		this.uniforms[ 'tDiffuse' ].value = readBuffer.texture;
 
 		renderer.setRenderTarget( this.renderTarget );
 		if ( this.clear ) renderer.clear();
-		this.fsQuad.render( renderer );
+		this._fsQuad.render( renderer );
 
 	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
 	setSize( width, height ) {
 
 		this.renderTarget.setSize( width, height );
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		this.renderTarget.dispose();
 
 		this.material.dispose();
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 

examples/jsm/postprocessing/ShaderPass.js

@@ -4,13 +4,53 @@ import {
 } from 'three';
 import { Pass, FullScreenQuad } from './Pass.js';
 
+/**
+ * This pass can be used to create a post processing effect
+ * with a raw GLSL shader object. Useful for implementing custom
+ * effects.
+ *
+ * ```js
+ * const fxaaPass = new ShaderPass( FXAAShader );
+ * composer.addPass( fxaaPass );
+ * ```
+ *
+ * @augments Pass
+ */
 class ShaderPass extends Pass {
 
-	constructor( shader, textureID ) {
+	/**
+	 * Constructs a new shader pass.
+	 *
+	 * @param {Object|ShaderMaterial} [shader] - A shader object holding vertex and fragment shader as well as
+	 * defines and uniforms. It's also valid to pass a custom shader material.
+	 * @param {string} [textureID='tDiffuse'] - The name of the texture uniform that should sample
+	 * the read buffer.
+	 */
+	constructor( shader, textureID = 'tDiffuse' ) {
 
 		super();
 
-		this.textureID = ( textureID !== undefined ) ? textureID : 'tDiffuse';
+		/**
+		 * The name of the texture uniform that should sample the read buffer.
+		 *
+		 * @type {string}
+		 * @default 'tDiffuse'
+		 */
+		this.textureID = textureID;
+
+		/**
+		 * The pass uniforms.
+		 *
+		 * @type {?Object}
+		 */
+		this.uniforms = null;
+
+		/**
+		 * The pass material.
+		 *
+		 * @type {?ShaderMaterial}
+		 */
+		this.material = null;
 
 		if ( shader instanceof ShaderMaterial ) {
 
@@ -34,10 +74,23 @@ class ShaderPass extends Pass {
 
 		}
 
-		this.fsQuad = new FullScreenQuad( this.material );
+		// internals
+
+		this._fsQuad = new FullScreenQuad( this.material );
 
 	}
 
+	/**
+	 * Performs the shader pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer /*, deltaTime, maskActive */ ) {
 
 		if ( this.uniforms[ this.textureID ] ) {
@@ -46,29 +99,33 @@ class ShaderPass extends Pass {
 
 		}
 
-		this.fsQuad.material = this.material;
+		this._fsQuad.material = this.material;
 
 		if ( this.renderToScreen ) {
 
 			renderer.setRenderTarget( null );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		} else {
 
 			renderer.setRenderTarget( writeBuffer );
 			// TODO: Avoid using autoClear properties, see https://github.com/mrdoob/three.js/pull/15571#issuecomment-465669600
 			if ( this.clear ) renderer.clear( renderer.autoClearColor, renderer.autoClearDepth, renderer.autoClearStencil );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		this.material.dispose();
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 

examples/jsm/postprocessing/TAARenderPass.js

@@ -6,28 +6,78 @@ import { SSAARenderPass } from './SSAARenderPass.js';
 
 /**
  *
- * Temporal Anti-Aliasing Render Pass
+ * Temporal Anti-Aliasing Render Pass.
  *
- * When there is no motion in the scene, the TAA render pass accumulates jittered camera samples across frames to create a high quality anti-aliased result.
+ * When there is no motion in the scene, the TAA render pass accumulates jittered camera
+ * samples across frames to create a high quality anti-aliased result.
  *
- * References:
+ * Note: This effect uses no reprojection so it is no TRAA implementation.
  *
- * TODO: Add support for motion vector pas so that accumulation of samples across frames can occur on dynamics scenes.
+ * ```js
+ * const taaRenderPass = new TAARenderPass( scene, camera );
+ * taaRenderPass.unbiased = false;
+ * composer.addPass( taaRenderPass );
+ * ```
  *
+ * @augments SSAARenderPass
  */
-
 class TAARenderPass extends SSAARenderPass {
 
+	/**
+	 * Constructs a new TAA render pass.
+	 *
+	 * @param {Scene} scene - The scene to render.
+	 * @param {Camera} camera - The camera.
+	 * @param {?(number|Color|string)} [clearColor=0x000000] - The clear color of the render pass.
+	 * @param {?number} [clearAlpha=0] - The clear alpha of the render pass.
+	 */
 	constructor( scene, camera, clearColor, clearAlpha ) {
 
 		super( scene, camera, clearColor, clearAlpha );
 
+		/**
+		 * Overwritten and set to 0 by default.
+		 *
+		 * @type {number}
+		 * @default 0
+		 */
 		this.sampleLevel = 0;
+
+		/**
+		 * Whether to accumulate frames or not. This enables
+		 * the TAA.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.accumulate = false;
+
+		/**
+		 * The accumulation index.
+		 *
+		 * @type {number}
+		 * @default -1
+		 */
 		this.accumulateIndex = - 1;
 
+		// internals
+
+		this._sampleRenderTarget = null;
+		this._holdRenderTarget = null;
+
 	}
 
+	/**
+	 * Performs the TAA render pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer, deltaTime ) {
 
 		if ( this.accumulate === false ) {
@@ -41,23 +91,23 @@ class TAARenderPass extends SSAARenderPass {
 
 		const jitterOffsets = _JitterVectors[ 5 ];
 
-		if ( this.sampleRenderTarget === undefined ) {
+		if ( this._sampleRenderTarget === null ) {
 
-			this.sampleRenderTarget = new WebGLRenderTarget( readBuffer.width, readBuffer.height, { type: HalfFloatType } );
-			this.sampleRenderTarget.texture.name = 'TAARenderPass.sample';
+			this._sampleRenderTarget = new WebGLRenderTarget( readBuffer.width, readBuffer.height, { type: HalfFloatType } );
+			this._sampleRenderTarget.texture.name = 'TAARenderPass.sample';
 
 		}
 
-		if ( this.holdRenderTarget === undefined ) {
+		if ( this._holdRenderTarget === null ) {
 
-			this.holdRenderTarget = new WebGLRenderTarget( readBuffer.width, readBuffer.height, { type: HalfFloatType } );
-			this.holdRenderTarget.texture.name = 'TAARenderPass.hold';
+			this._holdRenderTarget = new WebGLRenderTarget( readBuffer.width, readBuffer.height, { type: HalfFloatType } );
+			this._holdRenderTarget.texture.name = 'TAARenderPass.hold';
 
 		}
 
 		if ( this.accumulateIndex === - 1 ) {
 
-			super.render( renderer, this.holdRenderTarget, readBuffer, deltaTime );
+			super.render( renderer, this._holdRenderTarget, readBuffer, deltaTime );
 
 			this.accumulateIndex = 0;
 
@@ -73,8 +123,8 @@ class TAARenderPass extends SSAARenderPass {
 
 		if ( this.accumulateIndex >= 0 && this.accumulateIndex < jitterOffsets.length ) {
 
-			this.copyUniforms[ 'opacity' ].value = sampleWeight;
-			this.copyUniforms[ 'tDiffuse' ].value = writeBuffer.texture;
+			this._copyUniforms[ 'opacity' ].value = sampleWeight;
+			this._copyUniforms[ 'tDiffuse' ].value = writeBuffer.texture;
 
 			// render the scene multiple times, each slightly jitter offset from the last and accumulate the results.
 			const numSamplesPerFrame = Math.pow( 2, this.sampleLevel );
@@ -96,7 +146,7 @@ class TAARenderPass extends SSAARenderPass {
 				renderer.clear();
 				renderer.render( this.scene, this.camera );
 
-				renderer.setRenderTarget( this.sampleRenderTarget );
+				renderer.setRenderTarget( this._sampleRenderTarget );
 				if ( this.accumulateIndex === 0 ) {
 
 					renderer.setClearColor( 0x000000, 0.0 );
@@ -104,7 +154,7 @@ class TAARenderPass extends SSAARenderPass {
 
 				}
 
-				this.fsQuad.render( renderer );
+				this._fsQuad.render( renderer );
 
 				this.accumulateIndex ++;
 
@@ -121,20 +171,20 @@ class TAARenderPass extends SSAARenderPass {
 
 		if ( accumulationWeight > 0 ) {
 
-			this.copyUniforms[ 'opacity' ].value = 1.0;
-			this.copyUniforms[ 'tDiffuse' ].value = this.sampleRenderTarget.texture;
+			this._copyUniforms[ 'opacity' ].value = 1.0;
+			this._copyUniforms[ 'tDiffuse' ].value = this._sampleRenderTarget.texture;
 			renderer.setRenderTarget( writeBuffer );
 			renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 
 		if ( accumulationWeight < 1.0 ) {
 
-			this.copyUniforms[ 'opacity' ].value = 1.0 - accumulationWeight;
-			this.copyUniforms[ 'tDiffuse' ].value = this.holdRenderTarget.texture;
+			this._copyUniforms[ 'opacity' ].value = 1.0 - accumulationWeight;
+			this._copyUniforms[ 'tDiffuse' ].value = this._holdRenderTarget.texture;
 			renderer.setRenderTarget( writeBuffer );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 
@@ -143,11 +193,15 @@ class TAARenderPass extends SSAARenderPass {
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		super.dispose();
 
-		if ( this.holdRenderTarget ) this.holdRenderTarget.dispose();
+		if ( this._holdRenderTarget ) this._holdRenderTarget.dispose();
 
 	}
 

examples/jsm/postprocessing/TexturePass.js

@@ -5,19 +5,68 @@ import {
 import { Pass, FullScreenQuad } from './Pass.js';
 import { CopyShader } from '../shaders/CopyShader.js';
 
+/**
+ * This pass can be used to render a texture over the entire screen.
+ *
+ * ```js
+ * const texture = new THREE.TextureLoader().load( 'textures/2294472375_24a3b8ef46_o.jpg' );
+ * texture.colorSpace = THREE.SRGBColorSpace;
+ *
+ * const texturePass = new TexturePass( texture );
+ * composer.addPass( texturePass );
+ * ```
+ *
+ * @augments Pass
+ */
 class TexturePass extends Pass {
 
-	constructor( map, opacity ) {
+	/**
+	 * Constructs a new texture pass.
+	 *
+	 * @param {Texture} map - The texture to render.
+	 * @param {number} [opacity=1] - The opacity.
+	 */
+	constructor( map, opacity = 1 ) {
 
 		super();
 
 		const shader = CopyShader;
 
+		/**
+		 * The texture to render.
+		 *
+		 * @type {Texture}
+		 */
 		this.map = map;
-		this.opacity = ( opacity !== undefined ) ? opacity : 1.0;
 
+		/**
+		 * The opacity.
+		 *
+		 * @type {number}
+		 * @default 1
+		 */
+		this.opacity = opacity;
+
+		/**
+		 * Overwritten to disable the swap.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
+		this.needsSwap = false;
+
+		/**
+		 * The pass uniforms.
+		 *
+		 * @type {Object}
+		 */
 		this.uniforms = UniformsUtils.clone( shader.uniforms );
 
+		/**
+		 * The pass material.
+		 *
+		 * @type {ShaderMaterial}
+		 */
 		this.material = new ShaderMaterial( {
 
 			uniforms: this.uniforms,
@@ -29,18 +78,29 @@ class TexturePass extends Pass {
 
 		} );
 
-		this.needsSwap = false;
+		// internals
 
-		this.fsQuad = new FullScreenQuad( null );
+		this._fsQuad = new FullScreenQuad( null );
 
 	}
 
+	/**
+	 * Performs the texture pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer /*, deltaTime, maskActive */ ) {
 
 		const oldAutoClear = renderer.autoClear;
 		renderer.autoClear = false;
 
-		this.fsQuad.material = this.material;
+		this._fsQuad.material = this.material;
 
 		this.uniforms[ 'opacity' ].value = this.opacity;
 		this.uniforms[ 'tDiffuse' ].value = this.map;
@@ -48,17 +108,20 @@ class TexturePass extends Pass {
 
 		renderer.setRenderTarget( this.renderToScreen ? null : readBuffer );
 		if ( this.clear ) renderer.clear();
-		this.fsQuad.render( renderer );
+		this._fsQuad.render( renderer );
 
 		renderer.autoClear = oldAutoClear;
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		this.material.dispose();
-
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 

examples/jsm/postprocessing/UnrealBloomPass.js

@@ -14,28 +14,86 @@ import { CopyShader } from '../shaders/CopyShader.js';
 import { LuminosityHighPassShader } from '../shaders/LuminosityHighPassShader.js';
 
 /**
- * UnrealBloomPass is inspired by the bloom pass of Unreal Engine. It creates a
+ * This pass is inspired by the bloom pass of Unreal Engine. It creates a
  * mip map chain of bloom textures and blurs them with different radii. Because
  * of the weighted combination of mips, and because larger blurs are done on
  * higher mips, this effect provides good quality and performance.
  *
+ * When using this pass, tone mapping must be enabled in the renderer settings.
+ *
  * Reference:
- * - https://docs.unrealengine.com/latest/INT/Engine/Rendering/PostProcessEffects/Bloom/
+ * - [Bloom in Unreal Engine]{@link https://docs.unrealengine.com/latest/INT/Engine/Rendering/PostProcessEffects/Bloom/}
+ *
+ * ```js
+ * const resolution = new THREE.Vector2( window.innerWidth, window.innerHeight );
+ * const bloomPass = new UnrealBloomPass( resolution, 1.5, 0.4, 0.85 );
+ * composer.addPass( bloomPass );
+ * ```
+ *
+ * @augments Pass
  */
 class UnrealBloomPass extends Pass {
 
-	constructor( resolution, strength, radius, threshold ) {
+	/**
+	 * Constructs a new Unreal Bloom pass.
+	 *
+	 * @param {Vector2} [resolution] - The effect's resolution.
+	 * @param {number} [strength=1] - The Bloom strength.
+	 * @param {number} radius - The Bloom radius.
+	 * @param {number} threshold - The luminance threshold limits which bright areas contribute to the Bloom effect.
+	 */
+	constructor( resolution, strength = 1, radius, threshold ) {
 
 		super();
 
-		this.strength = ( strength !== undefined ) ? strength : 1;
+		/**
+		 * The Bloom strength.
+		 *
+		 * @type {number}
+		 * @default 1
+		 */
+		this.strength = strength;
+
+		/**
+		 * The Bloom radius.
+		 *
+		 * @type {number}
+		 */
 		this.radius = radius;
+
+		/**
+		 * The luminance threshold limits which bright areas contribute to the Bloom effect.
+		 *
+		 * @type {number}
+		 */
 		this.threshold = threshold;
+
+		/**
+		 * The effect's resolution.
+		 *
+		 * @type {Vector2}
+		 * @default (256,256)
+		 */
 		this.resolution = ( resolution !== undefined ) ? new Vector2( resolution.x, resolution.y ) : new Vector2( 256, 256 );
 
-		// create color only once here, reuse it later inside the render function
+		/**
+		 * The effect's clear color
+		 *
+		 * @type {Color}
+		 * @default (0,0,0)
+		 */
 		this.clearColor = new Color( 0, 0, 0 );
 
+		/**
+		 * Overwritten to disable the swap.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
+		this.needsSwap = false;
+
+		// internals
+
 		// render targets
 		this.renderTargetsHorizontal = [];
 		this.renderTargetsVertical = [];
@@ -92,7 +150,7 @@ class UnrealBloomPass extends Pass {
 
 		for ( let i = 0; i < this.nMips; i ++ ) {
 
-			this.separableBlurMaterials.push( this.getSeparableBlurMaterial( kernelSizeArray[ i ] ) );
+			this.separableBlurMaterials.push( this._getSeparableBlurMaterial( kernelSizeArray[ i ] ) );
 
 			this.separableBlurMaterials[ i ].uniforms[ 'invSize' ].value = new Vector2( 1 / resx, 1 / resy );
 
@@ -104,7 +162,7 @@ class UnrealBloomPass extends Pass {
 
 		// composite material
 
-		this.compositeMaterial = this.getCompositeMaterial( this.nMips );
+		this.compositeMaterial = this._getCompositeMaterial( this.nMips );
 		this.compositeMaterial.uniforms[ 'blurTexture1' ].value = this.renderTargetsVertical[ 0 ].texture;
 		this.compositeMaterial.uniforms[ 'blurTexture2' ].value = this.renderTargetsVertical[ 1 ].texture;
 		this.compositeMaterial.uniforms[ 'blurTexture3' ].value = this.renderTargetsVertical[ 2 ].texture;
@@ -120,32 +178,31 @@ class UnrealBloomPass extends Pass {
 
 		// blend material
 
-		const copyShader = CopyShader;
-
-		this.copyUniforms = UniformsUtils.clone( copyShader.uniforms );
+		this.copyUniforms = UniformsUtils.clone( CopyShader.uniforms );
 
 		this.blendMaterial = new ShaderMaterial( {
 			uniforms: this.copyUniforms,
-			vertexShader: copyShader.vertexShader,
-			fragmentShader: copyShader.fragmentShader,
+			vertexShader: CopyShader.vertexShader,
+			fragmentShader: CopyShader.fragmentShader,
 			blending: AdditiveBlending,
 			depthTest: false,
 			depthWrite: false,
 			transparent: true
 		} );
 
-		this.enabled = true;
-		this.needsSwap = false;
-
 		this._oldClearColor = new Color();
-		this.oldClearAlpha = 1;
+		this._oldClearAlpha = 1;
 
-		this.basic = new MeshBasicMaterial();
+		this._basic = new MeshBasicMaterial();
 
-		this.fsQuad = new FullScreenQuad( null );
+		this._fsQuad = new FullScreenQuad( null );
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever the pass is no longer used in your app.
+	 */
 	dispose() {
 
 		for ( let i = 0; i < this.renderTargetsHorizontal.length; i ++ ) {
@@ -172,14 +229,20 @@ class UnrealBloomPass extends Pass {
 
 		this.compositeMaterial.dispose();
 		this.blendMaterial.dispose();
-		this.basic.dispose();
+		this._basic.dispose();
 
 		//
 
-		this.fsQuad.dispose();
+		this._fsQuad.dispose();
 
 	}
 
+	/**
+	 * Sets the size of the pass.
+	 *
+	 * @param {number} width - The width to set.
+	 * @param {number} height - The width to set.
+	 */
 	setSize( width, height ) {
 
 		let resx = Math.round( width / 2 );
@@ -201,10 +264,21 @@ class UnrealBloomPass extends Pass {
 
 	}
 
+	/**
+	 * Performs the Bloom pass.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
+	 * destination for the pass.
+	 * @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
+	 * previous pass from this buffer.
+	 * @param {number} deltaTime - The delta time in seconds.
+	 * @param {boolean} maskActive - Whether masking is active or not.
+	 */
 	render( renderer, writeBuffer, readBuffer, deltaTime, maskActive ) {
 
 		renderer.getClearColor( this._oldClearColor );
-		this.oldClearAlpha = renderer.getClearAlpha();
+		this._oldClearAlpha = renderer.getClearAlpha();
 		const oldAutoClear = renderer.autoClear;
 		renderer.autoClear = false;
 
@@ -216,12 +290,12 @@ class UnrealBloomPass extends Pass {
 
 		if ( this.renderToScreen ) {
 
-			this.fsQuad.material = this.basic;
-			this.basic.map = readBuffer.texture;
+			this._fsQuad.material = this._basic;
+			this._basic.map = readBuffer.texture;
 
 			renderer.setRenderTarget( null );
 			renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 
@@ -229,11 +303,11 @@ class UnrealBloomPass extends Pass {
 
 		this.highPassUniforms[ 'tDiffuse' ].value = readBuffer.texture;
 		this.highPassUniforms[ 'luminosityThreshold' ].value = this.threshold;
-		this.fsQuad.material = this.materialHighPassFilter;
+		this._fsQuad.material = this.materialHighPassFilter;
 
 		renderer.setRenderTarget( this.renderTargetBright );
 		renderer.clear();
-		this.fsQuad.render( renderer );
+		this._fsQuad.render( renderer );
 
 		// 2. Blur All the mips progressively
 
@@ -241,19 +315,19 @@ class UnrealBloomPass extends Pass {
 
 		for ( let i = 0; i < this.nMips; i ++ ) {
 
-			this.fsQuad.material = this.separableBlurMaterials[ i ];
+			this._fsQuad.material = this.separableBlurMaterials[ i ];
 
 			this.separableBlurMaterials[ i ].uniforms[ 'colorTexture' ].value = inputRenderTarget.texture;
 			this.separableBlurMaterials[ i ].uniforms[ 'direction' ].value = UnrealBloomPass.BlurDirectionX;
 			renderer.setRenderTarget( this.renderTargetsHorizontal[ i ] );
 			renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 			this.separableBlurMaterials[ i ].uniforms[ 'colorTexture' ].value = this.renderTargetsHorizontal[ i ].texture;
 			this.separableBlurMaterials[ i ].uniforms[ 'direction' ].value = UnrealBloomPass.BlurDirectionY;
 			renderer.setRenderTarget( this.renderTargetsVertical[ i ] );
 			renderer.clear();
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 			inputRenderTarget = this.renderTargetsVertical[ i ];
 
@@ -261,18 +335,18 @@ class UnrealBloomPass extends Pass {
 
 		// Composite All the mips
 
-		this.fsQuad.material = this.compositeMaterial;
+		this._fsQuad.material = this.compositeMaterial;
 		this.compositeMaterial.uniforms[ 'bloomStrength' ].value = this.strength;
 		this.compositeMaterial.uniforms[ 'bloomRadius' ].value = this.radius;
 		this.compositeMaterial.uniforms[ 'bloomTintColors' ].value = this.bloomTintColors;
 
 		renderer.setRenderTarget( this.renderTargetsHorizontal[ 0 ] );
 		renderer.clear();
-		this.fsQuad.render( renderer );
+		this._fsQuad.render( renderer );
 
 		// Blend it additively over the input texture
 
-		this.fsQuad.material = this.blendMaterial;
+		this._fsQuad.material = this.blendMaterial;
 		this.copyUniforms[ 'tDiffuse' ].value = this.renderTargetsHorizontal[ 0 ].texture;
 
 		if ( maskActive ) renderer.state.buffers.stencil.setTest( true );
@@ -280,23 +354,25 @@ class UnrealBloomPass extends Pass {
 		if ( this.renderToScreen ) {
 
 			renderer.setRenderTarget( null );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		} else {
 
 			renderer.setRenderTarget( readBuffer );
-			this.fsQuad.render( renderer );
+			this._fsQuad.render( renderer );
 
 		}
 
 		// Restore renderer settings
 
-		renderer.setClearColor( this._oldClearColor, this.oldClearAlpha );
+		renderer.setClearColor( this._oldClearColor, this._oldClearAlpha );
 		renderer.autoClear = oldAutoClear;
 
 	}
 
-	getSeparableBlurMaterial( kernelRadius ) {
+	// internals
+
+	_getSeparableBlurMaterial( kernelRadius ) {
 
 		const coefficients = [];
 
@@ -352,7 +428,7 @@ class UnrealBloomPass extends Pass {
 
 	}
 
-	getCompositeMaterial( nMips ) {
+	_getCompositeMaterial( nMips ) {
 
 		return new ShaderMaterial( {
 

examples/jsm/tsl/display/SSRNode.js

@@ -98,7 +98,7 @@ class SSRNode extends TempNode {
 		this._ssrRenderTarget.texture.name = 'SSRNode.SSR';
 
 		/**
-		 * Controls how far a fragment can reflect
+		 * Controls how far a fragment can reflect.
 		 *
 		 *
 		 * @type {UniformNode<float>}

examples/webgl_postprocessing_rgb_halftone.html

@@ -132,7 +132,7 @@
 					greyscale: false,
 					disable: false
 				};
-				const halftonePass = new HalftonePass( window.innerWidth, window.innerHeight, params );
+				const halftonePass = new HalftonePass( params );
 				composer.addPass( renderPass );
 				composer.addPass( halftonePass );
 

examples/webgl_postprocessing_smaa.html

@@ -86,7 +86,7 @@
 				composer = new EffectComposer( renderer );
 				composer.addPass( new RenderPass( scene, camera ) );
 
-				smaaPass = new SMAAPass( window.innerWidth * renderer.getPixelRatio(), window.innerHeight * renderer.getPixelRatio() );
+				smaaPass = new SMAAPass();
 				composer.addPass( smaaPass );
 
 				const outputPass = new OutputPass();

utils/docs/jsdoc.config.json

@@ -33,6 +33,7 @@
             "examples/jsm/modifiers",
             "examples/jsm/objects",
             "examples/jsm/physics",
+            "examples/jsm/postprocessing",
             "examples/jsm/renderers",
             "examples/jsm/textures",
             "examples/jsm/transpiler",