opal-js_wrap-three 0.1.1 → 0.1.2

data/lib-opal/js_wrap/three/objects/Water.js

@@ -0,0 +1,246 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "three"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("three"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.three);
+    global.Water = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _three) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.Water = void 0;
+
+  function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+  function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+  function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } Object.defineProperty(subClass, "prototype", { value: Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }), writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+  function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+  function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+
+  function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+  function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+  function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+  /**
+   * Work based on :
+   * http://slayvin.net : Flat mirror for three.js
+   * http://www.adelphi.edu/~stemkoski : An implementation of water shader based on the flat mirror
+   * http://29a.ch/ && http://29a.ch/slides/2012/webglwater/ : Water shader explanations in WebGL
+   */
+  var Water = /*#__PURE__*/function (_Mesh) {
+    _inherits(Water, _Mesh);
+
+    var _super = _createSuper(Water);
+
+    function Water(geometry) {
+      var _this;
+
+      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
+      _classCallCheck(this, Water);
+
+      _this = _super.call(this, geometry);
+
+      var scope = _assertThisInitialized(_this);
+
+      var textureWidth = options.textureWidth !== undefined ? options.textureWidth : 512;
+      var textureHeight = options.textureHeight !== undefined ? options.textureHeight : 512;
+      var clipBias = options.clipBias !== undefined ? options.clipBias : 0.0;
+      var alpha = options.alpha !== undefined ? options.alpha : 1.0;
+      var time = options.time !== undefined ? options.time : 0.0;
+      var normalSampler = options.waterNormals !== undefined ? options.waterNormals : null;
+      var sunDirection = options.sunDirection !== undefined ? options.sunDirection : new _three.Vector3(0.70707, 0.70707, 0.0);
+      var sunColor = new _three.Color(options.sunColor !== undefined ? options.sunColor : 0xffffff);
+      var waterColor = new _three.Color(options.waterColor !== undefined ? options.waterColor : 0x7F7F7F);
+      var eye = options.eye !== undefined ? options.eye : new _three.Vector3(0, 0, 0);
+      var distortionScale = options.distortionScale !== undefined ? options.distortionScale : 20.0;
+      var side = options.side !== undefined ? options.side : _three.FrontSide;
+      var fog = options.fog !== undefined ? options.fog : false; //
+
+      var mirrorPlane = new _three.Plane();
+      var normal = new _three.Vector3();
+      var mirrorWorldPosition = new _three.Vector3();
+      var cameraWorldPosition = new _three.Vector3();
+      var rotationMatrix = new _three.Matrix4();
+      var lookAtPosition = new _three.Vector3(0, 0, -1);
+      var clipPlane = new _three.Vector4();
+      var view = new _three.Vector3();
+      var target = new _three.Vector3();
+      var q = new _three.Vector4();
+      var textureMatrix = new _three.Matrix4();
+      var mirrorCamera = new _three.PerspectiveCamera();
+      var parameters = {
+        minFilter: _three.LinearFilter,
+        magFilter: _three.LinearFilter,
+        format: _three.RGBFormat
+      };
+      var renderTarget = new _three.WebGLRenderTarget(textureWidth, textureHeight, parameters);
+
+      if (!_three.MathUtils.isPowerOfTwo(textureWidth) || !_three.MathUtils.isPowerOfTwo(textureHeight)) {
+        renderTarget.texture.generateMipmaps = false;
+      }
+
+      var mirrorShader = {
+        uniforms: _three.UniformsUtils.merge([_three.UniformsLib['fog'], _three.UniformsLib['lights'], {
+          'normalSampler': {
+            value: null
+          },
+          'mirrorSampler': {
+            value: null
+          },
+          'alpha': {
+            value: 1.0
+          },
+          'time': {
+            value: 0.0
+          },
+          'size': {
+            value: 1.0
+          },
+          'distortionScale': {
+            value: 20.0
+          },
+          'textureMatrix': {
+            value: new _three.Matrix4()
+          },
+          'sunColor': {
+            value: new _three.Color(0x7F7F7F)
+          },
+          'sunDirection': {
+            value: new _three.Vector3(0.70707, 0.70707, 0)
+          },
+          'eye': {
+            value: new _three.Vector3()
+          },
+          'waterColor': {
+            value: new _three.Color(0x555555)
+          }
+        }]),
+        vertexShader:
+        /* glsl */
+        "\n\t\t\t\tuniform mat4 textureMatrix;\n\t\t\t\tuniform float time;\n\n\t\t\t\tvarying vec4 mirrorCoord;\n\t\t\t\tvarying vec4 worldPosition;\n\n\t\t\t\t#include <common>\n\t\t\t\t#include <fog_pars_vertex>\n\t\t\t\t#include <shadowmap_pars_vertex>\n\t\t\t\t#include <logdepthbuf_pars_vertex>\n\n\t\t\t\tvoid main() {\n\t\t\t\t\tmirrorCoord = modelMatrix * vec4( position, 1.0 );\n\t\t\t\t\tworldPosition = mirrorCoord.xyzw;\n\t\t\t\t\tmirrorCoord = textureMatrix * mirrorCoord;\n\t\t\t\t\tvec4 mvPosition =  modelViewMatrix * vec4( position, 1.0 );\n\t\t\t\t\tgl_Position = projectionMatrix * mvPosition;\n\n\t\t\t\t#include <beginnormal_vertex>\n\t\t\t\t#include <defaultnormal_vertex>\n\t\t\t\t#include <logdepthbuf_vertex>\n\t\t\t\t#include <fog_vertex>\n\t\t\t\t#include <shadowmap_vertex>\n\t\t\t}",
+        fragmentShader:
+        /* glsl */
+        "\n\t\t\t\tuniform sampler2D mirrorSampler;\n\t\t\t\tuniform float alpha;\n\t\t\t\tuniform float time;\n\t\t\t\tuniform float size;\n\t\t\t\tuniform float distortionScale;\n\t\t\t\tuniform sampler2D normalSampler;\n\t\t\t\tuniform vec3 sunColor;\n\t\t\t\tuniform vec3 sunDirection;\n\t\t\t\tuniform vec3 eye;\n\t\t\t\tuniform vec3 waterColor;\n\n\t\t\t\tvarying vec4 mirrorCoord;\n\t\t\t\tvarying vec4 worldPosition;\n\n\t\t\t\tvec4 getNoise( vec2 uv ) {\n\t\t\t\t\tvec2 uv0 = ( uv / 103.0 ) + vec2(time / 17.0, time / 29.0);\n\t\t\t\t\tvec2 uv1 = uv / 107.0-vec2( time / -19.0, time / 31.0 );\n\t\t\t\t\tvec2 uv2 = uv / vec2( 8907.0, 9803.0 ) + vec2( time / 101.0, time / 97.0 );\n\t\t\t\t\tvec2 uv3 = uv / vec2( 1091.0, 1027.0 ) - vec2( time / 109.0, time / -113.0 );\n\t\t\t\t\tvec4 noise = texture2D( normalSampler, uv0 ) +\n\t\t\t\t\t\ttexture2D( normalSampler, uv1 ) +\n\t\t\t\t\t\ttexture2D( normalSampler, uv2 ) +\n\t\t\t\t\t\ttexture2D( normalSampler, uv3 );\n\t\t\t\t\treturn noise * 0.5 - 1.0;\n\t\t\t\t}\n\n\t\t\t\tvoid sunLight( const vec3 surfaceNormal, const vec3 eyeDirection, float shiny, float spec, float diffuse, inout vec3 diffuseColor, inout vec3 specularColor ) {\n\t\t\t\t\tvec3 reflection = normalize( reflect( -sunDirection, surfaceNormal ) );\n\t\t\t\t\tfloat direction = max( 0.0, dot( eyeDirection, reflection ) );\n\t\t\t\t\tspecularColor += pow( direction, shiny ) * sunColor * spec;\n\t\t\t\t\tdiffuseColor += max( dot( sunDirection, surfaceNormal ), 0.0 ) * sunColor * diffuse;\n\t\t\t\t}\n\n\t\t\t\t#include <common>\n\t\t\t\t#include <packing>\n\t\t\t\t#include <bsdfs>\n\t\t\t\t#include <fog_pars_fragment>\n\t\t\t\t#include <logdepthbuf_pars_fragment>\n\t\t\t\t#include <lights_pars_begin>\n\t\t\t\t#include <shadowmap_pars_fragment>\n\t\t\t\t#include <shadowmask_pars_fragment>\n\n\t\t\t\tvoid main() {\n\n\t\t\t\t\t#include <logdepthbuf_fragment>\n\t\t\t\t\tvec4 noise = getNoise( worldPosition.xz * size );\n\t\t\t\t\tvec3 surfaceNormal = normalize( noise.xzy * vec3( 1.5, 1.0, 1.5 ) );\n\n\t\t\t\t\tvec3 diffuseLight = vec3(0.0);\n\t\t\t\t\tvec3 specularLight = vec3(0.0);\n\n\t\t\t\t\tvec3 worldToEye = eye-worldPosition.xyz;\n\t\t\t\t\tvec3 eyeDirection = normalize( worldToEye );\n\t\t\t\t\tsunLight( surfaceNormal, eyeDirection, 100.0, 2.0, 0.5, diffuseLight, specularLight );\n\n\t\t\t\t\tfloat distance = length(worldToEye);\n\n\t\t\t\t\tvec2 distortion = surfaceNormal.xz * ( 0.001 + 1.0 / distance ) * distortionScale;\n\t\t\t\t\tvec3 reflectionSample = vec3( texture2D( mirrorSampler, mirrorCoord.xy / mirrorCoord.w + distortion ) );\n\n\t\t\t\t\tfloat theta = max( dot( eyeDirection, surfaceNormal ), 0.0 );\n\t\t\t\t\tfloat rf0 = 0.3;\n\t\t\t\t\tfloat reflectance = rf0 + ( 1.0 - rf0 ) * pow( ( 1.0 - theta ), 5.0 );\n\t\t\t\t\tvec3 scatter = max( 0.0, dot( surfaceNormal, eyeDirection ) ) * waterColor;\n\t\t\t\t\tvec3 albedo = mix( ( sunColor * diffuseLight * 0.3 + scatter ) * getShadowMask(), ( vec3( 0.1 ) + reflectionSample * 0.9 + reflectionSample * specularLight ), reflectance);\n\t\t\t\t\tvec3 outgoingLight = albedo;\n\t\t\t\t\tgl_FragColor = vec4( outgoingLight, alpha );\n\n\t\t\t\t\t#include <tonemapping_fragment>\n\t\t\t\t\t#include <fog_fragment>\n\t\t\t\t}"
+      };
+      var material = new _three.ShaderMaterial({
+        fragmentShader: mirrorShader.fragmentShader,
+        vertexShader: mirrorShader.vertexShader,
+        uniforms: _three.UniformsUtils.clone(mirrorShader.uniforms),
+        lights: true,
+        side: side,
+        fog: 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); // Avoid rendering when mirror is facing away
+
+        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; // Used in WebGLBackground
+
+        mirrorCamera.updateMatrixWorld();
+        mirrorCamera.projectionMatrix.copy(camera.projectionMatrix); // Update the texture matrix
+
+        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.multiply(mirrorCamera.projectionMatrix);
+        textureMatrix.multiply(mirrorCamera.matrixWorldInverse); // Now update projection matrix with new clip plane, implementing code from: http://www.terathon.com/code/oblique.html
+        // Paper explaining this technique: http://www.terathon.com/lengyel/Lengyel-Oblique.pdf
+
+        mirrorPlane.setFromNormalAndCoplanarPoint(normal, mirrorWorldPosition);
+        mirrorPlane.applyMatrix4(mirrorCamera.matrixWorldInverse);
+        clipPlane.set(mirrorPlane.normal.x, mirrorPlane.normal.y, mirrorPlane.normal.z, mirrorPlane.constant);
+        var 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.0;
+        q.w = (1.0 + projectionMatrix.elements[10]) / projectionMatrix.elements[14]; // Calculate the scaled plane vector
+
+        clipPlane.multiplyScalar(2.0 / clipPlane.dot(q)); // Replacing the third row of the projection matrix
+
+        projectionMatrix.elements[2] = clipPlane.x;
+        projectionMatrix.elements[6] = clipPlane.y;
+        projectionMatrix.elements[10] = clipPlane.z + 1.0 - clipBias;
+        projectionMatrix.elements[14] = clipPlane.w;
+        eye.setFromMatrixPosition(camera.matrixWorld); // Render
+
+        var currentRenderTarget = renderer.getRenderTarget();
+        var currentXrEnabled = renderer.xr.enabled;
+        var currentShadowAutoUpdate = renderer.shadowMap.autoUpdate;
+        scope.visible = false;
+        renderer.xr.enabled = false; // Avoid camera modification and recursion
+
+        renderer.shadowMap.autoUpdate = false; // Avoid re-computing shadows
+
+        renderer.setRenderTarget(renderTarget);
+        renderer.state.buffers.depth.setMask(true); // make sure the depth buffer is writable so it can be properly cleared, see #18897
+
+        if (renderer.autoClear === false) renderer.clear();
+        renderer.render(scene, mirrorCamera);
+        scope.visible = true;
+        renderer.xr.enabled = currentXrEnabled;
+        renderer.shadowMap.autoUpdate = currentShadowAutoUpdate;
+        renderer.setRenderTarget(currentRenderTarget); // Restore viewport
+
+        var viewport = camera.viewport;
+
+        if (viewport !== undefined) {
+          renderer.state.viewport(viewport);
+        }
+      };
+
+      return _this;
+    }
+
+    return _createClass(Water);
+  }(_three.Mesh);
+
+  _exports.Water = Water;
+  Water.prototype.isWater = true;
+});

data/lib-opal/js_wrap/three/objects/Water2.js

@@ -0,0 +1,238 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "three", "../objects/Reflector.js", "../objects/Refractor.js"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("three"), require("../objects/Reflector.js"), require("../objects/Refractor.js"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.three, global.Reflector, global.Refractor);
+    global.Water2 = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _three, _Reflector, _Refractor) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.Water = void 0;
+
+  function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+  function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+  function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } Object.defineProperty(subClass, "prototype", { value: Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }), writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+  function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+  function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+
+  function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+  function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+  function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+  /**
+   * References:
+   *	http://www.valvesoftware.com/publications/2010/siggraph2010_vlachos_waterflow.pdf
+   * 	http://graphicsrunner.blogspot.de/2010/08/water-using-flow-maps.html
+   *
+   */
+  var Water = /*#__PURE__*/function (_Mesh) {
+    _inherits(Water, _Mesh);
+
+    var _super = _createSuper(Water);
+
+    function Water(geometry) {
+      var _this;
+
+      var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
+      _classCallCheck(this, Water);
+
+      _this = _super.call(this, geometry);
+      _this.type = 'Water';
+
+      var scope = _assertThisInitialized(_this);
+
+      var color = options.color !== undefined ? new _three.Color(options.color) : new _three.Color(0xFFFFFF);
+      var textureWidth = options.textureWidth || 512;
+      var textureHeight = options.textureHeight || 512;
+      var clipBias = options.clipBias || 0;
+      var flowDirection = options.flowDirection || new _three.Vector2(1, 0);
+      var flowSpeed = options.flowSpeed || 0.03;
+      var reflectivity = options.reflectivity || 0.02;
+      var scale = options.scale || 1;
+      var shader = options.shader || Water.WaterShader;
+      var encoding = options.encoding !== undefined ? options.encoding : _three.LinearEncoding;
+      var textureLoader = new _three.TextureLoader();
+      var flowMap = options.flowMap || undefined;
+      var normalMap0 = options.normalMap0 || textureLoader.load('textures/water/Water_1_M_Normal.jpg');
+      var normalMap1 = options.normalMap1 || textureLoader.load('textures/water/Water_2_M_Normal.jpg');
+      var cycle = 0.15; // a cycle of a flow map phase
+
+      var halfCycle = cycle * 0.5;
+      var textureMatrix = new _three.Matrix4();
+      var clock = new _three.Clock(); // internal components
+
+      if (_Reflector.Reflector === undefined) {
+        console.error('THREE.Water: Required component Reflector not found.');
+        return _possibleConstructorReturn(_this);
+      }
+
+      if (_Refractor.Refractor === undefined) {
+        console.error('THREE.Water: Required component Refractor not found.');
+        return _possibleConstructorReturn(_this);
+      }
+
+      var reflector = new _Reflector.Reflector(geometry, {
+        textureWidth: textureWidth,
+        textureHeight: textureHeight,
+        clipBias: clipBias,
+        encoding: encoding
+      });
+      var refractor = new _Refractor.Refractor(geometry, {
+        textureWidth: textureWidth,
+        textureHeight: textureHeight,
+        clipBias: clipBias,
+        encoding: encoding
+      });
+      reflector.matrixAutoUpdate = false;
+      refractor.matrixAutoUpdate = false; // material
+
+      _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',
+          value: flowMap
+        };
+      } else {
+        _this.material.uniforms['flowDirection'] = {
+          type: 'v2',
+          value: flowDirection
+        };
+      } // maps
+
+
+      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; // 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
+
+      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.multiply(camera.projectionMatrix);
+        textureMatrix.multiply(camera.matrixWorldInverse);
+        textureMatrix.multiply(scope.matrixWorld);
+      }
+
+      function updateFlow() {
+        var delta = clock.getDelta();
+        var 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.
+
+        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) {
+        updateTextureMatrix(camera);
+        updateFlow();
+        scope.visible = false;
+        reflector.matrixWorld.copy(scope.matrixWorld);
+        refractor.matrixWorld.copy(scope.matrixWorld);
+        reflector.onBeforeRender(renderer, scene, camera);
+        refractor.onBeforeRender(renderer, scene, camera);
+        scope.visible = true;
+      };
+
+      return _this;
+    }
+
+    return _createClass(Water);
+  }(_three.Mesh);
+
+  _exports.Water = Water;
+  Water.prototype.isWater = true;
+  Water.WaterShader = {
+    uniforms: {
+      'color': {
+        type: 'c',
+        value: null
+      },
+      'reflectivity': {
+        type: 'f',
+        value: 0
+      },
+      'tReflectionMap': {
+        type: 't',
+        value: null
+      },
+      'tRefractionMap': {
+        type: 't',
+        value: null
+      },
+      'tNormalMap0': {
+        type: 't',
+        value: null
+      },
+      'tNormalMap1': {
+        type: 't',
+        value: null
+      },
+      'textureMatrix': {
+        type: 'm4',
+        value: null
+      },
+      'config': {
+        type: 'v4',
+        value: new _three.Vector4()
+      }
+    },
+    vertexShader:
+    /* glsl */
+    "\n\n\t\t#include <common>\n\t\t#include <fog_pars_vertex>\n\t\t#include <logdepthbuf_pars_vertex>\n\n\t\tuniform mat4 textureMatrix;\n\n\t\tvarying vec4 vCoord;\n\t\tvarying vec2 vUv;\n\t\tvarying vec3 vToEye;\n\n\t\tvoid main() {\n\n\t\t\tvUv = uv;\n\t\t\tvCoord = textureMatrix * vec4( position, 1.0 );\n\n\t\t\tvec4 worldPosition = modelMatrix * vec4( position, 1.0 );\n\t\t\tvToEye = cameraPosition - worldPosition.xyz;\n\n\t\t\tvec4 mvPosition =  viewMatrix * worldPosition; // used in fog_vertex\n\t\t\tgl_Position = projectionMatrix * mvPosition;\n\n\t\t\t#include <logdepthbuf_vertex>\n\t\t\t#include <fog_vertex>\n\n\t\t}",
+    fragmentShader:
+    /* glsl */
+    "\n\n\t\t#include <common>\n\t\t#include <fog_pars_fragment>\n\t\t#include <logdepthbuf_pars_fragment>\n\n\t\tuniform sampler2D tReflectionMap;\n\t\tuniform sampler2D tRefractionMap;\n\t\tuniform sampler2D tNormalMap0;\n\t\tuniform sampler2D tNormalMap1;\n\n\t\t#ifdef USE_FLOWMAP\n\t\t\tuniform sampler2D tFlowMap;\n\t\t#else\n\t\t\tuniform vec2 flowDirection;\n\t\t#endif\n\n\t\tuniform vec3 color;\n\t\tuniform float reflectivity;\n\t\tuniform vec4 config;\n\n\t\tvarying vec4 vCoord;\n\t\tvarying vec2 vUv;\n\t\tvarying vec3 vToEye;\n\n\t\tvoid main() {\n\n\t\t\t#include <logdepthbuf_fragment>\n\n\t\t\tfloat flowMapOffset0 = config.x;\n\t\t\tfloat flowMapOffset1 = config.y;\n\t\t\tfloat halfCycle = config.z;\n\t\t\tfloat scale = config.w;\n\n\t\t\tvec3 toEye = normalize( vToEye );\n\n\t\t\t// determine flow direction\n\t\t\tvec2 flow;\n\t\t\t#ifdef USE_FLOWMAP\n\t\t\t\tflow = texture2D( tFlowMap, vUv ).rg * 2.0 - 1.0;\n\t\t\t#else\n\t\t\t\tflow = flowDirection;\n\t\t\t#endif\n\t\t\tflow.x *= - 1.0;\n\n\t\t\t// sample normal maps (distort uvs with flowdata)\n\t\t\tvec4 normalColor0 = texture2D( tNormalMap0, ( vUv * scale ) + flow * flowMapOffset0 );\n\t\t\tvec4 normalColor1 = texture2D( tNormalMap1, ( vUv * scale ) + flow * flowMapOffset1 );\n\n\t\t\t// linear interpolate to get the final normal color\n\t\t\tfloat flowLerp = abs( halfCycle - flowMapOffset0 ) / halfCycle;\n\t\t\tvec4 normalColor = mix( normalColor0, normalColor1, flowLerp );\n\n\t\t\t// calculate normal vector\n\t\t\tvec3 normal = normalize( vec3( normalColor.r * 2.0 - 1.0, normalColor.b,  normalColor.g * 2.0 - 1.0 ) );\n\n\t\t\t// calculate the fresnel term to blend reflection and refraction maps\n\t\t\tfloat theta = max( dot( toEye, normal ), 0.0 );\n\t\t\tfloat reflectance = reflectivity + ( 1.0 - reflectivity ) * pow( ( 1.0 - theta ), 5.0 );\n\n\t\t\t// calculate final uv coords\n\t\t\tvec3 coord = vCoord.xyz / vCoord.w;\n\t\t\tvec2 uv = coord.xy + coord.z * normal.xz * 0.05;\n\n\t\t\tvec4 reflectColor = texture2D( tReflectionMap, vec2( 1.0 - uv.x, uv.y ) );\n\t\t\tvec4 refractColor = texture2D( tRefractionMap, uv );\n\n\t\t\t// multiply water color with the mix of both textures\n\t\t\tgl_FragColor = vec4( color, 1.0 ) * mix( refractColor, reflectColor, reflectance );\n\n\t\t\t#include <tonemapping_fragment>\n\t\t\t#include <encodings_fragment>\n\t\t\t#include <fog_fragment>\n\n\t\t}"
+  };
+});

data/lib-opal/js_wrap/three/offscreen/jank.js

@@ -0,0 +1,51 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports);
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports);
+    global.jank = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.default = void 0;
+  var interval = null;
+  var result = null;
+
+  function initJank() {
+    var button = document.getElementById('button');
+    button.addEventListener('click', function () {
+      if (interval === null) {
+        interval = setInterval(jank, 1000 / 60);
+        button.textContent = 'STOP JANK';
+      } else {
+        clearInterval(interval);
+        interval = null;
+        button.textContent = 'START JANK';
+        result.textContent = '';
+      }
+    });
+    result = document.getElementById('result');
+  }
+
+  function jank() {
+    var number = 0;
+
+    for (var i = 0; i < 10000000; i++) {
+      number += Math.random();
+    }
+
+    result.textContent = number;
+  }
+
+  var _default = initJank;
+  _exports.default = _default;
+});

data/lib-opal/js_wrap/three/offscreen/offscreen.js

@@ -0,0 +1,24 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["./scene.js"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(require("./scene.js"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(global.scene);
+    global.offscreen = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_scene) {
+  "use strict";
+
+  _scene = _interopRequireDefault(_scene);
+
+  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+  self.onmessage = function (message) {
+    var data = message.data;
+    (0, _scene.default)(data.drawingSurface, data.width, data.height, data.pixelRatio, data.path);
+  };
+});

data/lib-opal/js_wrap/three/offscreen/scene.js

@@ -0,0 +1,99 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "three"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("three"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.three);
+    global.scene = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, THREE) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.default = void 0;
+  THREE = _interopRequireWildcard(THREE);
+
+  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+  var camera, scene, renderer, group;
+
+  function init(canvas, width, height, pixelRatio, path) {
+    camera = new THREE.PerspectiveCamera(40, width / height, 1, 1000);
+    camera.position.z = 200;
+    scene = new THREE.Scene();
+    scene.fog = new THREE.Fog(0x444466, 100, 400);
+    scene.background = new THREE.Color(0x444466);
+    group = new THREE.Group();
+    scene.add(group); // we don't use ImageLoader since it has a DOM dependency (HTML5 image element)
+
+    var loader = new THREE.ImageBitmapLoader().setPath(path);
+    loader.setOptions({
+      imageOrientation: 'flipY'
+    });
+    loader.load('textures/matcaps/matcap-porcelain-white.jpg', function (imageBitmap) {
+      var texture = new THREE.CanvasTexture(imageBitmap);
+      var geometry = new THREE.IcosahedronGeometry(5, 8);
+      var materials = [new THREE.MeshMatcapMaterial({
+        color: 0xaa24df,
+        matcap: texture
+      }), new THREE.MeshMatcapMaterial({
+        color: 0x605d90,
+        matcap: texture
+      }), new THREE.MeshMatcapMaterial({
+        color: 0xe04a3f,
+        matcap: texture
+      }), new THREE.MeshMatcapMaterial({
+        color: 0xe30456,
+        matcap: texture
+      })];
+
+      for (var i = 0; i < 100; i++) {
+        var material = materials[i % materials.length];
+        var mesh = new THREE.Mesh(geometry, material);
+        mesh.position.x = random() * 200 - 100;
+        mesh.position.y = random() * 200 - 100;
+        mesh.position.z = random() * 200 - 100;
+        mesh.scale.setScalar(random() + 1);
+        group.add(mesh);
+      }
+
+      renderer = new THREE.WebGLRenderer({
+        antialias: true,
+        canvas: canvas
+      });
+      renderer.setPixelRatio(pixelRatio);
+      renderer.setSize(width, height, false);
+      animate();
+    });
+  }
+
+  function animate() {
+    // group.rotation.x = Date.now() / 4000;
+    group.rotation.y = -Date.now() / 4000;
+    renderer.render(scene, camera);
+
+    if (self.requestAnimationFrame) {
+      self.requestAnimationFrame(animate);
+    } else {// Firefox
+    }
+  } // PRNG
+
+
+  var seed = 1;
+
+  function random() {
+    var x = Math.sin(seed++) * 10000;
+    return x - Math.floor(x);
+  }
+
+  var _default = init;
+  _exports.default = _default;
+});