opencode-agent-flow 0.0.0-stage → 0.1.1
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/CHANGELOG.md +34 -0
- package/CONTRIBUTING.md +3 -0
- package/LICENSE +21 -0
- package/README.md +181 -2
- package/SECURITY.md +3 -0
- package/bin/cli.mjs +54 -0
- package/docs/architecture.md +58 -0
- package/docs/opencode-v2-api-notes.md +121 -0
- package/docs/screenshot.png +0 -0
- package/lib/demo.mjs +42 -0
- package/lib/privacy.mjs +9 -0
- package/lib/upstream.mjs +194 -0
- package/package.json +46 -4
- package/prices.json +10 -0
- package/public/app.js +223 -0
- package/public/flow-webgl.js +155 -0
- package/public/index.html +10 -0
- package/public/style.css +6 -0
- package/public/vendor/three/LICENSE +21 -0
- package/public/vendor/three/postprocessing/EffectComposer.js +363 -0
- package/public/vendor/three/postprocessing/MaskPass.js +195 -0
- package/public/vendor/three/postprocessing/OutputPass.js +139 -0
- package/public/vendor/three/postprocessing/Pass.js +191 -0
- package/public/vendor/three/postprocessing/RenderPass.js +183 -0
- package/public/vendor/three/postprocessing/ShaderPass.js +135 -0
- package/public/vendor/three/postprocessing/UnrealBloomPass.js +492 -0
- package/public/vendor/three/shaders/CopyShader.js +52 -0
- package/public/vendor/three/shaders/LuminosityHighPassShader.js +68 -0
- package/public/vendor/three/shaders/OutputShader.js +103 -0
- package/public/vendor/three/three.core.min.js +6 -0
- package/public/vendor/three/three.module.min.js +6 -0
- package/server.mjs +217 -0
|
@@ -0,0 +1,135 @@
|
|
|
1
|
+
import {
|
|
2
|
+
ShaderMaterial,
|
|
3
|
+
UniformsUtils
|
|
4
|
+
} from 'three';
|
|
5
|
+
import { Pass, FullScreenQuad } from './Pass.js';
|
|
6
|
+
|
|
7
|
+
/**
|
|
8
|
+
* This pass can be used to create a post processing effect
|
|
9
|
+
* with a raw GLSL shader object. Useful for implementing custom
|
|
10
|
+
* effects.
|
|
11
|
+
*
|
|
12
|
+
* ```js
|
|
13
|
+
* const fxaaPass = new ShaderPass( FXAAShader );
|
|
14
|
+
* composer.addPass( fxaaPass );
|
|
15
|
+
* ```
|
|
16
|
+
*
|
|
17
|
+
* @augments Pass
|
|
18
|
+
* @three_import import { ShaderPass } from 'three/addons/postprocessing/ShaderPass.js';
|
|
19
|
+
*/
|
|
20
|
+
class ShaderPass extends Pass {
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* Constructs a new shader pass.
|
|
24
|
+
*
|
|
25
|
+
* @param {Object|ShaderMaterial} [shader] - A shader object holding vertex and fragment shader as well as
|
|
26
|
+
* defines and uniforms. It's also valid to pass a custom shader material.
|
|
27
|
+
* @param {string} [textureID='tDiffuse'] - The name of the texture uniform that should sample
|
|
28
|
+
* the read buffer.
|
|
29
|
+
*/
|
|
30
|
+
constructor( shader, textureID = 'tDiffuse' ) {
|
|
31
|
+
|
|
32
|
+
super();
|
|
33
|
+
|
|
34
|
+
/**
|
|
35
|
+
* The name of the texture uniform that should sample the read buffer.
|
|
36
|
+
*
|
|
37
|
+
* @type {string}
|
|
38
|
+
* @default 'tDiffuse'
|
|
39
|
+
*/
|
|
40
|
+
this.textureID = textureID;
|
|
41
|
+
|
|
42
|
+
/**
|
|
43
|
+
* The pass uniforms.
|
|
44
|
+
*
|
|
45
|
+
* @type {?Object}
|
|
46
|
+
*/
|
|
47
|
+
this.uniforms = null;
|
|
48
|
+
|
|
49
|
+
/**
|
|
50
|
+
* The pass material.
|
|
51
|
+
*
|
|
52
|
+
* @type {?ShaderMaterial}
|
|
53
|
+
*/
|
|
54
|
+
this.material = null;
|
|
55
|
+
|
|
56
|
+
if ( shader instanceof ShaderMaterial ) {
|
|
57
|
+
|
|
58
|
+
this.uniforms = shader.uniforms;
|
|
59
|
+
|
|
60
|
+
this.material = shader;
|
|
61
|
+
|
|
62
|
+
} else if ( shader ) {
|
|
63
|
+
|
|
64
|
+
this.uniforms = UniformsUtils.clone( shader.uniforms );
|
|
65
|
+
|
|
66
|
+
this.material = new ShaderMaterial( {
|
|
67
|
+
|
|
68
|
+
name: ( shader.name !== undefined ) ? shader.name : 'unspecified',
|
|
69
|
+
defines: Object.assign( {}, shader.defines ),
|
|
70
|
+
uniforms: this.uniforms,
|
|
71
|
+
vertexShader: shader.vertexShader,
|
|
72
|
+
fragmentShader: shader.fragmentShader
|
|
73
|
+
|
|
74
|
+
} );
|
|
75
|
+
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
// internals
|
|
79
|
+
|
|
80
|
+
this._fsQuad = new FullScreenQuad( this.material );
|
|
81
|
+
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
/**
|
|
85
|
+
* Performs the shader pass.
|
|
86
|
+
*
|
|
87
|
+
* @param {WebGLRenderer} renderer - The renderer.
|
|
88
|
+
* @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
|
|
89
|
+
* destination for the pass.
|
|
90
|
+
* @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
|
|
91
|
+
* previous pass from this buffer.
|
|
92
|
+
* @param {number} deltaTime - The delta time in seconds.
|
|
93
|
+
* @param {boolean} maskActive - Whether masking is active or not.
|
|
94
|
+
*/
|
|
95
|
+
render( renderer, writeBuffer, readBuffer /*, deltaTime, maskActive */ ) {
|
|
96
|
+
|
|
97
|
+
if ( this.uniforms[ this.textureID ] ) {
|
|
98
|
+
|
|
99
|
+
this.uniforms[ this.textureID ].value = readBuffer.texture;
|
|
100
|
+
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
this._fsQuad.material = this.material;
|
|
104
|
+
|
|
105
|
+
if ( this.renderToScreen ) {
|
|
106
|
+
|
|
107
|
+
renderer.setRenderTarget( null );
|
|
108
|
+
this._fsQuad.render( renderer );
|
|
109
|
+
|
|
110
|
+
} else {
|
|
111
|
+
|
|
112
|
+
renderer.setRenderTarget( writeBuffer );
|
|
113
|
+
// TODO: Avoid using autoClear properties, see https://github.com/mrdoob/three.js/pull/15571#issuecomment-465669600
|
|
114
|
+
if ( this.clear ) renderer.clear( renderer.autoClearColor, renderer.autoClearDepth, renderer.autoClearStencil );
|
|
115
|
+
this._fsQuad.render( renderer );
|
|
116
|
+
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
/**
|
|
122
|
+
* Frees the GPU-related resources allocated by this instance. Call this
|
|
123
|
+
* method whenever the pass is no longer used in your app.
|
|
124
|
+
*/
|
|
125
|
+
dispose() {
|
|
126
|
+
|
|
127
|
+
this.material.dispose();
|
|
128
|
+
|
|
129
|
+
this._fsQuad.dispose();
|
|
130
|
+
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
export { ShaderPass };
|
|
@@ -0,0 +1,492 @@
|
|
|
1
|
+
import {
|
|
2
|
+
AdditiveBlending,
|
|
3
|
+
Color,
|
|
4
|
+
HalfFloatType,
|
|
5
|
+
MeshBasicMaterial,
|
|
6
|
+
ShaderMaterial,
|
|
7
|
+
UniformsUtils,
|
|
8
|
+
Vector2,
|
|
9
|
+
Vector3,
|
|
10
|
+
WebGLRenderTarget
|
|
11
|
+
} from 'three';
|
|
12
|
+
import { Pass, FullScreenQuad } from './Pass.js';
|
|
13
|
+
import { CopyShader } from '../shaders/CopyShader.js';
|
|
14
|
+
import { LuminosityHighPassShader } from '../shaders/LuminosityHighPassShader.js';
|
|
15
|
+
|
|
16
|
+
/**
|
|
17
|
+
* This pass is inspired by the bloom pass of Unreal Engine. It creates a
|
|
18
|
+
* mip map chain of bloom textures and blurs them with different radii. Because
|
|
19
|
+
* of the weighted combination of mips, and because larger blurs are done on
|
|
20
|
+
* higher mips, this effect provides good quality and performance.
|
|
21
|
+
*
|
|
22
|
+
* When using this pass, tone mapping must be enabled in the renderer settings.
|
|
23
|
+
*
|
|
24
|
+
* Reference:
|
|
25
|
+
* - [Bloom in Unreal Engine]{@link https://docs.unrealengine.com/latest/INT/Engine/Rendering/PostProcessEffects/Bloom/}
|
|
26
|
+
*
|
|
27
|
+
* ```js
|
|
28
|
+
* const resolution = new THREE.Vector2( window.innerWidth, window.innerHeight );
|
|
29
|
+
* const bloomPass = new UnrealBloomPass( resolution, 1.5, 0.4, 0.85 );
|
|
30
|
+
* composer.addPass( bloomPass );
|
|
31
|
+
* ```
|
|
32
|
+
*
|
|
33
|
+
* @augments Pass
|
|
34
|
+
* @three_import import { UnrealBloomPass } from 'three/addons/postprocessing/UnrealBloomPass.js';
|
|
35
|
+
*/
|
|
36
|
+
class UnrealBloomPass extends Pass {
|
|
37
|
+
|
|
38
|
+
/**
|
|
39
|
+
* Constructs a new Unreal Bloom pass.
|
|
40
|
+
*
|
|
41
|
+
* @param {Vector2} [resolution] - The effect's resolution.
|
|
42
|
+
* @param {number} [strength=1] - The Bloom strength.
|
|
43
|
+
* @param {number} radius - The Bloom radius.
|
|
44
|
+
* @param {number} threshold - The luminance threshold limits which bright areas contribute to the Bloom effect.
|
|
45
|
+
*/
|
|
46
|
+
constructor( resolution, strength = 1, radius, threshold ) {
|
|
47
|
+
|
|
48
|
+
super();
|
|
49
|
+
|
|
50
|
+
/**
|
|
51
|
+
* The Bloom strength.
|
|
52
|
+
*
|
|
53
|
+
* @type {number}
|
|
54
|
+
* @default 1
|
|
55
|
+
*/
|
|
56
|
+
this.strength = strength;
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* The Bloom radius.
|
|
60
|
+
*
|
|
61
|
+
* @type {number}
|
|
62
|
+
*/
|
|
63
|
+
this.radius = radius;
|
|
64
|
+
|
|
65
|
+
/**
|
|
66
|
+
* The luminance threshold limits which bright areas contribute to the Bloom effect.
|
|
67
|
+
*
|
|
68
|
+
* @type {number}
|
|
69
|
+
*/
|
|
70
|
+
this.threshold = threshold;
|
|
71
|
+
|
|
72
|
+
/**
|
|
73
|
+
* The effect's resolution.
|
|
74
|
+
*
|
|
75
|
+
* @type {Vector2}
|
|
76
|
+
* @default (256,256)
|
|
77
|
+
*/
|
|
78
|
+
this.resolution = ( resolution !== undefined ) ? new Vector2( resolution.x, resolution.y ) : new Vector2( 256, 256 );
|
|
79
|
+
|
|
80
|
+
/**
|
|
81
|
+
* The effect's clear color
|
|
82
|
+
*
|
|
83
|
+
* @type {Color}
|
|
84
|
+
* @default (0,0,0)
|
|
85
|
+
*/
|
|
86
|
+
this.clearColor = new Color( 0, 0, 0 );
|
|
87
|
+
|
|
88
|
+
/**
|
|
89
|
+
* Overwritten to disable the swap.
|
|
90
|
+
*
|
|
91
|
+
* @type {boolean}
|
|
92
|
+
* @default false
|
|
93
|
+
*/
|
|
94
|
+
this.needsSwap = false;
|
|
95
|
+
|
|
96
|
+
// internals
|
|
97
|
+
|
|
98
|
+
// render targets
|
|
99
|
+
this.renderTargetsHorizontal = [];
|
|
100
|
+
this.renderTargetsVertical = [];
|
|
101
|
+
this.nMips = 5;
|
|
102
|
+
let resx = Math.round( this.resolution.x / 2 );
|
|
103
|
+
let resy = Math.round( this.resolution.y / 2 );
|
|
104
|
+
|
|
105
|
+
this.renderTargetBright = new WebGLRenderTarget( resx, resy, { type: HalfFloatType } );
|
|
106
|
+
this.renderTargetBright.texture.name = 'UnrealBloomPass.bright';
|
|
107
|
+
this.renderTargetBright.texture.generateMipmaps = false;
|
|
108
|
+
|
|
109
|
+
for ( let i = 0; i < this.nMips; i ++ ) {
|
|
110
|
+
|
|
111
|
+
const renderTargetHorizontal = new WebGLRenderTarget( resx, resy, { type: HalfFloatType } );
|
|
112
|
+
|
|
113
|
+
renderTargetHorizontal.texture.name = 'UnrealBloomPass.h' + i;
|
|
114
|
+
renderTargetHorizontal.texture.generateMipmaps = false;
|
|
115
|
+
|
|
116
|
+
this.renderTargetsHorizontal.push( renderTargetHorizontal );
|
|
117
|
+
|
|
118
|
+
const renderTargetVertical = new WebGLRenderTarget( resx, resy, { type: HalfFloatType } );
|
|
119
|
+
|
|
120
|
+
renderTargetVertical.texture.name = 'UnrealBloomPass.v' + i;
|
|
121
|
+
renderTargetVertical.texture.generateMipmaps = false;
|
|
122
|
+
|
|
123
|
+
this.renderTargetsVertical.push( renderTargetVertical );
|
|
124
|
+
|
|
125
|
+
resx = Math.round( resx / 2 );
|
|
126
|
+
|
|
127
|
+
resy = Math.round( resy / 2 );
|
|
128
|
+
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
// luminosity high pass material
|
|
132
|
+
|
|
133
|
+
const highPassShader = LuminosityHighPassShader;
|
|
134
|
+
this.highPassUniforms = UniformsUtils.clone( highPassShader.uniforms );
|
|
135
|
+
|
|
136
|
+
this.highPassUniforms[ 'luminosityThreshold' ].value = threshold;
|
|
137
|
+
this.highPassUniforms[ 'smoothWidth' ].value = 0.01;
|
|
138
|
+
|
|
139
|
+
this.materialHighPassFilter = new ShaderMaterial( {
|
|
140
|
+
uniforms: this.highPassUniforms,
|
|
141
|
+
vertexShader: highPassShader.vertexShader,
|
|
142
|
+
fragmentShader: highPassShader.fragmentShader
|
|
143
|
+
} );
|
|
144
|
+
|
|
145
|
+
// gaussian blur materials
|
|
146
|
+
|
|
147
|
+
this.separableBlurMaterials = [];
|
|
148
|
+
const kernelSizeArray = [ 3, 5, 7, 9, 11 ];
|
|
149
|
+
resx = Math.round( this.resolution.x / 2 );
|
|
150
|
+
resy = Math.round( this.resolution.y / 2 );
|
|
151
|
+
|
|
152
|
+
for ( let i = 0; i < this.nMips; i ++ ) {
|
|
153
|
+
|
|
154
|
+
this.separableBlurMaterials.push( this._getSeparableBlurMaterial( kernelSizeArray[ i ] ) );
|
|
155
|
+
|
|
156
|
+
this.separableBlurMaterials[ i ].uniforms[ 'invSize' ].value = new Vector2( 1 / resx, 1 / resy );
|
|
157
|
+
|
|
158
|
+
resx = Math.round( resx / 2 );
|
|
159
|
+
|
|
160
|
+
resy = Math.round( resy / 2 );
|
|
161
|
+
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
// composite material
|
|
165
|
+
|
|
166
|
+
this.compositeMaterial = this._getCompositeMaterial( this.nMips );
|
|
167
|
+
this.compositeMaterial.uniforms[ 'blurTexture1' ].value = this.renderTargetsVertical[ 0 ].texture;
|
|
168
|
+
this.compositeMaterial.uniforms[ 'blurTexture2' ].value = this.renderTargetsVertical[ 1 ].texture;
|
|
169
|
+
this.compositeMaterial.uniforms[ 'blurTexture3' ].value = this.renderTargetsVertical[ 2 ].texture;
|
|
170
|
+
this.compositeMaterial.uniforms[ 'blurTexture4' ].value = this.renderTargetsVertical[ 3 ].texture;
|
|
171
|
+
this.compositeMaterial.uniforms[ 'blurTexture5' ].value = this.renderTargetsVertical[ 4 ].texture;
|
|
172
|
+
this.compositeMaterial.uniforms[ 'bloomStrength' ].value = strength;
|
|
173
|
+
this.compositeMaterial.uniforms[ 'bloomRadius' ].value = 0.1;
|
|
174
|
+
|
|
175
|
+
const bloomFactors = [ 1.0, 0.8, 0.6, 0.4, 0.2 ];
|
|
176
|
+
this.compositeMaterial.uniforms[ 'bloomFactors' ].value = bloomFactors;
|
|
177
|
+
this.bloomTintColors = [ new Vector3( 1, 1, 1 ), new Vector3( 1, 1, 1 ), new Vector3( 1, 1, 1 ), new Vector3( 1, 1, 1 ), new Vector3( 1, 1, 1 ) ];
|
|
178
|
+
this.compositeMaterial.uniforms[ 'bloomTintColors' ].value = this.bloomTintColors;
|
|
179
|
+
|
|
180
|
+
// blend material
|
|
181
|
+
|
|
182
|
+
this.copyUniforms = UniformsUtils.clone( CopyShader.uniforms );
|
|
183
|
+
|
|
184
|
+
this.blendMaterial = new ShaderMaterial( {
|
|
185
|
+
uniforms: this.copyUniforms,
|
|
186
|
+
vertexShader: CopyShader.vertexShader,
|
|
187
|
+
fragmentShader: CopyShader.fragmentShader,
|
|
188
|
+
blending: AdditiveBlending,
|
|
189
|
+
depthTest: false,
|
|
190
|
+
depthWrite: false,
|
|
191
|
+
transparent: true
|
|
192
|
+
} );
|
|
193
|
+
|
|
194
|
+
this._oldClearColor = new Color();
|
|
195
|
+
this._oldClearAlpha = 1;
|
|
196
|
+
|
|
197
|
+
this._basic = new MeshBasicMaterial();
|
|
198
|
+
|
|
199
|
+
this._fsQuad = new FullScreenQuad( null );
|
|
200
|
+
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
/**
|
|
204
|
+
* Frees the GPU-related resources allocated by this instance. Call this
|
|
205
|
+
* method whenever the pass is no longer used in your app.
|
|
206
|
+
*/
|
|
207
|
+
dispose() {
|
|
208
|
+
|
|
209
|
+
for ( let i = 0; i < this.renderTargetsHorizontal.length; i ++ ) {
|
|
210
|
+
|
|
211
|
+
this.renderTargetsHorizontal[ i ].dispose();
|
|
212
|
+
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
for ( let i = 0; i < this.renderTargetsVertical.length; i ++ ) {
|
|
216
|
+
|
|
217
|
+
this.renderTargetsVertical[ i ].dispose();
|
|
218
|
+
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
this.renderTargetBright.dispose();
|
|
222
|
+
|
|
223
|
+
//
|
|
224
|
+
|
|
225
|
+
for ( let i = 0; i < this.separableBlurMaterials.length; i ++ ) {
|
|
226
|
+
|
|
227
|
+
this.separableBlurMaterials[ i ].dispose();
|
|
228
|
+
|
|
229
|
+
}
|
|
230
|
+
|
|
231
|
+
this.compositeMaterial.dispose();
|
|
232
|
+
this.blendMaterial.dispose();
|
|
233
|
+
this._basic.dispose();
|
|
234
|
+
|
|
235
|
+
//
|
|
236
|
+
|
|
237
|
+
this._fsQuad.dispose();
|
|
238
|
+
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
/**
|
|
242
|
+
* Sets the size of the pass.
|
|
243
|
+
*
|
|
244
|
+
* @param {number} width - The width to set.
|
|
245
|
+
* @param {number} height - The height to set.
|
|
246
|
+
*/
|
|
247
|
+
setSize( width, height ) {
|
|
248
|
+
|
|
249
|
+
let resx = Math.round( width / 2 );
|
|
250
|
+
let resy = Math.round( height / 2 );
|
|
251
|
+
|
|
252
|
+
this.renderTargetBright.setSize( resx, resy );
|
|
253
|
+
|
|
254
|
+
for ( let i = 0; i < this.nMips; i ++ ) {
|
|
255
|
+
|
|
256
|
+
this.renderTargetsHorizontal[ i ].setSize( resx, resy );
|
|
257
|
+
this.renderTargetsVertical[ i ].setSize( resx, resy );
|
|
258
|
+
|
|
259
|
+
this.separableBlurMaterials[ i ].uniforms[ 'invSize' ].value = new Vector2( 1 / resx, 1 / resy );
|
|
260
|
+
|
|
261
|
+
resx = Math.round( resx / 2 );
|
|
262
|
+
resy = Math.round( resy / 2 );
|
|
263
|
+
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
}
|
|
267
|
+
|
|
268
|
+
/**
|
|
269
|
+
* Performs the Bloom pass.
|
|
270
|
+
*
|
|
271
|
+
* @param {WebGLRenderer} renderer - The renderer.
|
|
272
|
+
* @param {WebGLRenderTarget} writeBuffer - The write buffer. This buffer is intended as the rendering
|
|
273
|
+
* destination for the pass.
|
|
274
|
+
* @param {WebGLRenderTarget} readBuffer - The read buffer. The pass can access the result from the
|
|
275
|
+
* previous pass from this buffer.
|
|
276
|
+
* @param {number} deltaTime - The delta time in seconds.
|
|
277
|
+
* @param {boolean} maskActive - Whether masking is active or not.
|
|
278
|
+
*/
|
|
279
|
+
render( renderer, writeBuffer, readBuffer, deltaTime, maskActive ) {
|
|
280
|
+
|
|
281
|
+
renderer.getClearColor( this._oldClearColor );
|
|
282
|
+
this._oldClearAlpha = renderer.getClearAlpha();
|
|
283
|
+
const oldAutoClear = renderer.autoClear;
|
|
284
|
+
renderer.autoClear = false;
|
|
285
|
+
|
|
286
|
+
renderer.setClearColor( this.clearColor, 0 );
|
|
287
|
+
|
|
288
|
+
if ( maskActive ) renderer.state.buffers.stencil.setTest( false );
|
|
289
|
+
|
|
290
|
+
// Render input to screen
|
|
291
|
+
|
|
292
|
+
if ( this.renderToScreen ) {
|
|
293
|
+
|
|
294
|
+
this._fsQuad.material = this._basic;
|
|
295
|
+
this._basic.map = readBuffer.texture;
|
|
296
|
+
|
|
297
|
+
renderer.setRenderTarget( null );
|
|
298
|
+
renderer.clear();
|
|
299
|
+
this._fsQuad.render( renderer );
|
|
300
|
+
|
|
301
|
+
}
|
|
302
|
+
|
|
303
|
+
// 1. Extract Bright Areas
|
|
304
|
+
|
|
305
|
+
this.highPassUniforms[ 'tDiffuse' ].value = readBuffer.texture;
|
|
306
|
+
this.highPassUniforms[ 'luminosityThreshold' ].value = this.threshold;
|
|
307
|
+
this._fsQuad.material = this.materialHighPassFilter;
|
|
308
|
+
|
|
309
|
+
renderer.setRenderTarget( this.renderTargetBright );
|
|
310
|
+
renderer.clear();
|
|
311
|
+
this._fsQuad.render( renderer );
|
|
312
|
+
|
|
313
|
+
// 2. Blur All the mips progressively
|
|
314
|
+
|
|
315
|
+
let inputRenderTarget = this.renderTargetBright;
|
|
316
|
+
|
|
317
|
+
for ( let i = 0; i < this.nMips; i ++ ) {
|
|
318
|
+
|
|
319
|
+
this._fsQuad.material = this.separableBlurMaterials[ i ];
|
|
320
|
+
|
|
321
|
+
this.separableBlurMaterials[ i ].uniforms[ 'colorTexture' ].value = inputRenderTarget.texture;
|
|
322
|
+
this.separableBlurMaterials[ i ].uniforms[ 'direction' ].value = UnrealBloomPass.BlurDirectionX;
|
|
323
|
+
renderer.setRenderTarget( this.renderTargetsHorizontal[ i ] );
|
|
324
|
+
renderer.clear();
|
|
325
|
+
this._fsQuad.render( renderer );
|
|
326
|
+
|
|
327
|
+
this.separableBlurMaterials[ i ].uniforms[ 'colorTexture' ].value = this.renderTargetsHorizontal[ i ].texture;
|
|
328
|
+
this.separableBlurMaterials[ i ].uniforms[ 'direction' ].value = UnrealBloomPass.BlurDirectionY;
|
|
329
|
+
renderer.setRenderTarget( this.renderTargetsVertical[ i ] );
|
|
330
|
+
renderer.clear();
|
|
331
|
+
this._fsQuad.render( renderer );
|
|
332
|
+
|
|
333
|
+
inputRenderTarget = this.renderTargetsVertical[ i ];
|
|
334
|
+
|
|
335
|
+
}
|
|
336
|
+
|
|
337
|
+
// Composite All the mips
|
|
338
|
+
|
|
339
|
+
this._fsQuad.material = this.compositeMaterial;
|
|
340
|
+
this.compositeMaterial.uniforms[ 'bloomStrength' ].value = this.strength;
|
|
341
|
+
this.compositeMaterial.uniforms[ 'bloomRadius' ].value = this.radius;
|
|
342
|
+
this.compositeMaterial.uniforms[ 'bloomTintColors' ].value = this.bloomTintColors;
|
|
343
|
+
|
|
344
|
+
renderer.setRenderTarget( this.renderTargetsHorizontal[ 0 ] );
|
|
345
|
+
renderer.clear();
|
|
346
|
+
this._fsQuad.render( renderer );
|
|
347
|
+
|
|
348
|
+
// Blend it additively over the input texture
|
|
349
|
+
|
|
350
|
+
this._fsQuad.material = this.blendMaterial;
|
|
351
|
+
this.copyUniforms[ 'tDiffuse' ].value = this.renderTargetsHorizontal[ 0 ].texture;
|
|
352
|
+
|
|
353
|
+
if ( maskActive ) renderer.state.buffers.stencil.setTest( true );
|
|
354
|
+
|
|
355
|
+
if ( this.renderToScreen ) {
|
|
356
|
+
|
|
357
|
+
renderer.setRenderTarget( null );
|
|
358
|
+
this._fsQuad.render( renderer );
|
|
359
|
+
|
|
360
|
+
} else {
|
|
361
|
+
|
|
362
|
+
renderer.setRenderTarget( readBuffer );
|
|
363
|
+
this._fsQuad.render( renderer );
|
|
364
|
+
|
|
365
|
+
}
|
|
366
|
+
|
|
367
|
+
// Restore renderer settings
|
|
368
|
+
|
|
369
|
+
renderer.setClearColor( this._oldClearColor, this._oldClearAlpha );
|
|
370
|
+
renderer.autoClear = oldAutoClear;
|
|
371
|
+
|
|
372
|
+
}
|
|
373
|
+
|
|
374
|
+
// internals
|
|
375
|
+
|
|
376
|
+
_getSeparableBlurMaterial( kernelRadius ) {
|
|
377
|
+
|
|
378
|
+
const coefficients = [];
|
|
379
|
+
|
|
380
|
+
for ( let i = 0; i < kernelRadius; i ++ ) {
|
|
381
|
+
|
|
382
|
+
coefficients.push( 0.39894 * Math.exp( - 0.5 * i * i / ( kernelRadius * kernelRadius ) ) / kernelRadius );
|
|
383
|
+
|
|
384
|
+
}
|
|
385
|
+
|
|
386
|
+
return new ShaderMaterial( {
|
|
387
|
+
|
|
388
|
+
defines: {
|
|
389
|
+
'KERNEL_RADIUS': kernelRadius
|
|
390
|
+
},
|
|
391
|
+
|
|
392
|
+
uniforms: {
|
|
393
|
+
'colorTexture': { value: null },
|
|
394
|
+
'invSize': { value: new Vector2( 0.5, 0.5 ) }, // inverse texture size
|
|
395
|
+
'direction': { value: new Vector2( 0.5, 0.5 ) },
|
|
396
|
+
'gaussianCoefficients': { value: coefficients } // precomputed Gaussian coefficients
|
|
397
|
+
},
|
|
398
|
+
|
|
399
|
+
vertexShader:
|
|
400
|
+
`varying vec2 vUv;
|
|
401
|
+
void main() {
|
|
402
|
+
vUv = uv;
|
|
403
|
+
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
|
|
404
|
+
}`,
|
|
405
|
+
|
|
406
|
+
fragmentShader:
|
|
407
|
+
`#include <common>
|
|
408
|
+
varying vec2 vUv;
|
|
409
|
+
uniform sampler2D colorTexture;
|
|
410
|
+
uniform vec2 invSize;
|
|
411
|
+
uniform vec2 direction;
|
|
412
|
+
uniform float gaussianCoefficients[KERNEL_RADIUS];
|
|
413
|
+
|
|
414
|
+
void main() {
|
|
415
|
+
float weightSum = gaussianCoefficients[0];
|
|
416
|
+
vec3 diffuseSum = texture2D( colorTexture, vUv ).rgb * weightSum;
|
|
417
|
+
for( int i = 1; i < KERNEL_RADIUS; i ++ ) {
|
|
418
|
+
float x = float(i);
|
|
419
|
+
float w = gaussianCoefficients[i];
|
|
420
|
+
vec2 uvOffset = direction * invSize * x;
|
|
421
|
+
vec3 sample1 = texture2D( colorTexture, vUv + uvOffset ).rgb;
|
|
422
|
+
vec3 sample2 = texture2D( colorTexture, vUv - uvOffset ).rgb;
|
|
423
|
+
diffuseSum += (sample1 + sample2) * w;
|
|
424
|
+
weightSum += 2.0 * w;
|
|
425
|
+
}
|
|
426
|
+
gl_FragColor = vec4(diffuseSum/weightSum, 1.0);
|
|
427
|
+
}`
|
|
428
|
+
} );
|
|
429
|
+
|
|
430
|
+
}
|
|
431
|
+
|
|
432
|
+
_getCompositeMaterial( nMips ) {
|
|
433
|
+
|
|
434
|
+
return new ShaderMaterial( {
|
|
435
|
+
|
|
436
|
+
defines: {
|
|
437
|
+
'NUM_MIPS': nMips
|
|
438
|
+
},
|
|
439
|
+
|
|
440
|
+
uniforms: {
|
|
441
|
+
'blurTexture1': { value: null },
|
|
442
|
+
'blurTexture2': { value: null },
|
|
443
|
+
'blurTexture3': { value: null },
|
|
444
|
+
'blurTexture4': { value: null },
|
|
445
|
+
'blurTexture5': { value: null },
|
|
446
|
+
'bloomStrength': { value: 1.0 },
|
|
447
|
+
'bloomFactors': { value: null },
|
|
448
|
+
'bloomTintColors': { value: null },
|
|
449
|
+
'bloomRadius': { value: 0.0 }
|
|
450
|
+
},
|
|
451
|
+
|
|
452
|
+
vertexShader:
|
|
453
|
+
`varying vec2 vUv;
|
|
454
|
+
void main() {
|
|
455
|
+
vUv = uv;
|
|
456
|
+
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
|
|
457
|
+
}`,
|
|
458
|
+
|
|
459
|
+
fragmentShader:
|
|
460
|
+
`varying vec2 vUv;
|
|
461
|
+
uniform sampler2D blurTexture1;
|
|
462
|
+
uniform sampler2D blurTexture2;
|
|
463
|
+
uniform sampler2D blurTexture3;
|
|
464
|
+
uniform sampler2D blurTexture4;
|
|
465
|
+
uniform sampler2D blurTexture5;
|
|
466
|
+
uniform float bloomStrength;
|
|
467
|
+
uniform float bloomRadius;
|
|
468
|
+
uniform float bloomFactors[NUM_MIPS];
|
|
469
|
+
uniform vec3 bloomTintColors[NUM_MIPS];
|
|
470
|
+
|
|
471
|
+
float lerpBloomFactor(const in float factor) {
|
|
472
|
+
float mirrorFactor = 1.2 - factor;
|
|
473
|
+
return mix(factor, mirrorFactor, bloomRadius);
|
|
474
|
+
}
|
|
475
|
+
|
|
476
|
+
void main() {
|
|
477
|
+
gl_FragColor = bloomStrength * ( lerpBloomFactor(bloomFactors[0]) * vec4(bloomTintColors[0], 1.0) * texture2D(blurTexture1, vUv) +
|
|
478
|
+
lerpBloomFactor(bloomFactors[1]) * vec4(bloomTintColors[1], 1.0) * texture2D(blurTexture2, vUv) +
|
|
479
|
+
lerpBloomFactor(bloomFactors[2]) * vec4(bloomTintColors[2], 1.0) * texture2D(blurTexture3, vUv) +
|
|
480
|
+
lerpBloomFactor(bloomFactors[3]) * vec4(bloomTintColors[3], 1.0) * texture2D(blurTexture4, vUv) +
|
|
481
|
+
lerpBloomFactor(bloomFactors[4]) * vec4(bloomTintColors[4], 1.0) * texture2D(blurTexture5, vUv) );
|
|
482
|
+
}`
|
|
483
|
+
} );
|
|
484
|
+
|
|
485
|
+
}
|
|
486
|
+
|
|
487
|
+
}
|
|
488
|
+
|
|
489
|
+
UnrealBloomPass.BlurDirectionX = new Vector2( 1.0, 0.0 );
|
|
490
|
+
UnrealBloomPass.BlurDirectionY = new Vector2( 0.0, 1.0 );
|
|
491
|
+
|
|
492
|
+
export { UnrealBloomPass };
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @module CopyShader
|
|
3
|
+
* @three_import import { CopyShader } from 'three/addons/shaders/CopyShader.js';
|
|
4
|
+
*/
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Full-screen copy shader pass.
|
|
8
|
+
*
|
|
9
|
+
* @constant
|
|
10
|
+
* @type {ShaderMaterial~Shader}
|
|
11
|
+
*/
|
|
12
|
+
const CopyShader = {
|
|
13
|
+
|
|
14
|
+
name: 'CopyShader',
|
|
15
|
+
|
|
16
|
+
uniforms: {
|
|
17
|
+
|
|
18
|
+
'tDiffuse': { value: null },
|
|
19
|
+
'opacity': { value: 1.0 }
|
|
20
|
+
|
|
21
|
+
},
|
|
22
|
+
|
|
23
|
+
vertexShader: /* glsl */`
|
|
24
|
+
|
|
25
|
+
varying vec2 vUv;
|
|
26
|
+
|
|
27
|
+
void main() {
|
|
28
|
+
|
|
29
|
+
vUv = uv;
|
|
30
|
+
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
|
|
31
|
+
|
|
32
|
+
}`,
|
|
33
|
+
|
|
34
|
+
fragmentShader: /* glsl */`
|
|
35
|
+
|
|
36
|
+
uniform float opacity;
|
|
37
|
+
|
|
38
|
+
uniform sampler2D tDiffuse;
|
|
39
|
+
|
|
40
|
+
varying vec2 vUv;
|
|
41
|
+
|
|
42
|
+
void main() {
|
|
43
|
+
|
|
44
|
+
vec4 texel = texture2D( tDiffuse, vUv );
|
|
45
|
+
gl_FragColor = opacity * texel;
|
|
46
|
+
|
|
47
|
+
|
|
48
|
+
}`
|
|
49
|
+
|
|
50
|
+
};
|
|
51
|
+
|
|
52
|
+
export { CopyShader };
|