Materials: Convert to classes. (#21626)

examples/jsm/nodes/materials/BasicNodeMaterial.js

@@ -2,18 +2,19 @@ import { BasicNode } from './nodes/BasicNode.js';
 import { NodeMaterial } from './NodeMaterial.js';
 import { NodeUtils } from '../core/NodeUtils.js';
 
-function BasicNodeMaterial() {
+class BasicNodeMaterial extends NodeMaterial {
 
-	var node = new BasicNode();
+	constructor() {
 
-	NodeMaterial.call( this, node, node );
+		const node = new BasicNode();
 
-	this.type = 'BasicNodeMaterial';
+		super( node, node );
 
-}
+		this.type = 'BasicNodeMaterial';
+
+	}
 
-BasicNodeMaterial.prototype = Object.create( NodeMaterial.prototype );
-BasicNodeMaterial.prototype.constructor = BasicNodeMaterial;
+}
 
 NodeUtils.addShortcuts( BasicNodeMaterial.prototype, 'fragment', [
 	'color',

examples/jsm/nodes/materials/MeshStandardNodeMaterial.js

@@ -2,18 +2,19 @@ import { MeshStandardNode } from './nodes/MeshStandardNode.js';
 import { NodeMaterial } from './NodeMaterial.js';
 import { NodeUtils } from '../core/NodeUtils.js';
 
-function MeshStandardNodeMaterial() {
+class MeshStandardNodeMaterial extends NodeMaterial {
 
-	var node = new MeshStandardNode();
+	constructor() {
 
-	NodeMaterial.call( this, node, node );
+		const node = new MeshStandardNode();
 
-	this.type = 'MeshStandardNodeMaterial';
+		super( node, node );
 
-}
+		this.type = 'MeshStandardNodeMaterial';
+
+	}
 
-MeshStandardNodeMaterial.prototype = Object.create( NodeMaterial.prototype );
-MeshStandardNodeMaterial.prototype.constructor = MeshStandardNodeMaterial;
+}
 
 NodeUtils.addShortcuts( MeshStandardNodeMaterial.prototype, 'properties', [
 	'color',

examples/jsm/nodes/materials/NodeMaterial.js

@@ -11,219 +11,207 @@ import { ColorNode } from '../inputs/ColorNode.js';
 import { PositionNode } from '../accessors/PositionNode.js';
 import { RawNode } from './nodes/RawNode.js';
 
-function NodeMaterial( vertex, fragment ) {
+class NodeMaterial extends ShaderMaterial {
 
-	ShaderMaterial.call( this );
+	constructor( vertex, fragment ) {
 
-	this.vertex = vertex || new RawNode( new PositionNode( PositionNode.PROJECTION ) );
-	this.fragment = fragment || new RawNode( new ColorNode( 0xFF0000 ) );
+		super();
 
-	this.updaters = [];
+		this.vertex = vertex || new RawNode( new PositionNode( PositionNode.PROJECTION ) );
+		this.fragment = fragment || new RawNode( new ColorNode( 0xFF0000 ) );
 
-}
-
-NodeMaterial.prototype = Object.create( ShaderMaterial.prototype );
-NodeMaterial.prototype.constructor = NodeMaterial;
-NodeMaterial.prototype.type = 'NodeMaterial';
-
-NodeMaterial.prototype.isNodeMaterial = true;
-
-Object.defineProperties( NodeMaterial.prototype, {
-
-	properties: {
-
-		get: function () {
+		this.updaters = [];
 
-			return this.fragment.properties;
+		this.type = 'NodeMaterial';
 
-		}
+	}
 
-	},
+	get properties() {
 
-	needsUpdate: {
+		return this.fragment.properties;
 
-		set: function ( value ) {
+	}
 
-			if ( value === true ) this.version ++;
-			this.needsCompile = value;
+	get needsUpdate() {
 
-		},
+		return this.needsCompile;
 
-		get: function () {
+	}
 
-			return this.needsCompile;
+	set needsUpdate( value ) {
 
-		}
+		if ( value === true ) this.version ++;
+		this.needsCompile = value;
 
 	}
 
-} );
+	onBeforeCompile( shader, renderer ) {
 
-NodeMaterial.prototype.onBeforeCompile = function ( shader, renderer ) {
+		this.build( { renderer: renderer } );
 
-	this.build( { renderer: renderer } );
+		shader.defines = this.defines;
+		shader.uniforms = this.uniforms;
+		shader.vertexShader = this.vertexShader;
+		shader.fragmentShader = this.fragmentShader;
 
-	shader.defines = this.defines;
-	shader.uniforms = this.uniforms;
-	shader.vertexShader = this.vertexShader;
-	shader.fragmentShader = this.fragmentShader;
+		shader.extensionDerivatives = ( this.extensions.derivatives === true );
+		shader.extensionFragDepth = ( this.extensions.fragDepth === true );
+		shader.extensionDrawBuffers = ( this.extensions.drawBuffers === true );
+		shader.extensionShaderTextureLOD = ( this.extensions.shaderTextureLOD === true );
 
-	shader.extensionDerivatives = ( this.extensions.derivatives === true );
-	shader.extensionFragDepth = ( this.extensions.fragDepth === true );
-	shader.extensionDrawBuffers = ( this.extensions.drawBuffers === true );
-	shader.extensionShaderTextureLOD = ( this.extensions.shaderTextureLOD === true );
+	}
 
-};
+	customProgramCacheKey() {
 
-NodeMaterial.prototype.customProgramCacheKey = function () {
+		const hash = this.getHash();
 
-	var hash = this.getHash();
+		return hash;
 
-	return hash;
+	}
 
-};
+	getHash() {
 
-NodeMaterial.prototype.getHash = function () {
+		let hash = '{';
 
-	var hash = '{';
+		hash += '"vertex":' + this.vertex.getHash() + ',';
+		hash += '"fragment":' + this.fragment.getHash();
 
-	hash += '"vertex":' + this.vertex.getHash() + ',';
-	hash += '"fragment":' + this.fragment.getHash();
+		hash += '}';
 
-	hash += '}';
+		return hash;
 
-	return hash;
+	}
 
-};
+	updateFrame( frame ) {
 
-NodeMaterial.prototype.updateFrame = function ( frame ) {
+		for ( let i = 0; i < this.updaters.length; ++ i ) {
 
-	for ( var i = 0; i < this.updaters.length; ++ i ) {
+			frame.updateNode( this.updaters[ i ] );
 
-		frame.updateNode( this.updaters[ i ] );
+		}
 
 	}
 
-};
+	build( params = {} ) {
 
-NodeMaterial.prototype.build = function ( params ) {
+		const builder = params.builder || new NodeBuilder();
 
-	params = params || {};
+		builder.setMaterial( this, params.renderer );
+		builder.build( this.vertex, this.fragment );
 
-	var builder = params.builder || new NodeBuilder();
+		this.vertexShader = builder.getCode( 'vertex' );
+		this.fragmentShader = builder.getCode( 'fragment' );
 
-	builder.setMaterial( this, params.renderer );
-	builder.build( this.vertex, this.fragment );
+		this.defines = builder.defines;
+		this.uniforms = builder.uniforms;
+		this.extensions = builder.extensions;
+		this.updaters = builder.updaters;
 
-	this.vertexShader = builder.getCode( 'vertex' );
-	this.fragmentShader = builder.getCode( 'fragment' );
+		this.fog = builder.requires.fog;
+		this.lights = builder.requires.lights;
 
-	this.defines = builder.defines;
-	this.uniforms = builder.uniforms;
-	this.extensions = builder.extensions;
-	this.updaters = builder.updaters;
+		this.transparent = builder.requires.transparent || this.blending > NormalBlending;
 
-	this.fog = builder.requires.fog;
-	this.lights = builder.requires.lights;
+		return this;
 
-	this.transparent = builder.requires.transparent || this.blending > NormalBlending;
+	}
 
-	return this;
+	copy( source ) {
 
-};
+		const uuid = this.uuid;
 
-NodeMaterial.prototype.copy = function ( source ) {
+		for ( const name in source ) {
 
-	var uuid = this.uuid;
+			this[ name ] = source[ name ];
 
-	for ( var name in source ) {
+		}
 
-		this[ name ] = source[ name ];
+		this.uuid = uuid;
 
-	}
+		if ( source.userData !== undefined ) {
 
-	this.uuid = uuid;
+			this.userData = JSON.parse( JSON.stringify( source.userData ) );
 
-	if ( source.userData !== undefined ) {
+		}
 
-		this.userData = JSON.parse( JSON.stringify( source.userData ) );
+		return this;
 
 	}
 
-	return this;
+	toJSON( meta ) {
 
-};
+		const isRootObject = ( meta === undefined || typeof meta === 'string' );
 
-NodeMaterial.prototype.toJSON = function ( meta ) {
+		if ( isRootObject ) {
 
-	var isRootObject = ( meta === undefined || typeof meta === 'string' );
+			meta = {
+				nodes: {}
+			};
 
-	if ( isRootObject ) {
+		}
 
-		meta = {
-			nodes: {}
-		};
+		if ( meta && ! meta.materials ) meta.materials = {};
 
-	}
+		if ( ! meta.materials[ this.uuid ] ) {
 
-	if ( meta && ! meta.materials ) meta.materials = {};
+			const data = {};
 
-	if ( ! meta.materials[ this.uuid ] ) {
+			data.uuid = this.uuid;
+			data.type = this.type;
 
-		var data = {};
+			meta.materials[ data.uuid ] = data;
 
-		data.uuid = this.uuid;
-		data.type = this.type;
+			if ( this.name !== '' ) data.name = this.name;
 
-		meta.materials[ data.uuid ] = data;
+			if ( this.size !== undefined ) data.size = this.size;
+			if ( this.sizeAttenuation !== undefined ) data.sizeAttenuation = this.sizeAttenuation;
 
-		if ( this.name !== '' ) data.name = this.name;
+			if ( this.blending !== NormalBlending ) data.blending = this.blending;
+			if ( this.flatShading === true ) data.flatShading = this.flatShading;
+			if ( this.side !== FrontSide ) data.side = this.side;
+			if ( this.vertexColors !== NoColors ) data.vertexColors = this.vertexColors;
 
-		if ( this.size !== undefined ) data.size = this.size;
-		if ( this.sizeAttenuation !== undefined ) data.sizeAttenuation = this.sizeAttenuation;
+			if ( this.depthFunc !== LessEqualDepth ) data.depthFunc = this.depthFunc;
+			if ( this.depthTest === false ) data.depthTest = this.depthTest;
+			if ( this.depthWrite === false ) data.depthWrite = this.depthWrite;
 
-		if ( this.blending !== NormalBlending ) data.blending = this.blending;
-		if ( this.flatShading === true ) data.flatShading = this.flatShading;
-		if ( this.side !== FrontSide ) data.side = this.side;
-		if ( this.vertexColors !== NoColors ) data.vertexColors = this.vertexColors;
+			if ( this.linewidth !== 1 ) data.linewidth = this.linewidth;
+			if ( this.dashSize !== undefined ) data.dashSize = this.dashSize;
+			if ( this.gapSize !== undefined ) data.gapSize = this.gapSize;
+			if ( this.scale !== undefined ) data.scale = this.scale;
 
-		if ( this.depthFunc !== LessEqualDepth ) data.depthFunc = this.depthFunc;
-		if ( this.depthTest === false ) data.depthTest = this.depthTest;
-		if ( this.depthWrite === false ) data.depthWrite = this.depthWrite;
+			if ( this.dithering === true ) data.dithering = true;
 
-		if ( this.linewidth !== 1 ) data.linewidth = this.linewidth;
-		if ( this.dashSize !== undefined ) data.dashSize = this.dashSize;
-		if ( this.gapSize !== undefined ) data.gapSize = this.gapSize;
-		if ( this.scale !== undefined ) data.scale = this.scale;
+			if ( this.wireframe === true ) data.wireframe = this.wireframe;
+			if ( this.wireframeLinewidth > 1 ) data.wireframeLinewidth = this.wireframeLinewidth;
+			if ( this.wireframeLinecap !== 'round' ) data.wireframeLinecap = this.wireframeLinecap;
+			if ( this.wireframeLinejoin !== 'round' ) data.wireframeLinejoin = this.wireframeLinejoin;
 
-		if ( this.dithering === true ) data.dithering = true;
+			if ( this.alphaTest > 0 ) data.alphaTest = this.alphaTest;
+			if ( this.premultipliedAlpha === true ) data.premultipliedAlpha = this.premultipliedAlpha;
 
-		if ( this.wireframe === true ) data.wireframe = this.wireframe;
-		if ( this.wireframeLinewidth > 1 ) data.wireframeLinewidth = this.wireframeLinewidth;
-		if ( this.wireframeLinecap !== 'round' ) data.wireframeLinecap = this.wireframeLinecap;
-		if ( this.wireframeLinejoin !== 'round' ) data.wireframeLinejoin = this.wireframeLinejoin;
+			if ( this.morphTargets === true ) data.morphTargets = true;
+			if ( this.skinning === true ) data.skinning = true;
 
-		if ( this.alphaTest > 0 ) data.alphaTest = this.alphaTest;
-		if ( this.premultipliedAlpha === true ) data.premultipliedAlpha = this.premultipliedAlpha;
+			if ( this.visible === false ) data.visible = false;
+			if ( JSON.stringify( this.userData ) !== '{}' ) data.userData = this.userData;
 
-		if ( this.morphTargets === true ) data.morphTargets = true;
-		if ( this.skinning === true ) data.skinning = true;
+			data.fog = this.fog;
+			data.lights = this.lights;
 
-		if ( this.visible === false ) data.visible = false;
-		if ( JSON.stringify( this.userData ) !== '{}' ) data.userData = this.userData;
+			data.vertex = this.vertex.toJSON( meta ).uuid;
+			data.fragment = this.fragment.toJSON( meta ).uuid;
 
-		data.fog = this.fog;
-		data.lights = this.lights;
+		}
 
-		data.vertex = this.vertex.toJSON( meta ).uuid;
-		data.fragment = this.fragment.toJSON( meta ).uuid;
+		meta.material = this.uuid;
 
-	}
+		return meta;
 
-	meta.material = this.uuid;
+	}
 
-	return meta;
+}
 
-};
+NodeMaterial.prototype.isNodeMaterial = true;
 
 export { NodeMaterial };

examples/jsm/nodes/materials/PhongNodeMaterial.js

@@ -2,18 +2,19 @@ import { PhongNode } from './nodes/PhongNode.js';
 import { NodeMaterial } from './NodeMaterial.js';
 import { NodeUtils } from '../core/NodeUtils.js';
 
-function PhongNodeMaterial() {
+class PhongNodeMaterial extends NodeMaterial {
 
-	var node = new PhongNode();
+	constructor() {
 
-	NodeMaterial.call( this, node, node );
+		const node = new PhongNode();
 
-	this.type = 'PhongNodeMaterial';
+		super( node, node );
 
-}
+		this.type = 'PhongNodeMaterial';
+
+	}
 
-PhongNodeMaterial.prototype = Object.create( NodeMaterial.prototype );
-PhongNodeMaterial.prototype.constructor = PhongNodeMaterial;
+}
 
 NodeUtils.addShortcuts( PhongNodeMaterial.prototype, 'fragment', [
 	'color',

examples/jsm/nodes/materials/SpriteNodeMaterial.js

@@ -2,18 +2,19 @@ import { SpriteNode } from './nodes/SpriteNode.js';
 import { NodeMaterial } from './NodeMaterial.js';
 import { NodeUtils } from '../core/NodeUtils.js';
 
-function SpriteNodeMaterial() {
+class SpriteNodeMaterial extends NodeMaterial {
 
-	var node = new SpriteNode();
+	constructor() {
 
-	NodeMaterial.call( this, node, node );
+		const node = new SpriteNode();
 
-	this.type = 'SpriteNodeMaterial';
+		super( node, node );
 
-}
+		this.type = 'SpriteNodeMaterial';
+
+	}
 
-SpriteNodeMaterial.prototype = Object.create( NodeMaterial.prototype );
-SpriteNodeMaterial.prototype.constructor = SpriteNodeMaterial;
+}
 
 NodeUtils.addShortcuts( SpriteNodeMaterial.prototype, 'fragment', [
 	'color',

examples/jsm/nodes/materials/StandardNodeMaterial.js

@@ -2,18 +2,19 @@ import { StandardNode } from './nodes/StandardNode.js';
 import { NodeMaterial } from './NodeMaterial.js';
 import { NodeUtils } from '../core/NodeUtils.js';
 
-function StandardNodeMaterial() {
+class StandardNodeMaterial extends NodeMaterial {
 
-	var node = new StandardNode();
+	constructor() {
 
-	NodeMaterial.call( this, node, node );
+		const node = new StandardNode();
 
-	this.type = 'StandardNodeMaterial';
+		super( node, node );
 
-}
+		this.type = 'StandardNodeMaterial';
+
+	}
 
-StandardNodeMaterial.prototype = Object.create( NodeMaterial.prototype );
-StandardNodeMaterial.prototype.constructor = StandardNodeMaterial;
+}
 
 NodeUtils.addShortcuts( StandardNodeMaterial.prototype, 'fragment', [
 	'color',

src/cameras/StereoCamera.js

@@ -2,8 +2,8 @@ import { Matrix4 } from '../math/Matrix4.js';
 import { MathUtils } from '../math/MathUtils.js';
 import { PerspectiveCamera } from './PerspectiveCamera.js';
 
-const _eyeRight = new Matrix4();
-const _eyeLeft = new Matrix4();
+const _eyeRight = /*@__PURE__*/ new Matrix4();
+const _eyeLeft = /*@__PURE__*/ new Matrix4();
 
 class StereoCamera {
 

src/materials/MeshPhysicalMaterial.js

@@ -22,90 +22,91 @@ import { MathUtils } from '../math/MathUtils.js';
  * }
  */
 
-function MeshPhysicalMaterial( parameters ) {
+class MeshPhysicalMaterial extends MeshStandardMaterial {
 
-	MeshStandardMaterial.call( this );
+	constructor( parameters ) {
 
-	this.defines = {
+		super();
 
-		'STANDARD': '',
-		'PHYSICAL': ''
+		this.defines = {
 
-	};
+			'STANDARD': '',
+			'PHYSICAL': ''
 
-	this.type = 'MeshPhysicalMaterial';
+		};
 
-	this.clearcoat = 0.0;
-	this.clearcoatMap = null;
-	this.clearcoatRoughness = 0.0;
-	this.clearcoatRoughnessMap = null;
-	this.clearcoatNormalScale = new Vector2( 1, 1 );
-	this.clearcoatNormalMap = null;
+		this.type = 'MeshPhysicalMaterial';
 
-	this.reflectivity = 0.5; // maps to F0 = 0.04
+		this.clearcoat = 0.0;
+		this.clearcoatMap = null;
+		this.clearcoatRoughness = 0.0;
+		this.clearcoatRoughnessMap = null;
+		this.clearcoatNormalScale = new Vector2( 1, 1 );
+		this.clearcoatNormalMap = null;
 
-	Object.defineProperty( this, 'ior', {
-		get: function () {
+		this.reflectivity = 0.5; // maps to F0 = 0.04
 
-			return ( 1 + 0.4 * this.reflectivity ) / ( 1 - 0.4 * this.reflectivity );
+		Object.defineProperty( this, 'ior', {
+			get: function () {
 
-		},
-		set: function ( ior ) {
+				return ( 1 + 0.4 * this.reflectivity ) / ( 1 - 0.4 * this.reflectivity );
 
-			this.reflectivity = MathUtils.clamp( 2.5 * ( ior - 1 ) / ( ior + 1 ), 0, 1 );
+			},
+			set: function ( ior ) {
 
-		}
-	} );
+				this.reflectivity = MathUtils.clamp( 2.5 * ( ior - 1 ) / ( ior + 1 ), 0, 1 );
 
-	this.sheen = null; // null will disable sheen bsdf
+			}
+		} );
 
-	this.transmission = 0.0;
-	this.transmissionMap = null;
+		this.sheen = null; // null will disable sheen bsdf
 
-	this.setValues( parameters );
+		this.transmission = 0.0;
+		this.transmissionMap = null;
 
-}
+		this.setValues( parameters );
 
-MeshPhysicalMaterial.prototype = Object.create( MeshStandardMaterial.prototype );
-MeshPhysicalMaterial.prototype.constructor = MeshPhysicalMaterial;
+	}
 
-MeshPhysicalMaterial.prototype.isMeshPhysicalMaterial = true;
+	copy( source ) {
+
+		super.copy( source );
 
-MeshPhysicalMaterial.prototype.copy = function ( source ) {
+		this.defines = {
 
-	MeshStandardMaterial.prototype.copy.call( this, source );
+			'STANDARD': '',
+			'PHYSICAL': ''
 
-	this.defines = {
+		};
 
-		'STANDARD': '',
-		'PHYSICAL': ''
+		this.clearcoat = source.clearcoat;
+		this.clearcoatMap = source.clearcoatMap;
+		this.clearcoatRoughness = source.clearcoatRoughness;
+		this.clearcoatRoughnessMap = source.clearcoatRoughnessMap;
+		this.clearcoatNormalMap = source.clearcoatNormalMap;
+		this.clearcoatNormalScale.copy( source.clearcoatNormalScale );
 
-	};
+		this.reflectivity = source.reflectivity;
 
-	this.clearcoat = source.clearcoat;
-	this.clearcoatMap = source.clearcoatMap;
-	this.clearcoatRoughness = source.clearcoatRoughness;
-	this.clearcoatRoughnessMap = source.clearcoatRoughnessMap;
-	this.clearcoatNormalMap = source.clearcoatNormalMap;
-	this.clearcoatNormalScale.copy( source.clearcoatNormalScale );
+		if ( source.sheen ) {
 
-	this.reflectivity = source.reflectivity;
+			this.sheen = ( this.sheen || new Color() ).copy( source.sheen );
 
-	if ( source.sheen ) {
+		} else {
 
-		this.sheen = ( this.sheen || new Color() ).copy( source.sheen );
+			this.sheen = null;
 
-	} else {
+		}
 
-		this.sheen = null;
+		this.transmission = source.transmission;
+		this.transmissionMap = source.transmissionMap;
 
-	}
+		return this;
 
-	this.transmission = source.transmission;
-	this.transmissionMap = source.transmissionMap;
+	}
 
-	return this;
+}
 
-};
+MeshPhysicalMaterial.prototype.isMeshPhysicalMaterial = true;
 
 export { MeshPhysicalMaterial };

src/materials/MeshStandardMaterial.js

@@ -55,134 +55,134 @@ import { Color } from '../math/Color.js';
  * }
  */
 
-function MeshStandardMaterial( parameters ) {
+class MeshStandardMaterial extends Material {
 
-	Material.call( this );
+	constructor( parameters ) {
 
-	this.defines = { 'STANDARD': '' };
+		super();
 
-	this.type = 'MeshStandardMaterial';
+		this.defines = { 'STANDARD': '' };
 
-	this.color = new Color( 0xffffff ); // diffuse
-	this.roughness = 1.0;
-	this.metalness = 0.0;
+		this.type = 'MeshStandardMaterial';
 
-	this.map = null;
+		this.color = new Color( 0xffffff ); // diffuse
+		this.roughness = 1.0;
+		this.metalness = 0.0;
 
-	this.lightMap = null;
-	this.lightMapIntensity = 1.0;
+		this.map = null;
 
-	this.aoMap = null;
-	this.aoMapIntensity = 1.0;
+		this.lightMap = null;
+		this.lightMapIntensity = 1.0;
 
-	this.emissive = new Color( 0x000000 );
-	this.emissiveIntensity = 1.0;
-	this.emissiveMap = null;
+		this.aoMap = null;
+		this.aoMapIntensity = 1.0;
 
-	this.bumpMap = null;
-	this.bumpScale = 1;
+		this.emissive = new Color( 0x000000 );
+		this.emissiveIntensity = 1.0;
+		this.emissiveMap = null;
 
-	this.normalMap = null;
-	this.normalMapType = TangentSpaceNormalMap;
-	this.normalScale = new Vector2( 1, 1 );
+		this.bumpMap = null;
+		this.bumpScale = 1;
 
-	this.displacementMap = null;
-	this.displacementScale = 1;
-	this.displacementBias = 0;
+		this.normalMap = null;
+		this.normalMapType = TangentSpaceNormalMap;
+		this.normalScale = new Vector2( 1, 1 );
 
-	this.roughnessMap = null;
+		this.displacementMap = null;
+		this.displacementScale = 1;
+		this.displacementBias = 0;
 
-	this.metalnessMap = null;
+		this.roughnessMap = null;
 
-	this.alphaMap = null;
+		this.metalnessMap = null;
 
-	this.envMap = null;
-	this.envMapIntensity = 1.0;
+		this.alphaMap = null;
 
-	this.refractionRatio = 0.98;
+		this.envMap = null;
+		this.envMapIntensity = 1.0;
 
-	this.wireframe = false;
-	this.wireframeLinewidth = 1;
-	this.wireframeLinecap = 'round';
-	this.wireframeLinejoin = 'round';
+		this.refractionRatio = 0.98;
 
-	this.skinning = false;
-	this.morphTargets = false;
-	this.morphNormals = false;
+		this.wireframe = false;
+		this.wireframeLinewidth = 1;
+		this.wireframeLinecap = 'round';
+		this.wireframeLinejoin = 'round';
 
-	this.flatShading = false;
+		this.skinning = false;
+		this.morphTargets = false;
+		this.morphNormals = false;
 
-	this.vertexTangents = false;
+		this.flatShading = false;
 
-	this.setValues( parameters );
+		this.vertexTangents = false;
 
-}
+		this.setValues( parameters );
 
-MeshStandardMaterial.prototype = Object.create( Material.prototype );
-MeshStandardMaterial.prototype.constructor = MeshStandardMaterial;
+	}
 
-MeshStandardMaterial.prototype.isMeshStandardMaterial = true;
+	copy( source ) {
 
-MeshStandardMaterial.prototype.copy = function ( source ) {
+		super.copy( source );
 
-	Material.prototype.copy.call( this, source );
+		this.defines = { 'STANDARD': '' };
 
-	this.defines = { 'STANDARD': '' };
+		this.color.copy( source.color );
+		this.roughness = source.roughness;
+		this.metalness = source.metalness;
 
-	this.color.copy( source.color );
-	this.roughness = source.roughness;
-	this.metalness = source.metalness;
+		this.map = source.map;
 
-	this.map = source.map;
+		this.lightMap = source.lightMap;
+		this.lightMapIntensity = source.lightMapIntensity;
 
-	this.lightMap = source.lightMap;
-	this.lightMapIntensity = source.lightMapIntensity;
+		this.aoMap = source.aoMap;
+		this.aoMapIntensity = source.aoMapIntensity;
 
-	this.aoMap = source.aoMap;
-	this.aoMapIntensity = source.aoMapIntensity;
+		this.emissive.copy( source.emissive );
+		this.emissiveMap = source.emissiveMap;
+		this.emissiveIntensity = source.emissiveIntensity;
 
-	this.emissive.copy( source.emissive );
-	this.emissiveMap = source.emissiveMap;
-	this.emissiveIntensity = source.emissiveIntensity;
+		this.bumpMap = source.bumpMap;
+		this.bumpScale = source.bumpScale;
 
-	this.bumpMap = source.bumpMap;
-	this.bumpScale = source.bumpScale;
+		this.normalMap = source.normalMap;
+		this.normalMapType = source.normalMapType;
+		this.normalScale.copy( source.normalScale );
 
-	this.normalMap = source.normalMap;
-	this.normalMapType = source.normalMapType;
-	this.normalScale.copy( source.normalScale );
+		this.displacementMap = source.displacementMap;
+		this.displacementScale = source.displacementScale;
+		this.displacementBias = source.displacementBias;
 
-	this.displacementMap = source.displacementMap;
-	this.displacementScale = source.displacementScale;
-	this.displacementBias = source.displacementBias;
+		this.roughnessMap = source.roughnessMap;
 
-	this.roughnessMap = source.roughnessMap;
+		this.metalnessMap = source.metalnessMap;
 
-	this.metalnessMap = source.metalnessMap;
+		this.alphaMap = source.alphaMap;
 
-	this.alphaMap = source.alphaMap;
+		this.envMap = source.envMap;
+		this.envMapIntensity = source.envMapIntensity;
 
-	this.envMap = source.envMap;
-	this.envMapIntensity = source.envMapIntensity;
+		this.refractionRatio = source.refractionRatio;
 
-	this.refractionRatio = source.refractionRatio;
+		this.wireframe = source.wireframe;
+		this.wireframeLinewidth = source.wireframeLinewidth;
+		this.wireframeLinecap = source.wireframeLinecap;
+		this.wireframeLinejoin = source.wireframeLinejoin;
 
-	this.wireframe = source.wireframe;
-	this.wireframeLinewidth = source.wireframeLinewidth;
-	this.wireframeLinecap = source.wireframeLinecap;
-	this.wireframeLinejoin = source.wireframeLinejoin;
+		this.skinning = source.skinning;
+		this.morphTargets = source.morphTargets;
+		this.morphNormals = source.morphNormals;
 
-	this.skinning = source.skinning;
-	this.morphTargets = source.morphTargets;
-	this.morphNormals = source.morphNormals;
+		this.flatShading = source.flatShading;
 
-	this.flatShading = source.flatShading;
+		this.vertexTangents = source.vertexTangents;
 
-	this.vertexTangents = source.vertexTangents;
+		return this;
 
-	return this;
+	}
 
-};
+}
 
+MeshStandardMaterial.prototype.isMeshStandardMaterial = true;
 
 export { MeshStandardMaterial };

src/materials/ShaderMaterial.js

@@ -23,191 +23,191 @@ import default_fragment from '../renderers/shaders/ShaderChunk/default_fragment.
  * }
  */
 
-function ShaderMaterial( parameters ) {
+class ShaderMaterial extends Material {
 
-	Material.call( this );
+	constructor( parameters ) {
 
-	this.type = 'ShaderMaterial';
+		super();
 
-	this.defines = {};
-	this.uniforms = {};
+		this.type = 'ShaderMaterial';
 
-	this.vertexShader = default_vertex;
-	this.fragmentShader = default_fragment;
+		this.defines = {};
+		this.uniforms = {};
 
-	this.linewidth = 1;
+		this.vertexShader = default_vertex;
+		this.fragmentShader = default_fragment;
 
-	this.wireframe = false;
-	this.wireframeLinewidth = 1;
+		this.linewidth = 1;
 
-	this.fog = false; // set to use scene fog
-	this.lights = false; // set to use scene lights
-	this.clipping = false; // set to use user-defined clipping planes
+		this.wireframe = false;
+		this.wireframeLinewidth = 1;
 
-	this.skinning = false; // set to use skinning attribute streams
-	this.morphTargets = false; // set to use morph targets
-	this.morphNormals = false; // set to use morph normals
+		this.fog = false; // set to use scene fog
+		this.lights = false; // set to use scene lights
+		this.clipping = false; // set to use user-defined clipping planes
 
-	this.extensions = {
-		derivatives: false, // set to use derivatives
-		fragDepth: false, // set to use fragment depth values
-		drawBuffers: false, // set to use draw buffers
-		shaderTextureLOD: false // set to use shader texture LOD
-	};
+		this.skinning = false; // set to use skinning attribute streams
+		this.morphTargets = false; // set to use morph targets
+		this.morphNormals = false; // set to use morph normals
 
-	// When rendered geometry doesn't include these attributes but the material does,
-	// use these default values in WebGL. This avoids errors when buffer data is missing.
-	this.defaultAttributeValues = {
-		'color': [ 1, 1, 1 ],
-		'uv': [ 0, 0 ],
-		'uv2': [ 0, 0 ]
-	};
+		this.extensions = {
+			derivatives: false, // set to use derivatives
+			fragDepth: false, // set to use fragment depth values
+			drawBuffers: false, // set to use draw buffers
+			shaderTextureLOD: false // set to use shader texture LOD
+		};
 
-	this.index0AttributeName = undefined;
-	this.uniformsNeedUpdate = false;
+		// When rendered geometry doesn't include these attributes but the material does,
+		// use these default values in WebGL. This avoids errors when buffer data is missing.
+		this.defaultAttributeValues = {
+			'color': [ 1, 1, 1 ],
+			'uv': [ 0, 0 ],
+			'uv2': [ 0, 0 ]
+		};
 
-	this.glslVersion = null;
+		this.index0AttributeName = undefined;
+		this.uniformsNeedUpdate = false;
 
-	if ( parameters !== undefined ) {
+		this.glslVersion = null;
 
-		if ( parameters.attributes !== undefined ) {
+		if ( parameters !== undefined ) {
 
-			console.error( 'THREE.ShaderMaterial: attributes should now be defined in THREE.BufferGeometry instead.' );
+			if ( parameters.attributes !== undefined ) {
 
-		}
+				console.error( 'THREE.ShaderMaterial: attributes should now be defined in THREE.BufferGeometry instead.' );
 
-		this.setValues( parameters );
+			}
 
-	}
+			this.setValues( parameters );
 
-}
+		}
 
-ShaderMaterial.prototype = Object.create( Material.prototype );
-ShaderMaterial.prototype.constructor = ShaderMaterial;
+	}
 
-ShaderMaterial.prototype.isShaderMaterial = true;
+	copy( source ) {
 
-ShaderMaterial.prototype.copy = function ( source ) {
+		super.copy( source );
 
-	Material.prototype.copy.call( this, source );
+		this.fragmentShader = source.fragmentShader;
+		this.vertexShader = source.vertexShader;
 
-	this.fragmentShader = source.fragmentShader;
-	this.vertexShader = source.vertexShader;
+		this.uniforms = cloneUniforms( source.uniforms );
 
-	this.uniforms = cloneUniforms( source.uniforms );
+		this.defines = Object.assign( {}, source.defines );
 
-	this.defines = Object.assign( {}, source.defines );
+		this.wireframe = source.wireframe;
+		this.wireframeLinewidth = source.wireframeLinewidth;
 
-	this.wireframe = source.wireframe;
-	this.wireframeLinewidth = source.wireframeLinewidth;
+		this.lights = source.lights;
+		this.clipping = source.clipping;
 
-	this.lights = source.lights;
-	this.clipping = source.clipping;
+		this.skinning = source.skinning;
 
-	this.skinning = source.skinning;
+		this.morphTargets = source.morphTargets;
+		this.morphNormals = source.morphNormals;
 
-	this.morphTargets = source.morphTargets;
-	this.morphNormals = source.morphNormals;
+		this.extensions = Object.assign( {}, source.extensions );
 
-	this.extensions = Object.assign( {}, source.extensions );
+		this.glslVersion = source.glslVersion;
 
-	this.glslVersion = source.glslVersion;
+		return this;
 
-	return this;
+	}
 
-};
+	toJSON( meta ) {
 
-ShaderMaterial.prototype.toJSON = function ( meta ) {
+		const data = super.toJSON( meta );
 
-	const data = Material.prototype.toJSON.call( this, meta );
+		data.glslVersion = this.glslVersion;
+		data.uniforms = {};
 
-	data.glslVersion = this.glslVersion;
-	data.uniforms = {};
+		for ( const name in this.uniforms ) {
 
-	for ( const name in this.uniforms ) {
+			const uniform = this.uniforms[ name ];
+			const value = uniform.value;
 
-		const uniform = this.uniforms[ name ];
-		const value = uniform.value;
+			if ( value && value.isTexture ) {
 
-		if ( value && value.isTexture ) {
+				data.uniforms[ name ] = {
+					type: 't',
+					value: value.toJSON( meta ).uuid
+				};
 
-			data.uniforms[ name ] = {
-				type: 't',
-				value: value.toJSON( meta ).uuid
-			};
+			} else if ( value && value.isColor ) {
 
-		} else if ( value && value.isColor ) {
+				data.uniforms[ name ] = {
+					type: 'c',
+					value: value.getHex()
+				};
 
-			data.uniforms[ name ] = {
-				type: 'c',
-				value: value.getHex()
-			};
+			} else if ( value && value.isVector2 ) {
 
-		} else if ( value && value.isVector2 ) {
+				data.uniforms[ name ] = {
+					type: 'v2',
+					value: value.toArray()
+				};
 
-			data.uniforms[ name ] = {
-				type: 'v2',
-				value: value.toArray()
-			};
+			} else if ( value && value.isVector3 ) {
 
-		} else if ( value && value.isVector3 ) {
+				data.uniforms[ name ] = {
+					type: 'v3',
+					value: value.toArray()
+				};
 
-			data.uniforms[ name ] = {
-				type: 'v3',
-				value: value.toArray()
-			};
+			} else if ( value && value.isVector4 ) {
 
-		} else if ( value && value.isVector4 ) {
+				data.uniforms[ name ] = {
+					type: 'v4',
+					value: value.toArray()
+				};
 
-			data.uniforms[ name ] = {
-				type: 'v4',
-				value: value.toArray()
-			};
+			} else if ( value && value.isMatrix3 ) {
 
-		} else if ( value && value.isMatrix3 ) {
+				data.uniforms[ name ] = {
+					type: 'm3',
+					value: value.toArray()
+				};
 
-			data.uniforms[ name ] = {
-				type: 'm3',
-				value: value.toArray()
-			};
+			} else if ( value && value.isMatrix4 ) {
 
-		} else if ( value && value.isMatrix4 ) {
+				data.uniforms[ name ] = {
+					type: 'm4',
+					value: value.toArray()
+				};
 
-			data.uniforms[ name ] = {
-				type: 'm4',
-				value: value.toArray()
-			};
+			} else {
 
-		} else {
+				data.uniforms[ name ] = {
+					value: value
+				};
 
-			data.uniforms[ name ] = {
-				value: value
-			};
+				// note: the array variants v2v, v3v, v4v, m4v and tv are not supported so far
 
-			// note: the array variants v2v, v3v, v4v, m4v and tv are not supported so far
+			}
 
 		}
 
-	}
+		if ( Object.keys( this.defines ).length > 0 ) data.defines = this.defines;
 
-	if ( Object.keys( this.defines ).length > 0 ) data.defines = this.defines;
+		data.vertexShader = this.vertexShader;
+		data.fragmentShader = this.fragmentShader;
 
-	data.vertexShader = this.vertexShader;
-	data.fragmentShader = this.fragmentShader;
+		const extensions = {};
 
-	const extensions = {};
+		for ( const key in this.extensions ) {
 
-	for ( const key in this.extensions ) {
+			if ( this.extensions[ key ] === true ) extensions[ key ] = true;
 
-		if ( this.extensions[ key ] === true ) extensions[ key ] = true;
+		}
 
-	}
+		if ( Object.keys( extensions ).length > 0 ) data.extensions = extensions;
 
-	if ( Object.keys( extensions ).length > 0 ) data.extensions = extensions;
+		return data;
 
-	return data;
+	}
 
-};
+}
 
+ShaderMaterial.prototype.isShaderMaterial = true;
 
 export { ShaderMaterial };