three-stdlib 2.15.1 → 2.15.2

package/objects/Water.mjs

@@ -0,0 +1,235 @@
+import { Mesh, Vector3, Color, FrontSide, Plane, Matrix4, Vector4, PerspectiveCamera, WebGLRenderTarget, UniformsUtils, UniformsLib, ShaderMaterial } from "three";
+class Water extends Mesh {
+  constructor(geometry, options = {}) {
+    super(geometry);
+    const scope = this;
+    const textureWidth = options.textureWidth !== void 0 ? options.textureWidth : 512;
+    const textureHeight = options.textureHeight !== void 0 ? options.textureHeight : 512;
+    const clipBias = options.clipBias !== void 0 ? options.clipBias : 0;
+    const alpha = options.alpha !== void 0 ? options.alpha : 1;
+    const time = options.time !== void 0 ? options.time : 0;
+    const normalSampler = options.waterNormals !== void 0 ? options.waterNormals : null;
+    const sunDirection = options.sunDirection !== void 0 ? options.sunDirection : new Vector3(0.70707, 0.70707, 0);
+    const sunColor = new Color(options.sunColor !== void 0 ? options.sunColor : 16777215);
+    const waterColor = new Color(options.waterColor !== void 0 ? options.waterColor : 8355711);
+    const eye = options.eye !== void 0 ? options.eye : new Vector3(0, 0, 0);
+    const distortionScale = options.distortionScale !== void 0 ? options.distortionScale : 20;
+    const side = options.side !== void 0 ? options.side : FrontSide;
+    const fog = options.fog !== void 0 ? options.fog : false;
+    const mirrorPlane = new Plane();
+    const normal = new Vector3();
+    const mirrorWorldPosition = new Vector3();
+    const cameraWorldPosition = new Vector3();
+    const rotationMatrix = new Matrix4();
+    const lookAtPosition = new Vector3(0, 0, -1);
+    const clipPlane = new Vector4();
+    const view = new Vector3();
+    const target = new Vector3();
+    const q = new Vector4();
+    const textureMatrix = new Matrix4();
+    const mirrorCamera = new PerspectiveCamera();
+    const renderTarget = new WebGLRenderTarget(textureWidth, textureHeight);
+    const mirrorShader = {
+      uniforms: UniformsUtils.merge([
+        UniformsLib["fog"],
+        UniformsLib["lights"],
+        {
+          normalSampler: { value: null },
+          mirrorSampler: { value: null },
+          alpha: { value: 1 },
+          time: { value: 0 },
+          size: { value: 1 },
+          distortionScale: { value: 20 },
+          textureMatrix: { value: new Matrix4() },
+          sunColor: { value: new Color(8355711) },
+          sunDirection: { value: new Vector3(0.70707, 0.70707, 0) },
+          eye: { value: new Vector3() },
+          waterColor: { value: new Color(5592405) }
+        }
+      ]),
+      vertexShader: `
+				uniform mat4 textureMatrix;
+				uniform float time;
+
+				varying vec4 mirrorCoord;
+				varying vec4 worldPosition;
+
+				#include <common>
+				#include <fog_pars_vertex>
+				#include <shadowmap_pars_vertex>
+				#include <logdepthbuf_pars_vertex>
+
+				void main() {
+					mirrorCoord = modelMatrix * vec4( position, 1.0 );
+					worldPosition = mirrorCoord.xyzw;
+					mirrorCoord = textureMatrix * mirrorCoord;
+					vec4 mvPosition =  modelViewMatrix * vec4( position, 1.0 );
+					gl_Position = projectionMatrix * mvPosition;
+
+				#include <beginnormal_vertex>
+				#include <defaultnormal_vertex>
+				#include <logdepthbuf_vertex>
+				#include <fog_vertex>
+				#include <shadowmap_vertex>
+			}`,
+      fragmentShader: `
+				uniform sampler2D mirrorSampler;
+				uniform float alpha;
+				uniform float time;
+				uniform float size;
+				uniform float distortionScale;
+				uniform sampler2D normalSampler;
+				uniform vec3 sunColor;
+				uniform vec3 sunDirection;
+				uniform vec3 eye;
+				uniform vec3 waterColor;
+
+				varying vec4 mirrorCoord;
+				varying vec4 worldPosition;
+
+				vec4 getNoise( vec2 uv ) {
+					vec2 uv0 = ( uv / 103.0 ) + vec2(time / 17.0, time / 29.0);
+					vec2 uv1 = uv / 107.0-vec2( time / -19.0, time / 31.0 );
+					vec2 uv2 = uv / vec2( 8907.0, 9803.0 ) + vec2( time / 101.0, time / 97.0 );
+					vec2 uv3 = uv / vec2( 1091.0, 1027.0 ) - vec2( time / 109.0, time / -113.0 );
+					vec4 noise = texture2D( normalSampler, uv0 ) +
+						texture2D( normalSampler, uv1 ) +
+						texture2D( normalSampler, uv2 ) +
+						texture2D( normalSampler, uv3 );
+					return noise * 0.5 - 1.0;
+				}
+
+				void sunLight( const vec3 surfaceNormal, const vec3 eyeDirection, float shiny, float spec, float diffuse, inout vec3 diffuseColor, inout vec3 specularColor ) {
+					vec3 reflection = normalize( reflect( -sunDirection, surfaceNormal ) );
+					float direction = max( 0.0, dot( eyeDirection, reflection ) );
+					specularColor += pow( direction, shiny ) * sunColor * spec;
+					diffuseColor += max( dot( sunDirection, surfaceNormal ), 0.0 ) * sunColor * diffuse;
+				}
+
+				#include <common>
+				#include <packing>
+				#include <bsdfs>
+				#include <fog_pars_fragment>
+				#include <logdepthbuf_pars_fragment>
+				#include <lights_pars_begin>
+				#include <shadowmap_pars_fragment>
+				#include <shadowmask_pars_fragment>
+
+				void main() {
+
+					#include <logdepthbuf_fragment>
+					vec4 noise = getNoise( worldPosition.xz * size );
+					vec3 surfaceNormal = normalize( noise.xzy * vec3( 1.5, 1.0, 1.5 ) );
+
+					vec3 diffuseLight = vec3(0.0);
+					vec3 specularLight = vec3(0.0);
+
+					vec3 worldToEye = eye-worldPosition.xyz;
+					vec3 eyeDirection = normalize( worldToEye );
+					sunLight( surfaceNormal, eyeDirection, 100.0, 2.0, 0.5, diffuseLight, specularLight );
+
+					float distance = length(worldToEye);
+
+					vec2 distortion = surfaceNormal.xz * ( 0.001 + 1.0 / distance ) * distortionScale;
+					vec3 reflectionSample = vec3( texture2D( mirrorSampler, mirrorCoord.xy / mirrorCoord.w + distortion ) );
+
+					float theta = max( dot( eyeDirection, surfaceNormal ), 0.0 );
+					float rf0 = 0.3;
+					float reflectance = rf0 + ( 1.0 - rf0 ) * pow( ( 1.0 - theta ), 5.0 );
+					vec3 scatter = max( 0.0, dot( surfaceNormal, eyeDirection ) ) * waterColor;
+					vec3 albedo = mix( ( sunColor * diffuseLight * 0.3 + scatter ) * getShadowMask(), ( vec3( 0.1 ) + reflectionSample * 0.9 + reflectionSample * specularLight ), reflectance);
+					vec3 outgoingLight = albedo;
+					gl_FragColor = vec4( outgoingLight, alpha );
+
+					#include <tonemapping_fragment>
+					#include <fog_fragment>
+				}`
+    };
+    const material = new ShaderMaterial({
+      fragmentShader: mirrorShader.fragmentShader,
+      vertexShader: mirrorShader.vertexShader,
+      uniforms: UniformsUtils.clone(mirrorShader.uniforms),
+      lights: true,
+      side,
+      fog
+    });
+    material.uniforms["mirrorSampler"].value = renderTarget.texture;
+    material.uniforms["textureMatrix"].value = textureMatrix;
+    material.uniforms["alpha"].value = alpha;
+    material.uniforms["time"].value = time;
+    material.uniforms["normalSampler"].value = normalSampler;
+    material.uniforms["sunColor"].value = sunColor;
+    material.uniforms["waterColor"].value = waterColor;
+    material.uniforms["sunDirection"].value = sunDirection;
+    material.uniforms["distortionScale"].value = distortionScale;
+    material.uniforms["eye"].value = eye;
+    scope.material = material;
+    scope.onBeforeRender = function(renderer, scene, camera) {
+      mirrorWorldPosition.setFromMatrixPosition(scope.matrixWorld);
+      cameraWorldPosition.setFromMatrixPosition(camera.matrixWorld);
+      rotationMatrix.extractRotation(scope.matrixWorld);
+      normal.set(0, 0, 1);
+      normal.applyMatrix4(rotationMatrix);
+      view.subVectors(mirrorWorldPosition, cameraWorldPosition);
+      if (view.dot(normal) > 0)
+        return;
+      view.reflect(normal).negate();
+      view.add(mirrorWorldPosition);
+      rotationMatrix.extractRotation(camera.matrixWorld);
+      lookAtPosition.set(0, 0, -1);
+      lookAtPosition.applyMatrix4(rotationMatrix);
+      lookAtPosition.add(cameraWorldPosition);
+      target.subVectors(mirrorWorldPosition, lookAtPosition);
+      target.reflect(normal).negate();
+      target.add(mirrorWorldPosition);
+      mirrorCamera.position.copy(view);
+      mirrorCamera.up.set(0, 1, 0);
+      mirrorCamera.up.applyMatrix4(rotationMatrix);
+      mirrorCamera.up.reflect(normal);
+      mirrorCamera.lookAt(target);
+      mirrorCamera.far = camera.far;
+      mirrorCamera.updateMatrixWorld();
+      mirrorCamera.projectionMatrix.copy(camera.projectionMatrix);
+      textureMatrix.set(0.5, 0, 0, 0.5, 0, 0.5, 0, 0.5, 0, 0, 0.5, 0.5, 0, 0, 0, 1);
+      textureMatrix.multiply(mirrorCamera.projectionMatrix);
+      textureMatrix.multiply(mirrorCamera.matrixWorldInverse);
+      mirrorPlane.setFromNormalAndCoplanarPoint(normal, mirrorWorldPosition);
+      mirrorPlane.applyMatrix4(mirrorCamera.matrixWorldInverse);
+      clipPlane.set(mirrorPlane.normal.x, mirrorPlane.normal.y, mirrorPlane.normal.z, mirrorPlane.constant);
+      const projectionMatrix = mirrorCamera.projectionMatrix;
+      q.x = (Math.sign(clipPlane.x) + projectionMatrix.elements[8]) / projectionMatrix.elements[0];
+      q.y = (Math.sign(clipPlane.y) + projectionMatrix.elements[9]) / projectionMatrix.elements[5];
+      q.z = -1;
+      q.w = (1 + projectionMatrix.elements[10]) / projectionMatrix.elements[14];
+      clipPlane.multiplyScalar(2 / clipPlane.dot(q));
+      projectionMatrix.elements[2] = clipPlane.x;
+      projectionMatrix.elements[6] = clipPlane.y;
+      projectionMatrix.elements[10] = clipPlane.z + 1 - clipBias;
+      projectionMatrix.elements[14] = clipPlane.w;
+      eye.setFromMatrixPosition(camera.matrixWorld);
+      const currentRenderTarget = renderer.getRenderTarget();
+      const currentXrEnabled = renderer.xr.enabled;
+      const currentShadowAutoUpdate = renderer.shadowMap.autoUpdate;
+      scope.visible = false;
+      renderer.xr.enabled = false;
+      renderer.shadowMap.autoUpdate = false;
+      renderer.setRenderTarget(renderTarget);
+      renderer.state.buffers.depth.setMask(true);
+      if (renderer.autoClear === false)
+        renderer.clear();
+      renderer.render(scene, mirrorCamera);
+      scope.visible = true;
+      renderer.xr.enabled = currentXrEnabled;
+      renderer.shadowMap.autoUpdate = currentShadowAutoUpdate;
+      renderer.setRenderTarget(currentRenderTarget);
+      const viewport = camera.viewport;
+      if (viewport !== void 0) {
+        renderer.state.viewport(viewport);
+      }
+    };
+  }
+}
+Water.prototype.isWater = true;
+export {
+  Water
+};

package/objects/Water2.js

@@ -1,133 +1,104 @@
-import { Mesh, Color, Vector2, LinearEncoding, TextureLoader, Matrix4, Clock, ShaderMaterial, UniformsUtils, UniformsLib, RepeatWrapping, Vector4 } from 'three';
-import { Reflector } from './Reflector.js';
-import { Refractor } from './Refractor.js';
-
-/**
- * References:
- *	http://www.valvesoftware.com/publications/2010/siggraph2010_vlachos_waterflow.pdf
- * 	http://graphicsrunner.blogspot.de/2010/08/water-using-flow-maps.html
- *
- */
-
-class Water2 extends Mesh {
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const THREE = require("three");
+const Reflector = require("./Reflector.js");
+const Refractor = require("./Refractor.js");
+class Water2 extends THREE.Mesh {
   constructor(geometry, options = {}) {
     super(geometry);
-    this.type = 'Water';
+    this.type = "Water";
     const scope = this;
-    const color = options.color !== undefined ? new Color(options.color) : new Color(0xffffff);
+    const color = options.color !== void 0 ? new THREE.Color(options.color) : new THREE.Color(16777215);
     const textureWidth = options.textureWidth || 512;
     const textureHeight = options.textureHeight || 512;
     const clipBias = options.clipBias || 0;
-    const flowDirection = options.flowDirection || new Vector2(1, 0);
+    const flowDirection = options.flowDirection || new THREE.Vector2(1, 0);
     const flowSpeed = options.flowSpeed || 0.03;
     const reflectivity = options.reflectivity || 0.02;
     const scale = options.scale || 1;
     const shader = options.shader || Water.WaterShader;
-    const encoding = options.encoding !== undefined ? options.encoding : LinearEncoding;
-    const textureLoader = new TextureLoader();
-    const flowMap = options.flowMap || undefined;
-    const normalMap0 = options.normalMap0 || textureLoader.load('textures/water/Water_1_M_Normal.jpg');
-    const normalMap1 = options.normalMap1 || textureLoader.load('textures/water/Water_2_M_Normal.jpg');
-    const cycle = 0.15; // a cycle of a flow map phase
-
+    const encoding = options.encoding !== void 0 ? options.encoding : THREE.LinearEncoding;
+    const textureLoader = new THREE.TextureLoader();
+    const flowMap = options.flowMap || void 0;
+    const normalMap0 = options.normalMap0 || textureLoader.load("textures/water/Water_1_M_Normal.jpg");
+    const normalMap1 = options.normalMap1 || textureLoader.load("textures/water/Water_2_M_Normal.jpg");
+    const cycle = 0.15;
     const halfCycle = cycle * 0.5;
-    const textureMatrix = new Matrix4();
-    const clock = new Clock(); // internal components
-
-    if (Reflector === undefined) {
-      console.error('THREE.Water: Required component Reflector not found.');
+    const textureMatrix = new THREE.Matrix4();
+    const clock = new THREE.Clock();
+    if (Reflector.Reflector === void 0) {
+      console.error("THREE.Water: Required component Reflector not found.");
       return;
     }
-
-    if (Refractor === undefined) {
-      console.error('THREE.Water: Required component Refractor not found.');
+    if (Refractor.Refractor === void 0) {
+      console.error("THREE.Water: Required component Refractor not found.");
       return;
     }
-
-    const reflector = new Reflector(geometry, {
-      textureWidth: textureWidth,
-      textureHeight: textureHeight,
-      clipBias: clipBias,
-      encoding: encoding
+    const reflector = new Reflector.Reflector(geometry, {
+      textureWidth,
+      textureHeight,
+      clipBias,
+      encoding
     });
-    const refractor = new Refractor(geometry, {
-      textureWidth: textureWidth,
-      textureHeight: textureHeight,
-      clipBias: clipBias,
-      encoding: encoding
+    const refractor = new Refractor.Refractor(geometry, {
+      textureWidth,
+      textureHeight,
+      clipBias,
+      encoding
     });
     reflector.matrixAutoUpdate = false;
-    refractor.matrixAutoUpdate = false; // material
-
-    this.material = new ShaderMaterial({
-      uniforms: UniformsUtils.merge([UniformsLib['fog'], shader.uniforms]),
+    refractor.matrixAutoUpdate = false;
+    this.material = new THREE.ShaderMaterial({
+      uniforms: THREE.UniformsUtils.merge([THREE.UniformsLib["fog"], shader.uniforms]),
       vertexShader: shader.vertexShader,
       fragmentShader: shader.fragmentShader,
       transparent: true,
       fog: true
     });
-
-    if (flowMap !== undefined) {
-      this.material.defines.USE_FLOWMAP = '';
-      this.material.uniforms['tFlowMap'] = {
-        type: 't',
+    if (flowMap !== void 0) {
+      this.material.defines.USE_FLOWMAP = "";
+      this.material.uniforms["tFlowMap"] = {
+        type: "t",
         value: flowMap
       };
     } else {
-      this.material.uniforms['flowDirection'] = {
-        type: 'v2',
+      this.material.uniforms["flowDirection"] = {
+        type: "v2",
         value: flowDirection
       };
-    } // maps
-
-
-    normalMap0.wrapS = normalMap0.wrapT = RepeatWrapping;
-    normalMap1.wrapS = normalMap1.wrapT = RepeatWrapping;
-    this.material.uniforms['tReflectionMap'].value = reflector.getRenderTarget().texture;
-    this.material.uniforms['tRefractionMap'].value = refractor.getRenderTarget().texture;
-    this.material.uniforms['tNormalMap0'].value = normalMap0;
-    this.material.uniforms['tNormalMap1'].value = normalMap1; // water
-
-    this.material.uniforms['color'].value = color;
-    this.material.uniforms['reflectivity'].value = reflectivity;
-    this.material.uniforms['textureMatrix'].value = textureMatrix; // inital values
-
-    this.material.uniforms['config'].value.x = 0; // flowMapOffset0
-
-    this.material.uniforms['config'].value.y = halfCycle; // flowMapOffset1
-
-    this.material.uniforms['config'].value.z = halfCycle; // halfCycle
-
-    this.material.uniforms['config'].value.w = scale; // scale
-    // functions
-
+    }
+    normalMap0.wrapS = normalMap0.wrapT = THREE.RepeatWrapping;
+    normalMap1.wrapS = normalMap1.wrapT = THREE.RepeatWrapping;
+    this.material.uniforms["tReflectionMap"].value = reflector.getRenderTarget().texture;
+    this.material.uniforms["tRefractionMap"].value = refractor.getRenderTarget().texture;
+    this.material.uniforms["tNormalMap0"].value = normalMap0;
+    this.material.uniforms["tNormalMap1"].value = normalMap1;
+    this.material.uniforms["color"].value = color;
+    this.material.uniforms["reflectivity"].value = reflectivity;
+    this.material.uniforms["textureMatrix"].value = textureMatrix;
+    this.material.uniforms["config"].value.x = 0;
+    this.material.uniforms["config"].value.y = halfCycle;
+    this.material.uniforms["config"].value.z = halfCycle;
+    this.material.uniforms["config"].value.w = scale;
     function updateTextureMatrix(camera) {
-      textureMatrix.set(0.5, 0.0, 0.0, 0.5, 0.0, 0.5, 0.0, 0.5, 0.0, 0.0, 0.5, 0.5, 0.0, 0.0, 0.0, 1.0);
+      textureMatrix.set(0.5, 0, 0, 0.5, 0, 0.5, 0, 0.5, 0, 0, 0.5, 0.5, 0, 0, 0, 1);
       textureMatrix.multiply(camera.projectionMatrix);
       textureMatrix.multiply(camera.matrixWorldInverse);
       textureMatrix.multiply(scope.matrixWorld);
     }
-
     function updateFlow() {
       const delta = clock.getDelta();
-      const config = scope.material.uniforms['config'];
-      config.value.x += flowSpeed * delta; // flowMapOffset0
-
-      config.value.y = config.value.x + halfCycle; // flowMapOffset1
-      // Important: The distance between offsets should be always the value of "halfCycle".
-      // Moreover, both offsets should be in the range of [ 0, cycle ].
-      // This approach ensures a smooth water flow and avoids "reset" effects.
-
+      const config = scope.material.uniforms["config"];
+      config.value.x += flowSpeed * delta;
+      config.value.y = config.value.x + halfCycle;
       if (config.value.x >= cycle) {
         config.value.x = 0;
         config.value.y = halfCycle;
       } else if (config.value.y >= cycle) {
         config.value.y = config.value.y - cycle;
       }
-    } //
-
-
-    this.onBeforeRender = function (renderer, scene, camera) {
+    }
+    this.onBeforeRender = function(renderer, scene, camera) {
       updateTextureMatrix(camera);
       updateFlow();
       scope.visible = false;
@@ -138,48 +109,44 @@ class Water2 extends Mesh {
       scope.visible = true;
     };
   }
-
 }
-
 Water2.prototype.isWater = true;
 Water2.WaterShader = {
   uniforms: {
     color: {
-      type: 'c',
+      type: "c",
       value: null
     },
     reflectivity: {
-      type: 'f',
+      type: "f",
       value: 0
     },
     tReflectionMap: {
-      type: 't',
+      type: "t",
       value: null
     },
     tRefractionMap: {
-      type: 't',
+      type: "t",
       value: null
     },
     tNormalMap0: {
-      type: 't',
+      type: "t",
       value: null
     },
     tNormalMap1: {
-      type: 't',
+      type: "t",
       value: null
     },
     textureMatrix: {
-      type: 'm4',
+      type: "m4",
       value: null
     },
     config: {
-      type: 'v4',
-      value: new Vector4()
+      type: "v4",
+      value: new THREE.Vector4()
     }
   },
-  vertexShader:
-  /* glsl */
-  `
+  vertexShader: `
 
 		#include <common>
 		#include <fog_pars_vertex>
@@ -206,9 +173,7 @@ Water2.WaterShader = {
 			#include <fog_vertex>
 
 		}`,
-  fragmentShader:
-  /* glsl */
-  `
+  fragmentShader: `
 
 		#include <common>
 		#include <fog_pars_fragment>
@@ -284,5 +249,4 @@ Water2.WaterShader = {
 
 		}`
 };
-
-export { Water2 };
+exports.Water2 = Water2;