Upload index.html

index.html

@@ -102,7 +102,7 @@ function waveH(x, z, t){
    shader is handed the nearby ones as data, so the two can never disagree about whether land
    is there at all. The profile below is mirrored in the shader, so the boat sits on the same
    ground it is drawn on. */
-const ICELL = 48, MAX_ISLANDS = 48, MAXR = 70;   // a 170 m grid plus the reach of the largest island
+const ICELL = 48, MAX_ISLANDS = 96, MAXR = 70;   // a 170 m grid plus the reach of the largest island
 const LAND = { beach: 0.02, shelf: 1.2, deep: 6.0 };   // beach: how far up the shore the boat may sit
 let SEED = 1337;
 
@@ -120,11 +120,18 @@ function frac(v){ return v - Math.floor(v); }
 const F32 = v => Math.fround(v);
 function lhash(x, z){ return (ihash((Math.imul(x, 3419) + Math.imul(z, 2147483647)) >>> 0) & 1023) / 1023; }
 function lnoise(px, pz){            // takes lattice coordinates, so the caller sets the scale
-  const ix = Math.floor(px), iz = Math.floor(pz), fx = px-ix, fz = pz-iz;
-  const sx = fx*fx*(3 - 2*fx), sz = fz*fz*(3 - 2*fz);
+  // Every step is rounded to float32 so this matches what the shader does. The smoothstep and the two
+  // mixes were previously done in double, which is good enough for a metre grid - but the boat's height
+  // has to agree with the ground it is drawn on, and the only thing that can put the boat on a
+  // different height than the mesh is the boat and the shader disagreeing here.
+  const ix = Math.floor(px), iz = Math.floor(pz);
+  let fx = F32(px - F32(ix)), fz = F32(pz - F32(iz));
+  fx = F32(F32(F32(fx)*F32(fx))*F32(F32(3.0) - F32(F32(2.0)*fx)));
+  fz = F32(F32(F32(fz)*F32(fz))*F32(F32(3.0) - F32(F32(2.0)*fz)));
   const a = lhash(ix, iz), b = lhash(ix+1, iz), c = lhash(ix, iz+1), d = lhash(ix+1, iz+1);
-  const u = a + (b-a)*sx, v = c + (d-c)*sx;
-  return u + (v-u)*sz;
+  const u = F32(F32(a) + F32(F32(F32(b) - F32(a))*F32(fx)));
+  const v = F32(F32(c) + F32(F32(F32(d) - F32(c))*F32(fx)));
+  return F32(F32(u) + F32(F32(F32(v) - F32(u))*F32(fz)));
 }
 
 /* code packs four 4-bit fields, because that is the part both sides can decode identically:
@@ -154,13 +161,13 @@ function islandAt(cx, cz){
 }
 function decode(code){
   const pk = code & 15, sh = (code >> 4) & 15, rg = (code >> 8) & 15, type = code >> 12;
-  let peak = 1.2 + pk*0.22, shape = 1.2 + sh*0.03, ramp = 0;
-  // shape is the exponent on the falloff, so a small shape is nearly flat: a pinnacle gets near
-  // vertical sides. A flat island instead uses a ramp - flat for most of the radius, then a
-  // straight fall over the last fraction of it, which is the beach the boat can actually sit on.
-  if(type === 1){ peak = 2.0 + pk*0.35; ramp = 0.10 + sh*0.04; }
-  else if(type === 2){ peak = 14.0 + pk*1.6; shape = 0.04 + sh*0.012; }
-  return { peak, shape, rough: F32(rg/15), type, ramp, pk, sh, rg };
+  let peak = F32(F32(1.2) + F32(F32(pk)*F32(0.22))), shape = F32(F32(1.2) + F32(F32(sh)*F32(0.03))), ramp = 0.0;
+  // shape is the exponent on the falloff, so a small shape is nearly flat. A flat island instead uses a
+  // ramp - flat for most of the radius, then a straight fall over the last fraction of it, which is the
+  // beach the boat can actually sit on. Constants are rounded to float32 because the shader computes this
+  // in float32, and the two have to produce the same number for the same island.
+  if(type === 1){ peak = F32(F32(2.0) + F32(F32(pk)*F32(0.35))); ramp = F32(F32(0.10) + F32(F32(sh)*F32(0.04))); }
+  return { peak, shape, rough: F32(F32(rg)/F32(15)), type, ramp, pk, sh, rg };
 }
 
 function landH(x, z){
@@ -207,7 +214,13 @@ function islandsNear(minX, maxX, minZ, maxZ){
   for(let cz = Math.floor(c/ICELL); cz <= Math.floor(d/ICELL) && out.length < MAX_ISLANDS; cz++)
     for(let cx = Math.floor(a/ICELL); cx <= Math.floor(b/ICELL) && out.length < MAX_ISLANDS; cx++){
       const isl = islandAt(cx, cz);
-      if(isl) out.push(isl);
+      if(!isl) continue;
+      // Only islands that can actually reach a vertex inside the area the mesh is drawing. Without this
+      // the list filled up with islands that cannot affect any drawn point, so the ones dropped by the
+      // cap were still known to the boat - and that is a collision with land you cannot see.
+      const nx = Math.max(Math.min(isl.x, maxX), minX), nz = Math.max(Math.min(isl.z, maxZ), minZ);
+      if(Math.hypot(nx - isl.x, nz - isl.z) > isl.r) continue;
+      out.push(isl);
     }
   return out;
 }
@@ -232,7 +245,7 @@ float fbm(vec2 p, int oct){
 `;
 
 const ISLANDS_GLSL = `
-uniform vec4 uIsl[48];   // must match MAX_ISLANDS, otherwise islands past 25 are silently dropped
+uniform vec4 uIsl[96];   // must match MAX_ISLANDS, otherwise islands past the cap are silently dropped
 uniform int uCount;
 uint ihash(uint n){
   n ^= n >> 15; n *= 0x2c1b3c9du; n ^= n >> 12; n *= 0x297a2d39u; n ^= n >> 15;
@@ -261,7 +274,9 @@ float landH(vec2 p){
     float rr = isl.z * (0.55 + 0.45*wob);
     if(d > rr) continue;
     float peak = 1.2 + pk*0.22, shape = 1.2 + sh*0.03, ramp = 0.0;
-    if(type == 1.0){ peak = 2.0 + pk*0.35; }
+    if(type == 1.0){ peak = 2.0 + pk*0.35; ramp = 0.10 + sh*0.04; }   // ramp was never set here, so the
+    // shader drew a dome while the boat walked into a flat top with a beach band - two different shapes
+    // for the same island, which is the collision near the large ones.
     else if(type == 2.0){ peak = 14.0 + pk*1.6; shape = 0.04 + sh*0.012; }
     float rough = rg/15.0;
     float k = 1.0 - d/rr;