super-three 0.160.1 → 0.161.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (145) hide show
  1. package/LICENSE +1 -1
  2. package/build/three.cjs +379 -108
  3. package/build/three.module.js +380 -108
  4. package/build/three.module.min.js +1 -1
  5. package/examples/jsm/Addons.js +5 -1
  6. package/examples/jsm/capabilities/WebGPU.js +13 -9
  7. package/examples/jsm/controls/OrbitControls.js +102 -13
  8. package/examples/jsm/curves/NURBSUtils.js +59 -4
  9. package/examples/jsm/curves/NURBSVolume.js +62 -0
  10. package/examples/jsm/exporters/USDZExporter.js +8 -7
  11. package/examples/jsm/helpers/TextureHelper.js +3 -3
  12. package/examples/jsm/loaders/3DMLoader.js +44 -43
  13. package/examples/jsm/loaders/DDSLoader.js +1 -0
  14. package/examples/jsm/loaders/KTX2Loader.js +20 -5
  15. package/examples/jsm/loaders/LUT3dlLoader.js +78 -46
  16. package/examples/jsm/loaders/LUTCubeLoader.js +81 -67
  17. package/examples/jsm/loaders/LUTImageLoader.js +3 -2
  18. package/examples/jsm/loaders/MaterialXLoader.js +115 -16
  19. package/examples/jsm/loaders/SVGLoader.js +4 -3
  20. package/examples/jsm/loaders/VRMLLoader.js +1 -1
  21. package/examples/jsm/materials/MeshPostProcessingMaterial.js +144 -0
  22. package/examples/jsm/misc/Timer.js +13 -4
  23. package/examples/jsm/nodes/Nodes.js +16 -5
  24. package/examples/jsm/nodes/accessors/BufferAttributeNode.js +5 -3
  25. package/examples/jsm/nodes/accessors/CameraNode.js +9 -4
  26. package/examples/jsm/nodes/accessors/CubeTextureNode.js +12 -1
  27. package/examples/jsm/nodes/accessors/StorageBufferNode.js +27 -0
  28. package/examples/jsm/nodes/accessors/TextureStoreNode.js +56 -3
  29. package/examples/jsm/nodes/accessors/VertexColorNode.js +70 -0
  30. package/examples/jsm/nodes/core/AttributeNode.js +1 -1
  31. package/examples/jsm/nodes/core/NodeBuilder.js +23 -18
  32. package/examples/jsm/nodes/core/NodeFrame.js +16 -8
  33. package/examples/jsm/nodes/core/constants.js +1 -0
  34. package/examples/jsm/nodes/display/AfterImageNode.js +148 -0
  35. package/examples/jsm/nodes/display/AnamorphicNode.js +148 -0
  36. package/examples/jsm/nodes/display/ColorAdjustmentNode.js +3 -0
  37. package/examples/jsm/nodes/display/GaussianBlurNode.js +33 -13
  38. package/examples/jsm/nodes/display/PassNode.js +3 -2
  39. package/examples/jsm/nodes/display/ToneMappingNode.js +46 -3
  40. package/examples/jsm/nodes/display/ViewportDepthTextureNode.js +1 -4
  41. package/examples/jsm/nodes/display/ViewportNode.js +0 -2
  42. package/examples/jsm/nodes/display/ViewportSharedTextureNode.js +4 -4
  43. package/examples/jsm/nodes/fog/FogNode.js +2 -1
  44. package/examples/jsm/nodes/lighting/AmbientLightNode.js +1 -1
  45. package/examples/jsm/nodes/lighting/AnalyticLightNode.js +13 -5
  46. package/examples/jsm/nodes/lighting/LightingContextNode.js +1 -1
  47. package/examples/jsm/nodes/lighting/LightsNode.js +1 -1
  48. package/examples/jsm/nodes/materials/Line2NodeMaterial.js +18 -30
  49. package/examples/jsm/nodes/materials/Materials.js +1 -0
  50. package/examples/jsm/nodes/materials/MeshSSSNodeMaterial.js +84 -0
  51. package/examples/jsm/nodes/materials/NodeMaterial.js +6 -4
  52. package/examples/jsm/nodes/materials/SpriteNodeMaterial.js +1 -7
  53. package/examples/jsm/nodes/math/MathNode.js +12 -2
  54. package/examples/jsm/nodes/math/MathUtils.js +15 -0
  55. package/examples/jsm/nodes/math/OperatorNode.js +13 -5
  56. package/examples/jsm/nodes/math/TriNoise3D.js +71 -0
  57. package/examples/jsm/nodes/shadernode/ShaderNode.js +10 -1
  58. package/examples/jsm/nodes/utils/ArrayElementNode.js +6 -0
  59. package/examples/jsm/nodes/utils/JoinNode.js +2 -2
  60. package/examples/jsm/nodes/utils/LoopNode.js +3 -3
  61. package/examples/jsm/nodes/utils/ReflectorNode.js +227 -0
  62. package/examples/jsm/nodes/utils/RotateNode.js +68 -0
  63. package/examples/jsm/nodes/utils/RotateUVNode.js +1 -9
  64. package/examples/jsm/nodes/utils/SplitNode.js +4 -4
  65. package/examples/jsm/objects/GroundedSkybox.js +50 -0
  66. package/examples/jsm/objects/QuadMesh.js +8 -2
  67. package/examples/jsm/objects/Water2.js +8 -8
  68. package/examples/jsm/postprocessing/GTAOPass.js +11 -1
  69. package/examples/jsm/renderers/common/Backend.js +14 -0
  70. package/examples/jsm/renderers/common/Bindings.js +1 -1
  71. package/examples/jsm/renderers/common/DataMap.js +1 -1
  72. package/examples/jsm/renderers/common/Info.js +25 -1
  73. package/examples/jsm/renderers/common/Pipelines.js +8 -8
  74. package/examples/jsm/renderers/common/PostProcessing.js +2 -2
  75. package/examples/jsm/renderers/common/ProgrammableStage.js +3 -1
  76. package/examples/jsm/renderers/common/RenderObject.js +2 -0
  77. package/examples/jsm/renderers/common/Renderer.js +238 -22
  78. package/examples/jsm/renderers/common/StorageBufferAttribute.js +17 -0
  79. package/examples/jsm/renderers/common/Textures.js +25 -5
  80. package/examples/jsm/renderers/common/nodes/NodeBuilderState.js +2 -1
  81. package/examples/jsm/renderers/common/nodes/Nodes.js +4 -2
  82. package/examples/jsm/renderers/webgl/WebGLBackend.js +631 -270
  83. package/examples/jsm/renderers/webgl/nodes/GLSLNodeBuilder.js +37 -30
  84. package/examples/jsm/renderers/webgl/utils/WebGLAttributeUtils.js +89 -8
  85. package/examples/jsm/renderers/webgl/utils/WebGLConstants.js +11 -0
  86. package/examples/jsm/renderers/webgl/utils/WebGLState.js +197 -0
  87. package/examples/jsm/renderers/webgl/utils/WebGLTextureUtils.js +377 -11
  88. package/examples/jsm/renderers/webgl/utils/WebGLUtils.js +2 -2
  89. package/examples/jsm/renderers/webgl-legacy/nodes/GLSL1NodeBuilder.js +1 -21
  90. package/examples/jsm/renderers/webgl-legacy/nodes/WebGLNodeBuilder.js +2 -2
  91. package/examples/jsm/renderers/webgpu/WebGPUBackend.js +289 -102
  92. package/examples/jsm/renderers/webgpu/WebGPURenderer.js +7 -2
  93. package/examples/jsm/renderers/webgpu/nodes/WGSLNodeBuilder.js +56 -39
  94. package/examples/jsm/renderers/webgpu/utils/WebGPUAttributeUtils.js +9 -1
  95. package/examples/jsm/renderers/webgpu/utils/WebGPUPipelineUtils.js +38 -4
  96. package/examples/jsm/renderers/webgpu/utils/WebGPUTextureUtils.js +85 -12
  97. package/examples/jsm/transpiler/AST.js +1 -1
  98. package/examples/jsm/transpiler/GLSLDecoder.js +1 -1
  99. package/examples/jsm/transpiler/ShaderToyDecoder.js +1 -1
  100. package/examples/jsm/transpiler/TSLEncoder.js +1 -1
  101. package/examples/jsm/utils/BufferGeometryUtils.js +23 -27
  102. package/examples/jsm/utils/SortUtils.js +2 -0
  103. package/examples/jsm/webxr/ARButton.js +12 -2
  104. package/examples/jsm/webxr/VRButton.js +12 -2
  105. package/examples/jsm/webxr/XRButton.js +12 -2
  106. package/examples/jsm/webxr/XRControllerModelFactory.js +6 -1
  107. package/examples/jsm/webxr/XRHandMeshModel.js +3 -1
  108. package/package.json +2 -2
  109. package/src/audio/Audio.js +1 -3
  110. package/src/cameras/PerspectiveCamera.js +35 -0
  111. package/src/constants.js +1 -2
  112. package/src/core/BufferAttribute.js +2 -1
  113. package/src/core/InterleavedBuffer.js +2 -1
  114. package/src/core/InterleavedBufferAttribute.js +20 -0
  115. package/src/materials/ShaderMaterial.js +2 -1
  116. package/src/math/Triangle.js +0 -30
  117. package/src/objects/BatchedMesh.js +6 -7
  118. package/src/objects/SkinnedMesh.js +0 -8
  119. package/src/renderers/WebGLRenderer.js +5 -1
  120. package/src/renderers/shaders/ShaderChunk/alphatest_fragment.glsl.js +9 -0
  121. package/src/renderers/shaders/ShaderChunk/clipping_planes_fragment.glsl.js +56 -11
  122. package/src/renderers/shaders/ShaderChunk/tonemapping_pars_fragment.glsl.js +15 -7
  123. package/src/renderers/shaders/ShaderLib/depth.glsl.js +1 -2
  124. package/src/renderers/shaders/ShaderLib/distanceRGBA.glsl.js +1 -2
  125. package/src/renderers/shaders/ShaderLib/linedashed.glsl.js +1 -1
  126. package/src/renderers/shaders/ShaderLib/meshbasic.glsl.js +1 -2
  127. package/src/renderers/shaders/ShaderLib/meshlambert.glsl.js +1 -1
  128. package/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js +1 -2
  129. package/src/renderers/shaders/ShaderLib/meshnormal.glsl.js +3 -1
  130. package/src/renderers/shaders/ShaderLib/meshphong.glsl.js +1 -1
  131. package/src/renderers/shaders/ShaderLib/meshphysical.glsl.js +1 -1
  132. package/src/renderers/shaders/ShaderLib/meshtoon.glsl.js +1 -1
  133. package/src/renderers/shaders/ShaderLib/points.glsl.js +1 -1
  134. package/src/renderers/shaders/ShaderLib/sprite.glsl.js +1 -1
  135. package/src/renderers/webgl/WebGLAttributes.js +2 -2
  136. package/src/renderers/webgl/WebGLCubeMaps.js +1 -1
  137. package/src/renderers/webgl/WebGLProgram.js +30 -3
  138. package/src/renderers/webgl/WebGLPrograms.js +19 -11
  139. package/src/renderers/webgl/WebGLTextures.js +90 -16
  140. package/src/renderers/webxr/WebXRDepthSensing.js +105 -0
  141. package/src/renderers/webxr/WebXRManager.js +46 -0
  142. package/src/textures/Source.js +1 -0
  143. package/build/three.js +0 -54519
  144. package/build/three.min.js +0 -7
  145. package/examples/jsm/objects/GroundProjectedSkybox.js +0 -172
@@ -53,9 +53,11 @@ class NodeFrame {
53
53
 
54
54
  if ( frameMap.get( node ) !== this.frameId ) {
55
55
 
56
- frameMap.set( node, this.frameId );
56
+ if ( node.updateBefore( this ) !== false ) {
57
57
 
58
- node.updateBefore( this );
58
+ frameMap.set( node, this.frameId );
59
+
60
+ }
59
61
 
60
62
  }
61
63
 
@@ -65,9 +67,11 @@ class NodeFrame {
65
67
 
66
68
  if ( renderMap.get( node ) !== this.renderId ) {
67
69
 
68
- renderMap.set( node, this.renderId );
70
+ if ( node.updateBefore( this ) !== false ) {
71
+
72
+ renderMap.set( node, this.renderId );
69
73
 
70
- node.updateBefore( this );
74
+ }
71
75
 
72
76
  }
73
77
 
@@ -90,9 +94,11 @@ class NodeFrame {
90
94
 
91
95
  if ( frameMap.get( node ) !== this.frameId ) {
92
96
 
93
- frameMap.set( node, this.frameId );
97
+ if ( node.update( this ) !== false ) {
94
98
 
95
- node.update( this );
99
+ frameMap.set( node, this.frameId );
100
+
101
+ }
96
102
 
97
103
  }
98
104
 
@@ -102,9 +108,11 @@ class NodeFrame {
102
108
 
103
109
  if ( renderMap.get( node ) !== this.renderId ) {
104
110
 
105
- renderMap.set( node, this.renderId );
111
+ if ( node.update( this ) !== false ) {
112
+
113
+ renderMap.set( node, this.renderId );
106
114
 
107
- node.update( this );
115
+ }
108
116
 
109
117
  }
110
118
 
@@ -17,6 +17,7 @@ export const NodeType = {
17
17
  VECTOR2: 'vec2',
18
18
  VECTOR3: 'vec3',
19
19
  VECTOR4: 'vec4',
20
+ MATRIX2: 'mat2',
20
21
  MATRIX3: 'mat3',
21
22
  MATRIX4: 'mat4'
22
23
  };
@@ -0,0 +1,148 @@
1
+ import TempNode from '../core/TempNode.js';
2
+ import { nodeObject, addNodeElement, tslFn, float, vec4 } from '../shadernode/ShaderNode.js';
3
+ import { NodeUpdateType } from '../core/constants.js';
4
+ import { uv } from '../accessors/UVNode.js';
5
+ import { texture } from '../accessors/TextureNode.js';
6
+ import { texturePass } from './PassNode.js';
7
+ import { uniform } from '../core/UniformNode.js';
8
+ import { RenderTarget } from 'three';
9
+ import { sign, max } from '../math/MathNode.js';
10
+ import QuadMesh from '../../objects/QuadMesh.js';
11
+
12
+ const quadMeshComp = new QuadMesh();
13
+
14
+ class AfterImageNode extends TempNode {
15
+
16
+ constructor( textureNode, damp = 0.96 ) {
17
+
18
+ super( textureNode );
19
+
20
+ this.textureNode = textureNode;
21
+ this.textureNodeOld = texture();
22
+ this.damp = uniform( damp );
23
+
24
+ this._compRT = new RenderTarget();
25
+ this._compRT.texture.name = 'AfterImageNode.comp';
26
+
27
+ this._oldRT = new RenderTarget();
28
+ this._oldRT.texture.name = 'AfterImageNode.old';
29
+
30
+ this._textureNode = texturePass( this, this._compRT.texture );
31
+
32
+ this.updateBeforeType = NodeUpdateType.RENDER;
33
+
34
+ }
35
+
36
+ getTextureNode() {
37
+
38
+ return this._textureNode;
39
+
40
+ }
41
+
42
+ setSize( width, height ) {
43
+
44
+ this._compRT.setSize( width, height );
45
+ this._oldRT.setSize( width, height );
46
+
47
+ }
48
+
49
+ updateBefore( frame ) {
50
+
51
+ const { renderer } = frame;
52
+
53
+ const textureNode = this.textureNode;
54
+ const map = textureNode.value;
55
+
56
+ const textureType = map.type;
57
+
58
+ this._compRT.texture.type = textureType;
59
+ this._oldRT.texture.type = textureType;
60
+
61
+ const currentRenderTarget = renderer.getRenderTarget();
62
+ const currentTexture = textureNode.value;
63
+
64
+ this.textureNodeOld.value = this._oldRT.texture;
65
+
66
+ // comp
67
+ renderer.setRenderTarget( this._compRT );
68
+ quadMeshComp.render( renderer );
69
+
70
+ // Swap the textures
71
+ const temp = this._oldRT;
72
+ this._oldRT = this._compRT;
73
+ this._compRT = temp;
74
+
75
+ // set size before swapping fails
76
+ this.setSize( map.image.width, map.image.height );
77
+
78
+ renderer.setRenderTarget( currentRenderTarget );
79
+ textureNode.value = currentTexture;
80
+
81
+ }
82
+
83
+ setup( builder ) {
84
+
85
+ const textureNode = this.textureNode;
86
+ const textureNodeOld = this.textureNodeOld;
87
+
88
+ if ( textureNode.isTextureNode !== true ) {
89
+
90
+ console.error( 'AfterImageNode requires a TextureNode.' );
91
+
92
+ return vec4();
93
+
94
+ }
95
+
96
+ //
97
+
98
+ const uvNode = textureNode.uvNode || uv();
99
+
100
+ textureNodeOld.uvNode = uvNode;
101
+
102
+ const sampleTexture = ( uv ) => textureNode.cache().context( { getUV: () => uv, forceUVContext: true } );
103
+
104
+ const when_gt = tslFn( ( [ x_immutable, y_immutable ] ) => {
105
+
106
+ const y = float( y_immutable ).toVar();
107
+ const x = vec4( x_immutable ).toVar();
108
+
109
+ return max( sign( x.sub( y ) ), 0.0 );
110
+
111
+ } );
112
+
113
+ const afterImg = tslFn( () => {
114
+
115
+ const texelOld = vec4( textureNodeOld );
116
+ const texelNew = vec4( sampleTexture( uvNode ) );
117
+
118
+ texelOld.mulAssign( this.damp.mul( when_gt( texelOld, 0.1 ) ) );
119
+ return max( texelNew, texelOld );
120
+
121
+ } );
122
+
123
+ //
124
+
125
+ const materialComposed = this._materialComposed || ( this._materialComposed = builder.createNodeMaterial() );
126
+ materialComposed.fragmentNode = afterImg();
127
+
128
+ quadMeshComp.material = materialComposed;
129
+
130
+ //
131
+
132
+ const properties = builder.getNodeProperties( this );
133
+ properties.textureNode = textureNode;
134
+
135
+ //
136
+
137
+ return this._textureNode;
138
+
139
+ }
140
+
141
+ }
142
+
143
+ export const afterImage = ( node, damp ) => nodeObject( new AfterImageNode( nodeObject( node ), damp ) );
144
+
145
+ addNodeElement( 'afterImage', afterImage );
146
+
147
+ export default AfterImageNode;
148
+
@@ -0,0 +1,148 @@
1
+ import TempNode from '../core/TempNode.js';
2
+ import { nodeObject, addNodeElement, tslFn, float, vec2, vec3, vec4 } from '../shadernode/ShaderNode.js';
3
+ import { loop } from '../utils/LoopNode.js';
4
+ import { uniform } from '../core/UniformNode.js';
5
+ import { NodeUpdateType } from '../core/constants.js';
6
+ import { threshold } from './ColorAdjustmentNode.js';
7
+ import { uv } from '../accessors/UVNode.js';
8
+ import { texturePass } from './PassNode.js';
9
+ import { Vector2, RenderTarget } from 'three';
10
+ import QuadMesh from '../../objects/QuadMesh.js';
11
+
12
+ const quadMesh = new QuadMesh();
13
+
14
+ class AnamorphicNode extends TempNode {
15
+
16
+ constructor( textureNode, tresholdNode, scaleNode, samples ) {
17
+
18
+ super( 'vec4' );
19
+
20
+ this.textureNode = textureNode;
21
+ this.tresholdNode = tresholdNode;
22
+ this.scaleNode = scaleNode;
23
+ this.colorNode = vec3( 0.1, 0.0, 1.0 );
24
+ this.samples = samples;
25
+ this.resolution = new Vector2( 1, 1 );
26
+
27
+ this._renderTarget = new RenderTarget();
28
+ this._renderTarget.texture.name = 'anamorphic';
29
+
30
+ this._invSize = uniform( new Vector2() );
31
+
32
+ this._textureNode = texturePass( this, this._renderTarget.texture );
33
+
34
+ this.updateBeforeType = NodeUpdateType.RENDER;
35
+
36
+ }
37
+
38
+ getTextureNode() {
39
+
40
+ return this._textureNode;
41
+
42
+ }
43
+
44
+ setSize( width, height ) {
45
+
46
+ this._invSize.value.set( 1 / width, 1 / height );
47
+
48
+ width = Math.max( Math.round( width * this.resolution.x ), 1 );
49
+ height = Math.max( Math.round( height * this.resolution.y ), 1 );
50
+
51
+ this._renderTarget.setSize( width, height );
52
+
53
+ }
54
+
55
+ updateBefore( frame ) {
56
+
57
+ const { renderer } = frame;
58
+
59
+ const textureNode = this.textureNode;
60
+ const map = textureNode.value;
61
+
62
+ this._renderTarget.texture.type = map.type;
63
+
64
+ const currentRenderTarget = renderer.getRenderTarget();
65
+ const currentTexture = textureNode.value;
66
+
67
+ quadMesh.material = this._material;
68
+
69
+ this.setSize( map.image.width, map.image.height );
70
+
71
+ // render
72
+
73
+ renderer.setRenderTarget( this._renderTarget );
74
+
75
+ quadMesh.render( renderer );
76
+
77
+ // restore
78
+
79
+ renderer.setRenderTarget( currentRenderTarget );
80
+ textureNode.value = currentTexture;
81
+
82
+ }
83
+
84
+ setup( builder ) {
85
+
86
+ const textureNode = this.textureNode;
87
+
88
+ if ( textureNode.isTextureNode !== true ) {
89
+
90
+ console.error( 'AnamorphNode requires a TextureNode.' );
91
+
92
+ return vec4();
93
+
94
+ }
95
+
96
+ //
97
+
98
+ const uvNode = textureNode.uvNode || uv();
99
+
100
+ const sampleTexture = ( uv ) => textureNode.cache().context( { getUV: () => uv, forceUVContext: true } );
101
+
102
+ const anamorph = tslFn( () => {
103
+
104
+ const samples = this.samples;
105
+ const halfSamples = Math.floor( samples / 2 );
106
+
107
+ const total = vec3( 0 ).toVar();
108
+
109
+ loop( { start: - halfSamples, end: halfSamples }, ( { i } ) => {
110
+
111
+ const softness = float( i ).abs().div( halfSamples ).oneMinus();
112
+
113
+ const uv = vec2( uvNode.x.add( this._invSize.x.mul( i ).mul( this.scaleNode ) ), uvNode.y );
114
+ const color = sampleTexture( uv );
115
+ const pass = threshold( color, this.tresholdNode ).mul( softness );
116
+
117
+ total.addAssign( pass );
118
+
119
+ } );
120
+
121
+ return total.mul( this.colorNode );
122
+
123
+ } );
124
+
125
+ //
126
+
127
+ const material = this._material || ( this._material = builder.createNodeMaterial() );
128
+ material.fragmentNode = anamorph();
129
+
130
+ //
131
+
132
+ const properties = builder.getNodeProperties( this );
133
+ properties.textureNode = textureNode;
134
+
135
+ //
136
+
137
+ return this._textureNode;
138
+
139
+ }
140
+
141
+ }
142
+
143
+ export const anamorphic = ( node, threshold = .9, scale = 3, samples = 32 ) => nodeObject( new AnamorphicNode( nodeObject( node ), nodeObject( threshold ), nodeObject( scale ), samples ) );
144
+
145
+ addNodeElement( 'anamorphic', anamorphic );
146
+
147
+ export default AnamorphicNode;
148
+
@@ -89,8 +89,11 @@ export const hue = nodeProxy( ColorAdjustmentNode, ColorAdjustmentNode.HUE );
89
89
  export const lumaCoeffs = vec3( 0.2125, 0.7154, 0.0721 );
90
90
  export const luminance = ( color, luma = lumaCoeffs ) => dot( color, luma );
91
91
 
92
+ export const threshold = ( color, threshold ) => mix( vec3( 0.0 ), color, luminance( color ).sub( threshold ).max( 0 ) );
93
+
92
94
  addNodeElement( 'saturation', saturation );
93
95
  addNodeElement( 'vibrance', vibrance );
94
96
  addNodeElement( 'hue', hue );
97
+ addNodeElement( 'threshold', threshold );
95
98
 
96
99
  addNodeClass( 'ColorAdjustmentNode', ColorAdjustmentNode );
@@ -1,20 +1,24 @@
1
1
  import TempNode from '../core/TempNode.js';
2
- import { nodeObject, addNodeElement, tslFn, float, vec2, vec3, vec4 } from '../shadernode/ShaderNode.js';
2
+ import { nodeObject, addNodeElement, tslFn, float, vec2, vec4 } from '../shadernode/ShaderNode.js';
3
3
  import { NodeUpdateType } from '../core/constants.js';
4
4
  import { mul } from '../math/OperatorNode.js';
5
5
  import { uv } from '../accessors/UVNode.js';
6
- import { texture } from '../accessors/TextureNode.js';
6
+ import { texturePass } from './PassNode.js';
7
7
  import { uniform } from '../core/UniformNode.js';
8
8
  import { Vector2, RenderTarget } from 'three';
9
9
  import QuadMesh from '../../objects/QuadMesh.js';
10
10
 
11
- const quadMesh = new QuadMesh();
11
+ // WebGPU: The use of a single QuadMesh for both gaussian blur passes results in a single RenderObject with a SampledTexture binding that
12
+ // alternates between source textures and triggers creation of new BindGroups and BindGroupLayouts every frame.
13
+
14
+ const quadMesh1 = new QuadMesh();
15
+ const quadMesh2 = new QuadMesh();
12
16
 
13
17
  class GaussianBlurNode extends TempNode {
14
18
 
15
19
  constructor( textureNode, sigma = 2 ) {
16
20
 
17
- super( textureNode );
21
+ super( 'vec4' );
18
22
 
19
23
  this.textureNode = textureNode;
20
24
  this.sigma = sigma;
@@ -25,7 +29,11 @@ class GaussianBlurNode extends TempNode {
25
29
  this._passDirection = uniform( new Vector2() );
26
30
 
27
31
  this._horizontalRT = new RenderTarget();
32
+ this._horizontalRT.texture.name = 'GaussianBlurNode.horizontal';
28
33
  this._verticalRT = new RenderTarget();
34
+ this._verticalRT.texture.name = 'GaussianBlurNode.vertical';
35
+
36
+ this._textureNode = texturePass( this, this._verticalRT.texture );
29
37
 
30
38
  this.updateBeforeType = NodeUpdateType.RENDER;
31
39
 
@@ -54,17 +62,23 @@ class GaussianBlurNode extends TempNode {
54
62
  const currentRenderTarget = renderer.getRenderTarget();
55
63
  const currentTexture = textureNode.value;
56
64
 
57
- quadMesh.material = this._material;
65
+ quadMesh1.material = this._material;
66
+ quadMesh2.material = this._material;
58
67
 
59
68
  this.setSize( map.image.width, map.image.height );
60
69
 
70
+ const textureType = map.type;
71
+
72
+ this._horizontalRT.texture.type = textureType;
73
+ this._verticalRT.texture.type = textureType;
74
+
61
75
  // horizontal
62
76
 
63
77
  renderer.setRenderTarget( this._horizontalRT );
64
78
 
65
79
  this._passDirection.value.set( 1, 0 );
66
80
 
67
- quadMesh.render( renderer );
81
+ quadMesh1.render( renderer );
68
82
 
69
83
  // vertical
70
84
 
@@ -73,7 +87,7 @@ class GaussianBlurNode extends TempNode {
73
87
 
74
88
  this._passDirection.value.set( 0, 1 );
75
89
 
76
- quadMesh.render( renderer );
90
+ quadMesh2.render( renderer );
77
91
 
78
92
  // restore
79
93
 
@@ -82,6 +96,12 @@ class GaussianBlurNode extends TempNode {
82
96
 
83
97
  }
84
98
 
99
+ getTextureNode() {
100
+
101
+ return this._textureNode;
102
+
103
+ }
104
+
85
105
  setup( builder ) {
86
106
 
87
107
  const textureNode = this.textureNode;
@@ -109,7 +129,7 @@ class GaussianBlurNode extends TempNode {
109
129
  const direction = vec2( this.directionNode ).mul( this._passDirection );
110
130
 
111
131
  const weightSum = float( gaussianCoefficients[ 0 ] ).toVar();
112
- const diffuseSum = vec3( sampleTexture( uvNode ).mul( weightSum ) ).toVar();
132
+ const diffuseSum = vec4( sampleTexture( uvNode ).mul( weightSum ) ).toVar();
113
133
 
114
134
  for ( let i = 1; i < kernelSize; i ++ ) {
115
135
 
@@ -118,21 +138,21 @@ class GaussianBlurNode extends TempNode {
118
138
 
119
139
  const uvOffset = vec2( direction.mul( invSize.mul( x ) ) ).toVar();
120
140
 
121
- const sample1 = vec3( sampleTexture( uvNode.add( uvOffset ) ) );
122
- const sample2 = vec3( sampleTexture( uvNode.sub( uvOffset ) ) );
141
+ const sample1 = vec4( sampleTexture( uvNode.add( uvOffset ) ) );
142
+ const sample2 = vec4( sampleTexture( uvNode.sub( uvOffset ) ) );
123
143
 
124
144
  diffuseSum.addAssign( sample1.add( sample2 ).mul( w ) );
125
145
  weightSum.addAssign( mul( 2.0, w ) );
126
146
 
127
147
  }
128
148
 
129
- return vec4( diffuseSum.div( weightSum ), 1.0 );
149
+ return diffuseSum.div( weightSum );
130
150
 
131
151
  } );
132
152
 
133
153
  //
134
154
 
135
- const material = this._material || ( this._material = builder.createNodeMaterial( 'MeshBasicNodeMaterial' ) );
155
+ const material = this._material || ( this._material = builder.createNodeMaterial() );
136
156
  material.fragmentNode = blur();
137
157
 
138
158
  //
@@ -142,7 +162,7 @@ class GaussianBlurNode extends TempNode {
142
162
 
143
163
  //
144
164
 
145
- return texture( this._verticalRT.texture );
165
+ return this._textureNode;
146
166
 
147
167
  }
148
168
 
@@ -5,7 +5,7 @@ import { NodeUpdateType } from '../core/constants.js';
5
5
  import { nodeObject } from '../shadernode/ShaderNode.js';
6
6
  import { uniform } from '../core/UniformNode.js';
7
7
  import { viewZToOrthographicDepth, perspectiveDepthToViewZ } from './ViewportDepthNode.js';
8
- import { RenderTarget, Vector2, HalfFloatType, DepthTexture, FloatType, NoToneMapping } from 'three';
8
+ import { RenderTarget, Vector2, HalfFloatType, DepthTexture, NoToneMapping/*, FloatType*/ } from 'three';
9
9
 
10
10
  class PassTextureNode extends TextureNode {
11
11
 
@@ -51,7 +51,7 @@ class PassNode extends TempNode {
51
51
 
52
52
  const depthTexture = new DepthTexture();
53
53
  depthTexture.isRenderTargetTexture = true;
54
- depthTexture.type = FloatType;
54
+ //depthTexture.type = FloatType;
55
55
  depthTexture.name = 'PostProcessingDepth';
56
56
 
57
57
  const renderTarget = new RenderTarget( this._width * this._pixelRatio, this._height * this._pixelRatio, { type: HalfFloatType } );
@@ -177,6 +177,7 @@ PassNode.DEPTH = 'depth';
177
177
  export default PassNode;
178
178
 
179
179
  export const pass = ( scene, camera ) => nodeObject( new PassNode( PassNode.COLOR, scene, camera ) );
180
+ export const texturePass = ( pass, texture ) => nodeObject( new PassTextureNode( pass, texture ) );
180
181
  export const depthPass = ( scene, camera ) => nodeObject( new PassNode( PassNode.DEPTH, scene, camera ) );
181
182
 
182
183
  addNodeClass( 'PassNode', PassNode );
@@ -1,8 +1,10 @@
1
1
  import TempNode from '../core/TempNode.js';
2
2
  import { addNodeClass } from '../core/Node.js';
3
- import { tslFn, nodeObject, float, mat3 } from '../shadernode/ShaderNode.js';
3
+ import { tslFn, nodeObject, float, mat3, vec3 } from '../shadernode/ShaderNode.js';
4
4
 
5
- import { NoToneMapping, LinearToneMapping, ReinhardToneMapping, CineonToneMapping, ACESFilmicToneMapping } from 'three';
5
+ import { NoToneMapping, LinearToneMapping, ReinhardToneMapping, CineonToneMapping, ACESFilmicToneMapping, AgXToneMapping } from 'three';
6
+ import { clamp, log2, max, pow } from '../math/MathNode.js';
7
+ import { mul } from '../math/OperatorNode.js';
6
8
 
7
9
  // exposure only
8
10
  const LinearToneMappingNode = tslFn( ( { color, exposure } ) => {
@@ -75,11 +77,52 @@ const ACESFilmicToneMappingNode = tslFn( ( { color, exposure } ) => {
75
77
 
76
78
  } );
77
79
 
80
+
81
+
82
+ const LINEAR_REC2020_TO_LINEAR_SRGB = mat3( vec3( 1.6605, - 0.1246, - 0.0182 ), vec3( - 0.5876, 1.1329, - 0.1006 ), vec3( - 0.0728, - 0.0083, 1.1187 ) );
83
+ const LINEAR_SRGB_TO_LINEAR_REC2020 = mat3( vec3( 0.6274, 0.0691, 0.0164 ), vec3( 0.3293, 0.9195, 0.0880 ), vec3( 0.0433, 0.0113, 0.8956 ) );
84
+
85
+ const agxDefaultContrastApprox = tslFn( ( [ x_immutable ] ) => {
86
+
87
+ const x = vec3( x_immutable ).toVar();
88
+ const x2 = vec3( x.mul( x ) ).toVar();
89
+ const x4 = vec3( x2.mul( x2 ) ).toVar();
90
+
91
+ return float( 15.5 ).mul( x4.mul( x2 ) ).sub( mul( 40.14, x4.mul( x ) ) ).add( mul( 31.96, x4 ).sub( mul( 6.868, x2.mul( x ) ) ).add( mul( 0.4298, x2 ).add( mul( 0.1191, x ).sub( 0.00232 ) ) ) );
92
+
93
+ } );
94
+
95
+ const AGXToneMappingNode = tslFn( ( { color, exposure } ) => {
96
+
97
+ const colortone = vec3( color ).toVar();
98
+ const AgXInsetMatrix = mat3( vec3( 0.856627153315983, 0.137318972929847, 0.11189821299995 ), vec3( 0.0951212405381588, 0.761241990602591, 0.0767994186031903 ), vec3( 0.0482516061458583, 0.101439036467562, 0.811302368396859 ) );
99
+ const AgXOutsetMatrix = mat3( vec3( 1.1271005818144368, - 0.1413297634984383, - 0.14132976349843826 ), vec3( - 0.11060664309660323, 1.157823702216272, - 0.11060664309660294 ), vec3( - 0.016493938717834573, - 0.016493938717834257, 1.2519364065950405 ) );
100
+ const AgxMinEv = float( - 12.47393 );
101
+ const AgxMaxEv = float( 4.026069 );
102
+ colortone.mulAssign( exposure );
103
+ colortone.assign( LINEAR_SRGB_TO_LINEAR_REC2020.mul( colortone ) );
104
+ colortone.assign( AgXInsetMatrix.mul( colortone ) );
105
+ colortone.assign( max( colortone, 1e-10 ) );
106
+ colortone.assign( log2( colortone ) );
107
+ colortone.assign( colortone.sub( AgxMinEv ).div( AgxMaxEv.sub( AgxMinEv ) ) );
108
+ colortone.assign( clamp( colortone, 0.0, 1.0 ) );
109
+ colortone.assign( agxDefaultContrastApprox( colortone ) );
110
+ colortone.assign( AgXOutsetMatrix.mul( colortone ) );
111
+ colortone.assign( pow( max( vec3( 0.0 ), colortone ), vec3( 2.2 ) ) );
112
+ colortone.assign( LINEAR_REC2020_TO_LINEAR_SRGB.mul( colortone ) );
113
+ colortone.assign( clamp( colortone, 0.0, 1.0 ) );
114
+
115
+ return colortone;
116
+
117
+ } );
118
+
119
+
78
120
  const toneMappingLib = {
79
121
  [ LinearToneMapping ]: LinearToneMappingNode,
80
122
  [ ReinhardToneMapping ]: ReinhardToneMappingNode,
81
123
  [ CineonToneMapping ]: OptimizedCineonToneMappingNode,
82
- [ ACESFilmicToneMapping ]: ACESFilmicToneMappingNode
124
+ [ ACESFilmicToneMapping ]: ACESFilmicToneMappingNode,
125
+ [ AgXToneMapping ]: AGXToneMappingNode
83
126
  };
84
127
 
85
128
  class ToneMappingNode extends TempNode {
@@ -2,7 +2,7 @@ import ViewportTextureNode from './ViewportTextureNode.js';
2
2
  import { addNodeClass } from '../core/Node.js';
3
3
  import { addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
4
4
  import { viewportTopLeft } from './ViewportNode.js';
5
- import { DepthTexture, NearestMipmapNearestFilter, DepthFormat, UnsignedIntType } from 'three';
5
+ import { DepthTexture } from 'three';
6
6
 
7
7
  let sharedDepthbuffer = null;
8
8
 
@@ -13,9 +13,6 @@ class ViewportDepthTextureNode extends ViewportTextureNode {
13
13
  if ( sharedDepthbuffer === null ) {
14
14
 
15
15
  sharedDepthbuffer = new DepthTexture();
16
- sharedDepthbuffer.minFilter = NearestMipmapNearestFilter;
17
- sharedDepthbuffer.type = UnsignedIntType;
18
- sharedDepthbuffer.format = DepthFormat;
19
16
 
20
17
  }
21
18
 
@@ -59,8 +59,6 @@ class ViewportNode extends Node {
59
59
 
60
60
  const scope = this.scope;
61
61
 
62
- if ( scope === ViewportNode.COORDINATE ) return;
63
-
64
62
  let output = null;
65
63
 
66
64
  if ( scope === ViewportNode.RESOLUTION ) {
@@ -4,19 +4,19 @@ import { addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
4
4
  import { viewportTopLeft } from './ViewportNode.js';
5
5
  import { FramebufferTexture } from 'three';
6
6
 
7
- let sharedFramebuffer = null;
7
+ let _sharedFramebuffer = null;
8
8
 
9
9
  class ViewportSharedTextureNode extends ViewportTextureNode {
10
10
 
11
11
  constructor( uvNode = viewportTopLeft, levelNode = null ) {
12
12
 
13
- if ( sharedFramebuffer === null ) {
13
+ if ( _sharedFramebuffer === null ) {
14
14
 
15
- sharedFramebuffer = new FramebufferTexture();
15
+ _sharedFramebuffer = new FramebufferTexture();
16
16
 
17
17
  }
18
18
 
19
- super( uvNode, levelNode, sharedFramebuffer );
19
+ super( uvNode, levelNode, _sharedFramebuffer );
20
20
 
21
21
  }
22
22
 
@@ -1,4 +1,5 @@
1
1
  import Node, { addNodeClass } from '../core/Node.js';
2
+ import { mix } from '../math/MathNode.js';
2
3
  import { addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
3
4
 
4
5
  class FogNode extends Node {
@@ -16,7 +17,7 @@ class FogNode extends Node {
16
17
 
17
18
  mixAssign( outputNode ) {
18
19
 
19
- return this.mix( outputNode, this.colorNode );
20
+ return mix( outputNode, this.colorNode, this );
20
21
 
21
22
  }
22
23
 
@@ -14,7 +14,7 @@ class AmbientLightNode extends AnalyticLightNode {
14
14
 
15
15
  setup( { context } ) {
16
16
 
17
- context.irradiance.addAssign(this.colorNode );
17
+ context.irradiance.addAssign( this.colorNode );
18
18
 
19
19
  }
20
20