fix TextureCubeNode and new features

examples/js/nodes/accessors/ReflectNode.js

@@ -15,6 +15,7 @@ function ReflectNode( scope ) {
 ReflectNode.CUBE = 'cube';
 ReflectNode.SPHERE = 'sphere';
 ReflectNode.VECTOR = 'vector';
+ReflectNode.VECTOR2 = 'vector2';
 
 ReflectNode.prototype = Object.create( TempNode.prototype );
 ReflectNode.prototype.constructor = ReflectNode;
@@ -50,6 +51,14 @@ ReflectNode.prototype.generate = function ( builder, output ) {
 
 				break;
 
+			case ReflectNode.VECTOR2:
+
+				builder.addNodeCode( 'vec3 reflectVec2 = vec3( inverseTransformDirection( geometry.normal, viewMatrix ).x, inverseTransformDirection( geometry.normal, viewMatrix ).yz );' );
+
+				result = 'reflectVec2';
+
+				break;
+
 			case ReflectNode.CUBE:
 
 				var reflectVec = new ReflectNode( ReflectNode.VECTOR ).build( builder, 'v3' );

examples/js/nodes/core/Node.js

@@ -54,6 +54,7 @@ Node.prototype = {
 		var data = { result: this.build( builder.addFlow( settings.slot, settings.cache, settings.context ), output ) };
 
 		data.code = builder.clearNodeCode();
+		data.extra = builder.context.extra;
 
 		builder.removeFlow();
 

examples/js/nodes/core/NodeBuilder.js

@@ -13,6 +13,8 @@ import { Vector3Node } from '../inputs/Vector3Node.js';
 import { Vector4Node } from '../inputs/Vector4Node.js';
 import { TextureNode } from '../inputs/TextureNode.js';
 import { CubeTextureNode } from '../inputs/CubeTextureNode.js';
+import { TextureCubeNode } from '../misc/TextureCubeNode.js';
+
 
 var elements = NodeUtils.elements,
 	constructors = [ 'float', 'vec2', 'vec3', 'vec4' ],
@@ -278,6 +280,8 @@ NodeBuilder.prototype = {
 	addContext: function ( context ) {
 
 		this.context = Object.assign( {}, this.context, context );
+		this.context.extra = this.context.extra || {};
+
 		this.contexts.push( this.context );
 
 		return this;

examples/js/nodes/materials/nodes/StandardNode.js

@@ -370,6 +370,12 @@ StandardNode.prototype.build = function ( builder ) {
 
 			output.push( "radiance += " + environment.result + ";" );
 
+			if ( environment.extra.irradiance ) {
+
+				output.push( "irradiance += " + environment.extra.irradiance + ";" );
+
+			}
+
 		}
 
 		output.push(

examples/js/nodes/misc/TextureCubeNode.js

@@ -3,15 +3,20 @@
  */
 
 import { TempNode } from '../core/TempNode.js';
+import { FloatNode } from '../inputs/FloatNode.js';
+import { ExpressionNode } from '../core/ExpressionNode.js';
 import { TextureCubeUVNode } from './TextureCubeUVNode.js';
+import { ReflectNode } from '../accessors/ReflectNode.js';
 import { ColorSpaceNode } from '../utils/ColorSpaceNode.js';
 
-function TextureCubeNode( value, uv ) {
+function TextureCubeNode( value ) {
 
 	TempNode.call( this, 'v4' );
 
 	this.value = value;
-	this.uv = uv || new TextureCubeUVNode();
+
+	this.radianceCache = { uv: new TextureCubeUVNode() };
+	this.irradianceCache = { uv: new TextureCubeUVNode( new ReflectNode( ReflectNode.VECTOR2 ), undefined, new FloatNode( 1 ).setReadonly( true ) ) };
 
 }
 
@@ -19,30 +24,50 @@ TextureCubeNode.prototype = Object.create( TempNode.prototype );
 TextureCubeNode.prototype.constructor = TextureCubeNode;
 TextureCubeNode.prototype.nodeType = "TextureCube";
 
-TextureCubeNode.prototype.generate = function ( builder, output ) {
+TextureCubeNode.prototype.generateTextureCubeUV = function ( builder, cache, t ) {
 
-	if ( builder.isShader( 'fragment' ) ) {
+	var uv_10 = cache.uv.build( builder ) + '.uv_10',
+		uv_20 = cache.uv.build( builder ) + '.uv_20',
+		t = cache.uv.build( builder ) + '.t';
+
+	var color10 = 'texture2D( ' + this.value.build( builder, 'sampler2D' ) + ', ' + uv_10 + ' )',
+		color20 = 'texture2D( ' + this.value.build( builder, 'sampler2D' ) + ', ' + uv_20 + ' )';
+
+	// add a custom context for fix incompatibility with the core
+	// include ColorSpace function only if is a vertex shader
+	// for optimization this should be removed in the future
+	var context = { include: builder.isShader( 'vertex' ) };
+
+	builder.addContext( context );
+
+	cache.colorSpace10 = cache.colorSpace10 || new ColorSpaceNode( new ExpressionNode('', this.type ) );
+	cache.colorSpace10.input.eval( color10 );
+	cache.colorSpace10.fromDecoding( builder.getTextureEncodingFromMap( this.value.value ) );
+	color10 = cache.colorSpace10.build( builder, this.type );
+
+	cache.colorSpace20 = cache.colorSpace20 || new ColorSpaceNode( new ExpressionNode('', this.type ) );
+	cache.colorSpace20.input.eval( color20 );
+	cache.colorSpace20.fromDecoding( builder.getTextureEncodingFromMap( this.value.value ) );
+	color20 = cache.colorSpace20.build( builder, this.type );
 
-		var uv_10 = this.uv.build( builder ) + '.uv_10',
-			uv_20 = this.uv.build( builder ) + '.uv_20',
-			t = this.uv.build( builder ) + '.t';
+	builder.removeContext();
 
-		var texture = this.value && this.value.value;
-		var format = texture && texture.encoding || THREE.LinearEncoding;
-		var decoding = ColorSpaceNode.prototype.getDecodingMethod(format);
-		function decode(input) {
-			return decoding[0] + '( ' + input +
-				(decoding[1] !== undefined ? ', ' + decoding[1] : '') +
-				' )';
-		}
+	// end custom context
 
-		var color10 = 'texture2D( ' + this.value.build( builder, 'sampler2D' ) + ', ' + uv_10 + ' )';
-		color10 = decode(color10);
+	return 'mix( ' + color10 + ', ' + color20 + ', ' + t + ' ).rgb';
 
-		var color20 = 'texture2D( ' + this.value.build( builder, 'sampler2D' ) + ', ' + uv_20 + ' )';
-		color20 = decode(color20);
+};
+
+TextureCubeNode.prototype.generate = function ( builder, output ) {
+
+	if ( builder.isShader( 'fragment' ) ) {
+
+		var radiance = this.generateTextureCubeUV( builder, this.radianceCache );
+		var irradiance = this.generateTextureCubeUV( builder, this.irradianceCache );
 
-		return builder.format( 'vec4( mix( ' + color10 + ', ' + color20 + ', ' + t + ' ).rgb, 1.0 )', this.getType( builder ), output );
+		builder.context.extra.irradiance = '( PI * ' + irradiance + ' )';
+
+		return builder.format( 'vec4( ' + radiance + ', 1.0 )', this.getType( builder ), output );
 
 	} else {
 
@@ -62,11 +87,7 @@ TextureCubeNode.prototype.toJSON = function ( meta ) {
 
 		data = this.createJSONNode( meta );
 
-		data.uv = this.uv.toJSON( meta ).uuid;
-		data.textureSize = this.textureSize.toJSON( meta ).uuid;
-		data.blinnExponentToRoughness = this.blinnExponentToRoughness.toJSON( meta ).uuid;
-
-		if ( this.roughness ) data.roughness = this.roughness.toJSON( meta ).uuid;
+		data.value = this.value.toJSON( meta ).uuid;
 
 	}
 

examples/js/nodes/utils/ColorSpaceNode.js

@@ -4,7 +4,9 @@
 
 import { TempNode } from '../core/TempNode.js';
 import { ConstNode } from '../core/ConstNode.js';
+import { FloatNode } from '../inputs/FloatNode.js';
 import { FunctionNode } from '../core/FunctionNode.js';
+import { ExpressionNode } from '../core/ExpressionNode.js';
 
 function ColorSpaceNode( input, method ) {
 
@@ -12,7 +14,7 @@ function ColorSpaceNode( input, method ) {
 
 	this.input = input;
 
-	this.method = method || ColorSpaceNode.LINEAR;
+	this.method = method || ColorSpaceNode.LINEAR_TO_LINEAR;
 
 }
 
@@ -203,15 +205,15 @@ ColorSpaceNode.LOG_LUV_TO_LINEAR = 'LogLuvToLinear';
 
 ColorSpaceNode.prototype = Object.create( TempNode.prototype );
 ColorSpaceNode.prototype.constructor = ColorSpaceNode;
-ColorSpaceNode.prototype.nodeType = "ColorAdjustment";
+ColorSpaceNode.prototype.nodeType = "ColorSpace";
 
 ColorSpaceNode.prototype.generate = function ( builder, output ) {
 
-	var input = builder.context.input || this.input.build( builder, 'v4' ),
-		encodingMethod = builder.context.encoding !== undefined ? this.getEncodingMethod( builder.context.encoding ) : [ this.method ],
-		factor = this.factor ? this.factor.build( builder, 'f' ) : encodingMethod[ 1 ];
+	var input = this.input.build( builder, 'v4' );
+	var method = [ this.method ];
+	var factor = this.factor ? this.factor.build( builder, 'f' ) : method[ 1 ];
 
-	var method = builder.include( ColorSpaceNode.Nodes[ encodingMethod[ 0 ] ] );
+	method = builder.include( ColorSpaceNode.Nodes[ method[ 0 ] ] );
 
 	if ( factor ) {
 
@@ -225,17 +227,7 @@ ColorSpaceNode.prototype.generate = function ( builder, output ) {
 
 };
 
-ColorSpaceNode.prototype.getDecodingMethod = function ( encoding ) {
-
-	var components = this.getEncodingComponents( encoding );
-
-	components[ 0 ] += 'ToLinear';
-
-	return components;
-
-};
-
-ColorSpaceNode.prototype.getEncodingMethod = function ( encoding ) {
+ColorSpaceNode.getEncodingMethodFromEncoding = function ( encoding ) {
 
 	var components = this.getEncodingComponents( encoding );
 
@@ -245,7 +237,7 @@ ColorSpaceNode.prototype.getEncodingMethod = function ( encoding ) {
 
 };
 
-ColorSpaceNode.prototype.getEncodingComponents = function ( encoding ) {
+ColorSpaceNode.getEncodingComponents = function ( encoding ) {
 
 	switch ( encoding ) {
 
@@ -256,18 +248,29 @@ ColorSpaceNode.prototype.getEncodingComponents = function ( encoding ) {
 		case THREE.RGBEEncoding:
 			return [ 'RGBE' ];
 		case THREE.RGBM7Encoding:
-			return [ 'RGBM', '7.0' ];
+			return [ 'RGBM', new FloatNode( 7.0 ).setReadonly( true ) ];
 		case THREE.RGBM16Encoding:
-			return [ 'RGBM', '16.0' ];
+			return [ 'RGBM', new FloatNode( 16.0 ).setReadonly( true ) ];
 		case THREE.RGBDEncoding:
-			return [ 'RGBD', '256.0' ];
+			return [ 'RGBD', new FloatNode( 256.0 ).setReadonly( true ) ];
 		case THREE.GammaEncoding:
-			return [ 'Gamma', 'float( GAMMA_FACTOR )' ];
+			return [ 'Gamma', new ExpressionNode( 'float( GAMMA_FACTOR )' ) ];
 
 	}
 
 };
 
+ColorSpaceNode.prototype.fromDecoding = function ( encoding ) {
+
+	var components = ColorSpaceNode.getEncodingComponents( encoding );
+
+	components[ 0 ] += 'ToLinear';
+
+	this.method = components[ 0 ];
+	this.factor = components[ 1 ];
+
+};
+
 ColorSpaceNode.prototype.copy = function ( source ) {
 
 	TempNode.prototype.copy.call( this, source );

examples/webgl_materials_envmaps_node.html → examples/webgl_materials_envmaps_nodes.html

@@ -69,8 +69,7 @@
 
 			var container, stats;
 			var camera, scene, renderer, controls;
-			var torusMesh, planeMesh;
-			var nodeMaterial;
+			var torusMesh, torusMeshNode, planeMesh;
 			var ldrCubeRenderTarget, hdrCubeRenderTarget, rgbmCubeRenderTarget;
 			var ldrCubeMap, hdrCubeMap, rgbmCubeMap;
 
@@ -94,31 +93,27 @@
 				//
 
 				var geometry = new THREE.TorusKnotBufferGeometry( 18, 8, 150, 20 );
-				//geometry = new THREE.SphereBufferGeometry(20, 100, 100);
-				var material = new THREE.MeshStandardMaterial( {
-					color: 0xffffff,
-					metalness: params.metalness,
-					roughness: params.roughness
-				} );
+				var material;
+
+				material = new THREE.MeshStandardMaterial();
+				material.color = new THREE.Color( 0xffffff );
+				material.roughness = params.metalness;
+				material.metalness = params.roguhness;
 
 				torusMesh = new THREE.Mesh( geometry, material );
 				torusMesh.position.y = 35;
 				scene.add( torusMesh );
 
-				nodeMaterial = new THREE.StandardNodeMaterial();
-				nodeMaterial.color = new THREE.ColorNode(new THREE.Color(1, 1, 1))
-				nodeMaterial.roughness = new THREE.FloatNode(params.metalness);
-				nodeMaterial.metalness = new THREE.FloatNode(params.roguhness);
+				material = new THREE.MeshStandardNodeMaterial();
+				material.color = new THREE.Color( 0xffffff );
+				material.roughness = params.metalness;
+				material.metalness = params.roguhness;
 
-				var torusMeshNode = new THREE.Mesh( geometry, nodeMaterial );
+				torusMeshNode = new THREE.Mesh( geometry, material );
 				torusMeshNode.position.y = -35;
 				scene.add( torusMeshNode );
 
-
-				var geometry = new THREE.PlaneBufferGeometry( 200, 200 );
-				var material = new THREE.MeshBasicMaterial();
-
-				planeMesh = new THREE.Mesh( geometry, material );
+				planeMesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 200, 200 ), new THREE.MeshBasicMaterial() );
 				planeMesh.position.y = - 50;
 				planeMesh.rotation.x = - Math.PI * 0.5;
 				scene.add( planeMesh );
@@ -244,8 +239,8 @@
 				torusMesh.material.roughness = params.roughness;
 				torusMesh.material.metalness = params.metalness;
 
-				nodeMaterial.roughness.value = params.roughness;
-				nodeMaterial.metalness.value = params.metalness;
+				torusMeshNode.material.roughness = params.roughness;
+				torusMeshNode.material.metalness = params.metalness;
 
 				var renderTarget, cubeMap;
 
@@ -272,29 +267,12 @@
 					torusMesh.material.envMap = newEnvMap;
 					torusMesh.material.needsUpdate = true;
 
+					torusMeshNode.material.envMap = newEnvMap;
+					torusMeshNode.material.needsUpdate = true;
+
 					planeMesh.material.map = newEnvMap;
 					planeMesh.material.needsUpdate = true;
 
-					var textureNode = new THREE.TextureNode(newEnvMap);
-					textureNode.encodingOverride = newEnvMap.encoding;
-
-					nodeMaterial.environment = new THREE.TextureCubeNode(
-						textureNode
-					);
-					nodeMaterial.environment.uv.blinnExponentToRoughness = nodeMaterial.roughness;
-
-					nodeMaterial.ambient = new THREE.TextureCubeNode(
-						textureNode
-					);
-					nodeMaterial.ambient.uv.blinnExponentToRoughness = new THREE.FloatNode(1);
-					nodeMaterial.ambient.uv.uv = new THREE.NormalNode(THREE.NormalNode.WORLD);
-					nodeMaterial.ambient = new THREE.OperatorNode(
-						nodeMaterial.ambient,
-						new THREE.FloatNode(Math.PI),
-						THREE.OperatorNode.MUL);
-
-					nodeMaterial.needsUpdate = true;
-
 				}
 
 				//torusMesh.rotation.y += 0.005;