cp

Author: codeagent

graphics/index.ts

@@ -1,8 +1,5 @@
 export * from './camera';
 export * from './transform';
-export * from './plate-ocean-renderer';
-export * from './tile-ocean-renderer';
-export * from './projected-grid-renderer';
 export * from './mesh';
 export * from './gpu';
 export * from './texture-renderer';

graphics/mesh.ts

@@ -147,26 +147,33 @@ export const createPlane = (resolution: number): Mesh => {
   };
 };
 
-export const createNDCGrid = (resolution: number): Mesh => {
+export const createNDCGrid = (
+  resolutionX: number,
+  resolutionY: number,
+  marginX = 1.0,
+  marginY = 1.0
+): Mesh => {
   const vertices: vec3[] = [];
   const indices: number[] = [];
-  const N = resolution;
-  const L = 1.0;
-  const delta = (2.0 * L) / (N - 1);
-  const offset = vec3.fromValues(-L, -L, -1.0);
 
-  for (let i = 0; i < N - 1; i++) {
-    for (let j = 0; j < N - 1; j++) {
-      let v0 = vec3.fromValues(j * delta, i * delta, 0.0);
+  const Lx = 1.0 + marginX;
+  const Ly = 1.0 + marginY;
+  const deltaX = (2.0 * Lx) / (resolutionX - 1);
+  const deltaY = (2.0 * Ly) / (resolutionY - 1);
+  const offset = vec3.fromValues(-Lx, -Ly, -1.0);
+
+  for (let i = 0; i < resolutionY - 1; i++) {
+    for (let j = 0; j < resolutionX - 1; j++) {
+      let v0 = vec3.fromValues(j * deltaX, i * deltaY, 0.0);
       vec3.add(v0, v0, offset);
 
-      let v1 = vec3.fromValues((j + 1) * delta, i * delta, 0.0);
+      let v1 = vec3.fromValues((j + 1) * deltaX, i * deltaY, 0.0);
       vec3.add(v1, v1, offset);
 
-      let v2 = vec3.fromValues((j + 1) * delta, (i + 1) * delta, 0.0);
+      let v2 = vec3.fromValues((j + 1) * deltaX, (i + 1) * deltaY, 0.0);
       vec3.add(v2, v2, offset);
 
-      let v3 = vec3.fromValues(j * delta, (i + 1) * delta, 0.0);
+      let v3 = vec3.fromValues(j * deltaX, (i + 1) * deltaY, 0.0);
       vec3.add(v3, v3, offset);
 
       // indices.push(vertices.length + 1, vertices.length, vertices.length + 2);

graphics/programs/projected-grid.ts

@@ -2,25 +2,46 @@ export const vs = `#version 300 es
 
 layout(location = 0) in vec3 position;
 
-uniform mat4 invViewProjMat;
+uniform mat4 invProjView;
 uniform mat4 viewMat;
 uniform mat4 projMat;
 uniform vec3 pos;
-
-out highp vec2 _xz;
-
+uniform float sizes[3];   
+uniform float croppinesses[3];   
+uniform float scale;   
+
+uniform sampler2D dx_hy_dz_dxdz0;
+uniform sampler2D sx_sz_dxdx_dzdz0;
+uniform sampler2D dx_hy_dz_dxdz1;
+uniform sampler2D sx_sz_dxdx_dzdz1;
+uniform sampler2D dx_hy_dz_dxdz2;
+uniform sampler2D sx_sz_dxdx_dzdz2;
+
+out vec3 _position;
+out vec2 _xz;
+
+vec3 getDisplacement(in vec2 xz) {
+  vec2 uv0 = xz / sizes[0];
+  vec2 uv1 = xz / sizes[1];
+  vec2 uv2 = xz / sizes[2];
+
+  return 
+    texture(dx_hy_dz_dxdz0, uv0).xyz * vec3(croppinesses[0], 1.0f, croppinesses[0]) + 
+    texture(dx_hy_dz_dxdz1, uv1).xyz * vec3(croppinesses[1], 1.0f, croppinesses[1]) + 
+    texture(dx_hy_dz_dxdz2, uv2).xyz * vec3(croppinesses[2], 1.0f, croppinesses[2]);
+}
 void main()
 {
-   vec4 homogeneous = invViewProjMat * vec4(position, 1.0f);
-   vec3 world = homogeneous.xyz / homogeneous.w;
-   vec3 ray = world - pos;
+   vec4 homogeneous = invProjView * vec4(position, 1.0f);
+   vec3 ray = normalize(homogeneous.xyz / homogeneous.w);
 
   if(ray.y >= 0.0f) {  // beyond horizon
     gl_Position = vec4(position.x, position.y, 2.0f, 1.0f);
   } else {
-    world = ray * -pos.y / ray.y + pos;
-    _xz = world.xz;
-    gl_Position = projMat * viewMat * vec4(world, 1.0f);
+    _position = ray * -pos.y / ray.y + pos;
+    _xz = _position.xz;
+    _position = _position + getDisplacement(_xz);
+    gl_Position = projMat * viewMat * vec4(_position, 1.0f);
   }
 }
 `;

graphics/projected-grid-renderer.ts

@@ -0,0 +1,4 @@
+export * from './plate-ocean-renderer';
+export * from './tile-ocean-renderer';
+export * from './projected-grid-renderer';
+

renderer/index.ts

@@ -0,0 +1,8 @@
+import { Camera } from '../graphics';
+import { OceanField } from '../ocean';
+
+export interface OceanRendererInterface<S> {
+  render(camera: Camera, oceanField: OceanField): void;
+  getSettings(): Readonly<S>;
+  setSettings(settings: Partial<S>): void;
+}

renderer/ocean-renderer-interface.ts

@@ -3,11 +3,12 @@ import { BehaviorSubject } from 'rxjs';
 import { distinctUntilChanged, switchMap, debounceTime } from 'rxjs/operators';
 import { isEqual } from 'lodash-es';
 
-import { Geometry, Gpu, Mesh, ShaderProgram } from './gpu';
-import { Camera } from './camera';
+import { Geometry, Gpu, Mesh, ShaderProgram, Camera } from '../graphics';
+import { OceanRendererInterface } from './ocean-renderer-interface';
 import { vs as oceanvs, fs as oceanfs } from './programs/ocean';
 import { OceanField } from '../ocean';
 import { ThreadWorker } from '../thread';
+
 // @ts-ignore:
 import { createDisc } from './mesh';
 
@@ -21,7 +22,7 @@ export interface PlateOceanRendererSettings {
   offset: number;
 }
 
-export const plateDefaultSettings: Readonly<PlateOceanRendererSettings> = {
+const defaultSettings: Readonly<PlateOceanRendererSettings> = {
   rings: 512,
   segments: 512,
   delta: 0.1,
@@ -31,11 +32,13 @@ export const plateDefaultSettings: Readonly<PlateOceanRendererSettings> = {
 
 type ThreadWorkerInput = PlateOceanRendererSettings;
 
-export class PlateOceanRenderer {
+export class PlateOceanRenderer
+  implements OceanRendererInterface<PlateOceanRendererSettings>
+{
   private readonly shader: ShaderProgram;
   private readonly worker: ThreadWorker<ThreadWorkerInput, Mesh>;
   private readonly settings$ = new BehaviorSubject<PlateOceanRendererSettings>({
-    ...plateDefaultSettings,
+    ...defaultSettings,
   });
   private geometry: Geometry;
 

graphics/plate-ocean-renderer.ts renamed to renderer/plate-ocean-renderer.ts

@@ -0,0 +1,152 @@
+export const vs = `#version 300 es
+
+layout(location = 0) in vec3 position;
+
+uniform mat4 viewMat;
+uniform mat4 worldMat;
+uniform mat4 projMat;
+uniform float sizes[3];   
+uniform float croppinesses[3];   
+uniform float scale;   
+
+uniform sampler2D dx_hy_dz_dxdz0;
+uniform sampler2D sx_sz_dxdx_dzdz0;
+uniform sampler2D dx_hy_dz_dxdz1;
+uniform sampler2D sx_sz_dxdx_dzdz1;
+uniform sampler2D dx_hy_dz_dxdz2;
+uniform sampler2D sx_sz_dxdx_dzdz2;
+
+out vec3 _position;
+out vec2 _xz;
+
+vec3 getDisplacement(in vec2 xz) {
+  vec2 uv0 = xz / sizes[0];
+  vec2 uv1 = xz / sizes[1];
+  vec2 uv2 = xz / sizes[2];
+
+  return 
+    texture(dx_hy_dz_dxdz0, uv0).xyz * vec3(croppinesses[0], 1.0f, croppinesses[0]) + 
+    texture(dx_hy_dz_dxdz1, uv1).xyz * vec3(croppinesses[1], 1.0f, croppinesses[1]) + 
+    texture(dx_hy_dz_dxdz2, uv2).xyz * vec3(croppinesses[2], 1.0f, croppinesses[2]);
+}
+
+void main()
+{
+  vec2 xz = vec3(worldMat * vec4(position * scale, 1.0f)).xz;
+  _position = position * scale + getDisplacement(xz);
+  _position = vec3(worldMat * vec4(_position, 1.0f));
+  _xz = xz;
+  gl_Position = projMat * viewMat * vec4(_position, 1.0f);
+}
+`;
+
+export const fs = `#version 300 es
+precision highp float;
+
+layout(location = 0) out vec4 color;	
+
+in vec3 _position;
+in vec2 _xz;
+
+uniform vec3 pos;
+uniform float foamSpreading;
+uniform float foamContrast;
+uniform float sizes[3];   
+uniform float croppinesses[3];   
+
+uniform sampler2D dx_hy_dz_dxdz0;
+uniform sampler2D sx_sz_dxdx_dzdz0;
+uniform sampler2D dx_hy_dz_dxdz1;
+uniform sampler2D sx_sz_dxdx_dzdz1;
+uniform sampler2D dx_hy_dz_dxdz2;
+uniform sampler2D sx_sz_dxdx_dzdz2;
+
+vec4 jacobian(float dxdx, float dxdz, float dzdz) {
+  float Jxx = 1.0f + dxdx;
+  float Jxz = dxdz;
+  float Jzz = 1.0f + dzdz;
+  return vec4(Jxx, Jxz, Jxz, Jzz);
+}
+
+float det(vec4 jacobian) {
+  return jacobian.x * jacobian.w - jacobian.y * jacobian.z;
+}
+
+vec3 getNormal(in vec2 xz) {
+  vec2 uv0 = xz / sizes[0];
+  vec2 uv1 = xz / sizes[1];
+  vec2 uv2 = xz / sizes[2];
+
+  vec4 _sx_sz_dxdx_dzdz0 = texture(sx_sz_dxdx_dzdz0, uv0).xyzw;
+  vec4 _sx_sz_dxdx_dzdz1 = texture(sx_sz_dxdx_dzdz1, uv1).xyzw;
+  vec4 _sx_sz_dxdx_dzdz2 = texture(sx_sz_dxdx_dzdz2, uv2).xyzw;
+
+  float sx = _sx_sz_dxdx_dzdz0.x + _sx_sz_dxdx_dzdz1.x +_sx_sz_dxdx_dzdz2.x;
+  float sz = _sx_sz_dxdx_dzdz0.y + _sx_sz_dxdx_dzdz1.y +_sx_sz_dxdx_dzdz2.y;
+  float dxdx = _sx_sz_dxdx_dzdz0.z * croppinesses[0] + _sx_sz_dxdx_dzdz1.z * croppinesses[1] + _sx_sz_dxdx_dzdz2.z * croppinesses[2];
+  float dzdz = _sx_sz_dxdx_dzdz0.w * croppinesses[0] + _sx_sz_dxdx_dzdz1.w * croppinesses[1] + _sx_sz_dxdx_dzdz2.w * croppinesses[2];
+
+  vec2 slope = vec2(sx / (1.0f + dxdx), sz / (1.0f + dzdz));
+
+  return normalize(vec3(-slope.x, 1.0f, -slope.y));
+}
+
+float getFoam(in vec2 xz) {
+  vec2 uv0 = xz / sizes[0];
+  vec2 uv1 = xz / sizes[1];
+  vec2 uv2 = xz / sizes[2];
+
+  vec2 dxdx_dzdz0 = texture(sx_sz_dxdx_dzdz0, uv0).zw;
+  vec2 dxdx_dzdz1 = texture(sx_sz_dxdx_dzdz1, uv1).zw;
+  vec2 dxdx_dzdz2 = texture(sx_sz_dxdx_dzdz2, uv2).zw;
+
+  float dxdz0 = texture(dx_hy_dz_dxdz0, uv0).w;
+  float dxdz1 = texture(dx_hy_dz_dxdz1, uv1).w;
+  float dxdz2 = texture(dx_hy_dz_dxdz2, uv2).w;
+  
+  vec2 dxdx_dzdz = dxdx_dzdz0 * croppinesses[0] + dxdx_dzdz1 * croppinesses[1] + dxdx_dzdz2 * croppinesses[2];
+  float dxdz = dxdz0 * croppinesses[0] + dxdz1 * croppinesses[1] + dxdz2 * croppinesses[2];
+
+  float val = det(jacobian(dxdx_dzdz.x, dxdz, dxdx_dzdz.y));
+  return pow(-min(0.0f, val - foamSpreading), foamContrast);
+}
+
+vec3 surface(in vec3 normal, in vec3 view) {
+  const vec3 upwelling = vec3(0.0, 0.2, 0.3);
+  const vec3 sky = vec3(0.69, 0.84, 1.0);
+  const vec3 mist = vec3(0.34, 0.42, 0.5);
+  const float nShell = 1.34f;
+  const float kDiffuse = 0.91f;
+
+  float reflectivity;
+  float costhetai = abs(dot(normal, normalize(view)));
+  float thetai = acos(costhetai);
+  float sinthetat = sin(thetai) / nShell;
+  float thetat = asin(sinthetat);
+
+  if(thetai == 0.0)
+  {
+    reflectivity = (nShell - 1.0f) / (nShell + 1.0f);
+    reflectivity = reflectivity * reflectivity;
+  }
+  else
+  {
+    float fs = sin(thetat - thetai)  / sin(thetat + thetai);
+    float ts = tan(thetat - thetai)  / tan(thetat + thetai);
+    reflectivity = 0.5 * (fs * fs + ts * ts );
+  }
+
+  float falloff = exp(-length(view) * 1.0e-3) * kDiffuse;
+  vec3 surf =  reflectivity * sky + (1.0f - reflectivity) * upwelling;
+  return falloff * surf  + (1.0f - falloff) * mist;
+}
+
+void main()
+{
+  float f = getFoam(_xz);
+  vec3 n = getNormal(_xz);
+  const vec3 foam = vec3(1.0f);
+  vec3 water = surface(n, pos - _position);
+  color = vec4(mix(water, foam, f), 1.0f); 
+}
+`;