diff --git a/examples/jsm/postprocessing/WebaWaterPass.js b/examples/jsm/postprocessing/WebaWaterPass.js index ffc3ad20d5..041f0fa139 100644 --- a/examples/jsm/postprocessing/WebaWaterPass.js +++ b/examples/jsm/postprocessing/WebaWaterPass.js @@ -21,13 +21,13 @@ import { import { Pass, FullScreenQuad } from '../postprocessing/Pass.js'; import { WebaWaterSSRShader } from '../shaders/WebaWaterShader.js'; import { WebaWaterSSRBlurShader } from '../shaders/WebaWaterShader.js'; -import { WebaWaterEdgeHBlurShader, WebaWaterEdgeVBlurShader, WebaWaterMaskShader, WebaWaterBlankShader, WebaWaterCombineShader } from '../shaders/WebaWaterShader.js'; +import { WebaWaterEdgeHBlurShader, WebaWaterEdgeVBlurShader, WebaWaterMaskShader} from '../shaders/WebaWaterShader.js'; import { CopyShader } from '../shaders/CopyShader.js'; import { DoubleSide } from 'three'; class WebaWaterPass extends Pass { - constructor( { renderer, scene, camera, width, height, selects, bouncing = false, invisibleSelects } ) { + constructor( { renderer, scene, camera, width, height, selects, bouncing = false} ) { super(); @@ -48,28 +48,6 @@ class WebaWaterPass extends Pass { this.tempColor = new Color(); - // this.foamDepthMaterial = foamDepthMaterial; - // this.foamRenderTarget = foamRenderTarget; - - const pixelRatio = renderer.getPixelRatio(); - this.foamRenderTarget = new WebGLRenderTarget( - window.innerWidth * pixelRatio, - window.innerHeight * pixelRatio - ); - this.foamRenderTarget.texture.minFilter = NearestFilter; - this.foamRenderTarget.texture.magFilter = NearestFilter; - this.foamRenderTarget.texture.generateMipmaps = false; - this.foamRenderTarget.stencilBuffer = false; - - - - this.foamDepthMaterial = new MeshDepthMaterial(); - this.foamDepthMaterial.depthPacking = RGBADepthPacking; - this.foamDepthMaterial.blending = NoBlending; - - - this.invisibleSelects = invisibleSelects; - this._selects = selects; this.selective = Array.isArray( this._selects ); @@ -351,42 +329,6 @@ class WebaWaterPass extends Pass { this.originalClearColor = new Color(); - this.blankMaterial = new ShaderMaterial( { - defines: Object.assign( {}, WebaWaterBlankShader.defines ), - uniforms: UniformsUtils.clone( WebaWaterBlankShader.uniforms ), - vertexShader: WebaWaterBlankShader.vertexShader, - fragmentShader: WebaWaterBlankShader.fragmentShader - } ); - this.blankRenderTarget = this.ssrRenderTarget.clone(); - - this.combineMaterial = new ShaderMaterial( { - defines: Object.assign( {}, WebaWaterCombineShader.defines ), - uniforms: UniformsUtils.clone( WebaWaterCombineShader.uniforms ), - vertexShader: WebaWaterCombineShader.vertexShader, - fragmentShader: WebaWaterCombineShader.fragmentShader, - } ); - this.combineRenderTarget = this.ssrRenderTarget.clone(); - // this.combineMaterial.uniforms[ 'cameraNear' ].value = this.camera.near; - // this.combineMaterial.uniforms[ 'cameraFar' ].value = this.camera.far; - // this.combineMaterial.uniforms[ 'cameraProjectionMatrix' ].value.copy( this.camera.projectionMatrix ); - // this.combineMaterial.uniforms[ 'cameraInverseProjectionMatrix' ].value.copy( this.camera.projectionMatrixInverse ); - // this.combineMaterial.uniforms[ 'cameraMatrixWorldInverse' ].value.copy( this.camera.matrixWorldInverse ); - - - this.playerOnMaterial = new MeshBasicMaterial( { - color: 'white', - side: DoubleSide, - } ); - this.playerOffMaterial = new MeshBasicMaterial( { - color: 'black', - side: DoubleSide, - } ); - this.playerRenderTarget = new WebGLRenderTarget( this.width, this.height, { - minFilter: NearestFilter, - magFilter: NearestFilter, - format: RGBAFormat - } ); - } dispose() { @@ -620,45 +562,6 @@ class WebaWaterPass extends Pass { console.warn( 'THREE.WebaWaterPass: Unknown output type.' ); } - if(this.foamDepthMaterial && this.foamRenderTarget){ - - this.originalClearColor.copy( renderer.getClearColor( this.tempColor ) ); - const originalClearAlpha = renderer.getClearAlpha( this.tempColor ); - const originalAutoClear = renderer.autoClear; - - renderer.setRenderTarget(this.foamRenderTarget); - renderer.autoClear = false; - - const clearColor = this.foamDepthMaterial.clearColor || 0; - const clearAlpha = this.foamDepthMaterial.clearAlpha || 0; - - if ( ( clearColor !== undefined ) && ( clearColor !== null ) ) { - - renderer.setClearColor( clearColor ); - renderer.setClearAlpha( clearAlpha || 0.0 ); - renderer.clear(); - - } - - for(const invisibleSelect of this.invisibleSelects){ - - invisibleSelect.visible = false; - } - this.scene.overrideMaterial = this.foamDepthMaterial; - - // renderer.setRenderTarget(this.renderTarget); - renderer.render(this.scene, this.camera); - renderer.setRenderTarget(null); - - this.scene.overrideMaterial = null; - for(const invisibleSelect of this.invisibleSelects){ - invisibleSelect.visible = true; - } - - renderer.autoClear = originalAutoClear; - renderer.setClearColor( this.originalClearColor ); - renderer.setClearAlpha( originalClearAlpha ); - } } @@ -800,69 +703,11 @@ class WebaWaterPass extends Pass { } } ); - for(const invisibleSelect of this.invisibleSelects){ - invisibleSelect.visible = false; - } - renderer.render( this.scene, this.camera ); - for(const invisibleSelect of this.invisibleSelects){ - - invisibleSelect.visible = true; - } - this.scene.traverseVisible( child => { - - child.material = child._WebaWaterPassBackupMaterial; - - } ); - - // restore original state - - renderer.autoClear = originalAutoClear; - renderer.setClearColor( this.originalClearColor ); - renderer.setClearAlpha( originalClearAlpha ); - - this.renderPlayer( renderer, this.playerOnMaterial, this.playerRenderTarget, 0, 0 ); - - } - renderPlayer( renderer, overrideMaterial, renderTarget, clearColor, clearAlpha ) { - - this.originalClearColor.copy( renderer.getClearColor( this.tempColor ) ); - const originalClearAlpha = renderer.getClearAlpha( this.tempColor ); - const originalAutoClear = renderer.autoClear; - - renderer.setRenderTarget( renderTarget ); - renderer.autoClear = false; - - clearColor = overrideMaterial.clearColor || clearColor; - clearAlpha = overrideMaterial.clearAlpha || clearAlpha; - - if ( ( clearColor !== undefined ) && ( clearColor !== null ) ) { - - renderer.setClearColor( clearColor ); - renderer.setClearAlpha( clearAlpha || 0.0 ); - renderer.clear(); - - } - - this.scene.traverseVisible( child => { - - child._WebaWaterPassBackupMaterial = child.material; - if ( this._selects.includes( child ) ) { - - child.material = this.playerOnMaterial; - - } else { - - child.material = this.playerOffMaterial; - - } - - } ); renderer.render( this.scene, this.camera ); + this.scene.traverseVisible( child => { - child.material = child._WebaWaterPassBackupMaterial; - } ); diff --git a/examples/jsm/shaders/WebaWaterShader.js b/examples/jsm/shaders/WebaWaterShader.js index 41170a9fd0..87d7f6a02a 100644 --- a/examples/jsm/shaders/WebaWaterShader.js +++ b/examples/jsm/shaders/WebaWaterShader.js @@ -158,10 +158,10 @@ var WebaWaterSSRShader = { #endif // v1 - vec3 distortion = (texture2D(distortionTexture, vec2(0.5 * vUv.x + uTime / 10., 3. * vUv.y) * 1.).rgb) * 0.025; - vec3 distortion2 = (texture2D(distortionTexture, vec2(0.3 * -vUv.x - uTime / 30., 0.1 * vUv.y - uTime / 30.)).rgb) * 0.025; + vec3 distortion = (texture2D(distortionTexture, vec2(0.5 * vUv.x + uTime / 30., 3. * vUv.y - uTime / 30.) * 1.).rgb) * 0.1; + vec3 distortion2 = (texture2D(distortionTexture, vec2(0.3 * -vUv.x - uTime / 30., 0.1 * vUv.y - uTime / 30.)).rgb) * 0.1; vec3 reflectUv = distortion + distortion2; - reflectUv = clamp(reflectUv, 0.001, 0.999); + reflectUv = clamp(reflectUv, 0.035, 0.999); // v2 // vec2 flowmap = texture2D(distortionTexture, vUv / 20.).rg * 2. - 1.; @@ -395,7 +395,7 @@ var WebaWaterSSRBlurShader = { vec2 offset; - offset=(vec2(-1,0))*texelSize * 20.; + offset=(vec2(-1,0))*texelSize; vec4 cl=texture2D(tDiffuse,vUv+offset); offset=(vec2(1,0))*texelSize; @@ -628,111 +628,6 @@ var WebaWaterMaskShader = { }; -var WebaWaterBlankShader = { - vertexShader: /* glsl */` - void main() { - gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); - } - - `, - - fragmentShader: /* glsl */` - void main() { - gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0); - } - ` - - -}; - -var WebaWaterCombineShader = { - - uniforms: { - 'time': { value: 0 }, - 'tDiffuse': { value: null }, - 'tMask': { value: null }, - 'tDepth': { value: null }, - 'tPlayer': { value: null }, - 'dudvMap': { value: null }, - 'resolution': { value: new Vector2()}, - 'cameraInverseProjectionMatrix': { value: new Matrix4() }, - 'uMatrixWorld': { value: new Matrix4() }, - - - }, - - vertexShader: /* glsl */` - - varying vec2 vUv; - varying vec3 vPos; - - void main() { - - vUv = uv; - vPos = position; - gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); - - - } - - `, - - fragmentShader: /* glsl */` - #include - #include - uniform mat4 cameraInverseProjectionMatrix; - uniform mat4 uMatrixWorld; - - uniform sampler2D tDiffuse; - uniform sampler2D tMask; - uniform sampler2D tPlayer; - uniform sampler2D dudvMap; - uniform sampler2D tDepth; - uniform vec2 resolution; - uniform float time; - - varying vec2 vUv; - varying vec3 vPos; - - void main() { - vec4 diffuse = texture2D( tDiffuse, vUv ); - vec4 mask = texture2D( tMask, vUv ); - vec4 player = texture2D( tPlayer, vUv ); - - float normalizedDepth = unpackRGBAToDepth( texture2D( tDepth, gl_FragCoord.xy / resolution) ); - vec4 ndc = vec4( - (vUv.x - 0.5) * 2.0, - (vUv.y - 0.5) * 2.0, - (normalizedDepth - 0.5) * 2.0, - 1.0); - - - vec4 clip = cameraInverseProjectionMatrix * ndc; - vec4 view = uMatrixWorld * (clip / clip.w); - vec3 worldPos = view.xyz; - - - if(mask.a > 0.1 && mask.r < 1. && player.r > 0.1){ - float diff = mask.r; - - - vec2 channelA = texture2D( dudvMap, vec2(0.25 * worldPos.x + time * 0.08, 0.5 * worldPos.z - time * 0.05) ).rg; - vec2 channelB = texture2D( dudvMap, vec2(0.5 * worldPos.x - time * 0.07, 0.35 * worldPos.z + time * 0.06) ).rg; - - vec2 displacement = (channelA + channelB) * 0.5; - displacement = ( ( displacement * 2.0 ) - 1.0 ) * 1.0; - diff += displacement.x; - - gl_FragColor = mix( vec4(1.0, 1.0, 1.0, diffuse.a), diffuse, step( 0.5, diff ) ); - } - else{ - gl_FragColor = diffuse; - } - } - ` - - -}; -export { WebaWaterSSRShader, WebaWaterSSRDepthShader, WebaWaterSSRBlurShader, WebaWaterEdgeHBlurShader, WebaWaterEdgeVBlurShader, WebaWaterMaskShader, WebaWaterBlankShader, WebaWaterCombineShader }; \ No newline at end of file +export { WebaWaterSSRShader, WebaWaterSSRDepthShader, WebaWaterSSRBlurShader, WebaWaterEdgeHBlurShader, WebaWaterEdgeVBlurShader, WebaWaterMaskShader}; \ No newline at end of file