Merge pull request #21053 from alexfriesen/es6-render-target

WebGLRenderTarget: convert to es6

src/renderers/WebGLCubeRenderTarget.js

@@ -7,136 +7,138 @@ import { WebGLRenderTarget } from './WebGLRenderTarget.js';
 import { CubeCamera } from '../cameras/CubeCamera.js';
 import { CubeTexture } from '../textures/CubeTexture.js';
 
-function WebGLCubeRenderTarget( size, options, dummy ) {
+class WebGLCubeRenderTarget extends WebGLRenderTarget {
 
-	if ( Number.isInteger( options ) ) {
+	constructor( size, options, dummy ) {
 
-		console.warn( 'THREE.WebGLCubeRenderTarget: constructor signature is now WebGLCubeRenderTarget( size, options )' );
+		if ( Number.isInteger( options ) ) {
 
-		options = dummy;
+			console.warn( 'THREE.WebGLCubeRenderTarget: constructor signature is now WebGLCubeRenderTarget( size, options )' );
 
-	}
+			options = dummy;
 
-	WebGLRenderTarget.call( this, size, size, options );
+		}
 
-	options = options || {};
+		super( size, size, options );
 
-	this.texture = new CubeTexture( undefined, options.mapping, options.wrapS, options.wrapT, options.magFilter, options.minFilter, options.format, options.type, options.anisotropy, options.encoding );
+		Object.defineProperty( this, 'isWebGLCubeRenderTarget', { value: true } );
 
-	this.texture._needsFlipEnvMap = false;
+		options = options || {};
 
-}
+		this.texture = new CubeTexture( undefined, options.mapping, options.wrapS, options.wrapT, options.magFilter, options.minFilter, options.format, options.type, options.anisotropy, options.encoding );
 
-WebGLCubeRenderTarget.prototype = Object.create( WebGLRenderTarget.prototype );
-WebGLCubeRenderTarget.prototype.constructor = WebGLCubeRenderTarget;
+		this.texture._needsFlipEnvMap = false;
 
-WebGLCubeRenderTarget.prototype.isWebGLCubeRenderTarget = true;
+	}
 
-WebGLCubeRenderTarget.prototype.fromEquirectangularTexture = function ( renderer, texture ) {
+	fromEquirectangularTexture( renderer, texture ) {
 
-	this.texture.type = texture.type;
-	this.texture.format = RGBAFormat; // see #18859
-	this.texture.encoding = texture.encoding;
+		this.texture.type = texture.type;
+		this.texture.format = RGBAFormat; // see #18859
+		this.texture.encoding = texture.encoding;
 
-	this.texture.generateMipmaps = texture.generateMipmaps;
-	this.texture.minFilter = texture.minFilter;
-	this.texture.magFilter = texture.magFilter;
+		this.texture.generateMipmaps = texture.generateMipmaps;
+		this.texture.minFilter = texture.minFilter;
+		this.texture.magFilter = texture.magFilter;
 
-	const shader = {
+		const shader = {
 
-		uniforms: {
-			tEquirect: { value: null },
-		},
+			uniforms: {
+				tEquirect: { value: null },
+			},
 
-		vertexShader: /* glsl */`
+			vertexShader: /* glsl */`
 
-			varying vec3 vWorldDirection;
+				varying vec3 vWorldDirection;
 
-			vec3 transformDirection( in vec3 dir, in mat4 matrix ) {
+				vec3 transformDirection( in vec3 dir, in mat4 matrix ) {
 
-				return normalize( ( matrix * vec4( dir, 0.0 ) ).xyz );
+					return normalize( ( matrix * vec4( dir, 0.0 ) ).xyz );
 
-			}
+				}
 
-			void main() {
+				void main() {
 
-				vWorldDirection = transformDirection( position, modelMatrix );
+					vWorldDirection = transformDirection( position, modelMatrix );
 
-				#include <begin_vertex>
-				#include <project_vertex>
+					#include <begin_vertex>
+					#include <project_vertex>
 
-			}
-		`,
+				}
+			`,
 
-		fragmentShader: /* glsl */`
+			fragmentShader: /* glsl */`
 
-			uniform sampler2D tEquirect;
+				uniform sampler2D tEquirect;
 
-			varying vec3 vWorldDirection;
+				varying vec3 vWorldDirection;
 
-			#include <common>
+				#include <common>
 
-			void main() {
+				void main() {
 
-				vec3 direction = normalize( vWorldDirection );
+					vec3 direction = normalize( vWorldDirection );
 
-				vec2 sampleUV = equirectUv( direction );
+					vec2 sampleUV = equirectUv( direction );
 
-				gl_FragColor = texture2D( tEquirect, sampleUV );
+					gl_FragColor = texture2D( tEquirect, sampleUV );
 
-			}
-		`
-	};
+				}
+			`
+		};
 
-	const geometry = new BoxGeometry( 5, 5, 5 );
+		const geometry = new BoxGeometry( 5, 5, 5 );
 
-	const material = new ShaderMaterial( {
+		const material = new ShaderMaterial( {
 
-		name: 'CubemapFromEquirect',
+			name: 'CubemapFromEquirect',
 
-		uniforms: cloneUniforms( shader.uniforms ),
-		vertexShader: shader.vertexShader,
-		fragmentShader: shader.fragmentShader,
-		side: BackSide,
-		blending: NoBlending
+			uniforms: cloneUniforms( shader.uniforms ),
+			vertexShader: shader.vertexShader,
+			fragmentShader: shader.fragmentShader,
+			side: BackSide,
+			blending: NoBlending
 
-	} );
+		} );
 
-	material.uniforms.tEquirect.value = texture;
+		material.uniforms.tEquirect.value = texture;
 
-	const mesh = new Mesh( geometry, material );
+		const mesh = new Mesh( geometry, material );
 
-	const currentMinFilter = texture.minFilter;
+		const currentMinFilter = texture.minFilter;
 
-	// Avoid blurred poles
-	if ( texture.minFilter === LinearMipmapLinearFilter ) texture.minFilter = LinearFilter;
+		// Avoid blurred poles
+		if ( texture.minFilter === LinearMipmapLinearFilter ) texture.minFilter = LinearFilter;
 
-	const camera = new CubeCamera( 1, 10, this );
-	camera.update( renderer, mesh );
+		const camera = new CubeCamera( 1, 10, this );
+		camera.update( renderer, mesh );
 
-	texture.minFilter = currentMinFilter;
+		texture.minFilter = currentMinFilter;
 
-	mesh.geometry.dispose();
-	mesh.material.dispose();
+		mesh.geometry.dispose();
+		mesh.material.dispose();
 
-	return this;
+		return this;
 
-};
+	}
 
-WebGLCubeRenderTarget.prototype.clear = function ( renderer, color, depth, stencil ) {
+	clear( renderer, color, depth, stencil ) {
 
-	const currentRenderTarget = renderer.getRenderTarget();
+		const currentRenderTarget = renderer.getRenderTarget();
 
-	for ( let i = 0; i < 6; i ++ ) {
+		for ( let i = 0; i < 6; i ++ ) {
 
-		renderer.setRenderTarget( this, i );
+			renderer.setRenderTarget( this, i );
 
-		renderer.clear( color, depth, stencil );
+			renderer.clear( color, depth, stencil );
+
+		}
+
+		renderer.setRenderTarget( currentRenderTarget );
 
 	}
 
-	renderer.setRenderTarget( currentRenderTarget );
+}
 
-};
 
 export { WebGLCubeRenderTarget };

src/renderers/WebGLMultisampleRenderTarget.js

@@ -1,22 +1,20 @@
 import { WebGLRenderTarget } from './WebGLRenderTarget.js';
 
-function WebGLMultisampleRenderTarget( width, height, options ) {
+class WebGLMultisampleRenderTarget extends WebGLRenderTarget {
 
-	WebGLRenderTarget.call( this, width, height, options );
+	constructor( width, height, options ) {
 
-	this.samples = 4;
+		super( width, height, options );
 
-}
-
-WebGLMultisampleRenderTarget.prototype = Object.assign( Object.create( WebGLRenderTarget.prototype ), {
+		Object.defineProperty( this, 'isWebGLMultisampleRenderTarget', { value: true } );
 
-	constructor: WebGLMultisampleRenderTarget,
+		this.samples = 4;
 
-	isWebGLMultisampleRenderTarget: true,
+	}
 
-	copy: function ( source ) {
+	copy( source ) {
 
-		WebGLRenderTarget.prototype.copy.call( this, source );
+		super.copy.call( this, source );
 
 		this.samples = source.samples;
 
@@ -24,7 +22,7 @@ WebGLMultisampleRenderTarget.prototype = Object.assign( Object.create( WebGLRend
 
 	}
 
-} );
+}
 
 
 export { WebGLMultisampleRenderTarget };

src/renderers/WebGLRenderTarget.js

@@ -8,40 +8,40 @@ import { Vector4 } from '../math/Vector4.js';
  * Texture parameters for an auto-generated target texture
  * depthBuffer/stencilBuffer: Booleans to indicate if we should generate these buffers
 */
-function WebGLRenderTarget( width, height, options ) {
+class WebGLRenderTarget extends EventDispatcher {
 
-	this.width = width;
-	this.height = height;
+	constructor( width, height, options ) {
 
-	this.scissor = new Vector4( 0, 0, width, height );
-	this.scissorTest = false;
+		super();
 
-	this.viewport = new Vector4( 0, 0, width, height );
+		Object.defineProperty( this, 'isWebGLRenderTarget', { value: true } );
 
-	options = options || {};
+		this.width = width;
+		this.height = height;
 
-	this.texture = new Texture( undefined, options.mapping, options.wrapS, options.wrapT, options.magFilter, options.minFilter, options.format, options.type, options.anisotropy, options.encoding );
+		this.scissor = new Vector4( 0, 0, width, height );
+		this.scissorTest = false;
 
-	this.texture.image = {};
-	this.texture.image.width = width;
-	this.texture.image.height = height;
+		this.viewport = new Vector4( 0, 0, width, height );
 
-	this.texture.generateMipmaps = options.generateMipmaps !== undefined ? options.generateMipmaps : false;
-	this.texture.minFilter = options.minFilter !== undefined ? options.minFilter : LinearFilter;
+		options = options || {};
 
-	this.depthBuffer = options.depthBuffer !== undefined ? options.depthBuffer : true;
-	this.stencilBuffer = options.stencilBuffer !== undefined ? options.stencilBuffer : false;
-	this.depthTexture = options.depthTexture !== undefined ? options.depthTexture : null;
+		this.texture = new Texture( undefined, options.mapping, options.wrapS, options.wrapT, options.magFilter, options.minFilter, options.format, options.type, options.anisotropy, options.encoding );
 
-}
+		this.texture.image = {};
+		this.texture.image.width = width;
+		this.texture.image.height = height;
 
-WebGLRenderTarget.prototype = Object.assign( Object.create( EventDispatcher.prototype ), {
+		this.texture.generateMipmaps = options.generateMipmaps !== undefined ? options.generateMipmaps : false;
+		this.texture.minFilter = options.minFilter !== undefined ? options.minFilter : LinearFilter;
 
-	constructor: WebGLRenderTarget,
+		this.depthBuffer = options.depthBuffer !== undefined ? options.depthBuffer : true;
+		this.stencilBuffer = options.stencilBuffer !== undefined ? options.stencilBuffer : false;
+		this.depthTexture = options.depthTexture !== undefined ? options.depthTexture : null;
 
-	isWebGLRenderTarget: true,
+	}
 
-	setSize: function ( width, height ) {
+	setSize( width, height ) {
 
 		if ( this.width !== width || this.height !== height ) {
 
@@ -58,15 +58,15 @@ WebGLRenderTarget.prototype = Object.assign( Object.create( EventDispatcher.prot
 		this.viewport.set( 0, 0, width, height );
 		this.scissor.set( 0, 0, width, height );
 
-	},
+	}
 
-	clone: function () {
+	clone() {
 
 		return new this.constructor().copy( this );
 
-	},
+	}
 
-	copy: function ( source ) {
+	copy( source ) {
 
 		this.width = source.width;
 		this.height = source.height;
@@ -81,15 +81,15 @@ WebGLRenderTarget.prototype = Object.assign( Object.create( EventDispatcher.prot
 
 		return this;
 
-	},
+	}
 
-	dispose: function () {
+	dispose() {
 
 		this.dispatchEvent( { type: 'dispose' } );
 
 	}
 
-} );
+}
 
 
 export { WebGLRenderTarget };