opal-js_wrap-three 0.1.1 → 0.1.2

data/lib-opal/js_wrap/three/shaders/VerticalTiltShiftShader.js

@@ -0,0 +1,49 @@
+(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.VerticalTiltShiftShader = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.VerticalTiltShiftShader = void 0;
+
+  /**
+   * Simple fake tilt-shift effect, modulating two pass Gaussian blur (see above) by vertical position
+   *
+   * - 9 samples per pass
+   * - standard deviation 2.7
+   * - "h" and "v" parameters should be set to "1 / width" and "1 / height"
+   * - "r" parameter control where "focused" horizontal line lies
+   */
+  var VerticalTiltShiftShader = {
+    uniforms: {
+      'tDiffuse': {
+        value: null
+      },
+      'v': {
+        value: 1.0 / 512.0
+      },
+      'r': {
+        value: 0.35
+      }
+    },
+    vertexShader:
+    /* glsl */
+    "\n\n\t\tvarying vec2 vUv;\n\n\t\tvoid main() {\n\n\t\t\tvUv = uv;\n\t\t\tgl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n\n\t\t}",
+    fragmentShader:
+    /* glsl */
+    "\n\n\t\tuniform sampler2D tDiffuse;\n\t\tuniform float v;\n\t\tuniform float r;\n\n\t\tvarying vec2 vUv;\n\n\t\tvoid main() {\n\n\t\t\tvec4 sum = vec4( 0.0 );\n\n\t\t\tfloat vv = v * abs( r - vUv.y );\n\n\t\t\tsum += texture2D( tDiffuse, vec2( vUv.x, vUv.y - 4.0 * vv ) ) * 0.051;\n\t\t\tsum += texture2D( tDiffuse, vec2( vUv.x, vUv.y - 3.0 * vv ) ) * 0.0918;\n\t\t\tsum += texture2D( tDiffuse, vec2( vUv.x, vUv.y - 2.0 * vv ) ) * 0.12245;\n\t\t\tsum += texture2D( tDiffuse, vec2( vUv.x, vUv.y - 1.0 * vv ) ) * 0.1531;\n\t\t\tsum += texture2D( tDiffuse, vec2( vUv.x, vUv.y ) ) * 0.1633;\n\t\t\tsum += texture2D( tDiffuse, vec2( vUv.x, vUv.y + 1.0 * vv ) ) * 0.1531;\n\t\t\tsum += texture2D( tDiffuse, vec2( vUv.x, vUv.y + 2.0 * vv ) ) * 0.12245;\n\t\t\tsum += texture2D( tDiffuse, vec2( vUv.x, vUv.y + 3.0 * vv ) ) * 0.0918;\n\t\t\tsum += texture2D( tDiffuse, vec2( vUv.x, vUv.y + 4.0 * vv ) ) * 0.051;\n\n\t\t\tgl_FragColor = sum;\n\n\t\t}"
+  };
+  _exports.VerticalTiltShiftShader = VerticalTiltShiftShader;
+});

data/lib-opal/js_wrap/three/shaders/VignetteShader.js

@@ -0,0 +1,46 @@
+(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.VignetteShader = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.VignetteShader = void 0;
+
+  /**
+   * Vignette shader
+   * based on PaintEffect postprocess from ro.me
+   * http://code.google.com/p/3-dreams-of-black/source/browse/deploy/js/effects/PaintEffect.js
+   */
+  var VignetteShader = {
+    uniforms: {
+      'tDiffuse': {
+        value: null
+      },
+      'offset': {
+        value: 1.0
+      },
+      'darkness': {
+        value: 1.0
+      }
+    },
+    vertexShader:
+    /* glsl */
+    "\n\n\t\tvarying vec2 vUv;\n\n\t\tvoid main() {\n\n\t\t\tvUv = uv;\n\t\t\tgl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n\n\t\t}",
+    fragmentShader:
+    /* glsl */
+    "\n\n\t\tuniform float offset;\n\t\tuniform float darkness;\n\n\t\tuniform sampler2D tDiffuse;\n\n\t\tvarying vec2 vUv;\n\n\t\tvoid main() {\n\n\t\t\t// Eskil's vignette\n\n\t\t\tvec4 texel = texture2D( tDiffuse, vUv );\n\t\t\tvec2 uv = ( vUv - vec2( 0.5 ) ) * vec2( offset );\n\t\t\tgl_FragColor = vec4( mix( texel.rgb, vec3( 1.0 - darkness ), dot( uv, uv ) ), texel.a );\n\n\t\t}"
+  };
+  _exports.VignetteShader = VignetteShader;
+});

data/lib-opal/js_wrap/three/shaders/VolumeShader.js

@@ -0,0 +1,55 @@
+(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.VolumeShader = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _three) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.VolumeRenderShader1 = void 0;
+
+  /**
+   * Shaders to render 3D volumes using raycasting.
+   * The applied techniques are based on similar implementations in the Visvis and Vispy projects.
+   * This is not the only approach, therefore it's marked 1.
+   */
+  var VolumeRenderShader1 = {
+    uniforms: {
+      'u_size': {
+        value: new _three.Vector3(1, 1, 1)
+      },
+      'u_renderstyle': {
+        value: 0
+      },
+      'u_renderthreshold': {
+        value: 0.5
+      },
+      'u_clim': {
+        value: new _three.Vector2(1, 1)
+      },
+      'u_data': {
+        value: null
+      },
+      'u_cmdata': {
+        value: null
+      }
+    },
+    vertexShader:
+    /* glsl */
+    "\n\n\t\tvarying vec4 v_nearpos;\n\t\tvarying vec4 v_farpos;\n\t\tvarying vec3 v_position;\n\n\t\tvoid main() {\n\t\t\t\t// Prepare transforms to map to \"camera view\". See also:\n\t\t\t\t// https://threejs.org/docs/#api/renderers/webgl/WebGLProgram\n\t\t\t\tmat4 viewtransformf = modelViewMatrix;\n\t\t\t\tmat4 viewtransformi = inverse(modelViewMatrix);\n\n\t\t\t\t// Project local vertex coordinate to camera position. Then do a step\n\t\t\t\t// backward (in cam coords) to the near clipping plane, and project back. Do\n\t\t\t\t// the same for the far clipping plane. This gives us all the information we\n\t\t\t\t// need to calculate the ray and truncate it to the viewing cone.\n\t\t\t\tvec4 position4 = vec4(position, 1.0);\n\t\t\t\tvec4 pos_in_cam = viewtransformf * position4;\n\n\t\t\t\t// Intersection of ray and near clipping plane (z = -1 in clip coords)\n\t\t\t\tpos_in_cam.z = -pos_in_cam.w;\n\t\t\t\tv_nearpos = viewtransformi * pos_in_cam;\n\n\t\t\t\t// Intersection of ray and far clipping plane (z = +1 in clip coords)\n\t\t\t\tpos_in_cam.z = pos_in_cam.w;\n\t\t\t\tv_farpos = viewtransformi * pos_in_cam;\n\n\t\t\t\t// Set varyings and output pos\n\t\t\t\tv_position = position;\n\t\t\t\tgl_Position = projectionMatrix * viewMatrix * modelMatrix * position4;\n\t\t}",
+    fragmentShader:
+    /* glsl */
+    "\n\n\t\t\t\tprecision highp float;\n\t\t\t\tprecision mediump sampler3D;\n\n\t\t\t\tuniform vec3 u_size;\n\t\t\t\tuniform int u_renderstyle;\n\t\t\t\tuniform float u_renderthreshold;\n\t\t\t\tuniform vec2 u_clim;\n\n\t\t\t\tuniform sampler3D u_data;\n\t\t\t\tuniform sampler2D u_cmdata;\n\n\t\t\t\tvarying vec3 v_position;\n\t\t\t\tvarying vec4 v_nearpos;\n\t\t\t\tvarying vec4 v_farpos;\n\n\t\t\t\t// The maximum distance through our rendering volume is sqrt(3).\n\t\t\t\tconst int MAX_STEPS = 887;\t// 887 for 512^3, 1774 for 1024^3\n\t\t\t\tconst int REFINEMENT_STEPS = 4;\n\t\t\t\tconst float relative_step_size = 1.0;\n\t\t\t\tconst vec4 ambient_color = vec4(0.2, 0.4, 0.2, 1.0);\n\t\t\t\tconst vec4 diffuse_color = vec4(0.8, 0.2, 0.2, 1.0);\n\t\t\t\tconst vec4 specular_color = vec4(1.0, 1.0, 1.0, 1.0);\n\t\t\t\tconst float shininess = 40.0;\n\n\t\t\t\tvoid cast_mip(vec3 start_loc, vec3 step, int nsteps, vec3 view_ray);\n\t\t\t\tvoid cast_iso(vec3 start_loc, vec3 step, int nsteps, vec3 view_ray);\n\n\t\t\t\tfloat sample1(vec3 texcoords);\n\t\t\t\tvec4 apply_colormap(float val);\n\t\t\t\tvec4 add_lighting(float val, vec3 loc, vec3 step, vec3 view_ray);\n\n\n\t\t\t\tvoid main() {\n\t\t\t\t\t\t// Normalize clipping plane info\n\t\t\t\t\t\tvec3 farpos = v_farpos.xyz / v_farpos.w;\n\t\t\t\t\t\tvec3 nearpos = v_nearpos.xyz / v_nearpos.w;\n\n\t\t\t\t\t\t// Calculate unit vector pointing in the view direction through this fragment.\n\t\t\t\t\t\tvec3 view_ray = normalize(nearpos.xyz - farpos.xyz);\n\n\t\t\t\t\t\t// Compute the (negative) distance to the front surface or near clipping plane.\n\t\t\t\t\t\t// v_position is the back face of the cuboid, so the initial distance calculated in the dot\n\t\t\t\t\t\t// product below is the distance from near clip plane to the back of the cuboid\n\t\t\t\t\t\tfloat distance = dot(nearpos - v_position, view_ray);\n\t\t\t\t\t\tdistance = max(distance, min((-0.5 - v_position.x) / view_ray.x,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(u_size.x - 0.5 - v_position.x) / view_ray.x));\n\t\t\t\t\t\tdistance = max(distance, min((-0.5 - v_position.y) / view_ray.y,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(u_size.y - 0.5 - v_position.y) / view_ray.y));\n\t\t\t\t\t\tdistance = max(distance, min((-0.5 - v_position.z) / view_ray.z,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t(u_size.z - 0.5 - v_position.z) / view_ray.z));\n\n\t\t\t\t\t\t// Now we have the starting position on the front surface\n\t\t\t\t\t\tvec3 front = v_position + view_ray * distance;\n\n\t\t\t\t\t\t// Decide how many steps to take\n\t\t\t\t\t\tint nsteps = int(-distance / relative_step_size + 0.5);\n\t\t\t\t\t\tif ( nsteps < 1 )\n\t\t\t\t\t\t\t\tdiscard;\n\n\t\t\t\t\t\t// Get starting location and step vector in texture coordinates\n\t\t\t\t\t\tvec3 step = ((v_position - front) / u_size) / float(nsteps);\n\t\t\t\t\t\tvec3 start_loc = front / u_size;\n\n\t\t\t\t\t\t// For testing: show the number of steps. This helps to establish\n\t\t\t\t\t\t// whether the rays are correctly oriented\n\t\t\t\t\t\t//'gl_FragColor = vec4(0.0, float(nsteps) / 1.0 / u_size.x, 1.0, 1.0);\n\t\t\t\t\t\t//'return;\n\n\t\t\t\t\t\tif (u_renderstyle == 0)\n\t\t\t\t\t\t\t\tcast_mip(start_loc, step, nsteps, view_ray);\n\t\t\t\t\t\telse if (u_renderstyle == 1)\n\t\t\t\t\t\t\t\tcast_iso(start_loc, step, nsteps, view_ray);\n\n\t\t\t\t\t\tif (gl_FragColor.a < 0.05)\n\t\t\t\t\t\t\t\tdiscard;\n\t\t\t\t}\n\n\n\t\t\t\tfloat sample1(vec3 texcoords) {\n\t\t\t\t\t\t/* Sample float value from a 3D texture. Assumes intensity data. */\n\t\t\t\t\t\treturn texture(u_data, texcoords.xyz).r;\n\t\t\t\t}\n\n\n\t\t\t\tvec4 apply_colormap(float val) {\n\t\t\t\t\t\tval = (val - u_clim[0]) / (u_clim[1] - u_clim[0]);\n\t\t\t\t\t\treturn texture2D(u_cmdata, vec2(val, 0.5));\n\t\t\t\t}\n\n\n\t\t\t\tvoid cast_mip(vec3 start_loc, vec3 step, int nsteps, vec3 view_ray) {\n\n\t\t\t\t\t\tfloat max_val = -1e6;\n\t\t\t\t\t\tint max_i = 100;\n\t\t\t\t\t\tvec3 loc = start_loc;\n\n\t\t\t\t\t\t// Enter the raycasting loop. In WebGL 1 the loop index cannot be compared with\n\t\t\t\t\t\t// non-constant expression. So we use a hard-coded max, and an additional condition\n\t\t\t\t\t\t// inside the loop.\n\t\t\t\t\t\tfor (int iter=0; iter<MAX_STEPS; iter++) {\n\t\t\t\t\t\t\t\tif (iter >= nsteps)\n\t\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t// Sample from the 3D texture\n\t\t\t\t\t\t\t\tfloat val = sample1(loc);\n\t\t\t\t\t\t\t\t// Apply MIP operation\n\t\t\t\t\t\t\t\tif (val > max_val) {\n\t\t\t\t\t\t\t\t\t\tmax_val = val;\n\t\t\t\t\t\t\t\t\t\tmax_i = iter;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t// Advance location deeper into the volume\n\t\t\t\t\t\t\t\tloc += step;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Refine location, gives crispier images\n\t\t\t\t\t\tvec3 iloc = start_loc + step * (float(max_i) - 0.5);\n\t\t\t\t\t\tvec3 istep = step / float(REFINEMENT_STEPS);\n\t\t\t\t\t\tfor (int i=0; i<REFINEMENT_STEPS; i++) {\n\t\t\t\t\t\t\t\tmax_val = max(max_val, sample1(iloc));\n\t\t\t\t\t\t\t\tiloc += istep;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Resolve final color\n\t\t\t\t\t\tgl_FragColor = apply_colormap(max_val);\n\t\t\t\t}\n\n\n\t\t\t\tvoid cast_iso(vec3 start_loc, vec3 step, int nsteps, vec3 view_ray) {\n\n\t\t\t\t\t\tgl_FragColor = vec4(0.0);\t// init transparent\n\t\t\t\t\t\tvec4 color3 = vec4(0.0);\t// final color\n\t\t\t\t\t\tvec3 dstep = 1.5 / u_size;\t// step to sample derivative\n\t\t\t\t\t\tvec3 loc = start_loc;\n\n\t\t\t\t\t\tfloat low_threshold = u_renderthreshold - 0.02 * (u_clim[1] - u_clim[0]);\n\n\t\t\t\t\t\t// Enter the raycasting loop. In WebGL 1 the loop index cannot be compared with\n\t\t\t\t\t\t// non-constant expression. So we use a hard-coded max, and an additional condition\n\t\t\t\t\t\t// inside the loop.\n\t\t\t\t\t\tfor (int iter=0; iter<MAX_STEPS; iter++) {\n\t\t\t\t\t\t\t\tif (iter >= nsteps)\n\t\t\t\t\t\t\t\t\t\tbreak;\n\n\t\t\t\t\t\t\t\t// Sample from the 3D texture\n\t\t\t\t\t\t\t\tfloat val = sample1(loc);\n\n\t\t\t\t\t\t\t\tif (val > low_threshold) {\n\t\t\t\t\t\t\t\t\t\t// Take the last interval in smaller steps\n\t\t\t\t\t\t\t\t\t\tvec3 iloc = loc - 0.5 * step;\n\t\t\t\t\t\t\t\t\t\tvec3 istep = step / float(REFINEMENT_STEPS);\n\t\t\t\t\t\t\t\t\t\tfor (int i=0; i<REFINEMENT_STEPS; i++) {\n\t\t\t\t\t\t\t\t\t\t\t\tval = sample1(iloc);\n\t\t\t\t\t\t\t\t\t\t\t\tif (val > u_renderthreshold) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tgl_FragColor = add_lighting(val, iloc, dstep, view_ray);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\tiloc += istep;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t// Advance location deeper into the volume\n\t\t\t\t\t\t\t\tloc += step;\n\t\t\t\t\t\t}\n\t\t\t\t}\n\n\n\t\t\t\tvec4 add_lighting(float val, vec3 loc, vec3 step, vec3 view_ray)\n\t\t\t\t{\n\t\t\t\t\t// Calculate color by incorporating lighting\n\n\t\t\t\t\t\t// View direction\n\t\t\t\t\t\tvec3 V = normalize(view_ray);\n\n\t\t\t\t\t\t// calculate normal vector from gradient\n\t\t\t\t\t\tvec3 N;\n\t\t\t\t\t\tfloat val1, val2;\n\t\t\t\t\t\tval1 = sample1(loc + vec3(-step[0], 0.0, 0.0));\n\t\t\t\t\t\tval2 = sample1(loc + vec3(+step[0], 0.0, 0.0));\n\t\t\t\t\t\tN[0] = val1 - val2;\n\t\t\t\t\t\tval = max(max(val1, val2), val);\n\t\t\t\t\t\tval1 = sample1(loc + vec3(0.0, -step[1], 0.0));\n\t\t\t\t\t\tval2 = sample1(loc + vec3(0.0, +step[1], 0.0));\n\t\t\t\t\t\tN[1] = val1 - val2;\n\t\t\t\t\t\tval = max(max(val1, val2), val);\n\t\t\t\t\t\tval1 = sample1(loc + vec3(0.0, 0.0, -step[2]));\n\t\t\t\t\t\tval2 = sample1(loc + vec3(0.0, 0.0, +step[2]));\n\t\t\t\t\t\tN[2] = val1 - val2;\n\t\t\t\t\t\tval = max(max(val1, val2), val);\n\n\t\t\t\t\t\tfloat gm = length(N); // gradient magnitude\n\t\t\t\t\t\tN = normalize(N);\n\n\t\t\t\t\t\t// Flip normal so it points towards viewer\n\t\t\t\t\t\tfloat Nselect = float(dot(N, V) > 0.0);\n\t\t\t\t\t\tN = (2.0 * Nselect - 1.0) * N;\t// ==\tNselect * N - (1.0-Nselect)*N;\n\n\t\t\t\t\t\t// Init colors\n\t\t\t\t\t\tvec4 ambient_color = vec4(0.0, 0.0, 0.0, 0.0);\n\t\t\t\t\t\tvec4 diffuse_color = vec4(0.0, 0.0, 0.0, 0.0);\n\t\t\t\t\t\tvec4 specular_color = vec4(0.0, 0.0, 0.0, 0.0);\n\n\t\t\t\t\t\t// note: could allow multiple lights\n\t\t\t\t\t\tfor (int i=0; i<1; i++)\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t // Get light direction (make sure to prevent zero devision)\n\t\t\t\t\t\t\t\tvec3 L = normalize(view_ray);\t//lightDirs[i];\n\t\t\t\t\t\t\t\tfloat lightEnabled = float( length(L) > 0.0 );\n\t\t\t\t\t\t\t\tL = normalize(L + (1.0 - lightEnabled));\n\n\t\t\t\t\t\t\t\t// Calculate lighting properties\n\t\t\t\t\t\t\t\tfloat lambertTerm = clamp(dot(N, L), 0.0, 1.0);\n\t\t\t\t\t\t\t\tvec3 H = normalize(L+V); // Halfway vector\n\t\t\t\t\t\t\t\tfloat specularTerm = pow(max(dot(H, N), 0.0), shininess);\n\n\t\t\t\t\t\t\t\t// Calculate mask\n\t\t\t\t\t\t\t\tfloat mask1 = lightEnabled;\n\n\t\t\t\t\t\t\t\t// Calculate colors\n\t\t\t\t\t\t\t\tambient_color +=\tmask1 * ambient_color;\t// * gl_LightSource[i].ambient;\n\t\t\t\t\t\t\t\tdiffuse_color +=\tmask1 * lambertTerm;\n\t\t\t\t\t\t\t\tspecular_color += mask1 * specularTerm * specular_color;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Calculate final color by componing different components\n\t\t\t\t\t\tvec4 final_color;\n\t\t\t\t\t\tvec4 color = apply_colormap(val);\n\t\t\t\t\t\tfinal_color = color * (ambient_color + diffuse_color) + specular_color;\n\t\t\t\t\t\tfinal_color.a = color.a;\n\t\t\t\t\t\treturn final_color;\n\t\t\t\t}"
+  };
+  _exports.VolumeRenderShader1 = VolumeRenderShader1;
+});

data/lib-opal/js_wrap/three/shaders/WaterRefractionShader.js

@@ -0,0 +1,46 @@
+(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.WaterRefractionShader = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.WaterRefractionShader = void 0;
+  var WaterRefractionShader = {
+    uniforms: {
+      'color': {
+        value: null
+      },
+      'time': {
+        value: 0
+      },
+      'tDiffuse': {
+        value: null
+      },
+      'tDudv': {
+        value: null
+      },
+      'textureMatrix': {
+        value: null
+      }
+    },
+    vertexShader:
+    /* glsl */
+    "\n\n\t\tuniform mat4 textureMatrix;\n\n\t\tvarying vec2 vUv;\n\t\tvarying vec4 vUvRefraction;\n\n\t\tvoid main() {\n\n\t\t\tvUv = uv;\n\n\t\t\tvUvRefraction = textureMatrix * vec4( position, 1.0 );\n\n\t\t\tgl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n\n\t\t}",
+    fragmentShader:
+    /* glsl */
+    "\n\n\t\tuniform vec3 color;\n\t\tuniform float time;\n\t\tuniform sampler2D tDiffuse;\n\t\tuniform sampler2D tDudv;\n\n\t\tvarying vec2 vUv;\n\t\tvarying vec4 vUvRefraction;\n\n\t\tfloat blendOverlay( float base, float blend ) {\n\n\t\t\treturn( base < 0.5 ? ( 2.0 * base * blend ) : ( 1.0 - 2.0 * ( 1.0 - base ) * ( 1.0 - blend ) ) );\n\n\t\t}\n\n\t\tvec3 blendOverlay( vec3 base, vec3 blend ) {\n\n\t\t\treturn vec3( blendOverlay( base.r, blend.r ), blendOverlay( base.g, blend.g ),blendOverlay( base.b, blend.b ) );\n\n\t\t}\n\n\t\tvoid main() {\n\n\t\t float waveStrength = 0.5;\n\t\t float waveSpeed = 0.03;\n\n\t\t\t// simple distortion (ripple) via dudv map (see https://www.youtube.com/watch?v=6B7IF6GOu7s)\n\n\t\t\tvec2 distortedUv = texture2D( tDudv, vec2( vUv.x + time * waveSpeed, vUv.y ) ).rg * waveStrength;\n\t\t\tdistortedUv = vUv.xy + vec2( distortedUv.x, distortedUv.y + time * waveSpeed );\n\t\t\tvec2 distortion = ( texture2D( tDudv, distortedUv ).rg * 2.0 - 1.0 ) * waveStrength;\n\n\t\t\t// new uv coords\n\n\t\t vec4 uv = vec4( vUvRefraction );\n\t\t uv.xy += distortion;\n\n\t\t\tvec4 base = texture2DProj( tDiffuse, uv );\n\n\t\t\tgl_FragColor = vec4( blendOverlay( base.rgb, color ), 1.0 );\n\n\t\t}"
+  };
+  _exports.WaterRefractionShader = WaterRefractionShader;
+});

data/lib-opal/js_wrap/three/textures/FlakesTexture.js

@@ -0,0 +1,61 @@
+(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.FlakesTexture = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.FlakesTexture = 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"); } }
+
+  var FlakesTexture = /*#__PURE__*/_createClass(function FlakesTexture() {
+    var width = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 512;
+    var height = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 512;
+
+    _classCallCheck(this, FlakesTexture);
+
+    var canvas = document.createElement('canvas');
+    canvas.width = width;
+    canvas.height = height;
+    var context = canvas.getContext('2d');
+    context.fillStyle = 'rgb(127,127,255)';
+    context.fillRect(0, 0, width, height);
+
+    for (var i = 0; i < 4000; i++) {
+      var x = Math.random() * width;
+      var y = Math.random() * height;
+      var r = Math.random() * 3 + 3;
+      var nx = Math.random() * 2 - 1;
+      var ny = Math.random() * 2 - 1;
+      var nz = 1.5;
+      var l = Math.sqrt(nx * nx + ny * ny + nz * nz);
+      nx /= l;
+      ny /= l;
+      nz /= l;
+      context.fillStyle = 'rgb(' + (nx * 127 + 127) + ',' + (ny * 127 + 127) + ',' + nz * 255 + ')';
+      context.beginPath();
+      context.arc(x, y, r, 0, Math.PI * 2);
+      context.fill();
+    }
+
+    return canvas;
+  });
+
+  _exports.FlakesTexture = FlakesTexture;
+});