@multiplekex/shallot 0.2.3 → 0.2.5

package/src/standard/render/surface/noise.ts

@@ -5,6 +5,17 @@ fn hash2(p: vec2<f32>) -> f32 {
     return fract((p3.x + p3.y) * p3.z);
 }
 
+fn value2d(p: vec2f, seed: vec2f) -> f32 {
+    let i = floor(p);
+    let f = fract(p);
+    let u = f * f * (3.0 - 2.0 * f);
+    return mix(
+        mix(fract(sin(dot(i, seed)) * 43758.5) * 2.0 - 1.0,
+            fract(sin(dot(i + vec2(1.0, 0.0), seed)) * 43758.5) * 2.0 - 1.0, u.x),
+        mix(fract(sin(dot(i + vec2(0.0, 1.0), seed)) * 43758.5) * 2.0 - 1.0,
+            fract(sin(dot(i + vec2(1.0, 1.0), seed)) * 43758.5) * 2.0 - 1.0, u.x), u.y);
+}
+
 fn simplex2(p: vec2<f32>) -> f32 {
     let K1 = 0.366025404;
     let K2 = 0.211324865;
@@ -28,13 +39,15 @@ fn simplex2(p: vec2<f32>) -> f32 {
     return dot(h4, n) * 70.0;
 }
 
-fn fbm2(p: vec2<f32>, octaves: i32) -> f32 {
+const FBM2_OCTAVES = 5;
+
+fn fbm2(p: vec2<f32>) -> f32 {
     var value = 0.0;
     var amplitude = 0.5;
     var frequency = 1.0;
     var pos = p;
 
-    for (var i = 0; i < octaves; i++) {
+    for (var i = 0; i < FBM2_OCTAVES; i++) {
         value += amplitude * simplex2(pos * frequency);
         amplitude *= 0.5;
         frequency *= 2.0;

package/src/standard/render/surface/shaders.ts

@@ -0,0 +1,257 @@
+export function compileVertexBody(vertex?: string): string {
+    return vertex
+        ? `var pos = worldPos;
+    ${vertex}
+    return pos;`
+        : "return worldPos;";
+}
+
+export const STARS_WGSL = /* wgsl */ `
+fn hashStar(p: vec2<f32>) -> f32 {
+    var p3 = fract(vec3(p.x, p.y, p.x) * 0.1031);
+    p3 += dot(p3, p3.yzx + 33.33);
+    return fract((p3.x + p3.y) * p3.z);
+}
+
+fn hash2Star(p: vec2<f32>) -> vec2<f32> {
+    var p3 = fract(vec3(p.x, p.y, p.x) * vec3(0.1031, 0.1030, 0.0973));
+    p3 += dot(p3, p3.yzx + 33.33);
+    return fract((p3.xx + p3.yz) * p3.zy);
+}
+
+fn sampleStars(dir: vec3<f32>) -> vec3<f32> {
+    if (sky.starParams.z <= 0.0 || dir.y < 0.0) {
+        return vec3(0.0);
+    }
+
+    let theta = atan2(dir.z, dir.x);
+    let phi = asin(clamp(dir.y, -1.0, 1.0));
+
+    let gridSize = mix(20.0, 100.0, sky.starParams.y);
+    let cell = vec2(theta * gridSize / 3.14159, phi * gridSize / 1.5708);
+    let cellId = floor(cell);
+    let cellFract = fract(cell);
+
+    var starColor = vec3(0.0);
+
+    for (var dy = -1; dy <= 1; dy++) {
+        for (var dx = -1; dx <= 1; dx++) {
+            let neighbor = cellId + vec2(f32(dx), f32(dy));
+            let starHash = hashStar(neighbor);
+
+            if (starHash > sky.starParams.y * 0.7) {
+                continue;
+            }
+
+            let starPos = hash2Star(neighbor);
+            let starCenter = neighbor + starPos;
+            let dist = length(cell - starCenter);
+
+            let brightness = hashStar(neighbor + vec2(100.0, 100.0));
+            let radius = 0.02 + brightness * 0.03;
+
+            if (dist < radius) {
+                let twinkle = 0.8 + 0.2 * sin(brightness * 100.0);
+                let intensity = sky.starParams.x * brightness * twinkle;
+                let falloff = 1.0 - smoothstep(0.0, radius, dist);
+
+                let temp = hashStar(neighbor + vec2(200.0, 200.0));
+                let tint = mix(vec3(1.0, 0.9, 0.8), vec3(0.8, 0.9, 1.0), temp);
+
+                starColor = max(starColor, tint * intensity * falloff);
+            }
+        }
+    }
+
+    return starColor;
+}
+`;
+
+export { NOISE_WGSL } from "./noise";
+
+export const MOON_WGSL = /* wgsl */ `
+fn sampleMoon(dir: vec3<f32>) -> vec3<f32> {
+    if (sky.moonParams.z <= 0.0) {
+        return vec3(0.0);
+    }
+
+    let moonDir = sky.moonDirection.xyz;
+    let moonDot = dot(dir, moonDir);
+
+    let moonSize = 0.9995;
+    let moonColor = vec3(0.9, 0.9, 0.85);
+    let edgeWidth = 0.0003;
+    let glowStart = 0.999;
+
+    if (moonDot > moonSize - edgeWidth) {
+        let toCenter = dir - moonDir * moonDot;
+        let diskRight = normalize(cross(moonDir, vec3(0.0, 1.0, 0.0)));
+        let diskUp = cross(diskRight, moonDir);
+
+        let diskRadius = sqrt(1.0 - moonSize * moonSize);
+        let u = dot(toCenter, diskRight) / diskRadius;
+        let v = dot(toCenter, diskUp) / diskRadius;
+
+        let r2 = u * u + v * v;
+        let z = sqrt(max(0.0, 1.0 - r2));
+
+        let diskEdge = smoothstep(1.0 + edgeWidth / diskRadius, 1.0 - edgeWidth / diskRadius, sqrt(r2));
+
+        let limb = pow(z, 0.6);
+
+        let cellU = u * 8.0;
+        let cellV = v * 8.0;
+        let craterNoise = hashStar(floor(vec2(cellU, cellV)) + vec2(50.0, 50.0));
+        let surfaceVariation = 0.85 + 0.15 * craterNoise;
+
+        let phase = sky.moonParams.x;
+        let sunAngle = phase * 6.28318;
+        let sunLocalX = sin(sunAngle);
+        let sunLocalZ = -cos(sunAngle);
+
+        let illumination = u * sunLocalX + z * sunLocalZ;
+        let lit = smoothstep(-0.05, 0.05, illumination);
+
+        let earthshine = vec3(0.06, 0.07, 0.1);
+        let dayColor = moonColor * surfaceVariation * limb;
+        let surfaceColor = mix(earthshine * limb, dayColor, lit);
+
+        return surfaceColor * diskEdge * smoothstep(0.15, 0.3, sky.moonParams.y);
+    } else {
+        let glowFalloff = max(0.0, moonDot - glowStart) / (moonSize - edgeWidth - glowStart);
+        let glow = pow(glowFalloff, 2.0) * sky.moonParams.y;
+        return moonColor * glow * 0.3;
+    }
+}
+`;
+
+export const CLOUDS_WGSL = /* wgsl */ `
+fn sampleClouds(dir: vec3<f32>) -> vec4<f32> {
+    if (sky.cloudParams.w <= 0.0 || dir.y < 0.01) {
+        return vec4(0.0);
+    }
+
+    let t = sky.cloudParams.z / max(dir.y, 0.001);
+    let uv = dir.xz * t;
+
+    var n = fbm2(uv);
+
+    let coverage = sky.cloudParams.x;
+    let density = sky.cloudParams.y;
+    n = smoothstep(1.0 - coverage, 1.0, n * 0.5 + 0.5) * density;
+
+    n *= smoothstep(0.0, 0.15, dir.y);
+
+    return vec4(sky.cloudColor.rgb, n);
+}
+`;
+
+const DEG_TO_RAD = Math.PI / 180;
+
+export const SKY_DIR_WGSL = /* wgsl */ `
+const DEG_TO_RAD: f32 = ${DEG_TO_RAD};
+
+fn computeSkyDir(screenX: f32, screenY: f32) -> vec3<f32> {
+    let width = scene.viewport.x;
+    let height = scene.viewport.y;
+
+    let ndcX = screenX * 2.0 - 1.0;
+    let ndcY = 1.0 - screenY * 2.0;
+
+    let aspect = width / height;
+
+    let cameraWorld = scene.cameraWorld;
+    let r00 = cameraWorld[0][0]; let r10 = cameraWorld[0][1]; let r20 = cameraWorld[0][2];
+    let r01 = cameraWorld[1][0]; let r11 = cameraWorld[1][1]; let r21 = cameraWorld[1][2];
+    let r02 = cameraWorld[2][0]; let r12 = cameraWorld[2][1]; let r22 = cameraWorld[2][2];
+
+    let skyFov = select(scene.fov, 60.0, scene.cameraMode > 0.5);
+    let tanHalfFov = tan((skyFov * DEG_TO_RAD) / 2.0);
+    let camDirX = ndcX * aspect * tanHalfFov;
+    let camDirY = ndcY * tanHalfFov;
+    let camDirZ = -1.0;
+    var dirX = r00 * camDirX + r01 * camDirY + r02 * camDirZ;
+    var dirY = r10 * camDirX + r11 * camDirY + r12 * camDirZ;
+    var dirZ = r20 * camDirX + r21 * camDirY + r22 * camDirZ;
+    let len = sqrt(dirX * dirX + dirY * dirY + dirZ * dirZ);
+    dirX /= len; dirY /= len; dirZ /= len;
+    return vec3(dirX, dirY, dirZ);
+}
+`;
+
+export const SKY_WGSL = /* wgsl */ `
+${STARS_WGSL}
+${MOON_WGSL}
+${CLOUDS_WGSL}
+
+fn sampleSky(dir: vec3<f32>) -> vec3<f32> {
+    if (sky.skyZenith.a <= 0.0) {
+        return scene.clearColor.rgb;
+    }
+
+    let t = pow(clamp(dir.y, 0.0, 1.0), 0.25);
+    var color = mix(sky.skyHorizon.rgb, sky.skyZenith.rgb, t);
+
+    let horizonBand = 1.0 - abs(dir.y);
+    let horizonBlend = pow(horizonBand, 32.0);
+    color = mix(color, vec3(1.09), horizonBlend);
+
+    color += sampleStars(dir);
+
+    let clouds = sampleClouds(dir);
+    color = mix(color, clouds.rgb, clouds.a);
+
+    let moonContrib = sampleMoon(dir);
+    color += moonContrib * (1.0 - clouds.a * 0.7);
+
+    let sunDir = -scene.sunDirection.xyz;
+    let sunDot = dot(dir, sunDir);
+
+    let sunVisualColor = select(scene.sunColor.rgb, sky.sunVisualColor.rgb, sky.sunParams.z > 0.5);
+
+    let glowParam = sky.sunParams.y;
+
+    let baseSunSize = 0.9995;
+    let sunSizeParam = sky.sunParams.x;
+    let sunThreshold = 1.0 - (1.0 - baseSunSize) * sunSizeParam;
+    let sunEdgeWidth = (1.0 - sunThreshold) * 0.15;
+
+    let diskBlend = smoothstep(sunThreshold - sunEdgeWidth, sunThreshold + sunEdgeWidth, sunDot);
+    if (diskBlend > 0.0 && glowParam > 0.0) {
+        let radial = saturate((sunDot - sunThreshold) / (1.0 - sunThreshold));
+        let limbDarken = mix(0.7, 1.0, pow(radial, 0.5));
+        color += sunVisualColor * limbDarken * diskBlend * smoothstep(0.0, 0.3, glowParam);
+    }
+
+    let glow = max(0.0, sunDot);
+    let innerGlow = pow(glow, 32.0) * glowParam * 1.5;
+    let outerGlow = pow(glow, 3.0) * glowParam * 0.15;
+    color += sunVisualColor * (innerGlow + outerGlow);
+
+    if (sky.hazeDensity > 0.0) {
+        let horizonFactor = 1.0 - clamp(dir.y, 0.0, 1.0);
+        let hazeAmount = pow(horizonFactor, 2.0) * saturate(sky.hazeDensity * 5.0);
+        color = mix(color, sky.hazeColor.rgb, hazeAmount);
+    }
+
+    return color;
+}
+`;
+
+export const HAZE_WGSL = /* wgsl */ `
+fn applyHaze(color: vec3<f32>, dist: f32) -> vec3<f32> {
+    if (sky.hazeDensity <= 0.0) {
+        return color;
+    }
+    let haze = 1.0 - exp(-sky.hazeDensity * dist);
+    return mix(color, sky.hazeColor.rgb, haze);
+}
+`;
+
+export const WGSL_LIGHTING_CALC = /* wgsl */ `
+let NdotL = max(dot(surface.normal, -scene.sunDirection.xyz), 0.0);
+let ambient = scene.ambientColor.rgb * scene.ambientColor.a;
+let sunDiffuse = scene.sunColor.rgb * NdotL;
+let diffuseWeight = 1.0 - surface.metallic;
+let lighting = (ambient + sunDiffuse) * diffuseWeight;
+`;

package/src/standard/render/surface/structs.ts

@@ -28,6 +28,15 @@ struct Scene {
     reflectionDepth: u32,
     refractionDepth: u32,
     instanceCount: u32,
+    time: f32,
+    _pad0: f32,
+    _pad1: f32,
+    _pad2: f32,
+    frustumPlanes: array<vec4<f32>, 6>,
+}`;
+
+export const SKY_STRUCT_WGSL = /* wgsl */ `
+struct Sky {
     hazeDensity: f32,
     _pad2: f32,
     _pad3: f32,
@@ -35,7 +44,6 @@ struct Scene {
     hazeColor: vec4<f32>,
     skyZenith: vec4<f32>,
     skyHorizon: vec4<f32>,
-    frustumPlanes: array<vec4<f32>, 6>,
     moonParams: vec4<f32>,
     moonDirection: vec4<f32>,
     starParams: vec4<f32>,
@@ -80,12 +88,11 @@ struct FragmentOutput {
 
 ${SCENE_STRUCT_WGSL}
 
+${DATA_STRUCT_WGSL}
+
 @group(0) @binding(0) var<uniform> scene: Scene;
 @group(0) @binding(1) var<storage, read> entityIds: array<u32>;
 @group(0) @binding(2) var<storage, read> matrices: array<mat4x4<f32>>;
-@group(0) @binding(3) var<storage, read> colors: array<vec4<f32>>;
-@group(0) @binding(4) var<storage, read> sizes: array<vec4<f32>>;
-@group(0) @binding(5) var<storage, read> pbr: array<vec4<f32>>;
-@group(0) @binding(6) var<storage, read> emission: array<vec4<f32>>;
-@group(0) @binding(7) var<storage, read> shapes: array<u32>;
+@group(0) @binding(3) var<storage, read> sizes: array<vec4<f32>>;
+@group(0) @binding(4) var<storage, read> data: array<Data>;
 `;

package/src/standard/render/forward/index.ts

@@ -1,259 +0,0 @@
-import type { ComputeNode, ExecutionContext } from "../../compute";
-import type { SurfaceData } from "../surface";
-import type { Batch } from "../mesh";
-import { COLOR_FORMAT } from "../scene";
-import { compileUberShader } from "../shaders";
-import { createRasterPipeline, createSkyPipeline } from "./raster";
-
-export interface ForwardConfig {
-    scene: GPUBuffer;
-    matrices: GPUBuffer;
-    colors: GPUBuffer;
-    sizes: GPUBuffer;
-    pbr: GPUBuffer;
-    emission: GPUBuffer;
-    shapes: GPUBuffer;
-    surfaces: GPUBuffer;
-    data: GPUBuffer;
-    getSurfaces: () => SurfaceData[];
-    getRaytracing: () => boolean;
-    getClearColor: () => { r: number; g: number; b: number };
-    getSky: () => boolean;
-    acquire?: (message?: string) => (() => void) | undefined;
-    batches: () => (Batch | null)[];
-    tlasNodes: GPUBuffer;
-    tlasInstanceIds: GPUBuffer;
-    blasNodes: GPUBuffer;
-    blasTriIds: GPUBuffer;
-    blasTriangles: GPUBuffer;
-    blasMeta: GPUBuffer;
-    instanceInverses: GPUBuffer;
-}
-
-export type ForwardNode = ComputeNode;
-
-export function createForwardNode(config: ForwardConfig): ForwardNode {
-    let rasterPipeline: GPURenderPipeline | null = null;
-    let rtPipeline: GPUComputePipeline | null = null;
-    let rtCompiling = false;
-    let skyPipeline: GPURenderPipeline | null = null;
-
-    function executeRT(ctx: ExecutionContext): void {
-        const { device, encoder } = ctx;
-
-        const colorView = ctx.getTextureView("color");
-        const linearDepthView = ctx.getTextureView("linear-depth");
-        const eidView = ctx.getTextureView("eid");
-
-        if (!colorView || !linearDepthView || !eidView || !rtPipeline) {
-            return;
-        }
-
-        const bindGroup0 = device.createBindGroup({
-            layout: rtPipeline.getBindGroupLayout(0),
-            entries: [
-                { binding: 0, resource: { buffer: config.scene } },
-                { binding: 1, resource: { buffer: config.data } },
-                { binding: 2, resource: colorView },
-                { binding: 3, resource: linearDepthView },
-                { binding: 4, resource: eidView },
-            ],
-        });
-
-        const bindGroup1 = device.createBindGroup({
-            layout: rtPipeline.getBindGroupLayout(1),
-            entries: [
-                { binding: 0, resource: { buffer: config.tlasNodes } },
-                { binding: 1, resource: { buffer: config.tlasInstanceIds } },
-                { binding: 2, resource: { buffer: config.blasNodes } },
-                { binding: 3, resource: { buffer: config.blasTriIds } },
-                { binding: 4, resource: { buffer: config.blasTriangles } },
-                { binding: 5, resource: { buffer: config.blasMeta } },
-                { binding: 6, resource: { buffer: config.instanceInverses } },
-            ],
-        });
-
-        const colorTexture = ctx.getTexture("color");
-        if (!colorTexture) return;
-
-        const width = colorTexture.width;
-        const height = colorTexture.height;
-
-        const pass = encoder.beginComputePass();
-        pass.setPipeline(rtPipeline);
-        pass.setBindGroup(0, bindGroup0);
-        pass.setBindGroup(1, bindGroup1);
-        pass.dispatchWorkgroups(Math.ceil(width / 8), Math.ceil(height / 8));
-        pass.end();
-    }
-
-    function executeRaster(ctx: ExecutionContext): void {
-        const { device, encoder } = ctx;
-
-        const colorView = ctx.getTextureView("color");
-        const eidView = ctx.getTextureView("eid");
-        const depthView = ctx.getTextureView("depth");
-
-        if (!colorView || !eidView || !depthView || !rasterPipeline) {
-            return;
-        }
-
-        const batches = config.batches();
-        const colorTexture = ctx.getTexture("color");
-        if (!colorTexture) return;
-
-        const clearColor = config.getClearColor();
-        const hasSky = config.getSky() && skyPipeline;
-
-        if (hasSky) {
-            const skyPass = encoder.beginRenderPass({
-                colorAttachments: [
-                    {
-                        view: colorView as GPUTextureView,
-                        clearValue: { r: clearColor.r, g: clearColor.g, b: clearColor.b, a: 1 },
-                        loadOp: "clear" as const,
-                        storeOp: "store" as const,
-                    },
-                ],
-                depthStencilAttachment: {
-                    view: depthView as GPUTextureView,
-                    depthClearValue: 1.0,
-                    depthLoadOp: "clear" as const,
-                    depthStoreOp: "store" as const,
-                },
-            });
-
-            const skyBindGroup = device.createBindGroup({
-                layout: skyPipeline!.getBindGroupLayout(0),
-                entries: [{ binding: 0, resource: { buffer: config.scene } }],
-            });
-
-            skyPass.setPipeline(skyPipeline!);
-            skyPass.setBindGroup(0, skyBindGroup);
-            skyPass.draw(3);
-            skyPass.end();
-        }
-
-        const pass = encoder.beginRenderPass({
-            colorAttachments: [
-                {
-                    view: colorView as GPUTextureView,
-                    clearValue: { r: clearColor.r, g: clearColor.g, b: clearColor.b, a: 1 },
-                    loadOp: hasSky ? ("load" as const) : ("clear" as const),
-                    storeOp: "store" as const,
-                },
-                {
-                    view: eidView as GPUTextureView,
-                    clearValue: { r: 0, g: 0, b: 0, a: 0 },
-                    loadOp: "clear" as const,
-                    storeOp: "store" as const,
-                },
-            ],
-            depthStencilAttachment: {
-                view: depthView as GPUTextureView,
-                depthClearValue: 1.0,
-                depthLoadOp: hasSky ? ("load" as const) : ("clear" as const),
-                depthStoreOp: "store" as const,
-            },
-        });
-
-        pass.setPipeline(rasterPipeline);
-
-        for (const batch of batches) {
-            if (!batch || batch.count === 0) continue;
-
-            const batchBindGroup = device.createBindGroup({
-                layout: rasterPipeline.getBindGroupLayout(0),
-                entries: [
-                    { binding: 0, resource: { buffer: config.scene } },
-                    { binding: 1, resource: { buffer: batch.entityIds } },
-                    { binding: 2, resource: { buffer: config.matrices } },
-                    { binding: 3, resource: { buffer: config.colors } },
-                    { binding: 4, resource: { buffer: config.sizes } },
-                    { binding: 5, resource: { buffer: config.pbr } },
-                    { binding: 6, resource: { buffer: config.emission } },
-                    { binding: 7, resource: { buffer: config.shapes } },
-                    { binding: 8, resource: { buffer: config.surfaces } },
-                ],
-            });
-
-            pass.setBindGroup(0, batchBindGroup);
-            pass.setVertexBuffer(0, batch.buffers.vertex);
-            pass.setIndexBuffer(batch.buffers.index, "uint16");
-            pass.drawIndexed(batch.buffers.indexCount, batch.count);
-        }
-
-        pass.end();
-    }
-
-    return {
-        id: "forward",
-        inputs: [{ id: "tlas-bvh-nodes", access: "read" as const }],
-        outputs: [
-            { id: "color", access: "write" },
-            { id: "linear-depth", access: "write" },
-            { id: "eid", access: "write" },
-        ],
-
-        async prepare(device: GPUDevice) {
-            const surfaces = config.getSurfaces();
-            rasterPipeline = await createRasterPipeline(device, surfaces, COLOR_FORMAT);
-            skyPipeline = await createSkyPipeline(device, COLOR_FORMAT);
-
-            if (config.getRaytracing()) {
-                rtCompiling = true;
-                const release = config.acquire?.("compiling shaders");
-                createRTPipeline(device, surfaces)
-                    .then((p) => {
-                        rtPipeline = p;
-                    })
-                    .finally(() => {
-                        rtCompiling = false;
-                        release?.();
-                    });
-            }
-        },
-
-        execute(ctx: ExecutionContext) {
-            const wantRT = config.getRaytracing();
-
-            if (wantRT && !rtPipeline && !rtCompiling) {
-                rtCompiling = true;
-                const release = config.acquire?.("compiling shaders");
-                const surfaces = config.getSurfaces();
-                createRTPipeline(ctx.device, surfaces)
-                    .then((p) => {
-                        rtPipeline = p;
-                    })
-                    .finally(() => {
-                        rtCompiling = false;
-                        release?.();
-                    });
-            }
-
-            if (wantRT && rtPipeline) {
-                executeRT(ctx);
-            } else {
-                executeRaster(ctx);
-            }
-        },
-    };
-}
-
-export function compileRTShader(surfaces: SurfaceData[]): string {
-    return compileUberShader(surfaces);
-}
-
-export async function createRTPipeline(
-    device: GPUDevice,
-    surfaces: SurfaceData[]
-): Promise<GPUComputePipeline> {
-    const code = compileRTShader(surfaces);
-    const module = device.createShaderModule({ code });
-    return device.createComputePipelineAsync({
-        layout: "auto",
-        compute: { module, entryPoint: "main" },
-    });
-}
-
-export { createRasterPipeline, compileRasterShader } from "./raster";