@rings-webgpu/core 1.0.0 → 1.0.2

package/dist/src/gfx/graphics/webGpu/core/texture/TextureCube.js

@@ -0,0 +1,51 @@
+import { GPUAddressMode } from "../../WebGPUConst";
+import { Texture } from "./Texture";
+export class TextureCube extends Texture {
+    constructor() {
+        super(4, 4);
+        this.width = 4;
+        this.height = 4;
+        this.depthOrArrayLayers = 6;
+        this.visibility = GPUShaderStage.FRAGMENT;
+        this.textureBindingLayout = {
+            viewDimension: "cube",
+            multisampled: false,
+        };
+        this.samplerBindingLayout = {
+            type: "filtering",
+        };
+        this.addressModeU = GPUAddressMode.clamp_to_edge;
+        this.addressModeV = GPUAddressMode.clamp_to_edge;
+        this.addressModeW = GPUAddressMode.clamp_to_edge;
+        this.magFilter = this.minFilter = "linear";
+        this.mipmapFilter = "linear";
+        this.visibility = GPUShaderStage.FRAGMENT;
+    }
+    createTextureDescriptor(width, height, mipLevelCount, format, usage = GPUTextureUsage.TEXTURE_BINDING |
+        GPUTextureUsage.COPY_DST |
+        GPUTextureUsage.COPY_SRC |
+        GPUTextureUsage.STORAGE_BINDING |
+        GPUTextureUsage.RENDER_ATTACHMENT, sizeCount = 1) {
+        this.width = width;
+        this.height = height;
+        this.format = format;
+        this.usage = usage;
+        this.textureDescriptor = {
+            size: { width: width, height: height, depthOrArrayLayers: 6 },
+            mipLevelCount: mipLevelCount,
+            format: format,
+            usage: usage,
+            dimension: "2d",
+        };
+        if (sizeCount > 1) {
+            this.viewDescriptor = {
+                dimension: `cube-array`,
+            };
+        }
+        else {
+            this.viewDescriptor = {
+                dimension: this.textureBindingLayout.viewDimension,
+            };
+        }
+    }
+}

package/dist/src/gfx/graphics/webGpu/core/texture/TextureMipmapCompute.d.ts

@@ -0,0 +1,9 @@
+import { Texture } from "./Texture";
+export declare class TextureMipmapCompute {
+    private static codeMax;
+    private static codeMin;
+    private static _pipelineMax;
+    private static _pipelineMin;
+    static createMipmap(texture: Texture, mipmapCount: number): void;
+    private static mipmap;
+}

package/dist/src/gfx/graphics/webGpu/core/texture/TextureMipmapCompute.js

@@ -0,0 +1,134 @@
+import { GPUContext } from "../../../../renderJob/GPUContext";
+import { webGPUContext } from "../../Context3D";
+class MipMapData {
+}
+export class TextureMipmapCompute {
+    static { this.codeMax = `
+    @group(0) @binding(0) var inputTexture : texture_2d<f32>;
+    @group(0) @binding(1) var inputTextureSampler : sampler;
+    @group(0) @binding(2) var outputTexture : texture_storage_2d<rgba8unorm, write>;
+
+    @compute @workgroup_size(8, 8)
+    fn main(@builtin(global_invocaton_id) GlobalInvocationID : vec3<u32>) {
+        let dstSize = textureDimensions(outputTexture).xy;
+        let uv01 = vec2<f32>(f32(GlobalInvocationID.x) / f32(dstSize.x - 1), f32(GlobalInvocationID.y) / f32(dstSize.y - 1));
+        var fromColor = textureSampleLevel(inputTexture, inputTextureSampler, uv01, 0.0);
+        let dstCoord = vec2<i32>(i32(GlobalInvocationID.x), i32(GlobalInvocationID.y));
+        textureStore(outputTexture, dstCoord, fromColor);
+    }
+    `; }
+    static { this.codeMin = `
+      @group(0) @binding(0) var inputTexture: texture_2d<f32>;
+      @group(0) @binding(1) var inputTextureSampler: sampler;
+      @group(0) @binding(2) var outputTexture: texture_storage_2d<rgba8unorm, write>;
+
+      @compute @workgroup_size(1, 1)
+      fn main(@builtin(global_invocation_id) GlobalInvocationID: vec3<u32>) {
+        let dsSize = textureDimensions(outputTexture).xy;
+        let uv01 = vec2<f32>(f32(GlobalInvocationID.x) / f32(dstSize.x - 1), f32(GlobalInvocationID.y) / f32(dstSize.y - 1));
+        var fromColor = textureSampleLevel(inputTexture, inputTextureSampler, uv01, 0.0);
+        let dstCoord = vec2<i32>(i32(GlobalInvocationID.x), i32(GlobalInvocationID.y));
+        textureStore(outputTexture, dstCoord, fromColor);
+      }
+    `; }
+    static createMipmap(texture, mipmapCount) {
+        const device = webGPUContext.device;
+        this._pipelineMax ||= device.createComputePipeline({
+            layout: `auto`,
+            compute: {
+                module: device.createShaderModule({
+                    code: this.codeMax,
+                }),
+                entryPoint: "main",
+            },
+        });
+        this._pipelineMin ||= device.createComputePipeline({
+            layout: `auto`,
+            compute: {
+                module: device.createShaderModule({
+                    code: this.codeMin,
+                }),
+                entryPoint: "main",
+            },
+        });
+        let dstWidth = Math.ceil(texture.width * 0.5);
+        let dstHeight = Math.ceil(texture.height * 0.5);
+        let mipmapData = {
+            mipmapCount: mipmapCount,
+            texture: texture,
+            srcView: null,
+            mipLevel: 1,
+            dstHeight: dstHeight,
+            dstWidth: dstWidth,
+        };
+        mipmapData.srcView = texture.getGPUTexture().createView({
+            format: texture.format,
+            dimension: "2d",
+            baseMipLevel: 0, // Make sure we're getting the right mip level...
+            mipLevelCount: 1, // And only selecting one mip level
+        });
+        let isMax = texture.width > 1024 && texture.height > 1024;
+        if (isMax) {
+            this.mipmap(this._pipelineMax, mipmapData);
+        }
+        else {
+            this.mipmap(this._pipelineMin, mipmapData);
+        }
+    }
+    static mipmap(computePipeline, data) {
+        const device = webGPUContext.device;
+        const commandEncoder = GPUContext.beginCommandEncoder();
+        let isCurrentMax = computePipeline == this._pipelineMax;
+        let dstView;
+        let isBreakToMin;
+        for (let i = data.mipLevel; i < data.mipmapCount; i++) {
+            let entries = [];
+            let binding = 0;
+            entries.push({
+                binding: binding++,
+                resource: data.srcView,
+            });
+            entries.push({
+                binding: binding++,
+                resource: data.texture.gpuSampler,
+            });
+            dstView = data.texture.getGPUTexture().createView({
+                format: data.texture.format,
+                dimension: "2d",
+                baseMipLevel: i,
+                mipLevelCount: 1,
+            });
+            entries.push({
+                binding: binding++,
+                resource: dstView,
+            });
+            const computeBindGroup = device.createBindGroup({
+                layout: computePipeline.getBindGroupLayout(0),
+                entries: entries,
+            });
+            const computePass = commandEncoder.beginComputePass();
+            computePass.setPipeline(computePipeline);
+            computePass.setBindGroup(0, computeBindGroup);
+            let groupX = data.dstWidth;
+            let groupY = data.dstHeight;
+            if (isCurrentMax) {
+                groupX = Math.max(1, Math.floor(data.dstWidth / 8));
+                groupY = Math.max(1, Math.floor(data.dstHeight / 8));
+            }
+            computePass.dispatchWorkgroups(groupX, groupY);
+            data.dstHeight *= 0.5;
+            data.dstWidth *= 0.5;
+            data.srcView = dstView;
+            data.mipLevel = i + 1;
+            isBreakToMin = isCurrentMax && (data.dstWidth < 8 || data.dstHeight < 8);
+            computePass.end();
+            if (isBreakToMin) {
+                break;
+            }
+        }
+        GPUContext.endCommandEncoder(commandEncoder);
+        if (isBreakToMin) {
+            this.mipmap(this._pipelineMin, data);
+        }
+    }
+}

package/dist/src/gfx/graphics/webGpu/core/texture/TextureMipmapGenerator.d.ts

@@ -0,0 +1,9 @@
+import { Texture } from "./Texture";
+export declare class TextureMipmapGenerator {
+    private static mipmapShader;
+    private static pipelineCache;
+    private static pipeline;
+    static getMipmapPipeline(texture: Texture): GPURenderPipeline;
+    static webGPUGenerateMipmap(texture: Texture): void;
+    static getMipmapCount(width: number, height: number): number;
+}

package/dist/src/gfx/graphics/webGpu/core/texture/TextureMipmapGenerator.js

@@ -0,0 +1,163 @@
+import { GPUContext } from "../../../../renderJob/GPUContext";
+import { webGPUContext } from "../../Context3D";
+export class TextureMipmapGenerator {
+    static { this.mipmapShader = `
+    var<private> pos : array<vec2<f32>, 4> = array<vec2<f32>, 4>(
+    vec2<f32>(-1.0, 1.0), vec2<f32>(1.0, 1.0),
+    vec2<f32>(-1.0, -1.0), vec2<f32>(1.0, -1.0));
+
+    struct VertexOutput {
+    @builtin(position) position : vec4<f32>,
+    @location(0) texCoord : vec2<f32>
+    };
+
+    @vertex
+    fn vertexMain(@builtin(vertex_index) vertexIndex : u32) -> VertexOutput {
+    var output : VertexOutput;
+    output.texCoord = pos[vertexIndex] * vec2<f32>(0.5, -0.5) + vec2<f32>(0.5);
+    output.position = vec4<f32>(pos[vertexIndex], 0.0, 1.0);
+    return output;
+    }
+
+    @binding(0) @group(0) var imgSampler : sampler;
+    @binding(1) @group(0) var img : texture_2d<f32>;
+
+    @fragment
+    fn fragmentMain(@location(0) texCoord : vec2<f32>) -> @location(0) vec4<f32> {
+    var outColor: vec4<f32> = textureSampleLevel(img, imgSampler, texCoord, 0.0);
+    return outColor;
+    }
+    `; }
+    static { this.pipelineCache = {}; }
+    static getMipmapPipeline(texture) {
+        let gpuDevice = webGPUContext.device;
+        let pipeline = TextureMipmapGenerator.pipelineCache[texture.format];
+        if (!pipeline) {
+            // Create a simple shader that renders a fullscreen textured quad.
+            const mipmapShaderModule = gpuDevice.createShaderModule({
+                code: TextureMipmapGenerator.mipmapShader,
+            });
+            let textureLayout = gpuDevice.createBindGroupLayout({
+                entries: [
+                    {
+                        binding: 0,
+                        //TODO : After adding a shadow reflection, it is necessary to know that the vertex is used | the segment is used
+                        visibility: texture.visibility,
+                        // use GPUSamplerBindingLayout = { type:`filtering`} error
+                        sampler: texture.samplerBindingLayout,
+                    },
+                    {
+                        binding: 1,
+                        //TODO : After adding a shadow reflection, it is necessary to know that the vertex is used | the segment is used
+                        visibility: texture.visibility,
+                        // use GPUTextureBindingLayout = { sampleType:`float`} error
+                        texture: texture.textureBindingLayout,
+                    },
+                ],
+            });
+            // Need a separate bind group for each level to ensurev
+            // we're only sampling from the previous level.
+            let layouts = webGPUContext.device.createPipelineLayout({
+                bindGroupLayouts: [textureLayout],
+            });
+            pipeline = gpuDevice.createRenderPipeline({
+                layout: layouts,
+                vertex: {
+                    module: mipmapShaderModule,
+                    entryPoint: "vertexMain",
+                },
+                fragment: {
+                    module: mipmapShaderModule,
+                    entryPoint: "fragmentMain",
+                    targets: [
+                        {
+                            format: texture.format, // Make sure to use the same format as the texture
+                        },
+                    ],
+                },
+                primitive: {
+                    topology: "triangle-strip",
+                    stripIndexFormat: "uint32",
+                },
+            });
+            TextureMipmapGenerator.pipelineCache[texture.format] = pipeline;
+        }
+        return pipeline;
+    }
+    static webGPUGenerateMipmap(texture) {
+        let gpuDevice = webGPUContext.device;
+        let textureDescriptor = texture.textureDescriptor;
+        // let pipeline = TextureMipmapGenerator.pipeline;
+        let pipeline = TextureMipmapGenerator.getMipmapPipeline(texture);
+        let srcView = texture.getGPUTexture().createView({
+            baseMipLevel: 0,
+            mipLevelCount: 1,
+        });
+        // Loop through each mip level and renders the previous level's contents into it.
+        const commandEncoder = GPUContext.beginCommandEncoder();
+        for (let i = 1; i < textureDescriptor.mipLevelCount; ++i) {
+            const dstView = texture.getGPUTexture().createView({
+                baseMipLevel: i, // Make sure we're getting the right mip level...
+                mipLevelCount: 1, // And only selecting one mip level
+            });
+            const passEncoder = commandEncoder.beginRenderPass({
+                colorAttachments: [
+                    {
+                        view: dstView, // Render pass uses the next mip level as it's render attachment.
+                        clearValue: [0, 0, 0, 0],
+                        loadOp: `clear`,
+                        storeOp: "store",
+                    },
+                ],
+            });
+            let textureLayout = gpuDevice.createBindGroupLayout({
+                entries: [
+                    {
+                        binding: 0,
+                        //TODO : After adding a shadow reflection, it is necessary to know that the vertex is used | the segment is used
+                        visibility: texture.visibility,
+                        // use GPUSamplerBindingLayout = { type:`filtering`} error
+                        sampler: texture.samplerBindingLayout,
+                    },
+                    {
+                        binding: 1,
+                        //TODO : After adding a shadow reflection, it is necessary to know that the vertex is used | the segment is used
+                        visibility: texture.visibility,
+                        // use GPUTextureBindingLayout = { sampleType:`float`} error
+                        texture: texture.textureBindingLayout,
+                    },
+                ],
+            });
+            // Need a separate bind group for each level to ensurev
+            // we're only sampling from the previous level.
+            const bindGroup = gpuDevice.createBindGroup({
+                layout: textureLayout,
+                entries: [
+                    {
+                        binding: 0,
+                        resource: texture.gpuSampler,
+                    },
+                    {
+                        binding: 1,
+                        resource: srcView,
+                    },
+                ],
+            });
+            // Render
+            passEncoder.setPipeline(pipeline);
+            passEncoder.setBindGroup(0, bindGroup);
+            passEncoder.draw(4);
+            passEncoder.end();
+            // The source texture view for the next iteration of the loop is the
+            // destination view for this one.
+            srcView = dstView;
+        }
+        GPUContext.endCommandEncoder(commandEncoder);
+    }
+    static getMipmapCount(width, height) {
+        let w = width;
+        let h = height;
+        let maxSize = Math.max(w, h);
+        return (1 + Math.log2(maxSize)) | 0;
+    }
+}

package/dist/src/gfx/graphics/webGpu/core/uniforms/UniformNode.d.ts

@@ -0,0 +1,34 @@
+import { MemoryInfo } from "../../../../../core/pool/memory/MemoryInfo";
+import { Color } from "../../../../../math/Color";
+import { Vector2 } from "../../../../../math/Vector2";
+import { Vector3 } from "../../../../../math/Vector3";
+import { Vector4 } from "../../../../../math/Vector4";
+import { UniformValue } from "../../shader/value/UniformValue";
+export declare class UniformNode {
+    size: number;
+    memoryInfo: MemoryInfo;
+    bindOnChange: () => void;
+    private _data;
+    private _type;
+    private _x;
+    private _y;
+    private _z;
+    private _w;
+    constructor(value: UniformValue);
+    get data(): UniformValue;
+    set data(value: UniformValue);
+    getColor(ret: Color): Color;
+    get color(): Color;
+    set color(value: Color);
+    get value(): number;
+    set value(value: number);
+    get vector2(): Vector2;
+    set vector2(value: Vector2);
+    get vector3(): Vector3;
+    set vector3(value: Vector3);
+    get vector4(): Vector4;
+    set vector4(value: Vector4);
+    onChange(): void;
+    float32Array(value: Float32Array): void;
+    update(): void;
+}

package/dist/src/gfx/graphics/webGpu/core/uniforms/UniformNode.js

@@ -0,0 +1,176 @@
+import { Color } from "../../../../../math/Color";
+import { Vector2 } from "../../../../../math/Vector2";
+import { Vector3 } from "../../../../../math/Vector3";
+import { Vector4 } from "../../../../../math/Vector4";
+import { UniformType } from "../../shader/value/UniformValue";
+export class UniformNode {
+    constructor(value) {
+        this._type = UniformType.Number;
+        this._x = 0;
+        this._y = 0;
+        this._z = 0;
+        this._w = 0;
+        this.data = value;
+    }
+    get data() {
+        return this._data;
+    }
+    set data(value) {
+        this._data = value;
+        this._type = UniformType.Number;
+        if (value instanceof Vector2) {
+            this.size = 2;
+            this._x = value.x;
+            this._y = value.y;
+            this._type = UniformType.Vector2;
+        }
+        else if (value instanceof Vector3) {
+            this.size = 3;
+            this._x = value.x;
+            this._y = value.y;
+            this._z = value.z;
+            this._type = UniformType.Vector3;
+        }
+        else if (value instanceof Vector4) {
+            this.size = 4;
+            this._x = value.x;
+            this._y = value.y;
+            this._z = value.z;
+            this._w = value.w;
+            this._type = UniformType.Vector4;
+        }
+        else if (value instanceof Color) {
+            this.size = 4;
+            this._x = value.r;
+            this._y = value.g;
+            this._z = value.b;
+            this._w = value.a;
+            this._type = UniformType.Color;
+        }
+        else if (value instanceof Float32Array) {
+            this.size = value.length;
+            this._type = UniformType.Float32Array;
+        }
+        else {
+            this.size = 1;
+            this._x = value;
+            this._data = value;
+            this._type = UniformType.Number;
+        }
+    }
+    getColor(ret) {
+        if (ret) {
+            ret.copyFrom(this._data);
+        }
+        else {
+            ret = this._data;
+        }
+        return ret;
+    }
+    get color() {
+        let c = new Color(this._data.r, this._data.g, this._data.b, this._data.a);
+        return c;
+    }
+    set color(value) {
+        if (this._x != value.r ||
+            this._y != value.g ||
+            this._z != value.b ||
+            this._w != value.a) {
+            this._data.r = value.r;
+            this._data.g = value.g;
+            this._data.b = value.b;
+            this._data.a = value.a;
+            this._x = value.r;
+            this._y = value.g;
+            this._z = value.b;
+            this._w = value.a;
+            this.onChange();
+        }
+    }
+    get value() {
+        return this._x;
+    }
+    set value(value) {
+        if (this._x != value) {
+            this._data = value;
+            this._x = value;
+            this.onChange();
+        }
+    }
+    get vector2() {
+        return this._data; //new Vector2(this._data.x, this._data.y);
+    }
+    set vector2(value) {
+        if (this._x != value.x || this._y != value.y) {
+            this._data.x = value.x;
+            this._data.y = value.y;
+            this._x = value.x;
+            this._y = value.y;
+            this.onChange();
+        }
+    }
+    get vector3() {
+        return this._data; //new Vector3(this._data.x, this._data.y, this._data.z);
+    }
+    set vector3(value) {
+        if (this._x != value.x || this._y != value.y || this._z != value.z) {
+            this._data.x = value.x;
+            this._data.y = value.y;
+            this._data.z = value.z;
+            this._x = value.x;
+            this._y = value.y;
+            this._z = value.z;
+            this.onChange();
+        }
+    }
+    get vector4() {
+        return this._data; //new Vector4(this._data.x, this._data.y, this._data.z, this._data.w);
+    }
+    set vector4(value) {
+        if (this._x != value.x ||
+            this._y != value.y ||
+            this._z != value.z ||
+            this._w != value.w) {
+            this._data.x = value.x;
+            this._data.y = value.y;
+            this._data.z = value.z;
+            this._data.w = value.w;
+            this._x = value.x;
+            this._y = value.y;
+            this._z = value.z;
+            this._w = value.w;
+            this.onChange();
+        }
+    }
+    onChange() {
+        if (this.bindOnChange) {
+            this.bindOnChange();
+        }
+    }
+    float32Array(value) {
+        this._data.set(value);
+        this.onChange();
+    }
+    update() {
+        switch (this._type) {
+            case UniformType.Number:
+                this.memoryInfo.dataBytes.setFloat32(0 * Float32Array.BYTES_PER_ELEMENT, this._data, true);
+                break;
+            case UniformType.Vector2:
+                this.memoryInfo.setVector2(0, this._data);
+                break;
+            case UniformType.Vector3:
+                this.memoryInfo.setVector3(0, this._data);
+                break;
+            case UniformType.Vector4:
+                this.memoryInfo.setVector4(0, this._data);
+                break;
+            case UniformType.Color:
+                this.memoryInfo.setColor(0, this._data);
+                break;
+            case UniformType.Float32Array:
+                this.memoryInfo.setFloat32Array(0, this._data);
+                break;
+        }
+    }
+}

package/dist/src/gfx/graphics/webGpu/descriptor/RTDescriptor.d.ts

@@ -0,0 +1,5 @@
+export declare class RTDescriptor {
+    storeOp: string;
+    loadOp: GPULoadOp;
+    clearValue: GPUColor;
+}

package/dist/src/gfx/graphics/webGpu/descriptor/RTDescriptor.js

@@ -0,0 +1,7 @@
+export class RTDescriptor {
+    constructor() {
+        this.storeOp = "store";
+        this.loadOp = `clear`;
+        this.clearValue = [0, 0, 0, 0];
+    }
+}

package/dist/src/gfx/graphics/webGpu/descriptor/WebGPUDescriptorCreator.d.ts

@@ -0,0 +1,8 @@
+import { RTFrame } from "../../../renderJob/frame/RTFrame";
+import { RendererPassState } from "../../../renderJob/passRenderer/state/RendererPassState";
+export declare class WebGPUDescriptorCreator {
+    private static rendererPassState;
+    static createRendererPassState(rtFrame: RTFrame, loadOp?: GPULoadOp): RendererPassState;
+    static getRenderPassDescriptor(renderPassState: RendererPassState, loadOp?: GPULoadOp): any;
+    static getRenderBundleDescriptor(renderPassState: RendererPassState): GPURenderBundleEncoderDescriptor;
+}