Merge pull request #20102 from linbingquan/dev-es6-cameras

cameras: Convert to es6.

src/cameras/CubeCamera.js

@@ -4,58 +4,68 @@ import { PerspectiveCamera } from './PerspectiveCamera.js';
 
 const fov = 90, aspect = 1;
 
-function CubeCamera( near, far, renderTarget ) {
+class CubeCamera extends Object3D {
 
-	Object3D.call( this );
+	constructor( near, far, renderTarget ) {
 
-	this.type = 'CubeCamera';
+		super();
 
-	if ( renderTarget.isWebGLCubeRenderTarget !== true ) {
+		this.type = 'CubeCamera';
 
-		console.error( 'THREE.CubeCamera: The constructor now expects an instance of WebGLCubeRenderTarget as third parameter.' );
-		return;
+		if ( renderTarget.isWebGLCubeRenderTarget !== true ) {
+
+			console.error( 'THREE.CubeCamera: The constructor now expects an instance of WebGLCubeRenderTarget as third parameter.' );
+			return;
+
+		}
+
+		this.renderTarget = renderTarget;
+
+		const cameraPX = new PerspectiveCamera( fov, aspect, near, far );
+		cameraPX.layers = this.layers;
+		cameraPX.up.set( 0, - 1, 0 );
+		cameraPX.lookAt( new Vector3( 1, 0, 0 ) );
+		this.cameraPX = cameraPX;
+		this.add( cameraPX );
+
+		const cameraNX = new PerspectiveCamera( fov, aspect, near, far );
+		cameraNX.layers = this.layers;
+		cameraNX.up.set( 0, - 1, 0 );
+		cameraNX.lookAt( new Vector3( - 1, 0, 0 ) );
+		this.cameraNX = cameraNX;
+		this.add( cameraNX );
+
+		const cameraPY = new PerspectiveCamera( fov, aspect, near, far );
+		cameraPY.layers = this.layers;
+		cameraPY.up.set( 0, 0, 1 );
+		cameraPY.lookAt( new Vector3( 0, 1, 0 ) );
+		this.cameraPY = cameraPY;
+		this.add( cameraPY );
+
+		const cameraNY = new PerspectiveCamera( fov, aspect, near, far );
+		cameraNY.layers = this.layers;
+		cameraNY.up.set( 0, 0, - 1 );
+		cameraNY.lookAt( new Vector3( 0, - 1, 0 ) );
+		this.cameraNY = cameraNY;
+		this.add( cameraNY );
+
+		const cameraPZ = new PerspectiveCamera( fov, aspect, near, far );
+		cameraPZ.layers = this.layers;
+		cameraPZ.up.set( 0, - 1, 0 );
+		cameraPZ.lookAt( new Vector3( 0, 0, 1 ) );
+		this.cameraPZ = cameraPZ;
+		this.add( cameraPZ );
+
+		const cameraNZ = new PerspectiveCamera( fov, aspect, near, far );
+		cameraNZ.layers = this.layers;
+		cameraNZ.up.set( 0, - 1, 0 );
+		cameraNZ.lookAt( new Vector3( 0, 0, - 1 ) );
+		this.cameraNZ = cameraNZ;
+		this.add( cameraNZ );
 
 	}
 
-	this.renderTarget = renderTarget;
-
-	const cameraPX = new PerspectiveCamera( fov, aspect, near, far );
-	cameraPX.layers = this.layers;
-	cameraPX.up.set( 0, - 1, 0 );
-	cameraPX.lookAt( new Vector3( 1, 0, 0 ) );
-	this.add( cameraPX );
-
-	const cameraNX = new PerspectiveCamera( fov, aspect, near, far );
-	cameraNX.layers = this.layers;
-	cameraNX.up.set( 0, - 1, 0 );
-	cameraNX.lookAt( new Vector3( - 1, 0, 0 ) );
-	this.add( cameraNX );
-
-	const cameraPY = new PerspectiveCamera( fov, aspect, near, far );
-	cameraPY.layers = this.layers;
-	cameraPY.up.set( 0, 0, 1 );
-	cameraPY.lookAt( new Vector3( 0, 1, 0 ) );
-	this.add( cameraPY );
-
-	const cameraNY = new PerspectiveCamera( fov, aspect, near, far );
-	cameraNY.layers = this.layers;
-	cameraNY.up.set( 0, 0, - 1 );
-	cameraNY.lookAt( new Vector3( 0, - 1, 0 ) );
-	this.add( cameraNY );
-
-	const cameraPZ = new PerspectiveCamera( fov, aspect, near, far );
-	cameraPZ.layers = this.layers;
-	cameraPZ.up.set( 0, - 1, 0 );
-	cameraPZ.lookAt( new Vector3( 0, 0, 1 ) );
-	this.add( cameraPZ );
-
-	const cameraNZ = new PerspectiveCamera( fov, aspect, near, far );
-	cameraNZ.layers = this.layers;
-	cameraNZ.up.set( 0, - 1, 0 );
-	cameraNZ.lookAt( new Vector3( 0, 0, - 1 ) );
-	this.add( cameraNZ );
-
-	this.update = function ( renderer, scene ) {
+	update( renderer, scene ) {
 
 		if ( this.parent === null ) this.updateMatrixWorld();
 
@@ -64,40 +74,44 @@ function CubeCamera( near, far, renderTarget ) {
 
 		renderer.xr.enabled = false;
 
+		const renderTarget = this.renderTarget;
+
 		const generateMipmaps = renderTarget.texture.generateMipmaps;
 
 		renderTarget.texture.generateMipmaps = false;
 
 		renderer.setRenderTarget( renderTarget, 0 );
+		const cameraPX = this.cameraPX;
 		renderer.render( scene, cameraPX );
 
 		renderer.setRenderTarget( renderTarget, 1 );
+		const cameraNX = this.cameraNX;
 		renderer.render( scene, cameraNX );
 
 		renderer.setRenderTarget( renderTarget, 2 );
+		const cameraPY = this.cameraPY;
 		renderer.render( scene, cameraPY );
 
 		renderer.setRenderTarget( renderTarget, 3 );
+		const cameraNY = this.cameraNY;
 		renderer.render( scene, cameraNY );
 
 		renderer.setRenderTarget( renderTarget, 4 );
+		const cameraPZ = this.cameraPZ;
 		renderer.render( scene, cameraPZ );
 
 		renderTarget.texture.generateMipmaps = generateMipmaps;
 
 		renderer.setRenderTarget( renderTarget, 5 );
+		const cameraNZ = this.cameraNZ;
 		renderer.render( scene, cameraNZ );
 
 		renderer.setRenderTarget( currentRenderTarget );
 
 		renderer.xr.enabled = currentXrEnabled;
 
-	};
+	}
 
 }
 
-CubeCamera.prototype = Object.create( Object3D.prototype );
-CubeCamera.prototype.constructor = CubeCamera;
-
-
 export { CubeCamera };

src/cameras/OrthographicCamera.js

@@ -1,36 +1,41 @@
 import { Camera } from './Camera.js';
 import { Object3D } from '../core/Object3D.js';
 
-function OrthographicCamera( left = - 1, right = 1, top = 1, bottom = - 1, near = 0.1, far = 2000 ) {
+class OrthographicCamera extends Camera {
 
-	Camera.call( this );
+	constructor( left = - 1, right = 1, top = 1, bottom = - 1, near = 0.1, far = 2000 ) {
 
-	this.type = 'OrthographicCamera';
+		super();
 
-	this.zoom = 1;
-	this.view = null;
+		Object.defineProperty( this, 'isOrthographicCamera', { value: true } );
 
-	this.left = left;
-	this.right = right;
-	this.top = top;
-	this.bottom = bottom;
+		this.type = 'OrthographicCamera';
 
-	this.near = near;
-	this.far = far;
+		this.zoom = 1;
+		this.view = null;
+		this.left = left;
+		this.right = right;
+		this.top = top;
+		this.bottom = bottom;
 
-	this.updateProjectionMatrix();
+		this.near = near;
+		this.far = far;
 
-}
+		this.left = ( left !== undefined ) ? left : - 1;
+		this.right = ( right !== undefined ) ? right : 1;
+		this.top = ( top !== undefined ) ? top : 1;
+		this.bottom = ( bottom !== undefined ) ? bottom : - 1;
 
-OrthographicCamera.prototype = Object.assign( Object.create( Camera.prototype ), {
+		this.near = ( near !== undefined ) ? near : 0.1;
+		this.far = ( far !== undefined ) ? far : 2000;
 
-	constructor: OrthographicCamera,
+		this.updateProjectionMatrix();
 
-	isOrthographicCamera: true,
+	}
 
-	copy: function ( source, recursive ) {
+	copy( source, recursive ) {
 
-		Camera.prototype.copy.call( this, source, recursive );
+		super.copy( source, recursive );
 
 		this.left = source.left;
 		this.right = source.right;
@@ -44,9 +49,9 @@ OrthographicCamera.prototype = Object.assign( Object.create( Camera.prototype ),
 
 		return this;
 
-	},
+	}
 
-	setViewOffset: function ( fullWidth, fullHeight, x, y, width, height ) {
+	setViewOffset( fullWidth, fullHeight, x, y, width, height ) {
 
 		if ( this.view === null ) {
 
@@ -72,9 +77,9 @@ OrthographicCamera.prototype = Object.assign( Object.create( Camera.prototype ),
 
 		this.updateProjectionMatrix();
 
-	},
+	}
 
-	clearViewOffset: function () {
+	clearViewOffset() {
 
 		if ( this.view !== null ) {
 
@@ -84,9 +89,9 @@ OrthographicCamera.prototype = Object.assign( Object.create( Camera.prototype ),
 
 		this.updateProjectionMatrix();
 
-	},
+	}
 
-	updateProjectionMatrix: function () {
+	updateProjectionMatrix() {
 
 		const dx = ( this.right - this.left ) / ( 2 * this.zoom );
 		const dy = ( this.top - this.bottom ) / ( 2 * this.zoom );
@@ -114,9 +119,9 @@ OrthographicCamera.prototype = Object.assign( Object.create( Camera.prototype ),
 
 		this.projectionMatrixInverse.copy( this.projectionMatrix ).invert();
 
-	},
+	}
 
-	toJSON: function ( meta ) {
+	toJSON( meta ) {
 
 		const data = Object3D.prototype.toJSON.call( this, meta );
 
@@ -134,7 +139,6 @@ OrthographicCamera.prototype = Object.assign( Object.create( Camera.prototype ),
 
 	}
 
-} );
-
+}
 
 export { OrthographicCamera };

src/cameras/StereoCamera.js

@@ -5,37 +5,37 @@ import { PerspectiveCamera } from './PerspectiveCamera.js';
 const _eyeRight = new Matrix4();
 const _eyeLeft = new Matrix4();
 
-function StereoCamera() {
+class StereoCamera {
 
-	this.type = 'StereoCamera';
+	constructor() {
 
-	this.aspect = 1;
+		this.type = 'StereoCamera';
 
-	this.eyeSep = 0.064;
+		this.aspect = 1;
 
-	this.cameraL = new PerspectiveCamera();
-	this.cameraL.layers.enable( 1 );
-	this.cameraL.matrixAutoUpdate = false;
+		this.eyeSep = 0.064;
 
-	this.cameraR = new PerspectiveCamera();
-	this.cameraR.layers.enable( 2 );
-	this.cameraR.matrixAutoUpdate = false;
+		this.cameraL = new PerspectiveCamera();
+		this.cameraL.layers.enable( 1 );
+		this.cameraL.matrixAutoUpdate = false;
 
-	this._cache = {
-		focus: null,
-		fov: null,
-		aspect: null,
-		near: null,
-		far: null,
-		zoom: null,
-		eyeSep: null
-	};
+		this.cameraR = new PerspectiveCamera();
+		this.cameraR.layers.enable( 2 );
+		this.cameraR.matrixAutoUpdate = false;
 
-}
+		this._cache = {
+			focus: null,
+			fov: null,
+			aspect: null,
+			near: null,
+			far: null,
+			zoom: null,
+			eyeSep: null
+		};
 
-Object.assign( StereoCamera.prototype, {
+	}
 
-	update: function ( camera ) {
+	update( camera ) {
 
 		const cache = this._cache;
 
@@ -94,7 +94,6 @@ Object.assign( StereoCamera.prototype, {
 
 	}
 
-} );
-
+}
 
 export { StereoCamera };