super-three 0.160.0 → 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.
- package/LICENSE +1 -1
- package/build/three.cjs +380 -109
- package/build/three.module.js +381 -109
- package/build/three.module.min.js +1 -1
- package/examples/jsm/Addons.js +5 -1
- package/examples/jsm/capabilities/WebGPU.js +13 -9
- package/examples/jsm/controls/OrbitControls.js +102 -13
- package/examples/jsm/curves/NURBSUtils.js +59 -4
- package/examples/jsm/curves/NURBSVolume.js +62 -0
- package/examples/jsm/exporters/USDZExporter.js +8 -7
- package/examples/jsm/helpers/TextureHelper.js +3 -3
- package/examples/jsm/loaders/3DMLoader.js +44 -43
- package/examples/jsm/loaders/DDSLoader.js +1 -0
- package/examples/jsm/loaders/KTX2Loader.js +20 -5
- package/examples/jsm/loaders/LUT3dlLoader.js +78 -46
- package/examples/jsm/loaders/LUTCubeLoader.js +81 -67
- package/examples/jsm/loaders/LUTImageLoader.js +3 -2
- package/examples/jsm/loaders/MaterialXLoader.js +115 -16
- package/examples/jsm/loaders/SVGLoader.js +4 -3
- package/examples/jsm/loaders/VRMLLoader.js +1 -1
- package/examples/jsm/materials/MeshPostProcessingMaterial.js +144 -0
- package/examples/jsm/misc/Timer.js +13 -4
- package/examples/jsm/nodes/Nodes.js +16 -5
- package/examples/jsm/nodes/accessors/BufferAttributeNode.js +5 -3
- package/examples/jsm/nodes/accessors/CameraNode.js +9 -4
- package/examples/jsm/nodes/accessors/CubeTextureNode.js +12 -1
- package/examples/jsm/nodes/accessors/StorageBufferNode.js +27 -0
- package/examples/jsm/nodes/accessors/TextureStoreNode.js +56 -3
- package/examples/jsm/nodes/accessors/VertexColorNode.js +70 -0
- package/examples/jsm/nodes/core/AttributeNode.js +1 -1
- package/examples/jsm/nodes/core/NodeBuilder.js +23 -18
- package/examples/jsm/nodes/core/NodeFrame.js +16 -8
- package/examples/jsm/nodes/core/constants.js +1 -0
- package/examples/jsm/nodes/display/AfterImageNode.js +148 -0
- package/examples/jsm/nodes/display/AnamorphicNode.js +148 -0
- package/examples/jsm/nodes/display/ColorAdjustmentNode.js +3 -0
- package/examples/jsm/nodes/display/GaussianBlurNode.js +33 -13
- package/examples/jsm/nodes/display/PassNode.js +3 -2
- package/examples/jsm/nodes/display/ToneMappingNode.js +46 -3
- package/examples/jsm/nodes/display/ViewportDepthTextureNode.js +1 -4
- package/examples/jsm/nodes/display/ViewportNode.js +0 -2
- package/examples/jsm/nodes/display/ViewportSharedTextureNode.js +4 -4
- package/examples/jsm/nodes/fog/FogNode.js +2 -1
- package/examples/jsm/nodes/lighting/AmbientLightNode.js +1 -1
- package/examples/jsm/nodes/lighting/AnalyticLightNode.js +13 -5
- package/examples/jsm/nodes/lighting/LightingContextNode.js +1 -1
- package/examples/jsm/nodes/lighting/LightsNode.js +1 -1
- package/examples/jsm/nodes/materials/Line2NodeMaterial.js +18 -30
- package/examples/jsm/nodes/materials/Materials.js +1 -0
- package/examples/jsm/nodes/materials/MeshSSSNodeMaterial.js +84 -0
- package/examples/jsm/nodes/materials/NodeMaterial.js +6 -4
- package/examples/jsm/nodes/materials/SpriteNodeMaterial.js +1 -7
- package/examples/jsm/nodes/math/MathNode.js +12 -2
- package/examples/jsm/nodes/math/MathUtils.js +15 -0
- package/examples/jsm/nodes/math/OperatorNode.js +13 -5
- package/examples/jsm/nodes/math/TriNoise3D.js +71 -0
- package/examples/jsm/nodes/shadernode/ShaderNode.js +10 -1
- package/examples/jsm/nodes/utils/ArrayElementNode.js +6 -0
- package/examples/jsm/nodes/utils/JoinNode.js +2 -2
- package/examples/jsm/nodes/utils/LoopNode.js +3 -3
- package/examples/jsm/nodes/utils/ReflectorNode.js +227 -0
- package/examples/jsm/nodes/utils/RotateNode.js +68 -0
- package/examples/jsm/nodes/utils/RotateUVNode.js +1 -9
- package/examples/jsm/nodes/utils/SplitNode.js +4 -4
- package/examples/jsm/objects/GroundedSkybox.js +50 -0
- package/examples/jsm/objects/QuadMesh.js +8 -2
- package/examples/jsm/objects/Water2.js +8 -8
- package/examples/jsm/postprocessing/GTAOPass.js +11 -1
- package/examples/jsm/renderers/common/Backend.js +14 -0
- package/examples/jsm/renderers/common/Bindings.js +1 -1
- package/examples/jsm/renderers/common/DataMap.js +1 -1
- package/examples/jsm/renderers/common/Info.js +25 -1
- package/examples/jsm/renderers/common/Pipelines.js +8 -8
- package/examples/jsm/renderers/common/PostProcessing.js +2 -2
- package/examples/jsm/renderers/common/ProgrammableStage.js +3 -1
- package/examples/jsm/renderers/common/RenderObject.js +2 -0
- package/examples/jsm/renderers/common/Renderer.js +238 -22
- package/examples/jsm/renderers/common/StorageBufferAttribute.js +17 -0
- package/examples/jsm/renderers/common/Textures.js +25 -5
- package/examples/jsm/renderers/common/nodes/NodeBuilderState.js +2 -1
- package/examples/jsm/renderers/common/nodes/Nodes.js +4 -2
- package/examples/jsm/renderers/webgl/WebGLBackend.js +631 -270
- package/examples/jsm/renderers/webgl/nodes/GLSLNodeBuilder.js +37 -30
- package/examples/jsm/renderers/webgl/utils/WebGLAttributeUtils.js +89 -8
- package/examples/jsm/renderers/webgl/utils/WebGLConstants.js +11 -0
- package/examples/jsm/renderers/webgl/utils/WebGLState.js +197 -0
- package/examples/jsm/renderers/webgl/utils/WebGLTextureUtils.js +377 -11
- package/examples/jsm/renderers/webgl/utils/WebGLUtils.js +2 -2
- package/examples/jsm/renderers/webgl-legacy/nodes/GLSL1NodeBuilder.js +1 -21
- package/examples/jsm/renderers/webgl-legacy/nodes/WebGLNodeBuilder.js +2 -2
- package/examples/jsm/renderers/webgpu/WebGPUBackend.js +289 -102
- package/examples/jsm/renderers/webgpu/WebGPURenderer.js +7 -2
- package/examples/jsm/renderers/webgpu/nodes/WGSLNodeBuilder.js +56 -39
- package/examples/jsm/renderers/webgpu/utils/WebGPUAttributeUtils.js +9 -1
- package/examples/jsm/renderers/webgpu/utils/WebGPUPipelineUtils.js +38 -4
- package/examples/jsm/renderers/webgpu/utils/WebGPUTextureUtils.js +85 -12
- package/examples/jsm/transpiler/AST.js +1 -1
- package/examples/jsm/transpiler/GLSLDecoder.js +1 -1
- package/examples/jsm/transpiler/ShaderToyDecoder.js +1 -1
- package/examples/jsm/transpiler/TSLEncoder.js +1 -1
- package/examples/jsm/utils/BufferGeometryUtils.js +23 -27
- package/examples/jsm/utils/SortUtils.js +2 -0
- package/examples/jsm/webxr/ARButton.js +12 -2
- package/examples/jsm/webxr/VRButton.js +12 -2
- package/examples/jsm/webxr/XRButton.js +12 -2
- package/examples/jsm/webxr/XRControllerModelFactory.js +6 -1
- package/examples/jsm/webxr/XRHandMeshModel.js +3 -1
- package/package.json +2 -2
- package/src/audio/Audio.js +1 -3
- package/src/cameras/PerspectiveCamera.js +35 -0
- package/src/constants.js +1 -2
- package/src/core/BufferAttribute.js +2 -1
- package/src/core/InterleavedBuffer.js +2 -1
- package/src/core/InterleavedBufferAttribute.js +20 -0
- package/src/materials/ShaderMaterial.js +2 -1
- package/src/math/Triangle.js +0 -30
- package/src/objects/BatchedMesh.js +6 -7
- package/src/objects/SkinnedMesh.js +0 -8
- package/src/renderers/WebGLRenderer.js +6 -2
- package/src/renderers/shaders/ShaderChunk/alphatest_fragment.glsl.js +9 -0
- package/src/renderers/shaders/ShaderChunk/clipping_planes_fragment.glsl.js +56 -11
- package/src/renderers/shaders/ShaderChunk/tonemapping_pars_fragment.glsl.js +15 -7
- package/src/renderers/shaders/ShaderLib/depth.glsl.js +1 -2
- package/src/renderers/shaders/ShaderLib/distanceRGBA.glsl.js +1 -2
- package/src/renderers/shaders/ShaderLib/linedashed.glsl.js +1 -1
- package/src/renderers/shaders/ShaderLib/meshbasic.glsl.js +1 -2
- package/src/renderers/shaders/ShaderLib/meshlambert.glsl.js +1 -1
- package/src/renderers/shaders/ShaderLib/meshmatcap.glsl.js +1 -2
- package/src/renderers/shaders/ShaderLib/meshnormal.glsl.js +3 -1
- package/src/renderers/shaders/ShaderLib/meshphong.glsl.js +1 -1
- package/src/renderers/shaders/ShaderLib/meshphysical.glsl.js +1 -1
- package/src/renderers/shaders/ShaderLib/meshtoon.glsl.js +1 -1
- package/src/renderers/shaders/ShaderLib/points.glsl.js +1 -1
- package/src/renderers/shaders/ShaderLib/sprite.glsl.js +1 -1
- package/src/renderers/webgl/WebGLAttributes.js +2 -2
- package/src/renderers/webgl/WebGLCubeMaps.js +1 -1
- package/src/renderers/webgl/WebGLProgram.js +30 -3
- package/src/renderers/webgl/WebGLPrograms.js +19 -11
- package/src/renderers/webgl/WebGLTextures.js +90 -16
- package/src/renderers/webxr/WebXRDepthSensing.js +105 -0
- package/src/renderers/webxr/WebXRManager.js +46 -0
- package/src/textures/Source.js +1 -0
- package/build/three.js +0 -54519
- package/build/three.min.js +0 -7
- 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
|
-
|
|
56
|
+
if ( node.updateBefore( this ) !== false ) {
|
|
57
57
|
|
|
58
|
-
|
|
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
|
-
|
|
70
|
+
if ( node.updateBefore( this ) !== false ) {
|
|
71
|
+
|
|
72
|
+
renderMap.set( node, this.renderId );
|
|
69
73
|
|
|
70
|
-
|
|
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
|
-
|
|
97
|
+
if ( node.update( this ) !== false ) {
|
|
94
98
|
|
|
95
|
-
|
|
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
|
-
|
|
111
|
+
if ( node.update( this ) !== false ) {
|
|
112
|
+
|
|
113
|
+
renderMap.set( node, this.renderId );
|
|
106
114
|
|
|
107
|
-
|
|
115
|
+
}
|
|
108
116
|
|
|
109
117
|
}
|
|
110
118
|
|
|
@@ -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,
|
|
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 {
|
|
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
|
-
|
|
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(
|
|
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
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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 =
|
|
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 =
|
|
122
|
-
const sample2 =
|
|
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
|
|
149
|
+
return diffuseSum.div( weightSum );
|
|
130
150
|
|
|
131
151
|
} );
|
|
132
152
|
|
|
133
153
|
//
|
|
134
154
|
|
|
135
|
-
const material = this._material || ( this._material = builder.createNodeMaterial(
|
|
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
|
|
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
|
|
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
|
|
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
|
|
|
@@ -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
|
|
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 (
|
|
13
|
+
if ( _sharedFramebuffer === null ) {
|
|
14
14
|
|
|
15
|
-
|
|
15
|
+
_sharedFramebuffer = new FramebufferTexture();
|
|
16
16
|
|
|
17
17
|
}
|
|
18
18
|
|
|
19
|
-
super( uvNode, levelNode,
|
|
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
|
|
20
|
+
return mix( outputNode, this.colorNode, this );
|
|
20
21
|
|
|
21
22
|
}
|
|
22
23
|
|