From 42c078a407d8e0304cf698ce4b82df4bcf582984 Mon Sep 17 00:00:00 2001 From: Richard Zink Date: Wed, 7 Oct 2026 20:05:39 +0200 Subject: [PATCH] Permanent above-clouds cruise + more structure - Remove dive component from camY. Was mix(2.0, 1.2, diveT) (occasional dips into cloud top); now fixed at 2.2, always above the y=1.5 cloud ceiling. Cloud deck always visible below. - WEATHER_DENSITY bumped again: sunny 0.55->0.65, cloudy 0.85->0.90, night 0.65->0.75. Even 'sunny' is now a partly-cloudy sky. - clouds3d: third fBm detail layer at 3.2x frequency (was 2 layers). Contributions: base 1.0, mid 0.30, fine 0.12. Combined with the tighter smoothstep (0.18 -> 0.16) the silhouettes have wispier, more interesting edges instead of soft blobs. - Same density bump in clouds2d for consistency. --- vendor/clouds2d.js | 6 +++--- vendor/clouds3d.js | 34 ++++++++++++++++------------------ 2 files changed, 19 insertions(+), 21 deletions(-) diff --git a/vendor/clouds2d.js b/vendor/clouds2d.js index d09531e..c55cd8e 100644 --- a/vendor/clouds2d.js +++ b/vendor/clouds2d.js @@ -122,10 +122,10 @@ function hex(rgb) { } var WEATHER_DENSITY = { - sunny: 0.55, - cloudy: 0.85, + sunny: 0.65, + cloudy: 0.90, stormy: 1.00, - night: 0.65 + night: 0.75 }; // Load the noise image and upload it as a REPEAT-wrapped texture. diff --git a/vendor/clouds3d.js b/vendor/clouds3d.js index 63f5b05..eb640fc 100644 --- a/vendor/clouds3d.js +++ b/vendor/clouds3d.js @@ -97,21 +97,23 @@ var FRAG_SRC = [ '}', 'return v;', '}', - // Density at a point in the cloud layer. Two fBm layers: the - // base one at low frequency gives the large puffs, the detail - // layer at higher frequency breaks up the silhouette so clouds - // don't look like soft blobs. + // Density at a point in the cloud layer. Three fBm layers: the + // base one at low frequency gives the large puffs, the mid + // detail layer breaks up the silhouette, the fine layer adds + // wispy edges. Combined the result has more visual interest than + // a single fBm. 'float cloudDensity(vec3 p, float baseThresh) {', 'float n = fbm3(p * 0.35 + vec3(0.0, 0.0, uTime * 0.06));', 'float d = fbm3(p * 1.4 + vec3(uTime * 0.04, 7.3, uTime * 0.03));', - 'n = n + d * 0.18;', + 'float f = fbm3(p * 3.2 + vec3(2.1, uTime * 0.02, 5.7));', + 'n = n + d * 0.30 + f * 0.12;', // Cloud layer thickness: between y=-0.3 (deck bottom) // and y=1.5 (top), densest in the middle. 'float h = clamp((p.y + 0.3) / 1.8, 0.0, 1.0);', 'float profile = 4.0 * h * (1.0 - h); // bell curve', 'profile = max(profile, 0.0);', // Tighter smoothstep so the cloud edges have more detail. - 'return smoothstep(baseThresh, baseThresh + 0.18, n) * profile;', + 'return smoothstep(baseThresh, baseThresh + 0.16, n) * profile;', '}', // Star field: project ray onto a far sphere, hash-grid for // positions. Visible above the horizon at night with a small @@ -129,16 +131,12 @@ var FRAG_SRC = [ 'void main() {', 'vec2 uv = (gl_FragCoord.xy / uResolution.xy) * 2.0 - 1.0;', 'uv.x *= uResolution.x / uResolution.y;', - // Camera path: slow drift in X, mostly cruising just above the - // cloud deck like an airliner cockpit. pow(...,n) shapes the - // sin into short dips so we occasionally skim the cloud top. + // Camera path: slow drift in X, cruising just above the cloud deck + // like an airliner cockpit. No dives — we stay above so the + // deck is always visible below us. 'float drift = uTime * uSpeed * 0.45;', - // pow(...,8) keeps dives rare: most of the time diveT≈0, - // and only spikes briefly to 1. - 'float diveT = pow(0.5 + 0.5 * sin(uTime * 0.10), 8.0);', - // Cruise at y=2.0 (just above cloud ceiling y=1.5), dive to - // y=1.2 — close enough to skim the cloud top, never deep inside. - 'float camY = mix(2.0, 1.2, diveT);', + // Fixed altitude well above the cloud ceiling (y=1.5). + 'float camY = 2.2;', 'vec3 ro = vec3(drift, camY, drift * 0.7);', // Ray direction: nearly level, like looking out a cockpit // window. Horizon sits around the middle of the frame. @@ -238,10 +236,10 @@ function hex(rgb) { // Higher density across the board so even 'sunny' shows some cloud // structure, not just clear sky. Same mapping as clouds2d. var WEATHER_DENSITY = { - sunny: 0.55, - cloudy: 0.85, + sunny: 0.65, + cloudy: 0.90, stormy: 1.00, - night: 0.65 + night: 0.75 }; window.clouds3dRender = function(target) {