From b4537a137dd2d4cf0529643fd6198c6f390baefa Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 19 Feb 2025 21:58:42 +0800 Subject: [PATCH 01/57] =?UTF-8?q?=E6=B5=8B=E8=AF=95=E7=9D=80=E8=89=B2?= =?UTF-8?q?=E5=99=A8=E5=8F=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- examples/index.ts | 3 +- examples/src/test/RenderObjectChanges.html | 17 ++++ examples/src/test/RenderObjectChanges.ts | 103 +++++++++++++++++++++ 3 files changed, 122 insertions(+), 1 deletion(-) create mode 100644 examples/src/test/RenderObjectChanges.html create mode 100644 examples/src/test/RenderObjectChanges.ts diff --git a/examples/index.ts b/examples/index.ts index 1a4d9d4..2887de2 100644 --- a/examples/index.ts +++ b/examples/index.ts @@ -10,7 +10,8 @@ const files = { "sample8", ], "test":[ - "fractalCube" + "fractalCube", + "RenderObjectChanges", ], "regl-examples": [ "basic", diff --git a/examples/src/test/RenderObjectChanges.html b/examples/src/test/RenderObjectChanges.html new file mode 100644 index 0000000..a9750b6 --- /dev/null +++ b/examples/src/test/RenderObjectChanges.html @@ -0,0 +1,17 @@ + + + + + + 测试渲染对象数据变化。 + + + + +

+ 测试渲染对象数据变化。 +

+ + + + \ No newline at end of file diff --git a/examples/src/test/RenderObjectChanges.ts b/examples/src/test/RenderObjectChanges.ts new file mode 100644 index 0000000..f0c4e10 --- /dev/null +++ b/examples/src/test/RenderObjectChanges.ts @@ -0,0 +1,103 @@ +import { IRenderObject, ISubmit } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; + +const init = async (canvas: HTMLCanvasElement) => +{ + const devicePixelRatio = window.devicePixelRatio || 1; + canvas.width = canvas.clientWidth * devicePixelRatio; + canvas.height = canvas.clientHeight * devicePixelRatio; + + const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); // 初始化WebGL + + const renderObject: IRenderObject = { // 渲染对象 + pipeline: { // 渲染管线 + vertex: { // 顶点着色器 + code: ` + attribute vec4 position; + + void main() { + gl_Position = position; + } + ` }, + fragment: { // 片段着色器 + code: ` + precision highp float; + uniform vec4 color; + void main() { + gl_FragColor = color; + } + ` }, + }, + vertices: { + position: { data: new Float32Array([0.0, 0.5, -0.5, -0.5, 0.5, -0.5]), format: "float32x2" }, // 顶点坐标数据 + }, + indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 + uniforms: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 + drawIndexed: { indexCount: 3 }, // 绘制命令 + }; + + const submit: ISubmit = { // 一次GPU提交 + commandEncoders: [ // 命令编码列表 + { + passEncoders: [ // 通道编码列表 + { // 渲染通道 + descriptor: { // 渲染通道描述 + colorAttachments: [{ // 颜色附件 + clearValue: [0.0, 0.0, 0.0, 1.0], // 渲染前填充颜色 + }], + }, + renderObjects: [renderObject] + }, + ] + } + ], + }; + + function render() + { + webgl.submit(submit); // 提交GPU执行 + requestAnimationFrame(render); + } + + render(); + + window.onclick = () => + { + // 修改顶点着色器代码 + renderObject.pipeline.vertex.code = ` + attribute vec4 position; + + void main() { + vec4 pos = position; + pos.x = pos.x + 0.5; + gl_Position = pos; + } + `; + + // 修改片段着色器代码 + renderObject.pipeline.fragment.code = ` + precision highp float; + uniform vec4 color; + void main() { + vec4 col = color; + col.x = 0.5; + col.y = 0.6; + col.z = 0.7; + gl_FragColor = col; + } + `; + // + // renderObject.uniforms.color = [0, 1, 0, 1]; + }; +}; + +let webglCanvas = document.querySelector("#glcanvas") as HTMLCanvasElement; +if (!webglCanvas) +{ + webglCanvas = document.createElement("canvas"); + webglCanvas.id = "webgpu"; + webglCanvas.style.width = "400px"; + webglCanvas.style.height = "300px"; + document.body.appendChild(webglCanvas); +} +init(webglCanvas); \ No newline at end of file -- Gitee From b00e263f6fe09362b9afd921b8f1748771c5a0f3 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Feb 2025 00:15:23 +0800 Subject: [PATCH 02/57] =?UTF-8?q?=E5=8D=87=E7=BA=A7=20"@feng3d/watcher":?= =?UTF-8?q?=20"^0.8.9",?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 08ce72f..d0b62d3 100644 --- a/package.json +++ b/package.json @@ -64,6 +64,6 @@ }, "dependencies": { "@feng3d/render-api": "0.0.2", - "@feng3d/watcher": "^0.8.8" + "@feng3d/watcher": "^0.8.9" } } \ No newline at end of file -- Gitee From b3e33fc4f1c4578d7763179c5ebec2f62596af5a Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Feb 2025 22:07:16 +0800 Subject: [PATCH 03/57] vertexFormatMap --- src/data/IGLAttributeInfo.ts | 2 +- src/data/IGLPrimitiveState.ts | 9 ---- src/utils/getIVertexFormat.ts | 91 +++-------------------------------- 3 files changed, 7 insertions(+), 95 deletions(-) diff --git a/src/data/IGLAttributeInfo.ts b/src/data/IGLAttributeInfo.ts index 38fc6c3..7fe1029 100644 --- a/src/data/IGLAttributeInfo.ts +++ b/src/data/IGLAttributeInfo.ts @@ -1,4 +1,4 @@ -import { IGLVertexAttributeTypes } from "../utils/getIVertexFormat"; +import { IGLVertexAttributeTypes } from "@feng3d/render-api"; export interface IGLAttributeInfo { diff --git a/src/data/IGLPrimitiveState.ts b/src/data/IGLPrimitiveState.ts index 2b40897..6cac5c1 100644 --- a/src/data/IGLPrimitiveState.ts +++ b/src/data/IGLPrimitiveState.ts @@ -22,15 +22,6 @@ declare module "@feng3d/render-api" export interface IPrimitiveState { - /** - * 图形拓扑结构。 - * - * 以下仅在WebGL生效 - * * LINE_LOOP 绘制循环连线。 - * * TRIANGLE_FAN 绘制三角扇形。 - */ - readonly topology?: IPrimitiveTopology; - /** * * `FRONT_AND_BACK` 剔除正面与背面，仅在WebGL中生效！ * diff --git a/src/utils/getIVertexFormat.ts b/src/utils/getIVertexFormat.ts index b0161e7..0f0a488 100644 --- a/src/utils/getIVertexFormat.ts +++ b/src/utils/getIVertexFormat.ts @@ -1,10 +1,10 @@ -import { IVertexFormat } from "@feng3d/render-api"; +import { IGLVertexAttributeTypes, IVertexFormat, IVertexFormatInfo, vertexFormatMap } from "@feng3d/render-api"; export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: IGLVertexAttributeTypes = "FLOAT", normalized = false): IVertexFormat { - for (const key in formatMap) + for (const key in vertexFormatMap) { - const element = formatMap[key]; + const element = vertexFormatMap[key]; if ( element.numComponents === numComponents && element.type === type @@ -20,94 +20,15 @@ export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: IGLVertexAt return undefined; } -export function getIGLVertexFormat(format: IVertexFormat): IGLVertexFormat +export function getIGLVertexFormat(format: IVertexFormat): IVertexFormatInfo { - const glVertexFormat = formatMap[format]; + const glVertexFormat = vertexFormatMap[format]; - console.assert(!!glVertexFormat, `接收到错误值，请从 ${Object.keys(formatMap).toString()} 中取值！`); + console.assert(!!glVertexFormat, `接收到错误值，请从 ${Object.keys(vertexFormatMap).toString()} 中取值！`); return glVertexFormat; } -export const formatMap: { [key: string]: IGLVertexFormat } = { - - uint8x2: { numComponents: 2, type: "UNSIGNED_BYTE", normalized: false }, - uint8x4: { numComponents: 4, type: "UNSIGNED_BYTE", normalized: false }, - sint8x2: { numComponents: 2, type: "BYTE", normalized: false }, - sint8x4: { numComponents: 4, type: "BYTE", normalized: false }, - unorm8x2: { numComponents: 2, type: "UNSIGNED_BYTE", normalized: true }, - unorm8x4: { numComponents: 4, type: "UNSIGNED_BYTE", normalized: true }, - snorm8x2: { numComponents: 2, type: "BYTE", normalized: true }, - snorm8x4: { numComponents: 4, type: "BYTE", normalized: true }, - uint16x2: { numComponents: 2, type: "UNSIGNED_SHORT", normalized: false }, - uint16x4: { numComponents: 4, type: "UNSIGNED_SHORT", normalized: false }, - sint16x2: { numComponents: 2, type: "SHORT", normalized: false }, - sint16x4: { numComponents: 4, type: "SHORT", normalized: false }, - unorm16x2: { numComponents: 2, type: "UNSIGNED_SHORT", normalized: true }, - unorm16x4: { numComponents: 4, type: "UNSIGNED_SHORT", normalized: true }, - snorm16x2: { numComponents: 2, type: "SHORT", normalized: true }, - snorm16x4: { numComponents: 4, type: "SHORT", normalized: true }, - float16x2: { numComponents: 2, type: "HALF_FLOAT", normalized: false }, - float16x4: { numComponents: 4, type: "HALF_FLOAT", normalized: false }, - float32: { numComponents: 1, type: "FLOAT", normalized: false }, - float32x2: { numComponents: 2, type: "FLOAT", normalized: false }, - float32x3: { numComponents: 3, type: "FLOAT", normalized: false }, - float32x4: { numComponents: 4, type: "FLOAT", normalized: false }, - uint32: { numComponents: 1, type: "UNSIGNED_INT", normalized: false }, - uint32x2: { numComponents: 2, type: "UNSIGNED_INT", normalized: false }, - uint32x3: { numComponents: 3, type: "UNSIGNED_INT", normalized: false }, - uint32x4: { numComponents: 4, type: "UNSIGNED_INT", normalized: false }, - sint32: { numComponents: 1, type: "INT", normalized: false }, - sint32x2: { numComponents: 2, type: "INT", normalized: false }, - sint32x3: { numComponents: 3, type: "INT", normalized: false }, - sint32x4: { numComponents: 4, type: "INT", normalized: false }, - "unorm10-10-10-2": { numComponents: 4, type: "UNSIGNED_INT_2_10_10_10_REV", normalized: true }, -}; - -interface IGLVertexFormat -{ - /** - * 顶点数据元素数量。 - */ - numComponents: 1 | 2 | 3 | 4; - - /** - * 属性缓冲数据类型 - * - * 默认从Buffer数据中获取，如果未取到则默认为 "FLOAT" 。 - */ - type: IGLVertexAttributeTypes; - - /** - * 是否标准化。 - */ - normalized: boolean; -} - -/** - * 属性缓冲数据类型 - * - * A GLenum specifying the data type of each component in the array. Possible values: - * - * * gl.BYTE: signed 8-bit integer, with values in [-128, 127] - * * gl.SHORT: signed 16-bit integer, with values in [-32768, 32767] - * * gl.UNSIGNED_BYTE: unsigned 8-bit integer, with values in [0, 255] - * * gl.UNSIGNED_SHORT: unsigned 16-bit integer, with values in [0,65535] - * * gl.FLOAT: 32-bit IEEE floating point number - * - * When using a WebGL 2 context, the following values are available additionally: - * - * * gl.HALF_FLOAT: 16-bit IEEE floating point number - * * gl.INT: 32-bit signed binary integer - * * gl.UNSIGNED_INT: 32-bit unsigned binary integer - * * gl.INT_2_10_10_10_REV: 32-bit signed integer with values in [-512, 511] - * * gl.UNSIGNED_INT_2_10_10_10_REV: 32-bit unsigned integer with values in [0, 1023] - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/vertexAttribPointer - */ -export type IGLVertexAttributeTypes = "FLOAT" | "BYTE" | "SHORT" | "UNSIGNED_BYTE" | "UNSIGNED_SHORT" // WebGL1 - | "HALF_FLOAT" | "INT" | "UNSIGNED_INT" | "INT_2_10_10_10_REV" | "UNSIGNED_INT_2_10_10_10_REV"; // WebGL2 - /** * A GLenum specifying the data type of each component in the array. Must be one of: * * gl.BYTE -- Gitee From 3190a0abd39c06a12924ad924685713e36592cfc Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 20 Feb 2025 22:57:12 +0800 Subject: [PATCH 04/57] IVertexAttributeFormatInfo --- src/utils/getIVertexFormat.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/utils/getIVertexFormat.ts b/src/utils/getIVertexFormat.ts index 0f0a488..c835812 100644 --- a/src/utils/getIVertexFormat.ts +++ b/src/utils/getIVertexFormat.ts @@ -1,4 +1,4 @@ -import { IGLVertexAttributeTypes, IVertexFormat, IVertexFormatInfo, vertexFormatMap } from "@feng3d/render-api"; +import { IGLVertexAttributeTypes, IVertexFormat, IVertexAttributeFormatInfo, vertexFormatMap } from "@feng3d/render-api"; export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: IGLVertexAttributeTypes = "FLOAT", normalized = false): IVertexFormat { @@ -20,7 +20,7 @@ export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: IGLVertexAt return undefined; } -export function getIGLVertexFormat(format: IVertexFormat): IVertexFormatInfo +export function getIGLVertexFormat(format: IVertexFormat): IVertexAttributeFormatInfo { const glVertexFormat = vertexFormatMap[format]; -- Gitee From 0425d3760c4de23e8dc3bf4d453440c442183684 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 21 Feb 2025 22:50:16 +0800 Subject: [PATCH 05/57] IRenderObject.draw: IDrawVertex | IDrawIndexed --- examples/src/WebGL2Samples/buffer_copy.ts | 2 +- examples/src/WebGL2Samples/buffer_uniform.ts | 2 +- examples/src/WebGL2Samples/draw_image_space.ts | 2 +- examples/src/WebGL2Samples/draw_instanced.ts | 2 +- examples/src/WebGL2Samples/draw_instanced_ubo.ts | 2 +- .../src/WebGL2Samples/draw_primitive_restart.ts | 2 +- examples/src/WebGL2Samples/draw_range_arrays.ts | 5 +++-- examples/src/WebGL2Samples/fbo_blit.ts | 4 ++-- examples/src/WebGL2Samples/fbo_multisample.ts | 4 ++-- .../src/WebGL2Samples/fbo_new_blend_equation.ts | 2 +- examples/src/WebGL2Samples/fbo_read_pixels.ts | 4 ++-- .../src/WebGL2Samples/fbo_rtt_depth_texture.ts | 4 ++-- examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 4 ++-- .../src/WebGL2Samples/fbo_rtt_texture_array.ts | 6 +++--- examples/src/WebGL2Samples/geo_vertex_format.ts | 2 +- examples/src/WebGL2Samples/glsl_centroid.ts | 5 +++-- .../glsl_flat_smooth_interpolators.ts | 2 +- .../src/WebGL2Samples/glsl_non_square_matrix.ts | 2 +- examples/src/WebGL2Samples/query_occlusion.ts | 4 ++-- examples/src/WebGL2Samples/sampler_filter.ts | 2 +- examples/src/WebGL2Samples/sampler_object.ts | 2 +- examples/src/WebGL2Samples/sampler_wrap.ts | 3 ++- examples/src/WebGL2Samples/texture_2d_array.ts | 2 +- examples/src/WebGL2Samples/texture_3d.ts | 2 +- examples/src/WebGL2Samples/texture_derivative.ts | 2 +- examples/src/WebGL2Samples/texture_fetch.ts | 2 +- examples/src/WebGL2Samples/texture_format.ts | 4 ++-- examples/src/WebGL2Samples/texture_grad.ts | 2 +- examples/src/WebGL2Samples/texture_immutable.ts | 2 +- examples/src/WebGL2Samples/texture_integer.ts | 2 +- examples/src/WebGL2Samples/texture_lod.ts | 2 +- examples/src/WebGL2Samples/texture_offset.ts | 4 ++-- examples/src/WebGL2Samples/texture_pixel_store.ts | 2 +- examples/src/WebGL2Samples/texture_srgb.ts | 2 +- examples/src/WebGL2Samples/texture_vertex.ts | 6 +----- .../WebGL2Samples/transform_feedback_instanced.ts | 4 ++-- .../transform_feedback_interleaved.ts | 4 ++-- .../WebGL2Samples/transform_feedback_separated.ts | 4 ++-- .../transform_feedback_separated_2.ts | 4 ++-- examples/src/regl-examples/basic.ts | 2 +- examples/src/regl-examples/batch.ts | 2 +- examples/src/regl-examples/bunny.ts | 2 +- examples/src/regl-examples/camera.ts | 2 +- examples/src/regl-examples/cloth.ts | 2 +- examples/src/regl-examples/cube.ts | 2 +- examples/src/test/RenderObjectChanges.ts | 2 +- examples/src/test/fractalCube.ts | 2 +- examples/src/webgl-examples/sample1.ts | 2 +- examples/src/webgl-examples/sample2.ts | 2 +- examples/src/webgl-examples/sample3.ts | 2 +- examples/src/webgl-examples/sample4.ts | 2 +- examples/src/webgl-examples/sample5.ts | 2 +- examples/src/webgl-examples/sample6.ts | 2 +- examples/src/webgl-examples/sample7.ts | 2 +- examples/src/webgl-examples/sample8.ts | 2 +- src/RunWebGL.ts | 14 +++++++------- src/data/IGLTransformFeedbackPass.ts | 2 +- 57 files changed, 82 insertions(+), 83 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index 541e386..af8331e 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -54,7 +54,7 @@ import { getShaderSource } from "./utility"; renderObjects: [{ pipeline: program, vertices: vertexArray.vertices, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }] }; diff --git a/examples/src/WebGL2Samples/buffer_uniform.ts b/examples/src/WebGL2Samples/buffer_uniform.ts index 4928f9c..8c710fc 100644 --- a/examples/src/WebGL2Samples/buffer_uniform.ts +++ b/examples/src/WebGL2Samples/buffer_uniform.ts @@ -90,7 +90,7 @@ import { getShaderSource } from "./utility"; PerPass: lightPos, PerScene: material, }, - drawIndexed: { indexCount: 6, firstIndex: 0 } + draw: { __type: "DrawIndexed", indexCount: 6, firstIndex: 0 } }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/draw_image_space.ts b/examples/src/WebGL2Samples/draw_image_space.ts index 9751293..cb4a83e 100644 --- a/examples/src/WebGL2Samples/draw_image_space.ts +++ b/examples/src/WebGL2Samples/draw_image_space.ts @@ -39,7 +39,7 @@ loadImage("../../assets/img/Di-3d.png", (img) => diffuse: { texture, sampler }, u_imageSize: [canvas.width / 2, canvas.height / 2], }, - drawVertex: { firstVertex: 0, vertexCount: 3 }, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 3 }, pipeline: program }; diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index b6f822e..4b4c558 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -34,7 +34,7 @@ const vertexArray: { vertices?: IVertexAttributes } = { const renderObject: IRenderObject = { vertices: vertexArray.vertices, uniforms: {}, - drawVertex: { vertexCount: 3, instanceCount: 2 }, + draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: 2 }, pipeline: program }; diff --git a/examples/src/WebGL2Samples/draw_instanced_ubo.ts b/examples/src/WebGL2Samples/draw_instanced_ubo.ts index 0f730ef..b72f9ce 100644 --- a/examples/src/WebGL2Samples/draw_instanced_ubo.ts +++ b/examples/src/WebGL2Samples/draw_instanced_ubo.ts @@ -57,7 +57,7 @@ const rp: IRenderPass = { Transform: transforms, Material: materials, }, - drawVertex: { vertexCount: 3, instanceCount: 2 }, + draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: 2 }, }] }; diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index 7a2e4e5..73da09f 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -47,7 +47,7 @@ const renderObject: IRenderObject = { vertices: vertexArray.vertices, indices, uniforms: {}, - drawIndexed: { indexCount: 7, instanceCount: 2 }, + draw: { __type: "DrawIndexed", indexCount: 7, instanceCount: 2 }, pipeline: program, }; diff --git a/examples/src/WebGL2Samples/draw_range_arrays.ts b/examples/src/WebGL2Samples/draw_range_arrays.ts index 5cf681b..2a10c22 100644 --- a/examples/src/WebGL2Samples/draw_range_arrays.ts +++ b/examples/src/WebGL2Samples/draw_range_arrays.ts @@ -47,6 +47,7 @@ const vertexCount = 12; const renderObject: IRenderObject = { vertices: vertexArray.vertices, pipeline, + draw: undefined, }; const rp: IRenderPass = { @@ -60,12 +61,12 @@ const rp: IRenderPass = { { ...renderObject, viewport: { x: 0, y: 0, width: canvas.width / 2, height: canvas.height }, - drawVertex: { firstVertex: 0, vertexCount: vertexCount / 2 }, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: vertexCount / 2 }, }, { ...renderObject, viewport: { x: canvas.width / 2, y: 0, width: canvas.width / 2, height: canvas.height }, - drawVertex: { firstVertex: 6, vertexCount: vertexCount / 2 }, + draw: { __type: "DrawVertex", firstVertex: 6, vertexCount: vertexCount / 2 }, }, ], }; diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 394d776..2c9c1f8 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -92,7 +92,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => ]), diffuse: { texture: textureDiffuse, sampler: samplerDiffuse }, }, - drawVertex: { firstVertex: 0, vertexCount: 6 } + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 6 } }; // Render FBO @@ -160,7 +160,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => ]), diffuse: { texture: textureColorBuffer, sampler: samplerColorBuffer }, }, - drawVertex: { firstVertex: 0, vertexCount: 6 }, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 6 }, pipeline: program, }; diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index 00a8f2f..82e86df 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -106,7 +106,7 @@ const renderPass1: IRenderPass = { pipeline: programs[PROGRAM.TEXTURE], vertices: vertexArrays[PROGRAM.TEXTURE].vertices, uniforms: { MVP: IDENTITY }, - drawVertex: { vertexCount }, + draw: { __type: "DrawVertex", vertexCount }, }] }; @@ -124,7 +124,7 @@ const renderPass2: IRenderPass = { pipeline: programs[PROGRAM.SPLASH], vertices: vertexArrays[PROGRAM.SPLASH].vertices, uniforms: { diffuse: { texture, sampler }, MVP: mvp }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, } ], }; diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index 1180ada..79d5033 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -123,7 +123,7 @@ function render() pipeline: program, vertices: vertexArray.vertices, uniforms: { mvp: matrix, diffuse: { texture, sampler } }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }; const renderObjects: IRenderPassObject[] = []; diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index 21e86a5..e81d51a 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -136,7 +136,7 @@ const rp1: IRenderPass = { pipeline: multipleOutputProgram, uniforms: { mvp: matrix }, vertices: multipleOutputVertexArray.vertices, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }], }; @@ -155,7 +155,7 @@ const ro: IRenderObject = { layer: 0, }, vertices: layerVertexArray.vertices, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }; for (let i = 0; i < Textures.MAX; ++i) diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index 75f628d..c025289 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -97,7 +97,7 @@ const renderPass: IRenderPass = { renderObjects: [{ pipeline: depthProgram, vertices: triVertexArray.vertices, - drawVertex: { vertexCount: 3 }, + draw: { __type: "DrawVertex", vertexCount: 3 }, }], }; @@ -111,7 +111,7 @@ const rp2: IRenderPass = { pipeline: drawProgram, uniforms: { depthMap: { texture: depthTexture, sampler: depthSampler } }, vertices: quadVertexArray.vertices, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }], }; diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index 70b60f8..25b8f03 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -103,7 +103,7 @@ const renderPass: IRenderPass = { renderObjects: [{ pipeline: drawBufferProgram, vertices: triVertexArray.vertices, - drawVertex: { vertexCount: 3 }, + draw: { __type: "DrawVertex", vertexCount: 3 }, }], }; @@ -117,7 +117,7 @@ const renderPass2: IRenderPass = { color2Map: { texture: color2Texture, sampler: color2Sampler }, }, vertices: quadVertexArray.vertices, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }], }; diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index d18b080..bca8b6d 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -138,7 +138,7 @@ const renderPass1: IRenderPass = { pipeline: multipleOutputProgram, uniforms: { mvp: matrix }, vertices: multipleOutputVertexArray.vertices, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }] }; @@ -155,7 +155,7 @@ const renderObject: IRenderObject = { pipeline: layerProgram, uniforms: { mvp: matrix, diffuse: { texture, sampler } }, vertices: layerVertexArray.vertices, - + draw: { __type: "DrawVertex", vertexCount: 6 }, }; // @@ -166,7 +166,7 @@ for (let i = 0; i < Textures.MAX; ++i) viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, ...renderObject, uniforms: { ...renderObject.uniforms, layer: i }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, } ); } diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index 8b590d7..551cbf4 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -211,7 +211,7 @@ import { getShaderSource, loadImage } from "./utility"; u_lightPosition: lightPosition, u_ambient: 0.1, }, - drawIndexed: { indexCount: 36 }, + draw: { __type: "DrawIndexed", indexCount: 36 }, }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index de92550..b8fd04f 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -166,7 +166,7 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) pipeline: programs[i], vertices: vertexArrays[i].vertices, uniforms: { MVP: IDENTITY }, - drawVertex: { vertexCount }, + draw: { __type: "DrawVertex", vertexCount }, }] }; passEncoders.push(rp); @@ -180,6 +180,7 @@ const rp2: IRenderPass = { const ro: IRenderObject = { pipeline: programs[PROGRAM.SPLASH], vertices: vertexArrays[PROGRAM.SPLASH].vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, }; const scaleVector3 = vec3.create(); @@ -198,7 +199,7 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) MVP: mvp, diffuse: { texture: textures[i], sampler: samplers[i] }, }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, } ); } diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index 769e135..c98e603 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -177,7 +177,7 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) mvp: localMVP, mvNormal: localMVNormal, }, - drawIndexed: { indexCount: primitive.indices.length, firstIndex: 0 }, + draw: { __type: "DrawIndexed", indexCount: primitive.indices.length, firstIndex: 0 }, }); } } diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index 87f68bd..5bf280a 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -70,7 +70,7 @@ loadImage("../../assets/img/Di-3d.png", function (image) pipeline: program, uniforms: { MVP: matrix, diffuse: { texture, sampler } }, vertices: vertexArray.vertices, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }] }; diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index d15d444..8a261a5 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -54,7 +54,7 @@ const rp: IRenderPass = { const ro: IRenderObject = { vertices: vertexArray.vertices, pipeline: program, - drawVertex: { firstVertex: 0, vertexCount: 3 }, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 3 }, }; renderObjects.push(ro); @@ -62,7 +62,7 @@ const occlusionQuery: IGLOcclusionQuery = { __type: "OcclusionQuery", renderObjects: [{ ...ro, - drawVertex: { firstVertex: 3, vertexCount: 3 }, + draw: { __type: "DrawVertex", firstVertex: 3, vertexCount: 3 }, }] }; diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index 482de0f..8ee584b 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -152,7 +152,7 @@ function render() pipeline: program, uniforms: { mvp: matrix }, vertices: vertexArray.vertices, - drawVertex: { vertexCount: 6, instanceCount: 1 }, + draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, }; // Bind samplers diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index 79f995f..fa90797 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -96,7 +96,7 @@ function render() materialDiffuse0: { texture, sampler: samplerA }, materialDiffuse1: { texture, sampler: samplerB }, }, - drawVertex: { vertexCount: 6, instanceCount: 1 }, + draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, }], }; diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index 91fbd8f..8fa4de5 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -150,6 +150,7 @@ function render() pipeline: program, uniforms: { mvp: matrix }, vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, }; for (let i = 0; i < Corners.MAX; ++i) @@ -162,7 +163,7 @@ function render() ...ro.uniforms, diffuse: { texture, sampler: samplers[i] }, }, - drawVertex: { vertexCount: 6, instanceCount: 1 }, + draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, }); } diff --git a/examples/src/WebGL2Samples/texture_2d_array.ts b/examples/src/WebGL2Samples/texture_2d_array.ts index c69e0cb..324bdd6 100644 --- a/examples/src/WebGL2Samples/texture_2d_array.ts +++ b/examples/src/WebGL2Samples/texture_2d_array.ts @@ -89,7 +89,7 @@ import { getShaderSource, loadImage } from "./utility"; MVP: matrix, diffuse: { texture, sampler }, }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/texture_3d.ts b/examples/src/WebGL2Samples/texture_3d.ts index 48b1e93..a7bc9ae 100644 --- a/examples/src/WebGL2Samples/texture_3d.ts +++ b/examples/src/WebGL2Samples/texture_3d.ts @@ -163,7 +163,7 @@ import { getShaderSource } from "./utility"; diffuse: { texture, sampler }, }, vertices: vertexArray.vertices, - drawVertex: { vertexCount: 6 } + draw: { __type: "DrawVertex", vertexCount: 6 } }; const renderPassObjects: IRenderObject[] = []; diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index 5e5762d..8d66669 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -211,7 +211,7 @@ import { getShaderSource, loadImage } from "./utility"; vertices: vertexArray.vertices, indices: new Uint16Array(cubeVertexIndices), uniforms: {}, - drawIndexed: { indexCount: 36 }, + draw: { __type: "DrawIndexed", indexCount: 36 }, }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/texture_fetch.ts b/examples/src/WebGL2Samples/texture_fetch.ts index 4283d04..209a0e4 100644 --- a/examples/src/WebGL2Samples/texture_fetch.ts +++ b/examples/src/WebGL2Samples/texture_fetch.ts @@ -78,7 +78,7 @@ import { getShaderSource, loadImage } from "./utility"; MVP: matrix, diffuse: { texture, sampler }, }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, } ], }; diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index 30b0bad..5fa33e8 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -180,7 +180,7 @@ import { getShaderSource, loadImage } from "./utility"; MVP: matrix, diffuse: { texture: textures[i], sampler: samplers[i] }, }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }); } @@ -196,7 +196,7 @@ import { getShaderSource, loadImage } from "./utility"; MVP: matrix, diffuse: { texture: textures[i], sampler: samplers[i] }, }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }); } diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index 7f38b7d..de48c60 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -202,7 +202,7 @@ import { getShaderSource, loadImage } from "./utility"; vertices: vertexArray.vertices, indices: new Uint16Array(cubeVertexIndices), uniforms: {}, - drawIndexed: { indexCount: 36 }, + draw: { __type: "DrawIndexed", indexCount: 36 }, }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index 9ad3d4d..931137d 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -105,7 +105,7 @@ import { getShaderSource, loadImage } from "./utility"; uniforms: { MVP: matrix, }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }; const renderObjects: IRenderPassObject[] = []; diff --git a/examples/src/WebGL2Samples/texture_integer.ts b/examples/src/WebGL2Samples/texture_integer.ts index 5fe9048..a98c456 100644 --- a/examples/src/WebGL2Samples/texture_integer.ts +++ b/examples/src/WebGL2Samples/texture_integer.ts @@ -76,7 +76,7 @@ import { getShaderSource, loadImage } from "./utility"; diffuse: { texture, sampler }, }, vertices: vertexArray.vertices, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index a2c740a..0b933de 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -203,7 +203,7 @@ import { getShaderSource, loadImage } from "./utility"; mvp: matrix, }, vertices: vertexArray.vertices, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }; const lodBiasArray = [0.0, 0.0, 0.0, 0.0]; diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index b423614..a4ca3f5 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -108,7 +108,7 @@ import { getShaderSource, loadImage } from "./utility"; MVP: matrix, diffuse: { texture, sampler }, }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }); // Offset @@ -124,7 +124,7 @@ import { getShaderSource, loadImage } from "./utility"; diffuse: { texture, sampler }, offset, }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }); webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index 89d05f5..5db5ced 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -98,7 +98,7 @@ import { getShaderSource, loadImage } from "./utility"; MVP: matrix, diffuse: { texture, sampler }, }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }); webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index f5a947e..82289b3 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -88,7 +88,7 @@ import { getShaderSource, loadImage } from "./utility"; mvp: matrix, materialDiffuse: { texture, sampler }, }, - drawVertex: { vertexCount: 6 }, + draw: { __type: "DrawVertex", vertexCount: 6 }, }); webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index 79edd93..ca5deb6 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -56,10 +56,6 @@ import { getShaderSource, loadImage } from "./utility"; let texture: ITexture; let sampler: ISampler; - const ro: IRenderObject = { - pipeline: program, - }; - // -- Load model then render const glTFLoader = new GlTFLoader(); let curScene; @@ -227,7 +223,7 @@ import { getShaderSource, loadImage } from "./utility"; displacementMap: { texture, sampler }, diffuse: { texture, sampler }, }, - drawIndexed: { indexCount: primitive.indices.length } + draw: { __type: "DrawIndexed", indexCount: primitive.indices.length } }); } } diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index 0fd0b22..f967a72 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -136,14 +136,14 @@ import { getShaderSource } from "./utility"; vertices: null, transformFeedback: null, uniforms: {}, - drawVertex: { vertexCount: NUM_INSTANCES }, + draw: { __type: "DrawVertex", vertexCount: NUM_INSTANCES }, }; const renderRO: IRenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height - 10 }, pipeline: programs[PROGRAM_DRAW], uniforms: {}, - drawVertex: { vertexCount: 3, instanceCount: NUM_INSTANCES }, + draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: NUM_INSTANCES }, }; const submit: ISubmit = { diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index 769a2c3..b261b2b 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -95,7 +95,7 @@ import { getShaderSource } from "./utility"; vertices: vertexArrays[PROGRAM_TRANSFORM].vertices, uniforms: { MVP: matrix }, transformFeedback, - drawVertex: { vertexCount: VERTEX_COUNT }, + draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, } ], }, @@ -107,7 +107,7 @@ import { getShaderSource } from "./utility"; pipeline: programFeedback, vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, indices: vertexArrays[PROGRAM_FEEDBACK].indices, - drawVertex: { vertexCount: VERTEX_COUNT }, + draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, } ], }] diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index d6126ec..738e83d 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -106,7 +106,7 @@ import { getShaderSource } from "./utility"; vertices: vertexArrays[PROGRAM_TRANSFORM].vertices, uniforms: { MVP: matrix }, transformFeedback, - drawVertex: { vertexCount: VERTEX_COUNT }, + draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, } ] }, @@ -118,7 +118,7 @@ import { getShaderSource } from "./utility"; pipeline: programs[PROGRAM_FEEDBACK], vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, indices: vertexArrays[PROGRAM_FEEDBACK].indices, - drawVertex: { vertexCount: VERTEX_COUNT }, + draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, } ], } diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 055ade8..401fad5 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -139,7 +139,7 @@ import { getShaderSource } from "./utility"; uniforms: { u_acceleration: [0.0, ACCELERATION], }, - drawVertex: { vertexCount: NUM_PARTICLES }, + draw: { __type: "DrawVertex", vertexCount: NUM_PARTICLES }, }; const renderRO: IRenderObject = { @@ -148,7 +148,7 @@ import { getShaderSource } from "./utility"; uniforms: { u_color: [0.0, 1.0, 1.0, 1.0], }, - drawVertex: { vertexCount: NUM_PARTICLES }, + draw: { __type: "DrawVertex", vertexCount: NUM_PARTICLES }, }; const submit: ISubmit = { diff --git a/examples/src/regl-examples/basic.ts b/examples/src/regl-examples/basic.ts index 0e8551c..41f5e12 100644 --- a/examples/src/regl-examples/basic.ts +++ b/examples/src/regl-examples/basic.ts @@ -49,7 +49,7 @@ const renderObject: IRenderObject = { }, depthStencil: {}, }, - drawVertex: { vertexCount: 3 }, + draw: { __type: "DrawVertex", vertexCount: 3 }, }; function draw() diff --git a/examples/src/regl-examples/batch.ts b/examples/src/regl-examples/batch.ts index aa974ad..c20febf 100644 --- a/examples/src/regl-examples/batch.ts +++ b/examples/src/regl-examples/batch.ts @@ -62,7 +62,7 @@ function getRenderObject(batchId: number) offset: offsets[batchId].offset, }, pipeline, - drawVertex: { vertexCount: 3 } + draw: { __type: "DrawVertex", vertexCount: 3 } }; return renderObject; diff --git a/examples/src/regl-examples/bunny.ts b/examples/src/regl-examples/bunny.ts index 388a196..96f34c6 100644 --- a/examples/src/regl-examples/bunny.ts +++ b/examples/src/regl-examples/bunny.ts @@ -35,7 +35,7 @@ const renderObject: IRenderObject = { position: { data: new Float32Array(positions), format: "float32x3" }, }, indices: new Uint16Array(indices), - drawIndexed: { indexCount: indices.length }, + draw: { __type: "DrawIndexed", indexCount: indices.length }, uniforms: { model: mat4.identity([]), }, diff --git a/examples/src/regl-examples/camera.ts b/examples/src/regl-examples/camera.ts index ae5f99a..1a79da8 100644 --- a/examples/src/regl-examples/camera.ts +++ b/examples/src/regl-examples/camera.ts @@ -27,7 +27,7 @@ const renderObject: IRenderObject = { normal: { data: new Float32Array(normals), format: "float32x3" }, }, indices: new Uint16Array(indices), - drawIndexed: { indexCount: indices.length }, + draw: { __type: "DrawIndexed", indexCount: indices.length }, uniforms: {}, pipeline: { vertex: { diff --git a/examples/src/regl-examples/cloth.ts b/examples/src/regl-examples/cloth.ts index b67600e..255c7c4 100644 --- a/examples/src/regl-examples/cloth.ts +++ b/examples/src/regl-examples/cloth.ts @@ -171,7 +171,7 @@ import * as vec3 from "./stackgl/gl-vec3"; uv: { data: new Float32Array(uvs), format: "float32x2" }, }, indices: new Uint16Array(indices), - drawIndexed: { indexCount: indices.length }, + draw: { __type: "DrawIndexed", indexCount: indices.length }, uniforms: {}, pipeline: { vertex: { diff --git a/examples/src/regl-examples/cube.ts b/examples/src/regl-examples/cube.ts index f1dfad8..d97d689 100644 --- a/examples/src/regl-examples/cube.ts +++ b/examples/src/regl-examples/cube.ts @@ -70,7 +70,7 @@ import * as mat4 from "./stackgl/gl-mat4"; uv: { data: new Float32Array(uvs), format: "float32x2" }, }, indices: new Uint16Array(indices), - drawIndexed: { indexCount: indices.length }, + draw: { __type: "DrawIndexed", indexCount: indices.length }, uniforms: {}, pipeline: { vertex: { diff --git a/examples/src/test/RenderObjectChanges.ts b/examples/src/test/RenderObjectChanges.ts index f0c4e10..82983f8 100644 --- a/examples/src/test/RenderObjectChanges.ts +++ b/examples/src/test/RenderObjectChanges.ts @@ -33,7 +33,7 @@ const init = async (canvas: HTMLCanvasElement) => }, indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 uniforms: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 - drawIndexed: { indexCount: 3 }, // 绘制命令 + draw: { __type: "DrawIndexed", indexCount: 3 }, // 绘制命令 }; const submit: ISubmit = { // 一次GPU提交 diff --git a/examples/src/test/fractalCube.ts b/examples/src/test/fractalCube.ts index 35e98ed..11eb8a1 100644 --- a/examples/src/test/fractalCube.ts +++ b/examples/src/test/fractalCube.ts @@ -74,7 +74,7 @@ async function main() }, indices: buffers.indices, uniforms: { uSampler: texture }, - drawIndexed: { firstIndex: 0, indexCount: 36 }, + draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }; const submit: ISubmit = { diff --git a/examples/src/webgl-examples/sample1.ts b/examples/src/webgl-examples/sample1.ts index 9f334e7..e3ef32c 100644 --- a/examples/src/webgl-examples/sample1.ts +++ b/examples/src/webgl-examples/sample1.ts @@ -44,7 +44,7 @@ const init = async (canvas: HTMLCanvasElement) => }, indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 uniforms: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 - drawIndexed: { indexCount: 3 }, // 绘制命令 + draw: { __type: "DrawIndexed", indexCount: 3 }, // 绘制命令 }] }, ] diff --git a/examples/src/webgl-examples/sample2.ts b/examples/src/webgl-examples/sample2.ts index be3e0e3..1c90e27 100644 --- a/examples/src/webgl-examples/sample2.ts +++ b/examples/src/webgl-examples/sample2.ts @@ -57,7 +57,7 @@ function main() uProjectionMatrix: projectionMatrix, uModelViewMatrix: modelViewMatrix, }, - drawVertex: { firstVertex: 0, vertexCount: 4 }, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }], }; diff --git a/examples/src/webgl-examples/sample3.ts b/examples/src/webgl-examples/sample3.ts index b666ea9..84ff0a6 100644 --- a/examples/src/webgl-examples/sample3.ts +++ b/examples/src/webgl-examples/sample3.ts @@ -78,7 +78,7 @@ function main() uProjectionMatrix: projectionMatrix, uModelViewMatrix: modelViewMatrix, }, - drawVertex: { firstVertex: 0, vertexCount: 4 }, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }], }; diff --git a/examples/src/webgl-examples/sample4.ts b/examples/src/webgl-examples/sample4.ts index bf89c1f..c8383a2 100644 --- a/examples/src/webgl-examples/sample4.ts +++ b/examples/src/webgl-examples/sample4.ts @@ -63,7 +63,7 @@ function main() }, }, uniforms: {}, - drawVertex: { firstVertex: 0, vertexCount: 4 }, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }; const renderPass: IRenderPass = { diff --git a/examples/src/webgl-examples/sample5.ts b/examples/src/webgl-examples/sample5.ts index b05b586..3feddc7 100644 --- a/examples/src/webgl-examples/sample5.ts +++ b/examples/src/webgl-examples/sample5.ts @@ -58,7 +58,7 @@ function main() }, indices: buffers.indices, uniforms: {}, - drawIndexed: { firstIndex: 0, indexCount: 36 }, + draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }; const renderPass: IRenderPass = { diff --git a/examples/src/webgl-examples/sample6.ts b/examples/src/webgl-examples/sample6.ts index 847c71c..3f4d43b 100644 --- a/examples/src/webgl-examples/sample6.ts +++ b/examples/src/webgl-examples/sample6.ts @@ -62,7 +62,7 @@ async function main() }, indices: buffers.indices, uniforms: { uSampler: texture }, - drawIndexed: { firstIndex: 0, indexCount: 36 }, + draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }; const renderPass: IRenderPass = { diff --git a/examples/src/webgl-examples/sample7.ts b/examples/src/webgl-examples/sample7.ts index a171f9c..0ae8b7f 100644 --- a/examples/src/webgl-examples/sample7.ts +++ b/examples/src/webgl-examples/sample7.ts @@ -83,7 +83,7 @@ async function main() }, indices: buffers.indices, uniforms: { uSampler: texture }, - drawIndexed: { firstIndex: 0, indexCount: 36 }, + draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }; const renderPass: IRenderPass = { diff --git a/examples/src/webgl-examples/sample8.ts b/examples/src/webgl-examples/sample8.ts index 4369f56..0c05a61 100644 --- a/examples/src/webgl-examples/sample8.ts +++ b/examples/src/webgl-examples/sample8.ts @@ -87,7 +87,7 @@ function main() }, indices: buffers.indices, uniforms: { uSampler: texture }, - drawIndexed: { firstIndex: 0, indexCount: 36 }, + draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }; const renderPass: IRenderPass = { diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index fa75989..597a215 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -200,7 +200,7 @@ export class RunWebGL private runRenderObject(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObject: IRenderObject) { - const { viewport, scissorRect, pipeline, vertices, indices, uniforms, drawIndexed, drawVertex } = renderObject; + const { viewport, scissorRect, pipeline, vertices, indices, uniforms, draw } = renderObject; const topology = pipeline.primitive?.topology || "triangle-list"; const drawMode = getIGLDrawMode(topology); @@ -215,19 +215,19 @@ export class RunWebGL this.runUniforms(gl, pipeline, uniforms); - if (drawVertex) + if (draw.__type === 'DrawVertex') { - this.runDrawVertex(gl, drawMode, drawVertex); + this.runDrawVertex(gl, drawMode, draw); } - if (drawIndexed) + else { - this.runDrawIndexed(gl, drawMode, indices, drawIndexed); + this.runDrawIndexed(gl, drawMode, indices, draw); } } private runTransformFeedbackObject(gl: WebGLRenderingContext, renderObject: IGLTransformFeedbackObject) { - const { pipeline, vertices, uniforms, transformFeedback, drawVertex } = renderObject; + const { pipeline, vertices, uniforms, transformFeedback, draw } = renderObject; const drawMode = getIGLDrawMode("point-list"); @@ -239,7 +239,7 @@ export class RunWebGL this.runTransformFeedback(gl, transformFeedback, drawMode); - this.runDrawVertex(gl, drawMode, drawVertex); + this.runDrawVertex(gl, drawMode, draw); this.endTransformFeedback(gl, transformFeedback); } diff --git a/src/data/IGLTransformFeedbackPass.ts b/src/data/IGLTransformFeedbackPass.ts index 2e9228e..d6427d6 100644 --- a/src/data/IGLTransformFeedbackPass.ts +++ b/src/data/IGLTransformFeedbackPass.ts @@ -39,7 +39,7 @@ export interface IGLTransformFeedbackObject * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex */ - readonly drawVertex: IDrawVertex; + readonly draw: IDrawVertex; /** * Uniform渲染数据 -- Gitee From d00bdf7befd24c2ab7175e57cde036f42722577a Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 00:00:39 +0800 Subject: [PATCH 06/57] IRenderObject.geometry: IGeometry --- examples/src/WebGL2Samples/buffer_copy.ts | 6 ++- examples/src/WebGL2Samples/buffer_uniform.ts | 8 ++-- .../src/WebGL2Samples/draw_image_space.ts | 4 +- examples/src/WebGL2Samples/draw_instanced.ts | 6 ++- .../src/WebGL2Samples/draw_instanced_ubo.ts | 10 +++-- .../WebGL2Samples/draw_primitive_restart.ts | 8 ++-- .../src/WebGL2Samples/draw_range_arrays.ts | 16 ++++++-- examples/src/WebGL2Samples/fbo_blit.ts | 12 ++++-- examples/src/WebGL2Samples/fbo_multisample.ts | 12 ++++-- .../WebGL2Samples/fbo_new_blend_equation.ts | 6 ++- examples/src/WebGL2Samples/fbo_read_pixels.ts | 12 ++++-- .../WebGL2Samples/fbo_rtt_depth_texture.ts | 12 ++++-- .../src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 12 ++++-- .../WebGL2Samples/fbo_rtt_texture_array.ts | 17 +++++--- .../src/WebGL2Samples/geo_vertex_format.ts | 8 ++-- examples/src/WebGL2Samples/glsl_centroid.ts | 16 +++++--- .../glsl_flat_smooth_interpolators.ts | 8 ++-- .../WebGL2Samples/glsl_non_square_matrix.ts | 6 ++- examples/src/WebGL2Samples/query_occlusion.ts | 11 +++-- examples/src/WebGL2Samples/sampler_filter.ts | 6 ++- examples/src/WebGL2Samples/sampler_object.ts | 6 ++- examples/src/WebGL2Samples/sampler_wrap.ts | 11 +++-- .../src/WebGL2Samples/texture_2d_array.ts | 6 ++- examples/src/WebGL2Samples/texture_3d.ts | 6 ++- .../src/WebGL2Samples/texture_derivative.ts | 8 ++-- examples/src/WebGL2Samples/texture_fetch.ts | 6 ++- examples/src/WebGL2Samples/texture_format.ts | 12 ++++-- examples/src/WebGL2Samples/texture_grad.ts | 8 ++-- .../src/WebGL2Samples/texture_immutable.ts | 6 ++- examples/src/WebGL2Samples/texture_integer.ts | 6 ++- examples/src/WebGL2Samples/texture_lod.ts | 6 ++- examples/src/WebGL2Samples/texture_offset.ts | 12 ++++-- .../src/WebGL2Samples/texture_pixel_store.ts | 8 ++-- examples/src/WebGL2Samples/texture_srgb.ts | 6 ++- examples/src/WebGL2Samples/texture_vertex.ts | 10 +++-- .../transform_feedback_instanced.ts | 8 ++-- .../transform_feedback_interleaved.ts | 8 ++-- .../transform_feedback_separated.ts | 10 +++-- .../transform_feedback_separated_2.ts | 8 ++-- examples/src/regl-examples/basic.ts | 20 +++++---- examples/src/regl-examples/batch.ts | 6 ++- examples/src/regl-examples/bunny.ts | 10 +++-- examples/src/regl-examples/camera.ts | 12 +++--- examples/src/regl-examples/cloth.ts | 18 ++++---- examples/src/regl-examples/cube.ts | 12 +++--- examples/src/test/RenderObjectChanges.ts | 10 +++-- examples/src/test/fractalCube.ts | 22 +++++----- examples/src/webgl-examples/sample1.ts | 10 +++-- examples/src/webgl-examples/sample2.ts | 24 ++++++----- examples/src/webgl-examples/sample3.ts | 41 ++++++++++--------- examples/src/webgl-examples/sample4.ts | 40 +++++++++--------- examples/src/webgl-examples/sample5.ts | 22 +++++----- examples/src/webgl-examples/sample6.ts | 22 +++++----- examples/src/webgl-examples/sample7.ts | 34 +++++++-------- examples/src/webgl-examples/sample8.ts | 30 +++++++------- src/RunWebGL.ts | 8 ++-- 56 files changed, 418 insertions(+), 270 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index af8331e..fa2dac5 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -53,8 +53,10 @@ import { getShaderSource } from "./utility"; descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ pipeline: program, - vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + }, }] }; diff --git a/examples/src/WebGL2Samples/buffer_uniform.ts b/examples/src/WebGL2Samples/buffer_uniform.ts index 8c710fc..883743d 100644 --- a/examples/src/WebGL2Samples/buffer_uniform.ts +++ b/examples/src/WebGL2Samples/buffer_uniform.ts @@ -83,14 +83,16 @@ import { getShaderSource } from "./utility"; const ro: IRenderObject = { pipeline: program, - vertices: vertexArray.vertices, - indices: elementData, uniforms: { PerDraw: transforms, PerPass: lightPos, PerScene: material, }, - draw: { __type: "DrawIndexed", indexCount: 6, firstIndex: 0 } + geometry:{ + vertices: vertexArray.vertices, + indices: elementData, + draw: { __type: "DrawIndexed", indexCount: 6, firstIndex: 0 } + }, }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/draw_image_space.ts b/examples/src/WebGL2Samples/draw_image_space.ts index cb4a83e..2150466 100644 --- a/examples/src/WebGL2Samples/draw_image_space.ts +++ b/examples/src/WebGL2Samples/draw_image_space.ts @@ -39,7 +39,9 @@ loadImage("../../assets/img/Di-3d.png", (img) => diffuse: { texture, sampler }, u_imageSize: [canvas.width / 2, canvas.height / 2], }, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 3 }, + geometry: { + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 3 }, + }, pipeline: program }; diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index 4b4c558..ec61712 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -32,9 +32,11 @@ const vertexArray: { vertices?: IVertexAttributes } = { }; const renderObject: IRenderObject = { - vertices: vertexArray.vertices, uniforms: {}, - draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: 2 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: 2 }, + }, pipeline: program }; diff --git a/examples/src/WebGL2Samples/draw_instanced_ubo.ts b/examples/src/WebGL2Samples/draw_instanced_ubo.ts index b72f9ce..9de490d 100644 --- a/examples/src/WebGL2Samples/draw_instanced_ubo.ts +++ b/examples/src/WebGL2Samples/draw_instanced_ubo.ts @@ -50,14 +50,16 @@ const rp: IRenderPass = { descriptor: { colorAttachments: [{ clearValue: [0, 0, 0, 1], loadOp: "clear" }] }, renderObjects: [{ pipeline: program, - vertices: { - pos: { data: vertices, format: "float32x2" }, - }, uniforms: { Transform: transforms, Material: materials, }, - draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: 2 }, + geometry: { + vertices: { + pos: { data: vertices, format: "float32x2" }, + }, + draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: 2 }, + } }] }; diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index 73da09f..d3b3211 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -44,10 +44,12 @@ const vertexArray: { vertices?: IVertexAttributes } = { }; const renderObject: IRenderObject = { - vertices: vertexArray.vertices, - indices, uniforms: {}, - draw: { __type: "DrawIndexed", indexCount: 7, instanceCount: 2 }, + geometry: { + vertices: vertexArray.vertices, + indices, + draw: { __type: "DrawIndexed", indexCount: 7, instanceCount: 2 }, + }, pipeline: program, }; diff --git a/examples/src/WebGL2Samples/draw_range_arrays.ts b/examples/src/WebGL2Samples/draw_range_arrays.ts index 2a10c22..5bf892b 100644 --- a/examples/src/WebGL2Samples/draw_range_arrays.ts +++ b/examples/src/WebGL2Samples/draw_range_arrays.ts @@ -45,9 +45,11 @@ const vertexArray: { vertices?: IVertexAttributes } = { const vertexCount = 12; const renderObject: IRenderObject = { - vertices: vertexArray.vertices, pipeline, - draw: undefined, + geometry: { + vertices: vertexArray.vertices, + draw: undefined, + } }; const rp: IRenderPass = { @@ -61,12 +63,18 @@ const rp: IRenderPass = { { ...renderObject, viewport: { x: 0, y: 0, width: canvas.width / 2, height: canvas.height }, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: vertexCount / 2 }, + geometry: { + ...renderObject.geometry, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: vertexCount / 2 }, + } }, { ...renderObject, viewport: { x: canvas.width / 2, y: 0, width: canvas.width / 2, height: canvas.height }, - draw: { __type: "DrawVertex", firstVertex: 6, vertexCount: vertexCount / 2 }, + geometry: { + ...renderObject.geometry, + draw: { __type: "DrawVertex", firstVertex: 6, vertexCount: vertexCount / 2 }, + }, }, ], }; diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 2c9c1f8..64fc14a 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -82,7 +82,6 @@ loadImage("../../assets/img/Di-3d.png", (image) => const renderObject: IRenderObject = { viewport: { x: 0, y: 0, width: FRAMEBUFFER_SIZE.x, height: FRAMEBUFFER_SIZE.y }, pipeline: program, - vertices: vertexArray.vertices, uniforms: { MVP: new Float32Array([ 0.8, 0.0, 0.0, 0.0, @@ -92,7 +91,10 @@ loadImage("../../assets/img/Di-3d.png", (image) => ]), diffuse: { texture: textureDiffuse, sampler: samplerDiffuse }, }, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 6 } + geometry: { + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 6 } + } }; // Render FBO @@ -150,7 +152,6 @@ loadImage("../../assets/img/Di-3d.png", (image) => const renderObject2: IRenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height }, - vertices: vertexArray.vertices, uniforms: { MVP: new Float32Array([ 1.0, 0.0, 0.0, 0.0, @@ -160,7 +161,10 @@ loadImage("../../assets/img/Di-3d.png", (image) => ]), diffuse: { texture: textureColorBuffer, sampler: samplerColorBuffer }, }, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 6 }, + geometry: { + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 6 }, + }, pipeline: program, }; diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index 82e86df..d9f299a 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -104,9 +104,11 @@ const renderPass1: IRenderPass = { descriptor: framebuffer, renderObjects: [{ pipeline: programs[PROGRAM.TEXTURE], - vertices: vertexArrays[PROGRAM.TEXTURE].vertices, uniforms: { MVP: IDENTITY }, - draw: { __type: "DrawVertex", vertexCount }, + geometry: { + vertices: vertexArrays[PROGRAM.TEXTURE].vertices, + draw: { __type: "DrawVertex", vertexCount }, + } }] }; @@ -122,9 +124,11 @@ const renderPass2: IRenderPass = { renderObjects: [ { pipeline: programs[PROGRAM.SPLASH], - vertices: vertexArrays[PROGRAM.SPLASH].vertices, uniforms: { diffuse: { texture, sampler }, MVP: mvp }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry: { + vertices: vertexArrays[PROGRAM.SPLASH].vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } } ], }; diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index 79d5033..1c46e46 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -121,9 +121,11 @@ function render() const renderObject: IRenderObject = { pipeline: program, - vertices: vertexArray.vertices, uniforms: { mvp: matrix, diffuse: { texture, sampler } }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }; const renderObjects: IRenderPassObject[] = []; diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index e81d51a..5ebe64b 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -135,8 +135,10 @@ const rp1: IRenderPass = { viewport: { x: 0, y: 0, width: w, height: h }, pipeline: multipleOutputProgram, uniforms: { mvp: matrix }, - vertices: multipleOutputVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: multipleOutputVertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }], }; @@ -154,8 +156,10 @@ const ro: IRenderObject = { diffuse: { texture, sampler }, layer: 0, }, - vertices: layerVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: layerVertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }; for (let i = 0; i < Textures.MAX; ++i) diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index c025289..9ece5e0 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -96,8 +96,10 @@ const renderPass: IRenderPass = { descriptor: frameBuffer, renderObjects: [{ pipeline: depthProgram, - vertices: triVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 3 }, + geometry:{ + vertices: triVertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 3 }, + } }], }; @@ -110,8 +112,10 @@ const rp2: IRenderPass = { renderObjects: [{ pipeline: drawProgram, uniforms: { depthMap: { texture: depthTexture, sampler: depthSampler } }, - vertices: quadVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: quadVertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }], }; diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index 25b8f03..e16697f 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -102,8 +102,10 @@ const renderPass: IRenderPass = { descriptor: frameBuffer, renderObjects: [{ pipeline: drawBufferProgram, - vertices: triVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 3 }, + geometry:{ + vertices: triVertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 3 }, + } }], }; @@ -116,8 +118,10 @@ const renderPass2: IRenderPass = { color1Map: { texture: color1Texture, sampler: color1Sampler }, color2Map: { texture: color2Texture, sampler: color2Sampler }, }, - vertices: quadVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: quadVertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }], }; diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index bca8b6d..0ce9db3 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -137,8 +137,10 @@ const renderPass1: IRenderPass = { viewport: { x: 0, y: 0, width: w, height: h }, pipeline: multipleOutputProgram, uniforms: { mvp: matrix }, - vertices: multipleOutputVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: multipleOutputVertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }] }; @@ -154,8 +156,10 @@ const renderPass: IRenderPass = { const renderObject: IRenderObject = { pipeline: layerProgram, uniforms: { mvp: matrix, diffuse: { texture, sampler } }, - vertices: layerVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry: { + vertices: layerVertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }; // @@ -166,7 +170,10 @@ for (let i = 0; i < Textures.MAX; ++i) viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, ...renderObject, uniforms: { ...renderObject.uniforms, layer: i }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry: { + ...renderObject.geometry, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } } ); } diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index 551cbf4..7788b16 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -203,15 +203,17 @@ import { getShaderSource, loadImage } from "./utility"; const ro: IRenderObject = { pipeline: program, - vertices: vertexArray.vertices, - indices: new Uint16Array(cubeVertexIndices), uniforms: { u_model: modelMatrix, u_modelInvTrans: modelInvTrans, u_lightPosition: lightPosition, u_ambient: 0.1, }, - draw: { __type: "DrawIndexed", indexCount: 36 }, + geometry:{ + vertices: vertexArray.vertices, + indices: new Uint16Array(cubeVertexIndices), + draw: { __type: "DrawIndexed", indexCount: 36 }, + } }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index b8fd04f..54aad28 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -164,9 +164,11 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) descriptor: framebuffers[i], renderObjects: [{ pipeline: programs[i], - vertices: vertexArrays[i].vertices, uniforms: { MVP: IDENTITY }, - draw: { __type: "DrawVertex", vertexCount }, + geometry: { + vertices: vertexArrays[i].vertices, + draw: { __type: "DrawVertex", vertexCount }, + } }] }; passEncoders.push(rp); @@ -179,8 +181,10 @@ const rp2: IRenderPass = { }; const ro: IRenderObject = { pipeline: programs[PROGRAM.SPLASH], - vertices: vertexArrays[PROGRAM.SPLASH].vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry: { + vertices: vertexArrays[PROGRAM.SPLASH].vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + }, }; const scaleVector3 = vec3.create(); @@ -199,7 +203,9 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) MVP: mvp, diffuse: { texture: textures[i], sampler: samplers[i] }, }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry: { + draw: { __type: "DrawVertex", vertexCount: 6 }, + } } ); } diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index c98e603..3480d30 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -171,13 +171,15 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) { viewport: viewport[i], pipeline: programs[i], - vertices: vertexArray.vertices, - indices, uniforms: { mvp: localMVP, mvNormal: localMVNormal, }, - draw: { __type: "DrawIndexed", indexCount: primitive.indices.length, firstIndex: 0 }, + geometry: { + vertices: vertexArray.vertices, + indices, + draw: { __type: "DrawIndexed", indexCount: primitive.indices.length, firstIndex: 0 }, + }, }); } } diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index 5bf280a..b1c1f6f 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -69,8 +69,10 @@ loadImage("../../assets/img/Di-3d.png", function (image) renderObjects: [{ pipeline: program, uniforms: { MVP: matrix, diffuse: { texture, sampler } }, - vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }] }; diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index 8a261a5..819b217 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -52,9 +52,11 @@ const rp: IRenderPass = { }; const ro: IRenderObject = { - vertices: vertexArray.vertices, pipeline: program, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 3 }, + geometry: { + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 3 }, + } }; renderObjects.push(ro); @@ -62,7 +64,10 @@ const occlusionQuery: IGLOcclusionQuery = { __type: "OcclusionQuery", renderObjects: [{ ...ro, - draw: { __type: "DrawVertex", firstVertex: 3, vertexCount: 3 }, + geometry: { + ...ro.geometry, + draw: { __type: "DrawVertex", firstVertex: 3, vertexCount: 3 }, + } }] }; diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index 8ee584b..a1ba319 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -151,8 +151,10 @@ function render() const ro: IRenderObject = { pipeline: program, uniforms: { mvp: matrix }, - vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + } }; // Bind samplers diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index fa90797..0ec211a 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -90,13 +90,15 @@ function render() descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ pipeline: program, - vertices: vertexArray.vertices, uniforms: { mvp: matrix, materialDiffuse0: { texture, sampler: samplerA }, materialDiffuse1: { texture, sampler: samplerB }, }, - draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + } }], }; diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index 8fa4de5..5c60efd 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -149,8 +149,10 @@ function render() const ro: IRenderObject = { pipeline: program, uniforms: { mvp: matrix }, - vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + geometry: { + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + } }; for (let i = 0; i < Corners.MAX; ++i) @@ -163,7 +165,10 @@ function render() ...ro.uniforms, diffuse: { texture, sampler: samplers[i] }, }, - draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + geometry: { + ...ro.geometry, + draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + } }); } diff --git a/examples/src/WebGL2Samples/texture_2d_array.ts b/examples/src/WebGL2Samples/texture_2d_array.ts index 324bdd6..a30c749 100644 --- a/examples/src/WebGL2Samples/texture_2d_array.ts +++ b/examples/src/WebGL2Samples/texture_2d_array.ts @@ -84,12 +84,14 @@ import { getShaderSource, loadImage } from "./utility"; const ro: IRenderObject = { pipeline: program, - vertices: vertexArray.vertices, uniforms: { MVP: matrix, diffuse: { texture, sampler }, }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/texture_3d.ts b/examples/src/WebGL2Samples/texture_3d.ts index a7bc9ae..b6857a4 100644 --- a/examples/src/WebGL2Samples/texture_3d.ts +++ b/examples/src/WebGL2Samples/texture_3d.ts @@ -162,8 +162,10 @@ import { getShaderSource } from "./utility"; uniforms: { diffuse: { texture, sampler }, }, - vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 } + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 } + } }; const renderPassObjects: IRenderObject[] = []; diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index 8d66669..f9fe465 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -208,10 +208,12 @@ import { getShaderSource, loadImage } from "./utility"; const ro: IRenderObject = { pipeline: program, - vertices: vertexArray.vertices, - indices: new Uint16Array(cubeVertexIndices), uniforms: {}, - draw: { __type: "DrawIndexed", indexCount: 36 }, + geometry:{ + vertices: vertexArray.vertices, + indices: new Uint16Array(cubeVertexIndices), + draw: { __type: "DrawIndexed", indexCount: 36 }, + } }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/texture_fetch.ts b/examples/src/WebGL2Samples/texture_fetch.ts index 209a0e4..e955063 100644 --- a/examples/src/WebGL2Samples/texture_fetch.ts +++ b/examples/src/WebGL2Samples/texture_fetch.ts @@ -73,12 +73,14 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects: [ { pipeline: program, - vertices: vertexArray.vertices, uniforms: { MVP: matrix, diffuse: { texture, sampler }, }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } } ], }; diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index 5fa33e8..fd0adc6 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -174,13 +174,15 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, - vertices: vertexArray.vertices, pipeline: programNormalized, uniforms: { MVP: matrix, diffuse: { texture: textures[i], sampler: samplers[i] }, }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }); } @@ -190,13 +192,15 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, - vertices: vertexArray.vertices, pipeline: programUint, uniforms: { MVP: matrix, diffuse: { texture: textures[i], sampler: samplers[i] }, }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }); } diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index de48c60..9081438 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -199,10 +199,12 @@ import { getShaderSource, loadImage } from "./utility"; const ro: IRenderObject = { pipeline: program, - vertices: vertexArray.vertices, - indices: new Uint16Array(cubeVertexIndices), uniforms: {}, - draw: { __type: "DrawIndexed", indexCount: 36 }, + geometry:{ + vertices: vertexArray.vertices, + indices: new Uint16Array(cubeVertexIndices), + draw: { __type: "DrawIndexed", indexCount: 36 }, + } }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index 931137d..600fe4b 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -101,11 +101,13 @@ import { getShaderSource, loadImage } from "./utility"; // -- Render const ro: IRenderObject = { pipeline: program, - vertices: vertexArray.vertices, uniforms: { MVP: matrix, }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }; const renderObjects: IRenderPassObject[] = []; diff --git a/examples/src/WebGL2Samples/texture_integer.ts b/examples/src/WebGL2Samples/texture_integer.ts index a98c456..a6c081a 100644 --- a/examples/src/WebGL2Samples/texture_integer.ts +++ b/examples/src/WebGL2Samples/texture_integer.ts @@ -75,8 +75,10 @@ import { getShaderSource, loadImage } from "./utility"; MVP: matrix, diffuse: { texture, sampler }, }, - vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }; const rp: IRenderPass = { diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index 0b933de..8076d11 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -202,8 +202,10 @@ import { getShaderSource, loadImage } from "./utility"; uniforms: { mvp: matrix, }, - vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }; const lodBiasArray = [0.0, 0.0, 0.0, 0.0]; diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index a4ca3f5..b92d736 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -102,13 +102,15 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewports[Corners.RIGHT].x, y: viewports[Corners.RIGHT].y, width: viewports[Corners.RIGHT].z, height: viewports[Corners.RIGHT].w }, - vertices: vertexArray.vertices, pipeline: programBicubic, uniforms: { MVP: matrix, diffuse: { texture, sampler }, }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry: { + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }); // Offset @@ -117,14 +119,16 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewports[Corners.LEFT].x, y: viewports[Corners.LEFT].y, width: viewports[Corners.LEFT].z, height: viewports[Corners.LEFT].w }, - vertices: vertexArray.vertices, pipeline: programOffsetBicubic, uniforms: { MVP: matrix, diffuse: { texture, sampler }, offset, }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry: { + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }); webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index 5db5ced..ec52d79 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -92,13 +92,15 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push({ pipeline: program, - vertices: vertexArray.vertices, - indices: vertexArray.indices, uniforms: { MVP: matrix, diffuse: { texture, sampler }, }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices: vertexArray.vertices, + indices: vertexArray.indices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }); webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index 82289b3..ffb659c 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -83,12 +83,14 @@ import { getShaderSource, loadImage } from "./utility"; ]); renderObjects.push({ pipeline: program, - vertices, uniforms: { mvp: matrix, materialDiffuse: { texture, sampler }, }, - draw: { __type: "DrawVertex", vertexCount: 6 }, + geometry:{ + vertices, + draw: { __type: "DrawVertex", vertexCount: 6 }, + } }); webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index ca5deb6..234d4f5 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IPrimitiveTopology, IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IPrimitiveTopology, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIVertexFormat, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -215,15 +215,17 @@ import { getShaderSource, loadImage } from "./utility"; ...program, primitive: { topology: IDrawMode2Name[primitive.mode] } }, - vertices: vertexArrayMaps[mid][i].vertices, - indices: vertexArrayMaps[mid][i].indices, uniforms: { mvMatrix: localMV, pMatrix: perspectiveMatrix, displacementMap: { texture, sampler }, diffuse: { texture, sampler }, }, - draw: { __type: "DrawIndexed", indexCount: primitive.indices.length } + geometry:{ + vertices: vertexArrayMaps[mid][i].vertices, + indices: vertexArrayMaps[mid][i].indices, + draw: { __type: "DrawIndexed", indexCount: primitive.indices.length } + } }); } } diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index f967a72..8e56291 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -143,7 +143,9 @@ import { getShaderSource } from "./utility"; viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height - 10 }, pipeline: programs[PROGRAM_DRAW], uniforms: {}, - draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: NUM_INSTANCES }, + geometry:{ + draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: NUM_INSTANCES }, + } }; const submit: ISubmit = { @@ -181,8 +183,8 @@ import { getShaderSource } from "./utility"; // Rotate triangles transform(); - renderRO.vertices = vertexArrays[currentSourceIdx][1].vertices; - renderRO.indices = vertexArrays[currentSourceIdx][1].indices; + renderRO.geometry.vertices = vertexArrays[currentSourceIdx][1].vertices; + renderRO.geometry.indices = vertexArrays[currentSourceIdx][1].indices; webgl.submit(submit); diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index b261b2b..027a9d6 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -105,9 +105,11 @@ import { getShaderSource } from "./utility"; // Second draw, reuse captured attributes { pipeline: programFeedback, - vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, - indices: vertexArrays[PROGRAM_FEEDBACK].indices, - draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, + geometry:{ + vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, + indices: vertexArrays[PROGRAM_FEEDBACK].indices, + draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, + }, } ], }] diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index 738e83d..242f110 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderPass, IRenderPassObject, IRenderPipeline, ISubmit, IVertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IRenderPipeline, ISubmit, IVertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -116,9 +116,11 @@ import { getShaderSource } from "./utility"; // Second draw, reuse captured attributes { pipeline: programs[PROGRAM_FEEDBACK], - vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, - indices: vertexArrays[PROGRAM_FEEDBACK].indices, - draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, + geometry: { + vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, + indices: vertexArrays[PROGRAM_FEEDBACK].indices, + draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, + } } ], } diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 401fad5..ee4e155 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -148,7 +148,9 @@ import { getShaderSource } from "./utility"; uniforms: { u_color: [0.0, 1.0, 1.0, 1.0], }, - draw: { __type: "DrawVertex", vertexCount: NUM_PARTICLES }, + geometry:{ + draw: { __type: "DrawVertex", vertexCount: NUM_PARTICLES }, + } }; const submit: ISubmit = { @@ -186,8 +188,8 @@ import { getShaderSource } from "./utility"; transform(); // - renderRO.vertices = vertexArrays[currentSourceIdx][1].vertices; - renderRO.indices = vertexArrays[currentSourceIdx][1].indices; + renderRO.geometry.vertices = vertexArrays[currentSourceIdx][1].vertices; + renderRO.geometry.indices = vertexArrays[currentSourceIdx][1].indices; webgl.submit(submit); diff --git a/examples/src/regl-examples/basic.ts b/examples/src/regl-examples/basic.ts index 41f5e12..56532ef 100644 --- a/examples/src/regl-examples/basic.ts +++ b/examples/src/regl-examples/basic.ts @@ -17,15 +17,18 @@ document.body.appendChild(canvas); const webgl = new WebGL({ canvasId: "glcanvas" }); const renderObject: IRenderObject = { - vertices: { - position: { - data: new Float32Array([ - -1, 0, - 0, -1, - 1, 1 - ]), - format: "float32x2", + geometry: { + vertices: { + position: { + data: new Float32Array([ + -1, 0, + 0, -1, + 1, 1 + ]), + format: "float32x2", + }, }, + draw: { __type: "DrawVertex", vertexCount: 3 }, }, uniforms: { color: [1, 0, 0, 1] }, pipeline: { @@ -49,7 +52,6 @@ const renderObject: IRenderObject = { }, depthStencil: {}, }, - draw: { __type: "DrawVertex", vertexCount: 3 }, }; function draw() diff --git a/examples/src/regl-examples/batch.ts b/examples/src/regl-examples/batch.ts index c20febf..7693b5d 100644 --- a/examples/src/regl-examples/batch.ts +++ b/examples/src/regl-examples/batch.ts @@ -57,12 +57,14 @@ const vertexArray: { vertices?: IVertexAttributes } = { function getRenderObject(batchId: number) { const renderObject: IRenderObject = { - vertices: vertexArray.vertices, + geometry: { + vertices: vertexArray.vertices, + draw: { __type: "DrawVertex", vertexCount: 3 } + }, uniforms: { offset: offsets[batchId].offset, }, pipeline, - draw: { __type: "DrawVertex", vertexCount: 3 } }; return renderObject; diff --git a/examples/src/regl-examples/bunny.ts b/examples/src/regl-examples/bunny.ts index 96f34c6..4ad2fde 100644 --- a/examples/src/regl-examples/bunny.ts +++ b/examples/src/regl-examples/bunny.ts @@ -31,11 +31,13 @@ let viewportWidth = canvas.clientWidth; let viewportHeight = canvas.clientHeight; const renderObject: IRenderObject = { - vertices: { - position: { data: new Float32Array(positions), format: "float32x3" }, + geometry:{ + vertices: { + position: { data: new Float32Array(positions), format: "float32x3" }, + }, + indices: new Uint16Array(indices), + draw: { __type: "DrawIndexed", indexCount: indices.length }, }, - indices: new Uint16Array(indices), - draw: { __type: "DrawIndexed", indexCount: indices.length }, uniforms: { model: mat4.identity([]), }, diff --git a/examples/src/regl-examples/camera.ts b/examples/src/regl-examples/camera.ts index 1a79da8..b3957a7 100644 --- a/examples/src/regl-examples/camera.ts +++ b/examples/src/regl-examples/camera.ts @@ -22,12 +22,14 @@ const indices = bunny.cells.flat(); const normals = angleNormals(bunny.cells, bunny.positions).flat(); const renderObject: IRenderObject = { - vertices: { - position: { data: new Float32Array(positions), format: "float32x3" }, - normal: { data: new Float32Array(normals), format: "float32x3" }, + geometry:{ + vertices: { + position: { data: new Float32Array(positions), format: "float32x3" }, + normal: { data: new Float32Array(normals), format: "float32x3" }, + }, + indices: new Uint16Array(indices), + draw: { __type: "DrawIndexed", indexCount: indices.length }, }, - indices: new Uint16Array(indices), - draw: { __type: "DrawIndexed", indexCount: indices.length }, uniforms: {}, pipeline: { vertex: { diff --git a/examples/src/regl-examples/cloth.ts b/examples/src/regl-examples/cloth.ts index 255c7c4..b5aed96 100644 --- a/examples/src/regl-examples/cloth.ts +++ b/examples/src/regl-examples/cloth.ts @@ -165,13 +165,15 @@ import * as vec3 from "./stackgl/gl-vec3"; let viewportHeight = 1; const renderObject: IRenderObject = { - vertices: { - position: { data: new Float32Array(positions), format: "float32x3" }, - normal: { data: new Float32Array(normals), format: "float32x3" }, - uv: { data: new Float32Array(uvs), format: "float32x2" }, + geometry:{ + vertices: { + position: { data: new Float32Array(positions), format: "float32x3" }, + normal: { data: new Float32Array(normals), format: "float32x3" }, + uv: { data: new Float32Array(uvs), format: "float32x2" }, + }, + indices: new Uint16Array(indices), + draw: { __type: "DrawIndexed", indexCount: indices.length }, }, - indices: new Uint16Array(indices), - draw: { __type: "DrawIndexed", indexCount: indices.length }, uniforms: {}, pipeline: { vertex: { @@ -359,8 +361,8 @@ import * as vec3 from "./stackgl/gl-vec3"; return pv; }, []); - getIGLVertexBuffer(renderObject.vertices.position.data).data = new Float32Array(positions); - getIGLVertexBuffer(renderObject.vertices.normal.data).data = new Float32Array(normals); + getIGLVertexBuffer(renderObject.geometry.vertices.position.data).data = new Float32Array(positions); + getIGLVertexBuffer(renderObject.geometry.vertices.normal.data).data = new Float32Array(normals); tick++; diff --git a/examples/src/regl-examples/cube.ts b/examples/src/regl-examples/cube.ts index d97d689..d73820e 100644 --- a/examples/src/regl-examples/cube.ts +++ b/examples/src/regl-examples/cube.ts @@ -65,12 +65,14 @@ import * as mat4 from "./stackgl/gl-mat4"; let viewportHeight = 1; const renderObject: IRenderObject = { - vertices: { - position: { data: new Float32Array(positions), format: "float32x3" }, - uv: { data: new Float32Array(uvs), format: "float32x2" }, + geometry:{ + vertices: { + position: { data: new Float32Array(positions), format: "float32x3" }, + uv: { data: new Float32Array(uvs), format: "float32x2" }, + }, + indices: new Uint16Array(indices), + draw: { __type: "DrawIndexed", indexCount: indices.length }, }, - indices: new Uint16Array(indices), - draw: { __type: "DrawIndexed", indexCount: indices.length }, uniforms: {}, pipeline: { vertex: { diff --git a/examples/src/test/RenderObjectChanges.ts b/examples/src/test/RenderObjectChanges.ts index 82983f8..a1f23fd 100644 --- a/examples/src/test/RenderObjectChanges.ts +++ b/examples/src/test/RenderObjectChanges.ts @@ -28,12 +28,14 @@ const init = async (canvas: HTMLCanvasElement) => } ` }, }, - vertices: { - position: { data: new Float32Array([0.0, 0.5, -0.5, -0.5, 0.5, -0.5]), format: "float32x2" }, // 顶点坐标数据 + geometry: { + vertices: { + position: { data: new Float32Array([0.0, 0.5, -0.5, -0.5, 0.5, -0.5]), format: "float32x2" }, // 顶点坐标数据 + }, + indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 + draw: { __type: "DrawIndexed", indexCount: 3 }, // 绘制命令 }, - indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 uniforms: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 - draw: { __type: "DrawIndexed", indexCount: 3 }, // 绘制命令 }; const submit: ISubmit = { // 一次GPU提交 diff --git a/examples/src/test/fractalCube.ts b/examples/src/test/fractalCube.ts index 11eb8a1..d3c886e 100644 --- a/examples/src/test/fractalCube.ts +++ b/examples/src/test/fractalCube.ts @@ -62,19 +62,21 @@ async function main() ` }, depthStencil: { depthCompare: "less-equal" } }, - vertices: { - aVertexPosition: { - format: "float32x3", - data: buffers.position, - }, - aTextureCoord: { - format: "float32x2", - data: buffers.textureCoord, + geometry:{ + vertices: { + aVertexPosition: { + format: "float32x3", + data: buffers.position, + }, + aTextureCoord: { + format: "float32x2", + data: buffers.textureCoord, + }, }, + indices: buffers.indices, + draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, - indices: buffers.indices, uniforms: { uSampler: texture }, - draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }; const submit: ISubmit = { diff --git a/examples/src/webgl-examples/sample1.ts b/examples/src/webgl-examples/sample1.ts index e3ef32c..74d0be2 100644 --- a/examples/src/webgl-examples/sample1.ts +++ b/examples/src/webgl-examples/sample1.ts @@ -39,12 +39,14 @@ const init = async (canvas: HTMLCanvasElement) => } ` }, }, - vertices: { - position: { data: new Float32Array([0.0, 0.5, -0.5, -0.5, 0.5, -0.5]), format: "float32x2" }, // 顶点坐标数据 + geometry: { + vertices: { + position: { data: new Float32Array([0.0, 0.5, -0.5, -0.5, 0.5, -0.5]), format: "float32x2" }, // 顶点坐标数据 + }, + indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 + draw: { __type: "DrawIndexed", indexCount: 3 }, // 绘制命令 }, - indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 uniforms: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 - draw: { __type: "DrawIndexed", indexCount: 3 }, // 绘制命令 }] }, ] diff --git a/examples/src/webgl-examples/sample2.ts b/examples/src/webgl-examples/sample2.ts index 1c90e27..53d168c 100644 --- a/examples/src/webgl-examples/sample2.ts +++ b/examples/src/webgl-examples/sample2.ts @@ -42,22 +42,24 @@ function main() }` }, depthStencil: { depthCompare: "less-equal" } }, - vertices: { - aVertexPosition: { - format: "float32x2", - data: new Float32Array([ - 1.0, 1.0, - -1.0, 1.0, - 1.0, -1.0, - -1.0, -1.0, - ]), - } + geometry: { + vertices: { + aVertexPosition: { + format: "float32x2", + data: new Float32Array([ + 1.0, 1.0, + -1.0, 1.0, + 1.0, -1.0, + -1.0, -1.0, + ]), + } + }, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }, uniforms: { uProjectionMatrix: projectionMatrix, uModelViewMatrix: modelViewMatrix, }, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }], }; diff --git a/examples/src/webgl-examples/sample3.ts b/examples/src/webgl-examples/sample3.ts index 84ff0a6..2cee077 100644 --- a/examples/src/webgl-examples/sample3.ts +++ b/examples/src/webgl-examples/sample3.ts @@ -54,31 +54,34 @@ function main() ` }, depthStencil: { depthCompare: "less-equal" } }, - vertices: { - aVertexPosition: { - format: "float32x2", - data: new Float32Array([ - 1.0, 1.0, - -1.0, 1.0, - 1.0, -1.0, - -1.0, -1.0, - ]), - }, - aVertexColor: { - format: "float32x4", - data: new Float32Array([ - 1.0, 1.0, 1.0, 1.0, // white - 1.0, 0.0, 0.0, 1.0, // red - 0.0, 1.0, 0.0, 1.0, // green - 0.0, 0.0, 1.0, 1.0, // blue - ]), + geometry: { + + vertices: { + aVertexPosition: { + format: "float32x2", + data: new Float32Array([ + 1.0, 1.0, + -1.0, 1.0, + 1.0, -1.0, + -1.0, -1.0, + ]), + }, + aVertexColor: { + format: "float32x4", + data: new Float32Array([ + 1.0, 1.0, 1.0, 1.0, // white + 1.0, 0.0, 0.0, 1.0, // red + 0.0, 1.0, 0.0, 1.0, // green + 0.0, 0.0, 1.0, 1.0, // blue + ]), + }, }, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }, uniforms: { uProjectionMatrix: projectionMatrix, uModelViewMatrix: modelViewMatrix, }, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }], }; diff --git a/examples/src/webgl-examples/sample4.ts b/examples/src/webgl-examples/sample4.ts index c8383a2..190a57c 100644 --- a/examples/src/webgl-examples/sample4.ts +++ b/examples/src/webgl-examples/sample4.ts @@ -42,28 +42,30 @@ function main() ` }, depthStencil: { depthCompare: "less-equal" } }, - vertices: { - aVertexPosition: { - format: "float32x2", - data: new Float32Array([ - 1.0, 1.0, - -1.0, 1.0, - 1.0, -1.0, - -1.0, -1.0, - ]), - }, - aVertexColor: { - format: "float32x4", - data: new Float32Array([ - 1.0, 1.0, 1.0, 1.0, // white - 1.0, 0.0, 0.0, 1.0, // red - 0.0, 1.0, 0.0, 1.0, // green - 0.0, 0.0, 1.0, 1.0, // blue - ]), + geometry:{ + vertices: { + aVertexPosition: { + format: "float32x2", + data: new Float32Array([ + 1.0, 1.0, + -1.0, 1.0, + 1.0, -1.0, + -1.0, -1.0, + ]), + }, + aVertexColor: { + format: "float32x4", + data: new Float32Array([ + 1.0, 1.0, 1.0, 1.0, // white + 1.0, 0.0, 0.0, 1.0, // red + 0.0, 1.0, 0.0, 1.0, // green + 0.0, 0.0, 1.0, 1.0, // blue + ]), + }, }, + draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }, uniforms: {}, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }; const renderPass: IRenderPass = { diff --git a/examples/src/webgl-examples/sample5.ts b/examples/src/webgl-examples/sample5.ts index 3feddc7..8a8d134 100644 --- a/examples/src/webgl-examples/sample5.ts +++ b/examples/src/webgl-examples/sample5.ts @@ -46,19 +46,21 @@ function main() ` }, depthStencil: { depthCompare: "less-equal" } }, - vertices: { - aVertexPosition: { - format: "float32x3", - data: buffers.position, - }, - aVertexColor: { - format: "float32x4", - data: buffers.color, + geometry: { + vertices: { + aVertexPosition: { + format: "float32x3", + data: buffers.position, + }, + aVertexColor: { + format: "float32x4", + data: buffers.color, + }, }, + indices: buffers.indices, + draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, - indices: buffers.indices, uniforms: {}, - draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }; const renderPass: IRenderPass = { diff --git a/examples/src/webgl-examples/sample6.ts b/examples/src/webgl-examples/sample6.ts index 3f4d43b..8a9b2a5 100644 --- a/examples/src/webgl-examples/sample6.ts +++ b/examples/src/webgl-examples/sample6.ts @@ -50,19 +50,21 @@ async function main() ` }, depthStencil: { depthCompare: "less-equal" } }, - vertices: { - aVertexPosition: { - format: "float32x3", - data: buffers.position, - }, - aTextureCoord: { - format: "float32x2", - data: buffers.textureCoord, + geometry: { + vertices: { + aVertexPosition: { + format: "float32x3", + data: buffers.position, + }, + aTextureCoord: { + format: "float32x2", + data: buffers.textureCoord, + }, }, + indices: buffers.indices, + draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, - indices: buffers.indices, uniforms: { uSampler: texture }, - draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }; const renderPass: IRenderPass = { diff --git a/examples/src/webgl-examples/sample7.ts b/examples/src/webgl-examples/sample7.ts index 0ae8b7f..ccb1027 100644 --- a/examples/src/webgl-examples/sample7.ts +++ b/examples/src/webgl-examples/sample7.ts @@ -67,23 +67,25 @@ async function main() ` }, depthStencil: { depthCompare: "less-equal" } }, - vertices: { - aVertexPosition: { - format: "float32x3", - data: buffers.position, - }, - aVertexNormal: { - format: "float32x3", - data: buffers.normal, - }, - aTextureCoord: { - format: "float32x2", - data: buffers.textureCoord, - }, - }, - indices: buffers.indices, uniforms: { uSampler: texture }, - draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, + geometry: { + vertices: { + aVertexPosition: { + format: "float32x3", + data: buffers.position, + }, + aVertexNormal: { + format: "float32x3", + data: buffers.normal, + }, + aTextureCoord: { + format: "float32x2", + data: buffers.textureCoord, + }, + }, + indices: buffers.indices, + draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, + } }; const renderPass: IRenderPass = { diff --git a/examples/src/webgl-examples/sample8.ts b/examples/src/webgl-examples/sample8.ts index 0c05a61..f9cbd60 100644 --- a/examples/src/webgl-examples/sample8.ts +++ b/examples/src/webgl-examples/sample8.ts @@ -71,23 +71,25 @@ function main() ` }, depthStencil: { depthCompare: "less-equal" } }, - vertices: { - aVertexPosition: { - format: "float32x3", - data: buffers.position, - }, - aVertexNormal: { - format: "float32x3", - data: buffers.normal, - }, - aTextureCoord: { - format: "float32x2", - data: buffers.textureCoord, + geometry: { + vertices: { + aVertexPosition: { + format: "float32x3", + data: buffers.position, + }, + aVertexNormal: { + format: "float32x3", + data: buffers.normal, + }, + aTextureCoord: { + format: "float32x2", + data: buffers.textureCoord, + }, }, + indices: buffers.indices, + draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, - indices: buffers.indices, uniforms: { uSampler: texture }, - draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }; const renderPass: IRenderPass = { diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 597a215..5fc6d3d 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -200,7 +200,7 @@ export class RunWebGL private runRenderObject(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObject: IRenderObject) { - const { viewport, scissorRect, pipeline, vertices, indices, uniforms, draw } = renderObject; + const { viewport, scissorRect, pipeline, geometry, uniforms } = renderObject; const topology = pipeline.primitive?.topology || "triangle-list"; const drawMode = getIGLDrawMode(topology); @@ -211,10 +211,12 @@ export class RunWebGL this.runRenderPipeline(gl, pipeline); - this.runVertexArray(gl, pipeline, vertices, indices); - this.runUniforms(gl, pipeline, uniforms); + const { vertices, indices, draw, } = geometry; + + this.runVertexArray(gl, pipeline, vertices, indices); + if (draw.__type === 'DrawVertex') { this.runDrawVertex(gl, drawMode, draw); -- Gitee From f94b5d264174516808e10e98d46645f5fa118644 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 00:15:35 +0800 Subject: [PATCH 07/57] IGeometry.primitive?: IPrimitiveState --- examples/src/WebGL2Samples/buffer_copy.ts | 2 +- examples/src/WebGL2Samples/draw_image_space.ts | 2 +- examples/src/WebGL2Samples/draw_instanced.ts | 2 +- examples/src/WebGL2Samples/draw_primitive_restart.ts | 2 +- examples/src/WebGL2Samples/draw_range_arrays.ts | 2 +- examples/src/WebGL2Samples/fbo_blit.ts | 2 +- examples/src/WebGL2Samples/fbo_multisample.ts | 4 ++-- examples/src/WebGL2Samples/fbo_read_pixels.ts | 3 +-- examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts | 4 ++-- examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 4 ++-- examples/src/WebGL2Samples/fbo_rtt_texture_array.ts | 4 ++-- examples/src/WebGL2Samples/geo_vertex_format.ts | 2 +- examples/src/WebGL2Samples/glsl_centroid.ts | 5 ++--- .../WebGL2Samples/glsl_flat_smooth_interpolators.ts | 3 +-- examples/src/WebGL2Samples/glsl_non_square_matrix.ts | 2 +- examples/src/WebGL2Samples/query_occlusion.ts | 2 +- examples/src/WebGL2Samples/sampler_filter.ts | 2 +- examples/src/WebGL2Samples/sampler_object.ts | 2 +- examples/src/WebGL2Samples/sampler_wrap.ts | 2 +- examples/src/WebGL2Samples/texture_derivative.ts | 2 +- examples/src/WebGL2Samples/texture_grad.ts | 2 +- examples/src/WebGL2Samples/texture_vertex.ts | 2 +- .../WebGL2Samples/transform_feedback_instanced.ts | 2 +- .../WebGL2Samples/transform_feedback_separated_2.ts | 2 +- examples/src/test/fractalCube.ts | 4 ++-- examples/src/webgl-examples/sample2.ts | 2 +- examples/src/webgl-examples/sample3.ts | 3 +-- examples/src/webgl-examples/sample4.ts | 2 +- examples/src/webgl-examples/sample5.ts | 2 +- examples/src/webgl-examples/sample6.ts | 2 +- examples/src/webgl-examples/sample7.ts | 2 +- examples/src/webgl-examples/sample8.ts | 2 +- src/RunWebGL.ts | 12 ++++++------ 33 files changed, 44 insertions(+), 48 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index fa2dac5..f6af26a 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -18,7 +18,6 @@ import { getShaderSource } from "./utility"; // -- Init Program const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, - primitive: { topology: "triangle-list" }, }; // -- Init Buffer @@ -54,6 +53,7 @@ import { getShaderSource } from "./utility"; renderObjects: [{ pipeline: program, geometry:{ + primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 6 }, }, diff --git a/examples/src/WebGL2Samples/draw_image_space.ts b/examples/src/WebGL2Samples/draw_image_space.ts index 2150466..92f30b5 100644 --- a/examples/src/WebGL2Samples/draw_image_space.ts +++ b/examples/src/WebGL2Samples/draw_image_space.ts @@ -24,7 +24,6 @@ loadImage("../../assets/img/Di-3d.png", (img) => }; const program: IRenderPipeline = { - primitive: { topology: "triangle-list" }, vertex: { code: getShaderSource("vs") }, @@ -40,6 +39,7 @@ loadImage("../../assets/img/Di-3d.png", (img) => u_imageSize: [canvas.width / 2, canvas.height / 2], }, geometry: { + primitive: { topology: "triangle-list" }, draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 3 }, }, pipeline: program diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index ec61712..1078a0b 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -19,7 +19,6 @@ const vertexColorBuffer = new Float32Array([ 0.0, 0.5, 1.0]); const program: IRenderPipeline = { - primitive: { topology: "triangle-list" }, vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs"), targets: [{ blend: {} }] } }; @@ -34,6 +33,7 @@ const vertexArray: { vertices?: IVertexAttributes } = { const renderObject: IRenderObject = { uniforms: {}, geometry:{ + primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: 2 }, }, diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index d3b3211..065fc7d 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -23,7 +23,6 @@ const vertexPosBuffer = new Float32Array([ ]); const program: IRenderPipeline = { - primitive: { topology: "triangle-strip" }, vertex: { code: getShaderSource("vs") }, @@ -46,6 +45,7 @@ const vertexArray: { vertices?: IVertexAttributes } = { const renderObject: IRenderObject = { uniforms: {}, geometry: { + primitive: { topology: "triangle-strip" }, vertices: vertexArray.vertices, indices, draw: { __type: "DrawIndexed", indexCount: 7, instanceCount: 2 }, diff --git a/examples/src/WebGL2Samples/draw_range_arrays.ts b/examples/src/WebGL2Samples/draw_range_arrays.ts index 5bf892b..490a3db 100644 --- a/examples/src/WebGL2Samples/draw_range_arrays.ts +++ b/examples/src/WebGL2Samples/draw_range_arrays.ts @@ -27,7 +27,6 @@ const vertexPosBuffer = new Float32Array([ ]); const pipeline: IRenderPipeline = { - primitive: { topology: "triangle-strip" }, vertex: { code: getShaderSource("vs") }, @@ -47,6 +46,7 @@ const vertexCount = 12; const renderObject: IRenderObject = { pipeline, geometry: { + primitive: { topology: "triangle-strip" }, vertices: vertexArray.vertices, draw: undefined, } diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 64fc14a..4bc4a5c 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -12,7 +12,6 @@ const renderingContext: IGLCanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); const program: IRenderPipeline = { - primitive: { topology: "triangle-list" }, vertex: { code: getShaderSource("vs") }, @@ -92,6 +91,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => diffuse: { texture: textureDiffuse, sampler: samplerDiffuse }, }, geometry: { + primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 6 } } diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index d9f299a..9cb48ca 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -23,12 +23,10 @@ const programs: IRenderPipeline[] = [ { vertex: { code: getShaderSource("vs-render") }, fragment: { code: getShaderSource("fs-render") }, - primitive: { topology: "LINE_LOOP" }, }, { vertex: { code: getShaderSource("vs-splash") }, fragment: { code: getShaderSource("fs-splash") }, - primitive: { topology: "triangle-list" }, }, ]; @@ -106,6 +104,7 @@ const renderPass1: IRenderPass = { pipeline: programs[PROGRAM.TEXTURE], uniforms: { MVP: IDENTITY }, geometry: { + primitive: { topology: "LINE_LOOP" }, vertices: vertexArrays[PROGRAM.TEXTURE].vertices, draw: { __type: "DrawVertex", vertexCount }, } @@ -126,6 +125,7 @@ const renderPass2: IRenderPass = { pipeline: programs[PROGRAM.SPLASH], uniforms: { diffuse: { texture, sampler }, MVP: mvp }, geometry: { + primitive: { topology: "triangle-list" }, vertices: vertexArrays[PROGRAM.SPLASH].vertices, draw: { __type: "DrawVertex", vertexCount: 6 }, } diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index 5ebe64b..e955480 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -53,13 +53,11 @@ viewport[Textures.BLUE] = { // Multiple out shaders const multipleOutputProgram: IRenderPipeline = { vertex: { code: getShaderSource("vs-multiple-output") }, fragment: { code: getShaderSource("fs-multiple-output") }, - primitive: { topology: "triangle-list" }, }; // Layer shaders const layerProgram: IRenderPipeline = { vertex: { code: getShaderSource("vs-layer") }, fragment: { code: getShaderSource("fs-layer") }, - primitive: { topology: "triangle-list" }, }; // -- Initialize buffer @@ -136,6 +134,7 @@ const rp1: IRenderPass = { pipeline: multipleOutputProgram, uniforms: { mvp: matrix }, geometry:{ + primitive: { topology: "triangle-list" }, vertices: multipleOutputVertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 6 }, } diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index 9ece5e0..8f0e110 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -22,13 +22,11 @@ const windowSize = { const depthProgram: IRenderPipeline = { vertex: { code: getShaderSource("vs-depth") }, fragment: { code: getShaderSource("fs-depth") }, depthStencil: {}, - primitive: { topology: "triangle-list" }, }; // Draw shaders const drawProgram: IRenderPipeline = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw") }, - primitive: { topology: "triangle-list" }, }; // -- Initialize buffer @@ -97,6 +95,7 @@ const renderPass: IRenderPass = { renderObjects: [{ pipeline: depthProgram, geometry:{ + primitive: { topology: "triangle-list" }, vertices: triVertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 3 }, } @@ -113,6 +112,7 @@ const rp2: IRenderPass = { pipeline: drawProgram, uniforms: { depthMap: { texture: depthTexture, sampler: depthSampler } }, geometry:{ + primitive: { topology: "triangle-list" }, vertices: quadVertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 6 }, } diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index e16697f..c0a41b3 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -22,14 +22,12 @@ const windowSize = { const drawBufferProgram: IRenderPipeline = { vertex: { code: getShaderSource("vs-draw-buffer") }, fragment: { code: getShaderSource("fs-draw-buffer") }, - primitive: { topology: "triangle-list" }, }; // Draw shaders const drawProgram: IRenderPipeline = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw") }, - primitive: { topology: "triangle-list" }, }; // -- Initialize buffer @@ -103,6 +101,7 @@ const renderPass: IRenderPass = { renderObjects: [{ pipeline: drawBufferProgram, geometry:{ + primitive: { topology: "triangle-list" }, vertices: triVertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 3 }, } @@ -119,6 +118,7 @@ const renderPass2: IRenderPass = { color2Map: { texture: color2Texture, sampler: color2Sampler }, }, geometry:{ + primitive: { topology: "triangle-list" }, vertices: quadVertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 6 }, } diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index 0ce9db3..9bee6bd 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -53,13 +53,11 @@ viewport[Textures.BLUE] = { // Multiple out shaders const multipleOutputProgram: IRenderPipeline = { vertex: { code: getShaderSource("vs-multiple-output") }, fragment: { code: getShaderSource("fs-multiple-output") }, - primitive: { topology: "triangle-list" }, }; // Layer shaders const layerProgram: IRenderPipeline = { vertex: { code: getShaderSource("vs-layer") }, fragment: { code: getShaderSource("fs-layer") }, - primitive: { topology: "triangle-list" }, }; // -- Initialize buffer @@ -138,6 +136,7 @@ const renderPass1: IRenderPass = { pipeline: multipleOutputProgram, uniforms: { mvp: matrix }, geometry:{ + primitive: { topology: "triangle-list" }, vertices: multipleOutputVertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 6 }, } @@ -157,6 +156,7 @@ const renderObject: IRenderObject = { pipeline: layerProgram, uniforms: { mvp: matrix, diffuse: { texture, sampler } }, geometry: { + primitive: { topology: "triangle-list" }, vertices: layerVertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 6 }, } diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index 7788b16..f7bf0c6 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -18,7 +18,6 @@ import { getShaderSource, loadImage } from "./utility"; // -- Init program const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, - primitive: { topology: "triangle-list", cullFace: "back" }, depthStencil: {}, }; @@ -210,6 +209,7 @@ import { getShaderSource, loadImage } from "./utility"; u_ambient: 0.1, }, geometry:{ + primitive: { topology: "triangle-list", cullFace: "back" }, vertices: vertexArray.vertices, indices: new Uint16Array(cubeVertexIndices), draw: { __type: "DrawIndexed", indexCount: 36 }, diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index 54aad28..6320bf9 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -51,15 +51,12 @@ const PROGRAM = { const programs: IRenderPipeline[] = [ { vertex: { code: getShaderSource("vs-render") }, fragment: { code: getShaderSource("fs-render") }, - primitive: { topology: "triangle-list" }, }, { vertex: { code: getShaderSource("vs-render-centroid") }, fragment: { code: getShaderSource("fs-render-centroid") }, - primitive: { topology: "triangle-list" }, }, { vertex: { code: getShaderSource("vs-splash") }, fragment: { code: getShaderSource("fs-splash") }, - primitive: { topology: "triangle-list" }, } ]; @@ -166,6 +163,7 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) pipeline: programs[i], uniforms: { MVP: IDENTITY }, geometry: { + primitive: { topology: "triangle-list" }, vertices: vertexArrays[i].vertices, draw: { __type: "DrawVertex", vertexCount }, } @@ -182,6 +180,7 @@ const rp2: IRenderPass = { const ro: IRenderObject = { pipeline: programs[PROGRAM.SPLASH], geometry: { + primitive: { topology: "triangle-list" }, vertices: vertexArrays[PROGRAM.SPLASH].vertices, draw: { __type: "DrawVertex", vertexCount: 6 }, }, diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index 3480d30..0ccf1cb 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -45,12 +45,10 @@ viewport[VIEWPORTS.RIGHT] = { const programs: IRenderPipeline[] = [ { vertex: { code: getShaderSource("vs-flat") }, fragment: { code: getShaderSource("fs-flat") }, - primitive: { topology: "triangle-list" }, depthStencil: { depthCompare: "less-equal" }, }, { vertex: { code: getShaderSource("vs-smooth") }, fragment: { code: getShaderSource("fs-smooth") }, - primitive: { topology: "triangle-list" }, depthStencil: { depthCompare: "less-equal" }, } ]; @@ -176,6 +174,7 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) mvNormal: localMVNormal, }, geometry: { + primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, indices, draw: { __type: "DrawIndexed", indexCount: primitive.indices.length, firstIndex: 0 }, diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index b1c1f6f..ce2804b 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -14,7 +14,6 @@ const webgl = new WebGL(rc); // -- Init program const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, - primitive: { topology: "triangle-list" }, }; // -- Init buffers: vec2 Position, vec2 Texcoord @@ -70,6 +69,7 @@ loadImage("../../assets/img/Di-3d.png", function (image) pipeline: program, uniforms: { MVP: matrix, diffuse: { texture, sampler } }, geometry:{ + primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 6 }, } diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index 819b217..af019e3 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -20,7 +20,6 @@ const webgl = new WebGL(rc); const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: {}, - primitive: { topology: "triangle-list" }, }; // -- Init Buffer @@ -54,6 +53,7 @@ const rp: IRenderPass = { const ro: IRenderObject = { pipeline: program, geometry: { + primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 3 }, } diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index a1ba319..d3a3ae2 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -60,7 +60,6 @@ viewport[Corners.TOP_LEFT] = { const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, - primitive: { topology: "triangle-list" }, }; // -- Initialize buffer @@ -152,6 +151,7 @@ function render() pipeline: program, uniforms: { mvp: matrix }, geometry:{ + primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, } diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index 0ec211a..4622492 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -16,7 +16,6 @@ const webgl = new WebGL(rc); const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, - primitive: { topology: "triangle-list" }, }; // -- Initialize buffer @@ -96,6 +95,7 @@ function render() materialDiffuse1: { texture, sampler: samplerB }, }, geometry:{ + primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, } diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index 5c60efd..3c0c214 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -60,7 +60,6 @@ viewport[Corners.TOP_LEFT] = { const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, - primitive: { topology: "triangle-list" }, }; // -- Initialize buffer @@ -150,6 +149,7 @@ function render() pipeline: program, uniforms: { mvp: matrix }, geometry: { + primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, } diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index f9fe465..b1971e4 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -23,7 +23,6 @@ import { getShaderSource, loadImage } from "./utility"; }] }, depthStencil: {}, - primitive: { topology: "triangle-list", cullFace: "back" } }; // -- Init buffers @@ -210,6 +209,7 @@ import { getShaderSource, loadImage } from "./utility"; pipeline: program, uniforms: {}, geometry:{ + primitive: { topology: "triangle-list", cullFace: "back" }, vertices: vertexArray.vertices, indices: new Uint16Array(cubeVertexIndices), draw: { __type: "DrawIndexed", indexCount: 36 }, diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index 9081438..7d0485b 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -19,7 +19,6 @@ import { getShaderSource, loadImage } from "./utility"; const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: {}, - primitive: { cullFace: "back" }, }; // -- Init buffers @@ -201,6 +200,7 @@ import { getShaderSource, loadImage } from "./utility"; pipeline: program, uniforms: {}, geometry:{ + primitive: { cullFace: "back" }, vertices: vertexArray.vertices, indices: new Uint16Array(cubeVertexIndices), draw: { __type: "DrawIndexed", indexCount: 36 }, diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index 234d4f5..ad257fc 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -213,7 +213,6 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push({ pipeline: { ...program, - primitive: { topology: IDrawMode2Name[primitive.mode] } }, uniforms: { mvMatrix: localMV, @@ -222,6 +221,7 @@ import { getShaderSource, loadImage } from "./utility"; diffuse: { texture, sampler }, }, geometry:{ + primitive: { topology: IDrawMode2Name[primitive.mode] }, vertices: vertexArrayMaps[mid][i].vertices, indices: vertexArrayMaps[mid][i].indices, draw: { __type: "DrawIndexed", indexCount: primitive.indices.length } diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index 8e56291..db4b40a 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -123,7 +123,6 @@ import { getShaderSource } from "./utility"; } }] }, - primitive: { topology: "triangle-list" }, }; const programs: [IGLTransformFeedbackPipeline, IRenderPipeline] = [programTransform, programDraw]; @@ -144,6 +143,7 @@ import { getShaderSource } from "./utility"; pipeline: programs[PROGRAM_DRAW], uniforms: {}, geometry:{ + primitive: { topology: "triangle-list" }, draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: NUM_INSTANCES }, } }; diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index ee4e155..29a6b51 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -126,7 +126,6 @@ import { getShaderSource } from "./utility"; } }] }, - primitive: { topology: "point-list" }, }; return [transformFeedbackPipeline, program]; @@ -150,6 +149,7 @@ import { getShaderSource } from "./utility"; }, geometry:{ draw: { __type: "DrawVertex", vertexCount: NUM_PARTICLES }, + primitive: { topology: "point-list" }, } }; diff --git a/examples/src/test/fractalCube.ts b/examples/src/test/fractalCube.ts index d3c886e..280c103 100644 --- a/examples/src/test/fractalCube.ts +++ b/examples/src/test/fractalCube.ts @@ -28,7 +28,6 @@ async function main() const renderObject: IRenderObject = { pipeline: { - primitive: { topology: "triangle-list" }, vertex: { code: ` attribute vec4 aVertexPosition; @@ -62,7 +61,8 @@ async function main() ` }, depthStencil: { depthCompare: "less-equal" } }, - geometry:{ + geometry: { + primitive: { topology: "triangle-list" }, vertices: { aVertexPosition: { format: "float32x3", diff --git a/examples/src/webgl-examples/sample2.ts b/examples/src/webgl-examples/sample2.ts index 53d168c..52cb723 100644 --- a/examples/src/webgl-examples/sample2.ts +++ b/examples/src/webgl-examples/sample2.ts @@ -25,7 +25,6 @@ function main() }, renderObjects: [{ pipeline: { - primitive: { topology: "triangle-strip" }, vertex: { code: ` attribute vec4 aVertexPosition; @@ -43,6 +42,7 @@ function main() depthStencil: { depthCompare: "less-equal" } }, geometry: { + primitive: { topology: "triangle-strip" }, vertices: { aVertexPosition: { format: "float32x2", diff --git a/examples/src/webgl-examples/sample3.ts b/examples/src/webgl-examples/sample3.ts index 2cee077..6c94112 100644 --- a/examples/src/webgl-examples/sample3.ts +++ b/examples/src/webgl-examples/sample3.ts @@ -29,7 +29,6 @@ function main() }, renderObjects: [{ pipeline: { - primitive: { topology: "triangle-strip" }, vertex: { code: ` attribute vec4 aVertexPosition; @@ -55,7 +54,7 @@ function main() depthStencil: { depthCompare: "less-equal" } }, geometry: { - + primitive: { topology: "triangle-strip" }, vertices: { aVertexPosition: { format: "float32x2", diff --git a/examples/src/webgl-examples/sample4.ts b/examples/src/webgl-examples/sample4.ts index 190a57c..4255c46 100644 --- a/examples/src/webgl-examples/sample4.ts +++ b/examples/src/webgl-examples/sample4.ts @@ -17,7 +17,6 @@ function main() const renderObject: IRenderObject = { pipeline: { - primitive: { topology: "triangle-strip" }, vertex: { code: ` attribute vec4 aVertexPosition; @@ -43,6 +42,7 @@ function main() depthStencil: { depthCompare: "less-equal" } }, geometry:{ + primitive: { topology: "triangle-strip" }, vertices: { aVertexPosition: { format: "float32x2", diff --git a/examples/src/webgl-examples/sample5.ts b/examples/src/webgl-examples/sample5.ts index 8a8d134..f65b333 100644 --- a/examples/src/webgl-examples/sample5.ts +++ b/examples/src/webgl-examples/sample5.ts @@ -21,7 +21,6 @@ function main() const renderObject: IRenderObject = { pipeline: { - primitive: { topology: "triangle-list" }, vertex: { code: ` attribute vec4 aVertexPosition; @@ -47,6 +46,7 @@ function main() depthStencil: { depthCompare: "less-equal" } }, geometry: { + primitive: { topology: "triangle-list" }, vertices: { aVertexPosition: { format: "float32x3", diff --git a/examples/src/webgl-examples/sample6.ts b/examples/src/webgl-examples/sample6.ts index 8a9b2a5..3d8b2d2 100644 --- a/examples/src/webgl-examples/sample6.ts +++ b/examples/src/webgl-examples/sample6.ts @@ -23,7 +23,6 @@ async function main() const renderObject: IRenderObject = { pipeline: { - primitive: { topology: "triangle-list" }, vertex: { code: ` attribute vec4 aVertexPosition; @@ -51,6 +50,7 @@ async function main() depthStencil: { depthCompare: "less-equal" } }, geometry: { + primitive: { topology: "triangle-list" }, vertices: { aVertexPosition: { format: "float32x3", diff --git a/examples/src/webgl-examples/sample7.ts b/examples/src/webgl-examples/sample7.ts index ccb1027..88fb377 100644 --- a/examples/src/webgl-examples/sample7.ts +++ b/examples/src/webgl-examples/sample7.ts @@ -23,7 +23,6 @@ async function main() const renderObject: IRenderObject = { pipeline: { - primitive: { topology: "triangle-list" }, vertex: { code: ` attribute vec4 aVertexPosition; @@ -69,6 +68,7 @@ async function main() }, uniforms: { uSampler: texture }, geometry: { + primitive: { topology: "triangle-list" }, vertices: { aVertexPosition: { format: "float32x3", diff --git a/examples/src/webgl-examples/sample8.ts b/examples/src/webgl-examples/sample8.ts index f9cbd60..d19025a 100644 --- a/examples/src/webgl-examples/sample8.ts +++ b/examples/src/webgl-examples/sample8.ts @@ -27,7 +27,6 @@ function main() const renderObject: IRenderObject = { pipeline: { - primitive: { topology: "triangle-list" }, vertex: { code: ` attribute vec4 aVertexPosition; @@ -72,6 +71,7 @@ function main() depthStencil: { depthCompare: "less-equal" } }, geometry: { + primitive: { topology: "triangle-list" }, vertices: { aVertexPosition: { format: "float32x3", diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 5fc6d3d..82052a0 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -202,9 +202,6 @@ export class RunWebGL { const { viewport, scissorRect, pipeline, geometry, uniforms } = renderObject; - const topology = pipeline.primitive?.topology || "triangle-list"; - const drawMode = getIGLDrawMode(topology); - this.runViewPort(gl, attachmentSize, viewport); this.runScissor(gl, attachmentSize, scissorRect); @@ -213,10 +210,15 @@ export class RunWebGL this.runUniforms(gl, pipeline, uniforms); - const { vertices, indices, draw, } = geometry; + const { vertices, indices, draw, primitive } = geometry; this.runVertexArray(gl, pipeline, vertices, indices); + this.runPrimitiveState(gl, primitive); + + const topology = primitive?.topology || "triangle-list"; + const drawMode = getIGLDrawMode(topology); + if (draw.__type === 'DrawVertex') { this.runDrawVertex(gl, drawMode, draw); @@ -669,8 +671,6 @@ export class RunWebGL { this.runProgram(gl, renderPipeline); - this.runPrimitiveState(gl, renderPipeline?.primitive); - this.runDepthState(gl, renderPipeline.depthStencil); this.runStencilState(gl, renderPipeline.depthStencil); } -- Gitee From dffa844802b20a31b67afe6677995d36c8b94eaa Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 01:22:12 +0800 Subject: [PATCH 08/57] Geometry --- examples/src/WebGL2Samples/buffer_copy.ts | 4 ++-- examples/src/WebGL2Samples/buffer_uniform.ts | 4 ++-- examples/src/WebGL2Samples/draw_instanced.ts | 4 ++-- .../src/WebGL2Samples/draw_primitive_restart.ts | 4 ++-- examples/src/WebGL2Samples/draw_range_arrays.ts | 4 ++-- examples/src/WebGL2Samples/fbo_blit.ts | 6 +++--- examples/src/WebGL2Samples/fbo_multisample.ts | 4 ++-- .../src/WebGL2Samples/fbo_new_blend_equation.ts | 4 ++-- examples/src/WebGL2Samples/fbo_read_pixels.ts | 6 +++--- .../src/WebGL2Samples/fbo_rtt_depth_texture.ts | 6 +++--- examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 6 +++--- .../src/WebGL2Samples/fbo_rtt_texture_array.ts | 6 +++--- examples/src/WebGL2Samples/geo_vertex_format.ts | 4 ++-- examples/src/WebGL2Samples/glsl_centroid.ts | 4 ++-- .../glsl_flat_smooth_interpolators.ts | 6 +++--- .../src/WebGL2Samples/glsl_non_square_matrix.ts | 4 ++-- examples/src/WebGL2Samples/query_occlusion.ts | 4 ++-- examples/src/WebGL2Samples/sampler_filter.ts | 4 ++-- examples/src/WebGL2Samples/sampler_object.ts | 4 ++-- examples/src/WebGL2Samples/sampler_wrap.ts | 4 ++-- examples/src/WebGL2Samples/texture_2d_array.ts | 4 ++-- examples/src/WebGL2Samples/texture_3d.ts | 4 ++-- examples/src/WebGL2Samples/texture_derivative.ts | 4 ++-- examples/src/WebGL2Samples/texture_fetch.ts | 4 ++-- examples/src/WebGL2Samples/texture_format.ts | 4 ++-- examples/src/WebGL2Samples/texture_grad.ts | 4 ++-- examples/src/WebGL2Samples/texture_immutable.ts | 4 ++-- examples/src/WebGL2Samples/texture_integer.ts | 4 ++-- examples/src/WebGL2Samples/texture_lod.ts | 4 ++-- examples/src/WebGL2Samples/texture_offset.ts | 4 ++-- examples/src/WebGL2Samples/texture_pixel_store.ts | 4 ++-- examples/src/WebGL2Samples/texture_srgb.ts | 4 ++-- examples/src/WebGL2Samples/texture_vertex.ts | 4 ++-- .../WebGL2Samples/transform_feedback_instanced.ts | 4 ++-- .../transform_feedback_interleaved.ts | 4 ++-- .../WebGL2Samples/transform_feedback_separated.ts | 4 ++-- .../transform_feedback_separated_2.ts | 4 ++-- examples/src/regl-examples/batch.ts | 4 ++-- src/RunWebGL.ts | 10 +++++----- src/data/IGLPrimitiveState.ts | 14 -------------- src/data/IGLTransformFeedbackPass.ts | 4 ++-- 41 files changed, 89 insertions(+), 103 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index f6af26a..88b310d 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -1,4 +1,4 @@ -import { ICopyBufferToBuffer, IRenderPass, IRenderPipeline, IVertexAttributes } from "@feng3d/render-api"; +import { ICopyBufferToBuffer, IRenderPass, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -41,7 +41,7 @@ import { getShaderSource } from "./utility"; }; // -- Init Vertex Array - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { pos: { data: vertexPosBufferDst, format: "float32x2" }, } diff --git a/examples/src/WebGL2Samples/buffer_uniform.ts b/examples/src/WebGL2Samples/buffer_uniform.ts index 883743d..ec50d77 100644 --- a/examples/src/WebGL2Samples/buffer_uniform.ts +++ b/examples/src/WebGL2Samples/buffer_uniform.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISubmit, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPipeline, ISubmit, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -73,7 +73,7 @@ import { getShaderSource } from "./utility"; }; // -- Init Vertex Array - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: vertices, format: "float32x3", arrayStride: 40, offset: 0 }, normal: { data: vertices, format: "float32x3", arrayStride: 40, offset: 12 }, diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index 1078a0b..dab4a92 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPipeline, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -23,7 +23,7 @@ const program: IRenderPipeline = { fragment: { code: getShaderSource("fs"), targets: [{ blend: {} }] } }; -const vertexArray: { vertices?: IVertexAttributes } = { +const vertexArray: { vertices?: VertexAttributes } = { vertices: { pos: { data: vertexPosBuffer, format: "float32x2" }, color: { data: vertexColorBuffer, format: "float32x3", stepMode: "instance" }, diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index 065fc7d..38b57d7 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPipeline, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -36,7 +36,7 @@ const indices = new Uint16Array([ 0, 1, 2, MAX_UNSIGNED_SHORT, 2, 3, 1 ]); -const vertexArray: { vertices?: IVertexAttributes } = { +const vertexArray: { vertices?: VertexAttributes } = { vertices: { pos: { data: vertexPosBuffer, format: "float32x2" }, }, diff --git a/examples/src/WebGL2Samples/draw_range_arrays.ts b/examples/src/WebGL2Samples/draw_range_arrays.ts index 490a3db..d18c6fa 100644 --- a/examples/src/WebGL2Samples/draw_range_arrays.ts +++ b/examples/src/WebGL2Samples/draw_range_arrays.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -36,7 +36,7 @@ const pipeline: IRenderPipeline = { } }; -const vertexArray: { vertices?: IVertexAttributes } = { +const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: vertexPosBuffer, format: "float32x2" }, } diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 4bc4a5c..4702784 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, ITextureView, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, ITextureView, VertexAttributes } from "@feng3d/render-api"; import { IGLBlitFramebuffer, IGLBlitFramebufferItem, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -38,7 +38,7 @@ const vertexTexBuffer = new Float32Array([ 0.0, 1.0 ]); -const vertices: IVertexAttributes = { +const vertices: VertexAttributes = { position: { data: vertexPosBuffer, format: "float32x2" }, texcoord: { data: vertexTexBuffer, format: "float32x2" }, }; @@ -74,7 +74,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => // 此处 Renderbuffer 直接使用 IGLTextureView 替代。 const colorRenderbuffer: ITextureView = { texture: { format: "rgba8unorm", size: [FRAMEBUFFER_SIZE.x, FRAMEBUFFER_SIZE.y] } }; - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices, }; diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index 9cb48ca..d02a343 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -81,7 +81,7 @@ const framebuffer: IRenderPassDescriptor = { }; // -- Init VertexArray -const vertexArrays: { vertices?: IVertexAttributes }[] = [ +const vertexArrays: { vertices?: VertexAttributes }[] = [ { vertices: { position: { data, format: "float32x2" } } }, diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index 1c46e46..9b1df36 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes, IViewport } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes, IViewport } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -84,7 +84,7 @@ const texcoords = new Float32Array([ ]); // -- Initilize vertex array -const vertexArray: { vertices?: IVertexAttributes } = { +const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, textureCoordinates: { data: texcoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index e955480..eea7fe6 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -82,13 +82,13 @@ const texcoords = new Float32Array([ // -- Initialize vertex array -const multipleOutputVertexArray: { vertices?: IVertexAttributes } = { +const multipleOutputVertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, } }; -const layerVertexArray: { vertices?: IVertexAttributes } = { +const layerVertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, textureCoordinates: { data: texcoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index 8f0e110..18cce82 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -57,13 +57,13 @@ const quadTexcoords = new Float32Array([ // -- Initialize vertex array -const triVertexArray: { vertices?: IVertexAttributes } = { +const triVertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: triPositions, format: "float32x3" }, } }; -const quadVertexArray: { vertices?: IVertexAttributes } = { +const quadVertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: quadPositions, format: "float32x2" }, textureCoordinates: { data: quadTexcoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index c0a41b3..e3f87d3 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -58,13 +58,13 @@ const quadTexcoords = new Float32Array([ // -- Initialize vertex array -const triVertexArray: { vertices?: IVertexAttributes } = { +const triVertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: triPositions, format: "float32x3" } } }; -const quadVertexArray: { vertices?: IVertexAttributes } = { +const quadVertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: quadPositions, format: "float32x2" }, textureCoordinates: { data: quadTexcoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index 9bee6bd..7d6ed9b 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -82,13 +82,13 @@ const texcoords = new Float32Array([ // -- Initialize vertex array -const multipleOutputVertexArray: { vertices?: IVertexAttributes } = { +const multipleOutputVertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, } }; -const layerVertexArray: { vertices?: IVertexAttributes } = { +const layerVertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, textureCoordinates: { data: texcoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index f7bf0c6..bcc808c 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { HalfFloat } from "./third-party/HalfFloatUtility"; @@ -149,7 +149,7 @@ import { getShaderSource, loadImage } from "./utility"; // -- Init VertexArray - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { a_position: { data: positions, format: "float32x3" }, a_normal: { data: normals, format: "float16x4", arrayStride: 6 }, // 由于不支持类型 "float16x3"，则需要设置 arrayStride 为6，表示每次间隔3个半浮点数。 diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index 6320bf9..4da2106 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -1,4 +1,4 @@ -import { IPassEncoder, IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes, IViewport } from "@feng3d/render-api"; +import { IPassEncoder, IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes, IViewport } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -128,7 +128,7 @@ const framebuffers: IRenderPassDescriptor[] = [ ]; // -- Init VertexArray -const vertexArrays: { vertices?: IVertexAttributes }[] = [ +const vertexArrays: { vertices?: VertexAttributes }[] = [ { vertices: { position: { data: positions, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index 0ccf1cb..e10b98d 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderPass, IRenderPassObject, IRenderPipeline, IVertexAttributes, IViewport } from "@feng3d/render-api"; +import { IIndicesDataTypes, IRenderPass, IRenderPassObject, IRenderPipeline, VertexAttributes, IViewport } from "@feng3d/render-api"; import { getIVertexFormat, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; @@ -62,7 +62,7 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) // -- Initialize vertex array const vertexArrayMaps: { - [key: string]: { vertexArray: { vertices?: IVertexAttributes }, indices: IIndicesDataTypes }[] + [key: string]: { vertexArray: { vertices?: VertexAttributes }, indices: IIndicesDataTypes }[] } = {}; // var in loop @@ -71,7 +71,7 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) }; let primitive: Primitive; // { matrix: mat4, attributes: { [key: string]: { size: number, type: number, stride: number, offset: number } }, vertexBuffer, indices }; - let vertexArray: { vertices?: IVertexAttributes }; + let vertexArray: { vertices?: VertexAttributes }; let i: number; let len: number; diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index ce2804b..fad4a2f 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -36,7 +36,7 @@ const texCoords = new Float32Array([ ]); // -- Init VertexArray -const vertexArray: { vertices?: IVertexAttributes } = { +const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, texcoord: { data: texCoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index af019e3..b7aa54f 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLOcclusionQuery, WebGL } from "@feng3d/webgl"; import { watcher } from "@feng3d/watcher"; @@ -34,7 +34,7 @@ const vertices = new Float32Array([ ]); // -- Init Vertex Array -const vertexArray: { vertices?: IVertexAttributes } = { +const vertexArray: { vertices?: VertexAttributes } = { vertices: { pos: { data: vertices, format: "float32x3", arrayStride: 0, offset: 0 }, } diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index d3a3ae2..10c6646 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -84,7 +84,7 @@ const texcoords = new Float32Array([ // -- Initialize vertex array -const vertexArray: { vertices?: IVertexAttributes } = { +const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, textureCoordinates: { data: texcoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index 4622492..519a495 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -40,7 +40,7 @@ const texcoords = new Float32Array([ // -- Initialize vertex array -const vertexArray: { vertices?: IVertexAttributes } = { +const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, textureCoordinates: { data: texcoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index 3c0c214..3109792 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -84,7 +84,7 @@ const texcoords = new Float32Array([ // -- Initilize vertex array -const vertexArray: { vertices?: IVertexAttributes } = { +const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, textureCoordinates: { data: texcoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_2d_array.ts b/examples/src/WebGL2Samples/texture_2d_array.ts index a30c749..cda135d 100644 --- a/examples/src/WebGL2Samples/texture_2d_array.ts +++ b/examples/src/WebGL2Samples/texture_2d_array.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -38,7 +38,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); // -- Init VertexArray - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, texcoord: { data: texCoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_3d.ts b/examples/src/WebGL2Samples/texture_3d.ts index b6857a4..a87b838 100644 --- a/examples/src/WebGL2Samples/texture_3d.ts +++ b/examples/src/WebGL2Samples/texture_3d.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; import { getShaderSource } from "./utility"; @@ -118,7 +118,7 @@ import { getShaderSource } from "./utility"; // -- Initilize vertex array - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, in_texcoord: { data: texCoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index b1971e4..1db8306 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -115,7 +115,7 @@ import { getShaderSource, loadImage } from "./utility"; ]; // -- Init VertexArray - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x3" }, texcoord: { data: texCoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_fetch.ts b/examples/src/WebGL2Samples/texture_fetch.ts index e955063..db1f332 100644 --- a/examples/src/WebGL2Samples/texture_fetch.ts +++ b/examples/src/WebGL2Samples/texture_fetch.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -37,7 +37,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); // -- Init VertexArray - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, texcoord: { data: texCoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index fd0adc6..e1cd03c 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, ITextureFormat, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, ITextureFormat, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -73,7 +73,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); // -- Init VertexArray - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, texcoord: { data: texCoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index 7d0485b..580d66d 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -110,7 +110,7 @@ import { getShaderSource, loadImage } from "./utility"; ]; // -- Init VertexArray - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x3" }, texcoord: { data: texCoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index 600fe4b..905cc51 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; @@ -62,7 +62,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); // -- Init VertexArray - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, in_texcoord: { data: texCoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_integer.ts b/examples/src/WebGL2Samples/texture_integer.ts index a6c081a..5c9285f 100644 --- a/examples/src/WebGL2Samples/texture_integer.ts +++ b/examples/src/WebGL2Samples/texture_integer.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -39,7 +39,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); // -- Init VertexArray - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, texcoord: { data: texCoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index 8076d11..880e8cd 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -111,7 +111,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); // -- Initialize vertex array - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, textureCoordinates: { data: texcoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index b92d736..e491697 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -62,7 +62,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); // -- Init VertexArray - const vertexArray: { vertices?: IVertexAttributes } = { + const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: positions, format: "float32x2" }, texcoord: { data: texCoords, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index ec52d79..e13ba07 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIGLBuffer, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -40,7 +40,7 @@ import { getShaderSource, loadImage } from "./utility"; const vertexTexBuffer: IVertexDataTypes = texCoords; // -- Init VertexArray - const vertexArray: { vertices?: IVertexAttributes, indices?: IIndicesDataTypes } = { + const vertexArray: { vertices?: VertexAttributes, indices?: IIndicesDataTypes } = { vertices: { position: { data: vertexPosBuffer, format: "float32x2" }, texcoord: { data: vertexTexBuffer, format: "float32x2" }, diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index ffb659c..8f53034 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIGLBuffer, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -44,7 +44,7 @@ import { getShaderSource, loadImage } from "./utility"; // -- Initialize vertex array - const vertices: IVertexAttributes = { + const vertices: VertexAttributes = { position: { data: vertexPosBuffer, format: "float32x2" }, textureCoordinates: { data: vertexTexBuffer, format: "float32x2" }, }; diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index ad257fc..ea1c61c 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IPrimitiveTopology, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, IVertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IPrimitiveTopology, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIVertexFormat, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -45,7 +45,7 @@ import { getShaderSource, loadImage } from "./utility"; depthStencil: { depthCompare: "less" }, }; - const vertexArrayMaps: { [key: string]: { vertices?: IVertexAttributes, indices: IIndicesDataTypes }[] } = {}; + const vertexArrayMaps: { [key: string]: { vertices?: VertexAttributes, indices: IIndicesDataTypes }[] } = {}; // var in loop let mesh; diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index db4b40a..2f3a6fb 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderObject, IRenderPipeline, ISubmit, IVertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IRenderObject, IRenderPipeline, ISubmit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -65,7 +65,7 @@ import { getShaderSource } from "./utility"; const COLOR_LOCATION = 3; const NUM_LOCATIONS = 4; - const vertexArrays: { vertices?: IVertexAttributes, indices?: IIndicesDataTypes }[][] = []; + const vertexArrays: { vertices?: VertexAttributes, indices?: IIndicesDataTypes }[][] = []; // Transform feedback objects track output buffer state const transformFeedbacks: IGLTransformFeedback[] = []; diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index 027a9d6..b91b4e2 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderPipeline, IVertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IRenderPipeline, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIGLVertexBuffer, IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -53,7 +53,7 @@ import { getShaderSource } from "./utility"; ]; // -- Init Vertex Array - const vertexArrays: { vertices?: IVertexAttributes, indices?: IIndicesDataTypes }[] = [ + const vertexArrays: { vertices?: VertexAttributes, indices?: IIndicesDataTypes }[] = [ { vertices: { position: { data: buffers[PROGRAM_TRANSFORM], format: "float32x4" }, diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index 242f110..133d85d 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderPipeline, ISubmit, IVertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IRenderPipeline, ISubmit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -63,7 +63,7 @@ import { getShaderSource } from "./utility"; ]; // -- Init Transform Vertex Array - const vertexArrays: { vertices?: IVertexAttributes, indices?: IIndicesDataTypes }[] = [ + const vertexArrays: { vertices?: VertexAttributes, indices?: IIndicesDataTypes }[] = [ { vertices: { position: { data: buffers[BufferType.VERTEX], format: "float32x4" }, diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 29a6b51..156e5bb 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderObject, IRenderPipeline, ISubmit, IVertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IRenderObject, IRenderPipeline, ISubmit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -58,7 +58,7 @@ import { getShaderSource } from "./utility"; const NUM_LOCATIONS = 5; // -- Init Vertex Arrays and Buffers - const vertexArrays: { vertices?: IVertexAttributes, indices?: IIndicesDataTypes }[][] = []; + const vertexArrays: { vertices?: VertexAttributes, indices?: IIndicesDataTypes }[][] = []; // Transform feedback objects track output buffer state const transformFeedbacks: IGLTransformFeedback[] = []; diff --git a/examples/src/regl-examples/batch.ts b/examples/src/regl-examples/batch.ts index 7693b5d..0eea44f 100644 --- a/examples/src/regl-examples/batch.ts +++ b/examples/src/regl-examples/batch.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPipeline, ISubmit, IVertexAttributes } from "@feng3d/render-api"; +import { IRenderObject, IRenderPipeline, ISubmit, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; const canvas = document.createElement("canvas"); @@ -41,7 +41,7 @@ const pipeline: IRenderPipeline = { depthStencil: { depthWriteEnabled: false }, }; -const vertexArray: { vertices?: IVertexAttributes } = { +const vertexArray: { vertices?: VertexAttributes } = { vertices: { position: { data: new Float32Array([ diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 82052a0..8489dff 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { getBlendConstantColor, IBlendComponent, IBufferBinding, IColorTargetState, ICommandEncoder, ICopyBufferToBuffer, ICopyTextureToTexture, ICullFace, IDepthStencilState, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IPrimitiveState, IRenderObject, IRenderPass, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, IScissorRect, ISubmit, ITextureView, IUniforms, IVertexAttribute, IVertexAttributes, IViewport, TypedArray, UnReadonly } from "@feng3d/render-api"; +import { getBlendConstantColor, IBlendComponent, IBufferBinding, IColorTargetState, ICommandEncoder, ICopyBufferToBuffer, ICopyTextureToTexture, ICullFace, IDepthStencilState, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderObject, IRenderPass, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, IScissorRect, ISubmit, ITextureView, IUniforms, IViewport, PrimitiveState, TypedArray, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -38,7 +38,7 @@ declare global { interface WebGLRenderingContext { - _vertexArrays: ChainMap<[IRenderPipeline, IVertexAttributes, IIndicesDataTypes], WebGLVertexArrayObject>; + _vertexArrays: ChainMap<[IRenderPipeline, VertexAttributes, IIndicesDataTypes], WebGLVertexArrayObject>; } } @@ -544,7 +544,7 @@ export class RunWebGL /** * 执行设置或者上传渲染对象的顶点以及索引数据。 */ - private runVertexArray(gl: WebGLRenderingContext, pipeline: IRenderPipeline, vertices: IVertexAttributes, indices: IIndicesDataTypes) + private runVertexArray(gl: WebGLRenderingContext, pipeline: IRenderPipeline, vertices: VertexAttributes, indices: IIndicesDataTypes) { if (!vertices && !indices) return; @@ -595,7 +595,7 @@ export class RunWebGL gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, buffer); } - private runVertexAttribute(gl: WebGLRenderingContext, location: number, attribute: IVertexAttribute) + private runVertexAttribute(gl: WebGLRenderingContext, location: number, attribute: VertexAttribute) { const { stepMode, format } = attribute; let { arrayStride, offset } = attribute; @@ -748,7 +748,7 @@ export class RunWebGL } } - private runPrimitiveState(gl: WebGLRenderingContext, primitive?: IPrimitiveState) + private runPrimitiveState(gl: WebGLRenderingContext, primitive?: PrimitiveState) { const cullFace: ICullFace = primitive?.cullFace || "none"; const frontFace: IFrontFace = primitive?.frontFace || "ccw"; diff --git a/src/data/IGLPrimitiveState.ts b/src/data/IGLPrimitiveState.ts index 6cac5c1..a994d97 100644 --- a/src/data/IGLPrimitiveState.ts +++ b/src/data/IGLPrimitiveState.ts @@ -20,18 +20,4 @@ declare module "@feng3d/render-api" "FRONT_AND_BACK": "FRONT_AND_BACK"; } - export interface IPrimitiveState - { - /** - * * `FRONT_AND_BACK` 剔除正面与背面，仅在WebGL中生效！ - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/cullFace - */ - readonly cullFace?: ICullFace; - - /** - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/frontFace - */ - readonly frontFace?: IFrontFace; - } } diff --git a/src/data/IGLTransformFeedbackPass.ts b/src/data/IGLTransformFeedbackPass.ts index d6427d6..ef1d9d9 100644 --- a/src/data/IGLTransformFeedbackPass.ts +++ b/src/data/IGLTransformFeedbackPass.ts @@ -1,4 +1,4 @@ -import { IDrawVertex, IUniforms, IVertexAttributes, IVertexState } from "@feng3d/render-api"; +import { IDrawVertex, IUniforms, VertexAttributes, IVertexState } from "@feng3d/render-api"; import { IGLTransformFeedback } from "./IGLTransformFeedback"; declare module "@feng3d/render-api" @@ -32,7 +32,7 @@ export interface IGLTransformFeedbackObject /** * 顶点属性数据映射。 */ - vertices: IVertexAttributes; + vertices: VertexAttributes; /** * 根据顶点数据绘制图元。 -- Gitee From 17795a58f5092105b62e2bd6121fdc5ec64e531b Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 01:30:14 +0800 Subject: [PATCH 09/57] BlendComponent BlendState Buffer --- src/RunWebGL.ts | 6 +++--- src/WebGL.ts | 4 ++-- src/caches/getGLBuffer.ts | 8 ++++---- src/data/IGLBuffer.ts | 10 +++++----- src/runs/getIGLBuffer.ts | 6 +++--- 5 files changed, 17 insertions(+), 17 deletions(-) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 8489dff..7651a36 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { getBlendConstantColor, IBlendComponent, IBufferBinding, IColorTargetState, ICommandEncoder, ICopyBufferToBuffer, ICopyTextureToTexture, ICullFace, IDepthStencilState, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderObject, IRenderPass, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, IScissorRect, ISubmit, ITextureView, IUniforms, IViewport, PrimitiveState, TypedArray, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; +import { getBlendConstantColor, BlendComponent, IBufferBinding, IColorTargetState, ICommandEncoder, ICopyBufferToBuffer, ICopyTextureToTexture, ICullFace, IDepthStencilState, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderObject, IRenderPass, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, IScissorRect, ISubmit, ITextureView, IUniforms, IViewport, PrimitiveState, TypedArray, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -788,8 +788,8 @@ export class RunWebGL const blend = targets?.[0]?.blend; if (blend) { - const color: IBlendComponent = blend.color; - const alpha: IBlendComponent = blend.alpha; + const color: BlendComponent = blend.color; + const alpha: BlendComponent = blend.alpha; const colorOperation: IGLBlendEquation = getIGLBlendEquation(color?.operation) || "FUNC_ADD"; const colorSrcFactor: IGLBlendFactor = getIGLBlendFactor(color?.srcFactor, color?.operation) || "SRC_ALPHA"; diff --git a/src/WebGL.ts b/src/WebGL.ts index 00cceef..1a28bf4 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -1,4 +1,4 @@ -import { IBuffer, IRenderPassDescriptor, IRenderPipeline, ISampler, ISubmit, ITexture } from "@feng3d/render-api"; +import { Buffer, IRenderPassDescriptor, IRenderPipeline, ISampler, ISubmit, ITexture } from "@feng3d/render-api"; import { RunWebGL } from "./RunWebGL"; import { deleteBuffer } from "./caches/getGLBuffer"; @@ -58,7 +58,7 @@ export class WebGL deleteRenderbuffer(this._gl, renderbuffer); } - deleteBuffer(buffer: IBuffer) + deleteBuffer(buffer: Buffer) { deleteBuffer(this._gl, buffer); } diff --git a/src/caches/getGLBuffer.ts b/src/caches/getGLBuffer.ts index 1cfd4da..a38070f 100644 --- a/src/caches/getGLBuffer.ts +++ b/src/caches/getGLBuffer.ts @@ -1,11 +1,11 @@ -import { IBuffer } from "@feng3d/render-api"; +import { Buffer } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; declare global { interface WebGLRenderingContext { - _buffers: Map + _buffers: Map } interface WebGLBuffer @@ -17,7 +17,7 @@ declare global } } -export function getGLBuffer(gl: WebGLRenderingContext, buffer: IBuffer) +export function getGLBuffer(gl: WebGLRenderingContext, buffer: Buffer) { let webGLBuffer = gl._buffers.get(buffer); if (webGLBuffer) return webGLBuffer; @@ -95,7 +95,7 @@ export function getGLBuffer(gl: WebGLRenderingContext, buffer: IBuffer) return webGLBuffer; } -export function deleteBuffer(gl: WebGLRenderingContext, buffer: IBuffer) +export function deleteBuffer(gl: WebGLRenderingContext, buffer: Buffer) { const webGLBuffer = gl._buffers.get(buffer); if (webGLBuffer) diff --git a/src/data/IGLBuffer.ts b/src/data/IGLBuffer.ts index 46a9336..f006c61 100644 --- a/src/data/IGLBuffer.ts +++ b/src/data/IGLBuffer.ts @@ -1,4 +1,4 @@ -import { IBuffer, IIndicesDataTypes, IVertexDataTypes } from "@feng3d/render-api"; +import { Buffer, IIndicesDataTypes, IVertexDataTypes } from "@feng3d/render-api"; declare module "@feng3d/render-api" { @@ -7,7 +7,7 @@ declare module "@feng3d/render-api" * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bufferData */ - export interface IBuffer + export interface Buffer { target: IGLBufferTarget; @@ -20,7 +20,7 @@ declare module "@feng3d/render-api" } } -export interface IGLVertexBuffer extends IBuffer +export interface IGLVertexBuffer extends Buffer { target: "ARRAY_BUFFER"; @@ -38,7 +38,7 @@ export interface IGLVertexBuffer extends IBuffer * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bindBuffer * */ -export interface IGLIndexBuffer extends IBuffer +export interface IGLIndexBuffer extends Buffer { target: "ELEMENT_ARRAY_BUFFER"; @@ -48,7 +48,7 @@ export interface IGLIndexBuffer extends IBuffer data: IIndicesDataTypes; } -export interface IGLUniformBuffer extends IBuffer +export interface IGLUniformBuffer extends Buffer { target: "UNIFORM_BUFFER"; } diff --git a/src/runs/getIGLBuffer.ts b/src/runs/getIGLBuffer.ts index 8ac9694..544ebae 100644 --- a/src/runs/getIGLBuffer.ts +++ b/src/runs/getIGLBuffer.ts @@ -1,11 +1,11 @@ -import { IBuffer, IIndicesDataTypes, IVertexDataTypes, TypedArray } from "@feng3d/render-api"; +import { Buffer, IIndicesDataTypes, IVertexDataTypes, TypedArray } from "@feng3d/render-api"; import { IGLBufferTarget, IGLBufferUsage, IGLIndexBuffer, IGLUniformBuffer, IGLVertexBuffer } from "../data/IGLBuffer"; -export function getIGLBuffer(data: TypedArray, target?: IGLBufferTarget, usage: IGLBufferUsage = "STATIC_DRAW"): IBuffer +export function getIGLBuffer(data: TypedArray, target?: IGLBufferTarget, usage: IGLBufferUsage = "STATIC_DRAW"): Buffer { if (data[_IGLBuffer]) return data[_IGLBuffer]; - const buffer: IBuffer = { + const buffer: Buffer = { size: Math.ceil(data.byteLength / 4) * 4, target, usage, -- Gitee From 74a55f58e1b56427855c751df41524d6f0cfaee5 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 01:38:11 +0800 Subject: [PATCH 10/57] CanvasContext CanvasTexture ColorTargetState CommandEncoder --- src/RunWebGL.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 7651a36..96101ce 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { getBlendConstantColor, BlendComponent, IBufferBinding, IColorTargetState, ICommandEncoder, ICopyBufferToBuffer, ICopyTextureToTexture, ICullFace, IDepthStencilState, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderObject, IRenderPass, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, IScissorRect, ISubmit, ITextureView, IUniforms, IViewport, PrimitiveState, TypedArray, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; +import { getBlendConstantColor, BlendComponent, IBufferBinding, ColorTargetState, CommandEncoder, ICopyBufferToBuffer, ICopyTextureToTexture, ICullFace, IDepthStencilState, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderObject, IRenderPass, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, IScissorRect, ISubmit, ITextureView, IUniforms, IViewport, PrimitiveState, TypedArray, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -72,7 +72,7 @@ export class RunWebGL gl[_GL_Submit_Times] = ~~gl[_GL_Submit_Times] + 1; } - protected runCommandEncoder(gl: WebGLRenderingContext, commandEncoder: ICommandEncoder) + protected runCommandEncoder(gl: WebGLRenderingContext, commandEncoder: CommandEncoder) { commandEncoder.passEncoders.forEach((passEncoder) => { @@ -778,7 +778,7 @@ export class RunWebGL this.runColorTargetStates(gl, pipeline.fragment.targets); } - private runColorTargetStates(gl: WebGLRenderingContext, targets?: readonly IColorTargetState[]) + private runColorTargetStates(gl: WebGLRenderingContext, targets?: readonly ColorTargetState[]) { // const colorMask = targets?.[0]?.writeMask || [true, true, true, true]; -- Gitee From 6fbf844abf01bcc4de4b74aea3fadd0f641a9d58 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 01:51:47 +0800 Subject: [PATCH 11/57] CopyBufferToBuffer CopyTextureToTexture DepthStencilState FragmentState --- examples/src/WebGL2Samples/buffer_copy.ts | 4 ++-- src/RunWebGL.ts | 10 +++++----- src/caches/getIGLBlitFramebuffer.ts | 6 +++--- src/data/IGLCommandEncoder.ts | 2 +- src/runs/runDepthState.ts | 2 +- src/runs/runStencilState.ts | 2 +- 6 files changed, 13 insertions(+), 13 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index 88b310d..083d1c8 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -1,4 +1,4 @@ -import { ICopyBufferToBuffer, IRenderPass, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { CopyBufferToBuffer, IRenderPass, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -33,7 +33,7 @@ import { getShaderSource } from "./utility"; const vertexPosBufferDst = new Float32Array(vertices.length); - const cb: ICopyBufferToBuffer = { + const cb: CopyBufferToBuffer = { __type: "CopyBufferToBuffer", source: vertexPosBufferSrc, destination: getIGLBuffer(vertexPosBufferDst, "ARRAY_BUFFER"), diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 96101ce..c4f382a 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { getBlendConstantColor, BlendComponent, IBufferBinding, ColorTargetState, CommandEncoder, ICopyBufferToBuffer, ICopyTextureToTexture, ICullFace, IDepthStencilState, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderObject, IRenderPass, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, IScissorRect, ISubmit, ITextureView, IUniforms, IViewport, PrimitiveState, TypedArray, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; +import { BlendComponent, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, getBlendConstantColor, IBufferBinding, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderObject, IRenderPass, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, IScissorRect, ISubmit, ITextureView, IUniforms, IViewport, PrimitiveState, TypedArray, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -675,7 +675,7 @@ export class RunWebGL this.runStencilState(gl, renderPipeline.depthStencil); } - private runStencilState(gl: WebGLRenderingContext, depthStencil?: IDepthStencilState) + private runStencilState(gl: WebGLRenderingContext, depthStencil?: DepthStencilState) { const { stencilFront, stencilBack } = { ...depthStencil }; // @@ -716,7 +716,7 @@ export class RunWebGL } } - private runDepthState(gl: WebGLRenderingContext, depthStencil?: IDepthStencilState) + private runDepthState(gl: WebGLRenderingContext, depthStencil?: DepthStencilState) { if (depthStencil && (depthStencil.depthWriteEnabled || depthStencil.depthCompare !== "always")) { @@ -880,7 +880,7 @@ export class RunWebGL } } - private runCopyTextureToTexture(gl: WebGLRenderingContext, copyTextureToTexture: ICopyTextureToTexture) + private runCopyTextureToTexture(gl: WebGLRenderingContext, copyTextureToTexture: CopyTextureToTexture) { const blitFramebuffer = getIGLBlitFramebuffer(copyTextureToTexture); this.runBlitFramebuffer(gl, blitFramebuffer); @@ -916,7 +916,7 @@ export class RunWebGL } } - private runCopyBuffer(gl: WebGLRenderingContext, copyBuffer: ICopyBufferToBuffer) + private runCopyBuffer(gl: WebGLRenderingContext, copyBuffer: CopyBufferToBuffer) { if (gl instanceof WebGL2RenderingContext) { diff --git a/src/caches/getIGLBlitFramebuffer.ts b/src/caches/getIGLBlitFramebuffer.ts index 42755ab..075b6b7 100644 --- a/src/caches/getIGLBlitFramebuffer.ts +++ b/src/caches/getIGLBlitFramebuffer.ts @@ -1,4 +1,4 @@ -import { ICopyTextureToTexture, IImageCopyTexture, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, ITextureView } from "@feng3d/render-api"; +import { CopyTextureToTexture, ImageCopyTexture, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, ITextureView } from "@feng3d/render-api"; import { IGLBlitFramebuffer, IGLBlitFramebufferItem } from "../data/IGLBlitFramebuffer"; /** @@ -7,7 +7,7 @@ import { IGLBlitFramebuffer, IGLBlitFramebufferItem } from "../data/IGLBlitFrame * @param copyTextureToTexture GL纹理之间拷贝。 * @returns */ -export function getIGLBlitFramebuffer(copyTextureToTexture: ICopyTextureToTexture) +export function getIGLBlitFramebuffer(copyTextureToTexture: CopyTextureToTexture) { const { source, destination, copySize } = copyTextureToTexture; @@ -67,7 +67,7 @@ export function getIGLBlitFramebuffer(copyTextureToTexture: ICopyTextureToTextur return blitFramebuffer; } -function getIGLTextureView(source: IImageCopyTexture) +function getIGLTextureView(source: ImageCopyTexture) { if (!source.texture) return undefined; diff --git a/src/data/IGLCommandEncoder.ts b/src/data/IGLCommandEncoder.ts index 32bff98..9f8c576 100644 --- a/src/data/IGLCommandEncoder.ts +++ b/src/data/IGLCommandEncoder.ts @@ -14,7 +14,7 @@ declare module "@feng3d/render-api" * {@link GPUCommandEncoder.copyTextureToTexture} * {@link GPUImageCopyTexture} */ - export interface IImageCopyTexture + export interface ImageCopyTexture { /** * diff --git a/src/runs/runDepthState.ts b/src/runs/runDepthState.ts index b4d5ca0..fcd686b 100644 --- a/src/runs/runDepthState.ts +++ b/src/runs/runDepthState.ts @@ -1,4 +1,4 @@ -import { ICompareFunction, IDepthStencilState } from "@feng3d/render-api"; +import { ICompareFunction, DepthStencilState } from "@feng3d/render-api"; import { IGLCompareFunction } from "../data/IGLDepthStencilState"; export function getIGLCompareFunction(depthCompare: ICompareFunction) diff --git a/src/runs/runStencilState.ts b/src/runs/runStencilState.ts index d4a114b..e27ab19 100644 --- a/src/runs/runStencilState.ts +++ b/src/runs/runStencilState.ts @@ -1,4 +1,4 @@ -import { ICompareFunction, IDepthStencilState, IStencilOperation } from "@feng3d/render-api"; +import { ICompareFunction, IStencilOperation } from "@feng3d/render-api"; import { IGLStencilFunc, IGLStencilOp } from "../data/IGLDepthStencilState"; export function getIGLStencilFunc(compare: ICompareFunction) -- Gitee From 9ea62e8dcfde8a2c1b6a8118c519f50c41f8a23d Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 02:31:43 +0800 Subject: [PATCH 12/57] RenderObject --- examples/src/WebGL2Samples/buffer_copy.ts | 6 ++-- examples/src/WebGL2Samples/buffer_uniform.ts | 10 +++--- .../src/WebGL2Samples/draw_image_space.ts | 10 +++--- examples/src/WebGL2Samples/draw_instanced.ts | 6 ++-- .../src/WebGL2Samples/draw_instanced_ubo.ts | 6 ++-- .../WebGL2Samples/draw_primitive_restart.ts | 6 ++-- .../src/WebGL2Samples/draw_range_arrays.ts | 8 ++--- examples/src/WebGL2Samples/fbo_blit.ts | 26 +++++++-------- examples/src/WebGL2Samples/fbo_multisample.ts | 14 ++++---- .../WebGL2Samples/fbo_new_blend_equation.ts | 12 +++---- examples/src/WebGL2Samples/fbo_read_pixels.ts | 18 +++++------ .../WebGL2Samples/fbo_rtt_depth_texture.ts | 16 +++++----- .../src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 20 ++++++------ .../WebGL2Samples/fbo_rtt_texture_array.ts | 18 +++++------ .../src/WebGL2Samples/geo_vertex_format.ts | 12 +++---- examples/src/WebGL2Samples/glsl_centroid.ts | 16 +++++----- .../glsl_flat_smooth_interpolators.ts | 6 ++-- .../WebGL2Samples/glsl_non_square_matrix.ts | 10 +++--- examples/src/WebGL2Samples/query_occlusion.ts | 8 ++--- examples/src/WebGL2Samples/sampler_filter.ts | 12 +++---- examples/src/WebGL2Samples/sampler_object.ts | 12 +++---- examples/src/WebGL2Samples/sampler_wrap.ts | 12 +++---- .../src/WebGL2Samples/texture_2d_array.ts | 12 +++---- examples/src/WebGL2Samples/texture_3d.ts | 14 ++++---- .../src/WebGL2Samples/texture_derivative.ts | 12 +++---- examples/src/WebGL2Samples/texture_fetch.ts | 10 +++--- examples/src/WebGL2Samples/texture_format.ts | 12 +++---- examples/src/WebGL2Samples/texture_grad.ts | 12 +++---- .../src/WebGL2Samples/texture_immutable.ts | 18 +++++------ examples/src/WebGL2Samples/texture_integer.ts | 12 +++---- examples/src/WebGL2Samples/texture_lod.ts | 12 +++---- examples/src/WebGL2Samples/texture_offset.ts | 12 +++---- .../src/WebGL2Samples/texture_pixel_store.ts | 10 +++--- examples/src/WebGL2Samples/texture_srgb.ts | 10 +++--- examples/src/WebGL2Samples/texture_vertex.ts | 10 +++--- .../transform_feedback_instanced.ts | 10 +++--- .../transform_feedback_interleaved.ts | 4 +-- .../transform_feedback_separated.ts | 6 ++-- .../transform_feedback_separated_2.ts | 10 +++--- examples/src/regl-examples/basic.ts | 4 +-- examples/src/regl-examples/batch.ts | 10 +++--- examples/src/regl-examples/bunny.ts | 6 ++-- examples/src/regl-examples/camera.ts | 4 +-- examples/src/regl-examples/cloth.ts | 6 ++-- examples/src/regl-examples/cube.ts | 6 ++-- examples/src/regl-examples/util/camera.ts | 6 ++-- examples/src/test/RenderObjectChanges.ts | 6 ++-- examples/src/test/fractalCube.ts | 10 +++--- examples/src/webgl-examples/sample1.ts | 4 +-- examples/src/webgl-examples/sample2.ts | 4 +-- examples/src/webgl-examples/sample3.ts | 4 +-- examples/src/webgl-examples/sample4.ts | 6 ++-- examples/src/webgl-examples/sample5.ts | 6 ++-- examples/src/webgl-examples/sample6.ts | 10 +++--- examples/src/webgl-examples/sample7.ts | 10 +++--- examples/src/webgl-examples/sample8.ts | 12 +++---- src/RunWebGL.ts | 32 +++++++++---------- src/WebGL.ts | 12 +++---- src/caches/getGLFramebuffer.ts | 10 +++--- src/caches/getGLProgram.ts | 12 +++---- src/caches/getGLRenderOcclusionQuery.ts | 6 ++-- src/caches/getGLSampler.ts | 8 ++--- src/caches/getGLTexture.ts | 8 ++--- src/caches/getIGLBlitFramebuffer.ts | 12 +++---- ...tIGLRenderPassDescriptorWithMultisample.ts | 12 +++---- src/data/IGLBlitFramebuffer.ts | 6 ++-- src/data/IGLOcclusionQuery.ts | 4 +-- src/data/IGLReadPixels.ts | 4 +-- src/data/IGLRenderPass.ts | 4 +-- src/data/IGLSamplerTexture.ts | 6 ++-- src/data/IGLTexture.ts | 4 +-- src/data/IGLTransformFeedbackPass.ts | 4 +-- src/utils/getGLRenderPassAttachmentSize.ts | 4 +-- 73 files changed, 356 insertions(+), 356 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index 083d1c8..59daf20 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -1,4 +1,4 @@ -import { CopyBufferToBuffer, IRenderPass, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { CopyBufferToBuffer, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -16,7 +16,7 @@ import { getShaderSource } from "./utility"; const webgl = new WebGL(rc); // -- Init Program - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -48,7 +48,7 @@ import { getShaderSource } from "./utility"; }; // -- Render - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ pipeline: program, diff --git a/examples/src/WebGL2Samples/buffer_uniform.ts b/examples/src/WebGL2Samples/buffer_uniform.ts index ec50d77..1fad68f 100644 --- a/examples/src/WebGL2Samples/buffer_uniform.ts +++ b/examples/src/WebGL2Samples/buffer_uniform.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISubmit, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Submit, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -16,7 +16,7 @@ import { getShaderSource } from "./utility"; const webgl = new WebGL(rc); // -- Init Program - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -81,7 +81,7 @@ import { getShaderSource } from "./utility"; }, }; - const ro: IRenderObject = { + const ro: RenderObject = { pipeline: program, uniforms: { PerDraw: transforms, @@ -95,12 +95,12 @@ import { getShaderSource } from "./utility"; }, }; - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [ro], }; - const submit: ISubmit = { commandEncoders: [{ passEncoders: [rp] }] }; + const submit: Submit = { commandEncoders: [{ passEncoders: [rp] }] }; let uTime = 0; function render() diff --git a/examples/src/WebGL2Samples/draw_image_space.ts b/examples/src/WebGL2Samples/draw_image_space.ts index 92f30b5..f899953 100644 --- a/examples/src/WebGL2Samples/draw_image_space.ts +++ b/examples/src/WebGL2Samples/draw_image_space.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPipeline, ISampler, ITexture } from "@feng3d/render-api"; +import { RenderPipeline, Sampler, Texture, RenderObject } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -13,17 +13,17 @@ const webgl = new WebGL(renderingContext); loadImage("../../assets/img/Di-3d.png", (img) => { - const texture: ITexture = { + const texture: Texture = { size: [img.width, img.height], sources: [{ image: img, flipY: false }], format: "rgba8unorm", }; - const sampler: ISampler = { + const sampler: Sampler = { minFilter: "linear", magFilter: "linear", }; - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, @@ -33,7 +33,7 @@ loadImage("../../assets/img/Di-3d.png", (img) => } }; - const renderObject: IRenderObject = { + const renderObject: RenderObject = { uniforms: { diffuse: { texture, sampler }, u_imageSize: [canvas.width / 2, canvas.height / 2], diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index dab4a92..a565d69 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -18,7 +18,7 @@ const vertexColorBuffer = new Float32Array([ 1.0, 0.5, 0.0, 0.0, 0.5, 1.0]); -const program: IRenderPipeline = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs"), targets: [{ blend: {} }] } }; @@ -30,7 +30,7 @@ const vertexArray: { vertices?: VertexAttributes } = { }, }; -const renderObject: IRenderObject = { +const renderObject: RenderObject = { uniforms: {}, geometry:{ primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/draw_instanced_ubo.ts b/examples/src/WebGL2Samples/draw_instanced_ubo.ts index 9de490d..4b92506 100644 --- a/examples/src/WebGL2Samples/draw_instanced_ubo.ts +++ b/examples/src/WebGL2Samples/draw_instanced_ubo.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPipeline } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -12,7 +12,7 @@ const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program -const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; // -- Init Buffer const vertices = new Float32Array([ @@ -46,7 +46,7 @@ const materials = { }; // -- Render -const rp: IRenderPass = { +const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0, 0, 0, 1], loadOp: "clear" }] }, renderObjects: [{ pipeline: program, diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index 38b57d7..1b6213d 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -22,7 +22,7 @@ const vertexPosBuffer = new Float32Array([ 1.0, 1.0, ]); -const program: IRenderPipeline = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, @@ -42,7 +42,7 @@ const vertexArray: { vertices?: VertexAttributes } = { }, }; -const renderObject: IRenderObject = { +const renderObject: RenderObject = { uniforms: {}, geometry: { primitive: { topology: "triangle-strip" }, diff --git a/examples/src/WebGL2Samples/draw_range_arrays.ts b/examples/src/WebGL2Samples/draw_range_arrays.ts index d18c6fa..0851438 100644 --- a/examples/src/WebGL2Samples/draw_range_arrays.ts +++ b/examples/src/WebGL2Samples/draw_range_arrays.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -26,7 +26,7 @@ const vertexPosBuffer = new Float32Array([ -0.5, -0.5, ]); -const pipeline: IRenderPipeline = { +const pipeline: RenderPipeline = { vertex: { code: getShaderSource("vs") }, @@ -43,7 +43,7 @@ const vertexArray: { vertices?: VertexAttributes } = { }; const vertexCount = 12; -const renderObject: IRenderObject = { +const renderObject: RenderObject = { pipeline, geometry: { primitive: { topology: "triangle-strip" }, @@ -52,7 +52,7 @@ const renderObject: IRenderObject = { } }; -const rp: IRenderPass = { +const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 4702784..3abec52 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, ITextureView, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, TextureView, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLBlitFramebuffer, IGLBlitFramebufferItem, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ document.body.appendChild(canvas); const renderingContext: IGLCanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); -const program: IRenderPipeline = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, @@ -50,35 +50,35 @@ loadImage("../../assets/img/Di-3d.png", (image) => y: image.height }; - const textureDiffuse: ITexture = { + const textureDiffuse: Texture = { size: [image.width, image.height], format: "rgba8unorm", sources: [{ image, flipY: true }], }; - const samplerDiffuse: ISampler = { + const samplerDiffuse: Sampler = { minFilter: "linear", magFilter: "linear", }; - const textureColorBuffer: ITexture = { + const textureColorBuffer: Texture = { format: "rgba8unorm", size: [FRAMEBUFFER_SIZE.x, FRAMEBUFFER_SIZE.y], }; - const samplerColorBuffer: ISampler = { + const samplerColorBuffer: Sampler = { minFilter: "linear", magFilter: "linear", }; // 此处 Renderbuffer 直接使用 IGLTextureView 替代。 - const colorRenderbuffer: ITextureView = { texture: { format: "rgba8unorm", size: [FRAMEBUFFER_SIZE.x, FRAMEBUFFER_SIZE.y] } }; + const colorRenderbuffer: TextureView = { texture: { format: "rgba8unorm", size: [FRAMEBUFFER_SIZE.x, FRAMEBUFFER_SIZE.y] } }; const vertexArray: { vertices?: VertexAttributes } = { vertices, }; - const renderObject: IRenderObject = { + const renderObject: RenderObject = { viewport: { x: 0, y: 0, width: FRAMEBUFFER_SIZE.x, height: FRAMEBUFFER_SIZE.y }, pipeline: program, uniforms: { @@ -98,7 +98,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => }; // Render FBO - const fboRenderPass: IRenderPass = { + const fboRenderPass: RenderPass = { descriptor: { colorAttachments: [{ view: colorRenderbuffer, @@ -108,7 +108,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => renderObjects: [renderObject], }; - const framebufferResolve: IRenderPassDescriptor = { + const framebufferResolve: RenderPassDescriptor = { colorAttachments: [{ view: { texture: textureColorBuffer, baseMipLevel: 0 }, clearValue: [0.7, 0.0, 0.0, 1.0] @@ -116,7 +116,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => }; // - const renderPassResolve: IRenderPass = { + const renderPassResolve: RenderPass = { descriptor: framebufferResolve, }; @@ -150,7 +150,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => blitFramebuffers, }; - const renderObject2: IRenderObject = { + const renderObject2: RenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height }, uniforms: { MVP: new Float32Array([ @@ -168,7 +168,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => pipeline: program, }; - const renderPass2: IRenderPass = { + const renderPass2: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index d02a343..f7b7bc1 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -19,7 +19,7 @@ const PROGRAM = { MAX: 2 }; -const programs: IRenderPipeline[] = [ +const programs: RenderPipeline[] = [ { vertex: { code: getShaderSource("vs-render") }, fragment: { code: getShaderSource("fs-render") }, @@ -68,14 +68,14 @@ const FRAMEBUFFER_SIZE = { x: canvas.width, y: canvas.height }; -const texture: ITexture = { +const texture: Texture = { format: "rgba8unorm", size: [FRAMEBUFFER_SIZE.x, FRAMEBUFFER_SIZE.y] }; -const sampler: ISampler = { minFilter: "nearest", magFilter: "nearest" }; +const sampler: Sampler = { minFilter: "nearest", magFilter: "nearest" }; // -- Init Frame Buffers -const framebuffer: IRenderPassDescriptor = { +const framebuffer: RenderPassDescriptor = { colorAttachments: [{ view: { texture, baseMipLevel: 0 }, clearValue: [0.0, 0.0, 0.0, 1.0] }], sampleCount: 4 // 多重采样 }; @@ -98,7 +98,7 @@ const IDENTITY = mat4.create(); // -- Render // Pass 1 -const renderPass1: IRenderPass = { +const renderPass1: RenderPass = { descriptor: framebuffer, renderObjects: [{ pipeline: programs[PROGRAM.TEXTURE], @@ -118,7 +118,7 @@ vec3.set(scaleVector3, 8.0, 8.0, 8.0); const mvp = mat4.create(); mat4.scale(mvp, IDENTITY, scaleVector3); -const renderPass2: IRenderPass = { +const renderPass2: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [ { diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index 9b1df36..26f2d5d 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes, IViewport } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, IViewport, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -59,7 +59,7 @@ viewport[Corners.TOP_LEFT] = { // -- Initialize program -const program: IRenderPipeline = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs"), targets: [{ blend: {} }] }, }; @@ -92,12 +92,12 @@ const vertexArray: { vertices?: VertexAttributes } = { }; // -- Load texture then render -const sampler: ISampler = { +const sampler: Sampler = { minFilter: "linear", magFilter: "linear" }; const imageUrl = "../../assets/img/Di-3d.png"; -let texture: ITexture; +let texture: Texture; loadImage(imageUrl, function (image) { texture = { @@ -119,7 +119,7 @@ function render() 0.0, 0.0, 0.0, 1.0 ]); - const renderObject: IRenderObject = { + const renderObject: RenderObject = { pipeline: program, uniforms: { mvp: matrix, diffuse: { texture, sampler } }, geometry:{ @@ -129,7 +129,7 @@ function render() }; const renderObjects: IRenderPassObject[] = []; - const renderPass: IRenderPass = { + const renderPass: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.5, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects, }; diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index eea7fe6..e65b8cd 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -51,12 +51,12 @@ viewport[Textures.BLUE] = { // -- Initialize program // Multiple out shaders -const multipleOutputProgram: IRenderPipeline = { +const multipleOutputProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-multiple-output") }, fragment: { code: getShaderSource("fs-multiple-output") }, }; // Layer shaders -const layerProgram: IRenderPipeline = { +const layerProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-layer") }, fragment: { code: getShaderSource("fs-layer") }, }; @@ -100,16 +100,16 @@ const layerVertexArray: { vertices?: VertexAttributes } = { const w = 16; const h = 16; -const texture: ITexture = { +const texture: Texture = { dimension: "2d-array", size: [w, h, 3], format: "rgba8unorm", }; -const sampler: ISampler = { lodMinClamp: 0, lodMaxClamp: 0, minFilter: "nearest", magFilter: "nearest" }; +const sampler: Sampler = { lodMinClamp: 0, lodMaxClamp: 0, minFilter: "nearest", magFilter: "nearest" }; // -- Initialize frame buffer -const frameBuffer: IRenderPassDescriptor = { +const frameBuffer: RenderPassDescriptor = { colorAttachments: [ { view: { texture, baseMipLevel: 0, baseArrayLayer: Textures.RED } }, { view: { texture, baseMipLevel: 0, baseArrayLayer: Textures.GREEN } }, @@ -126,7 +126,7 @@ const matrix = new Float32Array([ 0.0, 0.0, 1.0, 0.0, 0.0, 0.0, 0.0, 1.0 ]); -const rp1: IRenderPass = { +const rp1: RenderPass = { descriptor: frameBuffer, renderObjects: [ { @@ -143,12 +143,12 @@ const rp1: IRenderPass = { const renderObjects: IRenderPassObject[] = []; // Pass 2 -const rp: IRenderPass = { +const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects }; -const ro: IRenderObject = { +const ro: RenderObject = { pipeline: layerProgram, uniforms: { mvp: matrix, diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index 18cce82..c77f447 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -19,13 +19,13 @@ const windowSize = { // -- Initialize program // Depth shaders -const depthProgram: IRenderPipeline = { +const depthProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-depth") }, fragment: { code: getShaderSource("fs-depth") }, depthStencil: {}, }; // Draw shaders -const drawProgram: IRenderPipeline = { +const drawProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw") }, }; @@ -74,15 +74,15 @@ const quadVertexArray: { vertices?: VertexAttributes } = { // the proper texture format combination can be found here // https://www.khronos.org/registry/OpenGL-Refpages/es3.0/html/glTexImage2D.xhtml -const depthTexture: ITexture = { +const depthTexture: Texture = { size: [windowSize.x, windowSize.y], format: "depth16unorm", }; -const depthSampler: ISampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "nearest", magFilter: "nearest" }; +const depthSampler: Sampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "nearest", magFilter: "nearest" }; // -- Initialize frame buffer -const frameBuffer: IRenderPassDescriptor = { +const frameBuffer: RenderPassDescriptor = { colorAttachments: [], depthStencilAttachment: { view: { texture: depthTexture, baseMipLevel: 0 }, depthLoadOp: "clear" }, }; @@ -90,7 +90,7 @@ const frameBuffer: IRenderPassDescriptor = { // -- Render // Pass 1: Depth -const renderPass: IRenderPass = { +const renderPass: RenderPass = { descriptor: frameBuffer, renderObjects: [{ pipeline: depthProgram, @@ -104,7 +104,7 @@ const renderPass: IRenderPass = { }; // Pass 2: Draw -const rp2: IRenderPass = { +const rp2: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }], }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index e3f87d3..f109cc8 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassDescriptor, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -19,13 +19,13 @@ const windowSize = { // -- Initialize program // Draw buffer shaders -const drawBufferProgram: IRenderPipeline = { +const drawBufferProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-draw-buffer") }, fragment: { code: getShaderSource("fs-draw-buffer") }, }; // Draw shaders -const drawProgram: IRenderPipeline = { +const drawProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw") }, }; @@ -73,21 +73,21 @@ const quadVertexArray: { vertices?: VertexAttributes } = { // -- Initialize texture targets -const color1Texture: ITexture = { +const color1Texture: Texture = { format: "rgba8unorm", size: [windowSize.x, windowSize.y], }; -const color1Sampler: ISampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "nearest", magFilter: "nearest" }; +const color1Sampler: Sampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "nearest", magFilter: "nearest" }; -const color2Texture: ITexture = { +const color2Texture: Texture = { format: "rgba8unorm", size: [windowSize.x, windowSize.y], }; -const color2Sampler: ISampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "nearest", magFilter: "nearest" }; +const color2Sampler: Sampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "nearest", magFilter: "nearest" }; // -- Initialize frame buffer -const frameBuffer: IRenderPassDescriptor = { +const frameBuffer: RenderPassDescriptor = { colorAttachments: [ { view: { texture: color1Texture, baseMipLevel: 0 } }, { view: { texture: color2Texture, baseMipLevel: 0 } }, @@ -96,7 +96,7 @@ const frameBuffer: IRenderPassDescriptor = { // -- Render -const renderPass: IRenderPass = { +const renderPass: RenderPass = { descriptor: frameBuffer, renderObjects: [{ pipeline: drawBufferProgram, @@ -109,7 +109,7 @@ const renderPass: IRenderPass = { }; // Pass 2: Draw to screen -const renderPass2: IRenderPass = { +const renderPass2: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ pipeline: drawProgram, diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index 7d6ed9b..5982259 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -51,12 +51,12 @@ viewport[Textures.BLUE] = { // -- Initialize program // Multiple out shaders -const multipleOutputProgram: IRenderPipeline = { +const multipleOutputProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-multiple-output") }, fragment: { code: getShaderSource("fs-multiple-output") }, }; // Layer shaders -const layerProgram: IRenderPipeline = { +const layerProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-layer") }, fragment: { code: getShaderSource("fs-layer") }, }; @@ -100,16 +100,16 @@ const layerVertexArray: { vertices?: VertexAttributes } = { const w = 16; const h = 16; -const texture: ITexture = { +const texture: Texture = { dimension: "2d-array", format: "rgba8unorm", size: [w, h, 3], }; -const sampler: ISampler = { minFilter: "nearest", magFilter: "nearest", lodMinClamp: 0, lodMaxClamp: 0 }; +const sampler: Sampler = { minFilter: "nearest", magFilter: "nearest", lodMinClamp: 0, lodMaxClamp: 0 }; // -- Initialize frame buffer -const frameBuffer: IRenderPassDescriptor = { +const frameBuffer: RenderPassDescriptor = { colorAttachments: [ { view: { texture, baseMipLevel: 0, baseArrayLayer: Textures.RED } }, { view: { texture, baseMipLevel: 0, baseArrayLayer: Textures.GREEN } }, @@ -128,7 +128,7 @@ const matrix = new Float32Array([ 0.0, 0.0, 0.0, 1.0 ]); -const renderPass1: IRenderPass = { +const renderPass1: RenderPass = { descriptor: frameBuffer, renderObjects: [ { @@ -145,14 +145,14 @@ const renderPass1: IRenderPass = { // Pass 2 const renderObjects: IRenderPassObject[] = []; -const renderPass: IRenderPass = { +const renderPass: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }], }, renderObjects, }; -const renderObject: IRenderObject = { +const renderObject: RenderObject = { pipeline: layerProgram, uniforms: { mvp: matrix, diffuse: { texture, sampler } }, geometry: { diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index bcc808c..053872a 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { HalfFloat } from "./third-party/HalfFloatUtility"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: {}, }; @@ -160,8 +160,8 @@ import { getShaderSource, loadImage } from "./utility"; // -- Init Texture const imageUrl = "../../assets/img/Di-3d.png"; - let texture: ITexture; - let sampler: ISampler; + let texture: Texture; + let sampler: Sampler; loadImage(imageUrl, function (image) { // -- Init 2D Texture @@ -200,7 +200,7 @@ import { getShaderSource, loadImage } from "./utility"; const lightPosition = [0.0, 0.0, 5.0]; - const ro: IRenderObject = { + const ro: RenderObject = { pipeline: program, uniforms: { u_model: modelMatrix, @@ -216,7 +216,7 @@ import { getShaderSource, loadImage } from "./utility"; } }; - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [ro], }; diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index 4da2106..8e5e859 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -1,4 +1,4 @@ -import { IPassEncoder, IRenderObject, IRenderPass, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes, IViewport } from "@feng3d/render-api"; +import { IPassEncoder, RenderPass, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, Texture, IViewport, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -48,7 +48,7 @@ const PROGRAM = { MAX: 3 }; -const programs: IRenderPipeline[] = [ +const programs: RenderPipeline[] = [ { vertex: { code: getShaderSource("vs-render") }, fragment: { code: getShaderSource("fs-render") }, }, @@ -101,8 +101,8 @@ const FRAMEBUFFER_SIZE = { x: canvas.width, y: canvas.height }; -const textures: ITexture[] = []; -const samplers: ISampler[] = []; +const textures: Texture[] = []; +const samplers: Sampler[] = []; for (let i = 0; i < VIEWPORTS.MAX; ++i) { @@ -122,7 +122,7 @@ const FRAMEBUFFER = { COLORBUFFER_CENTROID: 3 }; -const framebuffers: IRenderPassDescriptor[] = [ +const framebuffers: RenderPassDescriptor[] = [ { colorAttachments: [{ view: { texture: textures[0], baseMipLevel: 0 }, clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }], sampleCount: 4 }, { colorAttachments: [{ view: { texture: textures[1], baseMipLevel: 0 }, clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }], sampleCount: 4 }, ]; @@ -157,7 +157,7 @@ const IDENTITY = mat4.create(); for (let i = 0; i < VIEWPORTS.MAX; ++i) { // render buffers - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: framebuffers[i], renderObjects: [{ pipeline: programs[i], @@ -174,10 +174,10 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) const renderObjects: IRenderPassObject[] = []; // Pass 2 -const rp2: IRenderPass = { +const rp2: RenderPass = { renderObjects, }; -const ro: IRenderObject = { +const ro: RenderObject = { pipeline: programs[PROGRAM.SPLASH], geometry: { primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index e10b98d..2c44252 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderPass, IRenderPassObject, IRenderPipeline, VertexAttributes, IViewport } from "@feng3d/render-api"; +import { IIndicesDataTypes, RenderPass, IRenderPassObject, RenderPipeline, VertexAttributes, IViewport } from "@feng3d/render-api"; import { getIVertexFormat, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; @@ -42,7 +42,7 @@ viewport[VIEWPORTS.RIGHT] = { }; // -- Initialize program -const programs: IRenderPipeline[] = [ +const programs: RenderPipeline[] = [ { vertex: { code: getShaderSource("vs-flat") }, fragment: { code: getShaderSource("fs-flat") }, depthStencil: { depthCompare: "less-equal" }, @@ -136,7 +136,7 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) (function render() { const renderObjects: IRenderPassObject[] = []; - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }], depthStencilAttachment: { depthLoadOp: "clear" } diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index fad4a2f..f4ab69d 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -12,7 +12,7 @@ const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program -const program: IRenderPipeline = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -46,14 +46,14 @@ const vertexArray: { vertices?: VertexAttributes } = { loadImage("../../assets/img/Di-3d.png", function (image) { // -- Init Texture - const texture: ITexture = { + const texture: Texture = { size: [image.width, image.height], format: "rgba8unorm", sources: [{ image, flipY: false, }] }; - const sampler: ISampler = { minFilter: "nearest", magFilter: "nearest" }; + const sampler: Sampler = { minFilter: "nearest", magFilter: "nearest" }; // -- Render const matrix = new Float32Array([ @@ -63,7 +63,7 @@ loadImage("../../assets/img/Di-3d.png", function (image) 0.2, -0.2, 0.0 //translation ]); - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ pipeline: program, diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index b7aa54f..ad75967 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLOcclusionQuery, WebGL } from "@feng3d/webgl"; import { watcher } from "@feng3d/watcher"; @@ -17,7 +17,7 @@ const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init Program -const program: IRenderPipeline = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: {}, }; @@ -42,7 +42,7 @@ const vertexArray: { vertices?: VertexAttributes } = { const renderObjects: IRenderPassObject[] = []; // -- Render -const rp: IRenderPass = { +const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }], depthStencilAttachment: { depthLoadOp: "clear" }, @@ -50,7 +50,7 @@ const rp: IRenderPass = { renderObjects, }; -const ro: IRenderObject = { +const ro: RenderObject = { pipeline: program, geometry: { primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index 10c6646..87eccc6 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -58,7 +58,7 @@ viewport[Corners.TOP_LEFT] = { // -- Initialize program -const program: IRenderPipeline = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -93,7 +93,7 @@ const vertexArray: { vertices?: VertexAttributes } = { // -- Initialize samplers -const samplers: ISampler[] = new Array(Corners.MAX); +const samplers: Sampler[] = new Array(Corners.MAX); for (let i = 0; i < Corners.MAX; ++i) { samplers[i] = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", addressModeW: "clamp-to-edge" }; @@ -118,7 +118,7 @@ samplers[Corners.BOTTOM_LEFT].mipmapFilter = "linear"; // -- Load texture then render const imageUrl = "../../assets/img/Di-3d.png"; -let texture: ITexture; +let texture: Texture; loadImage(imageUrl, function (image) { texture = { @@ -142,12 +142,12 @@ function render() ]); const renderObjects: IRenderPassObject[] = []; - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects }; - const ro: IRenderObject = { + const ro: RenderObject = { pipeline: program, uniforms: { mvp: matrix }, geometry:{ diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index 519a495..25c9d51 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -14,7 +14,7 @@ const webgl = new WebGL(rc); // -- Initialize program -const program: IRenderPipeline = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -49,12 +49,12 @@ const vertexArray: { vertices?: VertexAttributes } = { // -- Initialize samplers -const samplerA: ISampler = { +const samplerA: Sampler = { minFilter: "nearest", magFilter: "nearest", mipmapFilter: "nearest", addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", addressModeW: "clamp-to-edge", lodMinClamp: -1000.0, lodMaxClamp: 1000.0, }; -const samplerB: ISampler = { +const samplerB: Sampler = { minFilter: "linear", magFilter: "linear", mipmapFilter: "linear", addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", addressModeW: "clamp-to-edge", lodMinClamp: -1000.0, lodMaxClamp: 1000.0, @@ -63,7 +63,7 @@ const samplerB: ISampler = { // -- Load texture then render const imageUrl = "../../assets/img/Di-3d.png"; -let texture: ITexture; +let texture: Texture; loadImage(imageUrl, function (image) { texture = { @@ -85,7 +85,7 @@ function render() 0.0, 0.0, 0.0, 1.0 ]); - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ pipeline: program, diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index 3109792..a51f037 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -58,7 +58,7 @@ viewport[Corners.TOP_LEFT] = { // -- Initialize program -const program: IRenderPipeline = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -93,7 +93,7 @@ const vertexArray: { vertices?: VertexAttributes } = { // -- Initialize samplers -const samplers: ISampler[] = new Array(Corners.MAX); +const samplers: Sampler[] = new Array(Corners.MAX); for (let i = 0; i < Corners.MAX; ++i) { @@ -117,7 +117,7 @@ samplers[Corners.BOTTOM_LEFT].addressModeV = "clamp-to-edge"; // -- Load texture then render const imageUrl = "../../assets/img/Di-3d.png"; -let texture: ITexture; +let texture: Texture; loadImage(imageUrl, function (image) { texture = { @@ -133,7 +133,7 @@ function render() { const renderObjects: IRenderPassObject[] = []; // Clear color buffer - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects, }; @@ -145,7 +145,7 @@ function render() 0.0, 0.0, 0.0, 1.0 ]); - const ro: IRenderObject = { + const ro: RenderObject = { pipeline: program, uniforms: { mvp: matrix }, geometry: { diff --git a/examples/src/WebGL2Samples/texture_2d_array.ts b/examples/src/WebGL2Samples/texture_2d_array.ts index cda135d..f686649 100644 --- a/examples/src/WebGL2Samples/texture_2d_array.ts +++ b/examples/src/WebGL2Samples/texture_2d_array.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -14,7 +14,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -45,8 +45,8 @@ import { getShaderSource, loadImage } from "./utility"; } }; - let texture: ITexture; - let sampler: ISampler; + let texture: Texture; + let sampler: Sampler; loadImage("../../assets/img/di-animation-array.jpg", function (image) { const NUM_IMAGES = 3; @@ -82,7 +82,7 @@ import { getShaderSource, loadImage } from "./utility"; 0.0, 0.0, 0.0, 1.0 ]); - const ro: IRenderObject = { + const ro: RenderObject = { pipeline: program, uniforms: { MVP: matrix, @@ -94,7 +94,7 @@ import { getShaderSource, loadImage } from "./utility"; } }; - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [1.0, 1.0, 1.0, 1.0], loadOp: "clear" }] }, renderObjects: [ro], }; diff --git a/examples/src/WebGL2Samples/texture_3d.ts b/examples/src/WebGL2Samples/texture_3d.ts index a87b838..df0e1a7 100644 --- a/examples/src/WebGL2Samples/texture_3d.ts +++ b/examples/src/WebGL2Samples/texture_3d.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; import { getShaderSource } from "./utility"; @@ -79,14 +79,14 @@ import { getShaderSource } from "./utility"; } } - const texture: ITexture = { + const texture: Texture = { size: [SIZE, SIZE, SIZE], dimension: "3d", format: "r8unorm", generateMipmap: true, sources: [{ __type: "TextureDataSource", mipLevel: 0, size: [SIZE, SIZE, SIZE], data }], }; - const sampler: ISampler = { + const sampler: Sampler = { lodMinClamp: 0, lodMaxClamp: Math.log2(SIZE), minFilter: "linear", @@ -95,7 +95,7 @@ import { getShaderSource } from "./utility"; }; // -- Initialize program - const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; // -- Initialize buffer const positions = new Float32Array([ @@ -157,7 +157,7 @@ import { getShaderSource } from "./utility"; ]; } - const ro: IRenderObject = { + const ro: RenderObject = { pipeline: program, uniforms: { diffuse: { texture, sampler }, @@ -168,7 +168,7 @@ import { getShaderSource } from "./utility"; } }; - const renderPassObjects: IRenderObject[] = []; + const renderPassObjects: RenderObject[] = []; for (let i = 0; i < Corners.MAX; ++i) { renderPassObjects.push({ @@ -177,7 +177,7 @@ import { getShaderSource } from "./utility"; }); } - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: renderPassObjects, }; diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index 1db8306..eea4100 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs"), targets: [{ @@ -125,8 +125,8 @@ import { getShaderSource, loadImage } from "./utility"; // -- Init Texture const imageUrl = "../../assets/img/Di-3d.png"; - let texture: ITexture; - let sampler: ISampler; + let texture: Texture; + let sampler: Sampler; loadImage(imageUrl, function (image) { // -- Init 2D Texture @@ -205,7 +205,7 @@ import { getShaderSource, loadImage } from "./utility"; lastMouseY = newY; }; - const ro: IRenderObject = { + const ro: RenderObject = { pipeline: program, uniforms: {}, geometry:{ @@ -216,7 +216,7 @@ import { getShaderSource, loadImage } from "./utility"; } }; - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [ro] }; diff --git a/examples/src/WebGL2Samples/texture_fetch.ts b/examples/src/WebGL2Samples/texture_fetch.ts index db1f332..09cde77 100644 --- a/examples/src/WebGL2Samples/texture_fetch.ts +++ b/examples/src/WebGL2Samples/texture_fetch.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -15,7 +15,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; // -- Init buffers: vec2 Position, vec2 Texcoord const positions = new Float32Array([ @@ -47,14 +47,14 @@ import { getShaderSource, loadImage } from "./utility"; loadImage("../../assets/img/Di-3d.png", function (image) { // -- Init Texture - const texture: ITexture = { + const texture: Texture = { size: [image.width, image.height], format: "rgba8unorm", sources: [{ mipLevel: 0, image, flipY: false, }], }; - const sampler: ISampler = { + const sampler: Sampler = { minFilter: "nearest", magFilter: "nearest", }; @@ -68,7 +68,7 @@ import { getShaderSource, loadImage } from "./utility"; 0.0, 0.0, 0.0, 1.0 ]); - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [ { diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index e1cd03c..41603f5 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, ITextureFormat, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, ITextureFormat, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -49,9 +49,9 @@ import { getShaderSource, loadImage } from "./utility"; } // -- Init program - const programUint: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-uint") } }; + const programUint: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-uint") } }; - const programNormalized: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-normalized") } }; + const programNormalized: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-normalized") } }; // -- Init buffers: vec2 Position, vec2 Texcoord const positions = new Float32Array([ @@ -135,8 +135,8 @@ import { getShaderSource, loadImage } from "./utility"; // -- Init Texture - const textures: ITexture[] = new Array(TextureTypes.MAX); - const samplers: ISampler[] = new Array(TextureTypes.MAX); + const textures: Texture[] = new Array(TextureTypes.MAX); + const samplers: Sampler[] = new Array(TextureTypes.MAX); let i = 0; for (i = 0; i < TextureTypes.MAX; ++i) { @@ -164,7 +164,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); const renderObjects: IRenderPassObject[] = []; - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects }; diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index 580d66d..1cea9b6 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: {}, }; @@ -120,8 +120,8 @@ import { getShaderSource, loadImage } from "./utility"; // -- Init Texture const imageUrl = "../../assets/img/Di-3d.png"; - let texture: ITexture; - let sampler: ISampler; + let texture: Texture; + let sampler: Sampler; loadImage(imageUrl, function (image) { // -- Init 2D Texture @@ -196,7 +196,7 @@ import { getShaderSource, loadImage } from "./utility"; lastMouseY = newY; }; - const ro: IRenderObject = { + const ro: RenderObject = { pipeline: program, uniforms: {}, geometry:{ @@ -207,7 +207,7 @@ import { getShaderSource, loadImage } from "./utility"; } }; - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [ro], }; diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index 905cc51..717d637 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; @@ -38,9 +38,9 @@ import { getShaderSource, loadImage } from "./utility"; }; // -- Init program - const program: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; - const program3D: IRenderPipeline = { vertex: { code: getShaderSource("vs-3d") }, fragment: { code: getShaderSource("fs-3d") } }; + const program3D: RenderPipeline = { vertex: { code: getShaderSource("vs-3d") }, fragment: { code: getShaderSource("fs-3d") } }; // -- Init buffers: vec2 Position, vec2 Texcoord const positions = new Float32Array([ @@ -83,7 +83,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); // -- Init 2D Texture - const texture2D: ITexture = { + const texture2D: Texture = { format: "rgba8unorm", mipLevelCount: 1, size: [512, 512], @@ -91,7 +91,7 @@ import { getShaderSource, loadImage } from "./utility"; image, flipY: false, }], }; - const sampler2D: ISampler = { + const sampler2D: Sampler = { minFilter: "nearest", magFilter: "linear", addressModeU: "clamp-to-edge", @@ -99,7 +99,7 @@ import { getShaderSource, loadImage } from "./utility"; }; // -- Render - const ro: IRenderObject = { + const ro: RenderObject = { pipeline: program, uniforms: { MVP: matrix, @@ -111,7 +111,7 @@ import { getShaderSource, loadImage } from "./utility"; }; const renderObjects: IRenderPassObject[] = []; - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects }; @@ -168,7 +168,7 @@ import { getShaderSource, loadImage } from "./utility"; } } - const texture3D: ITexture = { + const texture3D: Texture = { dimension: "3d", format: "r8uint", generateMipmap: true, @@ -176,7 +176,7 @@ import { getShaderSource, loadImage } from "./utility"; size: [SIZE, SIZE, SIZE], sources: [{ __type: "TextureDataSource", size: [SIZE, SIZE, SIZE], data }], }; - const sampler3D: ISampler = { + const sampler3D: Sampler = { lodMinClamp: 0, lodMaxClamp: Math.log2(SIZE), minFilter: "linear", diff --git a/examples/src/WebGL2Samples/texture_integer.ts b/examples/src/WebGL2Samples/texture_integer.ts index 5c9285f..483f27e 100644 --- a/examples/src/WebGL2Samples/texture_integer.ts +++ b/examples/src/WebGL2Samples/texture_integer.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -15,7 +15,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -49,14 +49,14 @@ import { getShaderSource, loadImage } from "./utility"; loadImage("../../assets/img/Di-3d.png", function (image) { // -- Init Texture - const texture: ITexture = { + const texture: Texture = { size: [image.width, image.height], format: "rgba8uint", sources: [{ mipLevel: 0, image, flipY: false, }], }; - const sampler: ISampler = { + const sampler: Sampler = { minFilter: "nearest", magFilter: "nearest", }; @@ -69,7 +69,7 @@ import { getShaderSource, loadImage } from "./utility"; 0.0, 0.0, 0.0, 1.0 ]); - const ro: IRenderObject = { + const ro: RenderObject = { pipeline: program, uniforms: { MVP: matrix, @@ -81,7 +81,7 @@ import { getShaderSource, loadImage } from "./utility"; } }; - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [ro], }; diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index 880e8cd..8bab83f 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -87,7 +87,7 @@ import { getShaderSource, loadImage } from "./utility"; }; // -- Initialize program - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -120,8 +120,8 @@ import { getShaderSource, loadImage } from "./utility"; // -- Load texture then render const imageUrl = "../../assets/img/Di-3d.png"; - const textures: ITexture[] = new Array(Corners.MAX); - const samplers: ISampler[] = new Array(Corners.MAX); + const textures: Texture[] = new Array(Corners.MAX); + const samplers: Sampler[] = new Array(Corners.MAX); loadImage(imageUrl, function (image) { textures[Corners.TOP_LEFT] = { @@ -185,7 +185,7 @@ import { getShaderSource, loadImage } from "./utility"; { const renderObjects: IRenderPassObject[] = []; // Clear color buffer - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects, }; @@ -197,7 +197,7 @@ import { getShaderSource, loadImage } from "./utility"; 0.0, 0.0, 0.0, 1.0 ]); - const ro: IRenderObject = { + const ro: RenderObject = { pipeline: program, uniforms: { mvp: matrix, diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index e491697..900289d 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -36,9 +36,9 @@ import { getShaderSource, loadImage } from "./utility"; }; // -- Init program - const programBicubic: IRenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-bicubic") } }; + const programBicubic: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-bicubic") } }; - const programOffsetBicubic: IRenderPipeline = { + const programOffsetBicubic: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-offset-bicubic") }, }; @@ -72,12 +72,12 @@ import { getShaderSource, loadImage } from "./utility"; loadImage("../../assets/img/Di-3d.png", function (image) { // -- Init Texture - const texture: ITexture = { + const texture: Texture = { size: [image.width, image.height], format: "rgba8unorm", sources: [{ mipLevel: 0, image, flipY: false }], }; - const sampler: ISampler = { + const sampler: Sampler = { minFilter: "nearest", magFilter: "nearest", addressModeU: "clamp-to-edge", @@ -86,7 +86,7 @@ import { getShaderSource, loadImage } from "./utility"; const renderObjects: IRenderPassObject[] = []; // -- Render - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects }; diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index e13ba07..a2d9ebe 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIGLBuffer, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -14,7 +14,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -59,7 +59,7 @@ import { getShaderSource, loadImage } from "./utility"; const pixels = new Uint8Array(imageData.data.buffer); // -- Init Texture - const texture: ITexture = { + const texture: Texture = { size: [image.width / 2, image.height / 2], format: "rgba8unorm", sources: [{ @@ -71,14 +71,14 @@ import { getShaderSource, loadImage } from "./utility"; dataImageOrigin: [image.width / 4, image.width / 4], }] }; - const sampler: ISampler = { + const sampler: Sampler = { minFilter: "nearest", magFilter: "nearest", }; const renderObjects: IRenderPassObject[] = []; // -- Render - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects, }; diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index 8f53034..13dd9b4 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIGLBuffer, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; // -- Initialize program - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -52,8 +52,8 @@ import { getShaderSource, loadImage } from "./utility"; // -- Load texture then render const imageUrl = "../../assets/img/Di-3d.png"; - let texture: ITexture; - let sampler: ISampler; + let texture: Texture; + let sampler: Sampler; loadImage(imageUrl, function (image) { texture = { @@ -70,7 +70,7 @@ import { getShaderSource, loadImage } from "./utility"; { const renderObjects: IRenderPassObject[] = []; // Clear color buffer - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects, }; diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index ea1c61c..06c963f 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IPrimitiveTopology, IRenderPass, IRenderPassObject, IRenderPipeline, ISampler, ITexture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IPrimitiveTopology, RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIVertexFormat, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -40,7 +40,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: { depthCompare: "less" }, }; @@ -53,8 +53,8 @@ import { getShaderSource, loadImage } from "./utility"; let vertexBuffer: IVertexDataTypes; let indicesBuffer: IIndicesDataTypes; - let texture: ITexture; - let sampler: ISampler; + let texture: Texture; + let sampler: Sampler; // -- Load model then render const glTFLoader = new GlTFLoader(); @@ -183,7 +183,7 @@ import { getShaderSource, loadImage } from "./utility"; { const renderObjects: IRenderPassObject[] = []; // -- Render - const rp: IRenderPass = { + const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }], depthStencilAttachment: { depthLoadOp: "clear" } diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index 2f3a6fb..7838660 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderObject, IRenderPipeline, ISubmit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, RenderPipeline, Submit, IVertexDataTypes, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -113,7 +113,7 @@ import { getShaderSource } from "./utility"; }; // Setup program for draw shader - const programDraw: IRenderPipeline = { + const programDraw: RenderPipeline = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw"), targets: [{ @@ -125,7 +125,7 @@ import { getShaderSource } from "./utility"; }, }; - const programs: [IGLTransformFeedbackPipeline, IRenderPipeline] = [programTransform, programDraw]; + const programs: [IGLTransformFeedbackPipeline, RenderPipeline] = [programTransform, programDraw]; return programs; } @@ -138,7 +138,7 @@ import { getShaderSource } from "./utility"; draw: { __type: "DrawVertex", vertexCount: NUM_INSTANCES }, }; - const renderRO: IRenderObject = { + const renderRO: RenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height - 10 }, pipeline: programs[PROGRAM_DRAW], uniforms: {}, @@ -148,7 +148,7 @@ import { getShaderSource } from "./utility"; } }; - const submit: ISubmit = { + const submit: Submit = { commandEncoders: [{ passEncoders: [ { diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index b91b4e2..2350548 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderPipeline, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, RenderPipeline, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIGLVertexBuffer, IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -29,7 +29,7 @@ import { getShaderSource } from "./utility"; return programTransform; })(getShaderSource("vs-transform"), getShaderSource("fs-transform")); - const programFeedback: IRenderPipeline = { + const programFeedback: RenderPipeline = { vertex: { code: getShaderSource("vs-feedback") }, fragment: { code: getShaderSource("fs-feedback") }, }; diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index 133d85d..7fd19d0 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderPipeline, ISubmit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, RenderPipeline, Submit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -27,7 +27,7 @@ import { getShaderSource } from "./utility"; return transformFeedbackPipeline; })(getShaderSource("vs-transform"), getShaderSource("fs-transform")); - const programFeedback: IRenderPipeline = { + const programFeedback: RenderPipeline = { vertex: { code: getShaderSource("vs-feedback") }, fragment: { code: getShaderSource("fs-feedback") }, }; @@ -95,7 +95,7 @@ import { getShaderSource } from "./utility"; 0.0, 0.0, 0.0, 1.0 ]); - const submit: ISubmit = { + const submit: Submit = { commandEncoders: [{ passEncoders: [ { diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 156e5bb..2d5293a 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IRenderObject, IRenderPipeline, ISubmit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -108,14 +108,14 @@ import { getShaderSource } from "./utility"; }; } - function initProgram(): [IGLTransformFeedbackPipeline, IRenderPipeline] + function initProgram(): [IGLTransformFeedbackPipeline, RenderPipeline] { const transformFeedbackPipeline: IGLTransformFeedbackPipeline = { vertex: { code: getShaderSource("vs-emit") }, transformFeedbackVaryings: { varyings: ["v_position", "v_velocity", "v_spawntime", "v_lifetime"], bufferMode: "SEPARATE_ATTRIBS" }, }; - const program: IRenderPipeline = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw"), @@ -141,7 +141,7 @@ import { getShaderSource } from "./utility"; draw: { __type: "DrawVertex", vertexCount: NUM_PARTICLES }, }; - const renderRO: IRenderObject = { + const renderRO: RenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height - 10 }, pipeline: program, uniforms: { @@ -153,7 +153,7 @@ import { getShaderSource } from "./utility"; } }; - const submit: ISubmit = { + const submit: Submit = { commandEncoders: [{ passEncoders: [ { diff --git a/examples/src/regl-examples/basic.ts b/examples/src/regl-examples/basic.ts index 56532ef..49634e3 100644 --- a/examples/src/regl-examples/basic.ts +++ b/examples/src/regl-examples/basic.ts @@ -1,4 +1,4 @@ -import { IRenderObject } from "@feng3d/render-api"; +import { RenderObject } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; /** @@ -16,7 +16,7 @@ document.body.appendChild(canvas); const webgl = new WebGL({ canvasId: "glcanvas" }); -const renderObject: IRenderObject = { +const renderObject: RenderObject = { geometry: { vertices: { position: { diff --git a/examples/src/regl-examples/batch.ts b/examples/src/regl-examples/batch.ts index 0eea44f..825e9bf 100644 --- a/examples/src/regl-examples/batch.ts +++ b/examples/src/regl-examples/batch.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPipeline, ISubmit, VertexAttributes } from "@feng3d/render-api"; +import { RenderPipeline, Submit, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; const canvas = document.createElement("canvas"); @@ -21,7 +21,7 @@ const offsets = [{ offset: [-1, -1] }, { offset: [1, 0] }, { offset: [1, 1] }]; -const pipeline: IRenderPipeline = { +const pipeline: RenderPipeline = { vertex: { code: `precision mediump float; attribute vec2 position; @@ -56,7 +56,7 @@ const vertexArray: { vertices?: VertexAttributes } = { function getRenderObject(batchId: number) { - const renderObject: IRenderObject = { + const renderObject: RenderObject = { geometry: { vertices: vertexArray.vertices, draw: { __type: "DrawVertex", vertexCount: 3 } @@ -70,13 +70,13 @@ function getRenderObject(batchId: number) return renderObject; } -const renderObjects: IRenderObject[] = []; +const renderObjects: RenderObject[] = []; for (let i = 0; i < offsets.length; i++) { renderObjects.push(getRenderObject(i)); } -const submit: ISubmit = { +const submit: Submit = { commandEncoders: [{ passEncoders: [ { diff --git a/examples/src/regl-examples/bunny.ts b/examples/src/regl-examples/bunny.ts index 4ad2fde..e2d3b4c 100644 --- a/examples/src/regl-examples/bunny.ts +++ b/examples/src/regl-examples/bunny.ts @@ -1,4 +1,4 @@ -import { IRenderObject, ISubmit } from "@feng3d/render-api"; +import { Submit, RenderObject } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import * as bunny from "./mikolalysenko/bunny"; @@ -30,7 +30,7 @@ let tick = 0; let viewportWidth = canvas.clientWidth; let viewportHeight = canvas.clientHeight; -const renderObject: IRenderObject = { +const renderObject: RenderObject = { geometry:{ vertices: { position: { data: new Float32Array(positions), format: "float32x3" }, @@ -60,7 +60,7 @@ const renderObject: IRenderObject = { } }; -const submit: ISubmit = { +const submit: Submit = { commandEncoders: [{ passEncoders: [ { diff --git a/examples/src/regl-examples/camera.ts b/examples/src/regl-examples/camera.ts index b3957a7..fbe1b28 100644 --- a/examples/src/regl-examples/camera.ts +++ b/examples/src/regl-examples/camera.ts @@ -1,4 +1,4 @@ -import { IRenderObject } from "@feng3d/render-api"; +import { RenderObject } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { angleNormals } from "./mikolalysenko/angle-normals"; @@ -21,7 +21,7 @@ const positions = bunny.positions.flat(); const indices = bunny.cells.flat(); const normals = angleNormals(bunny.cells, bunny.positions).flat(); -const renderObject: IRenderObject = { +const renderObject: RenderObject = { geometry:{ vertices: { position: { data: new Float32Array(positions), format: "float32x3" }, diff --git a/examples/src/regl-examples/cloth.ts b/examples/src/regl-examples/cloth.ts index b5aed96..feaa7dc 100644 --- a/examples/src/regl-examples/cloth.ts +++ b/examples/src/regl-examples/cloth.ts @@ -1,4 +1,4 @@ -import { IRenderObject, ISubmit } from "@feng3d/render-api"; +import { Submit, RenderObject } from "@feng3d/render-api"; import { getIGLVertexBuffer, IGLSamplerTexture, WebGL } from "@feng3d/webgl"; import { fit } from "./hughsk/canvas-fit"; @@ -164,7 +164,7 @@ import * as vec3 from "./stackgl/gl-vec3"; let viewportWidth = 1; let viewportHeight = 1; - const renderObject: IRenderObject = { + const renderObject: RenderObject = { geometry:{ vertices: { position: { data: new Float32Array(positions), format: "float32x3" }, @@ -223,7 +223,7 @@ import * as vec3 from "./stackgl/gl-vec3"; } }; - const submit: ISubmit = { + const submit: Submit = { commandEncoders: [{ passEncoders: [ { diff --git a/examples/src/regl-examples/cube.ts b/examples/src/regl-examples/cube.ts index d73820e..3261afb 100644 --- a/examples/src/regl-examples/cube.ts +++ b/examples/src/regl-examples/cube.ts @@ -1,4 +1,4 @@ -import { IRenderObject, ISubmit } from "@feng3d/render-api"; +import { Submit, RenderObject } from "@feng3d/render-api"; import { IGLSamplerTexture, WebGL } from "@feng3d/webgl"; import * as mat4 from "./stackgl/gl-mat4"; @@ -64,7 +64,7 @@ import * as mat4 from "./stackgl/gl-mat4"; let viewportWidth = 1; let viewportHeight = 1; - const renderObject: IRenderObject = { + const renderObject: RenderObject = { geometry:{ vertices: { position: { data: new Float32Array(positions), format: "float32x3" }, @@ -98,7 +98,7 @@ import * as mat4 from "./stackgl/gl-mat4"; } }; - const submit: ISubmit = { + const submit: Submit = { commandEncoders: [{ passEncoders: [ { diff --git a/examples/src/regl-examples/util/camera.ts b/examples/src/regl-examples/util/camera.ts index c477f79..0cb9df3 100644 --- a/examples/src/regl-examples/util/camera.ts +++ b/examples/src/regl-examples/util/camera.ts @@ -1,4 +1,4 @@ -import { IRenderObject } from "@feng3d/render-api"; +import { RenderObject } from "@feng3d/render-api"; import { mouseListen as mouseChange } from "../mikolalysenko/mouse-change"; import { mouseWheelListen as mouseWheel } from "../mikolalysenko/mouse-wheel"; @@ -101,7 +101,7 @@ export function createCamera(props) lookAt(cameraState.view, eye, center, up); } - const injectContext = (renderObject: IRenderObject, viewportWidth: number, viewportHeight: number) => + const injectContext = (renderObject: RenderObject, viewportWidth: number, viewportHeight: number) => { Object.keys(cameraState).forEach(function (name) { @@ -115,7 +115,7 @@ export function createCamera(props) 1000.0); }; - function setupCamera(renderObject: IRenderObject, viewportWidth: number, viewportHeight: number) + function setupCamera(renderObject: RenderObject, viewportWidth: number, viewportHeight: number) { updateCamera(); injectContext(renderObject, viewportWidth, viewportHeight); diff --git a/examples/src/test/RenderObjectChanges.ts b/examples/src/test/RenderObjectChanges.ts index a1f23fd..d394572 100644 --- a/examples/src/test/RenderObjectChanges.ts +++ b/examples/src/test/RenderObjectChanges.ts @@ -1,4 +1,4 @@ -import { IRenderObject, ISubmit } from "@feng3d/render-api"; +import { Submit, RenderObject } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; const init = async (canvas: HTMLCanvasElement) => @@ -9,7 +9,7 @@ const init = async (canvas: HTMLCanvasElement) => const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); // 初始化WebGL - const renderObject: IRenderObject = { // 渲染对象 + const renderObject: RenderObject = { // 渲染对象 pipeline: { // 渲染管线 vertex: { // 顶点着色器 code: ` @@ -38,7 +38,7 @@ const init = async (canvas: HTMLCanvasElement) => uniforms: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 }; - const submit: ISubmit = { // 一次GPU提交 + const submit: Submit = { // 一次GPU提交 commandEncoders: [ // 命令编码列表 { passEncoders: [ // 通道编码列表 diff --git a/examples/src/test/fractalCube.ts b/examples/src/test/fractalCube.ts index 280c103..de3099d 100644 --- a/examples/src/test/fractalCube.ts +++ b/examples/src/test/fractalCube.ts @@ -1,4 +1,4 @@ -import { IRenderObject, ISampler, ISubmit, ITexture } from "@feng3d/render-api"; +import { Sampler, Submit, Texture, RenderObject } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; @@ -22,11 +22,11 @@ async function main() const buffers = initBuffers(); const texture: { - texture: ITexture; - sampler: ISampler; + texture: Texture; + sampler: Sampler; } = { texture: { size: [canvas.width, canvas.height] }, sampler: {} }; - const renderObject: IRenderObject = { + const renderObject: RenderObject = { pipeline: { vertex: { code: ` @@ -79,7 +79,7 @@ async function main() uniforms: { uSampler: texture }, }; - const submit: ISubmit = { + const submit: Submit = { commandEncoders: [{ passEncoders: [ // 绘制 diff --git a/examples/src/webgl-examples/sample1.ts b/examples/src/webgl-examples/sample1.ts index 74d0be2..eef5b55 100644 --- a/examples/src/webgl-examples/sample1.ts +++ b/examples/src/webgl-examples/sample1.ts @@ -1,4 +1,4 @@ -import { ISubmit } from "@feng3d/render-api"; +import { Submit } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; const init = async (canvas: HTMLCanvasElement) => @@ -9,7 +9,7 @@ const init = async (canvas: HTMLCanvasElement) => const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); // 初始化WebGL - const submit: ISubmit = { // 一次GPU提交 + const submit: Submit = { // 一次GPU提交 commandEncoders: [ // 命令编码列表 { passEncoders: [ // 通道编码列表 diff --git a/examples/src/webgl-examples/sample2.ts b/examples/src/webgl-examples/sample2.ts index 52cb723..400ee66 100644 --- a/examples/src/webgl-examples/sample2.ts +++ b/examples/src/webgl-examples/sample2.ts @@ -1,4 +1,4 @@ -import { IRenderPass } from "@feng3d/render-api"; +import { RenderPass } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; @@ -12,7 +12,7 @@ function main() const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); - const renderPass: IRenderPass = { + const renderPass: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0, 0, 0, 1], diff --git a/examples/src/webgl-examples/sample3.ts b/examples/src/webgl-examples/sample3.ts index 6c94112..5d5b9f8 100644 --- a/examples/src/webgl-examples/sample3.ts +++ b/examples/src/webgl-examples/sample3.ts @@ -1,4 +1,4 @@ -import { IRenderPass } from "@feng3d/render-api"; +import { RenderPass } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; @@ -16,7 +16,7 @@ function main() const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); - const renderPass: IRenderPass = { + const renderPass: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], diff --git a/examples/src/webgl-examples/sample4.ts b/examples/src/webgl-examples/sample4.ts index 4255c46..9cbdd82 100644 --- a/examples/src/webgl-examples/sample4.ts +++ b/examples/src/webgl-examples/sample4.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass } from "@feng3d/render-api"; +import { RenderPass, RenderObject } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; @@ -15,7 +15,7 @@ function main() const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); - const renderObject: IRenderObject = { + const renderObject: RenderObject = { pipeline: { vertex: { code: ` @@ -68,7 +68,7 @@ function main() uniforms: {}, }; - const renderPass: IRenderPass = { + const renderPass: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], diff --git a/examples/src/webgl-examples/sample5.ts b/examples/src/webgl-examples/sample5.ts index f65b333..848fa03 100644 --- a/examples/src/webgl-examples/sample5.ts +++ b/examples/src/webgl-examples/sample5.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass } from "@feng3d/render-api"; +import { RenderPass, RenderObject } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; @@ -19,7 +19,7 @@ function main() // objects we'll be drawing. const buffers = initBuffers(); - const renderObject: IRenderObject = { + const renderObject: RenderObject = { pipeline: { vertex: { code: ` @@ -63,7 +63,7 @@ function main() uniforms: {}, }; - const renderPass: IRenderPass = { + const renderPass: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], diff --git a/examples/src/webgl-examples/sample6.ts b/examples/src/webgl-examples/sample6.ts index 3d8b2d2..54a8699 100644 --- a/examples/src/webgl-examples/sample6.ts +++ b/examples/src/webgl-examples/sample6.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, ISampler, ITexture } from "@feng3d/render-api"; +import { RenderPass, Sampler, Texture, RenderObject } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; @@ -21,7 +21,7 @@ async function main() const texture = await loadTexture("../../cubetexture.png"); - const renderObject: IRenderObject = { + const renderObject: RenderObject = { pipeline: { vertex: { code: ` @@ -67,7 +67,7 @@ async function main() uniforms: { uSampler: texture }, }; - const renderPass: IRenderPass = { + const renderPass: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], @@ -222,14 +222,14 @@ async function loadTexture(url: string) const generateMipmap = isPowerOf2(img.width) && isPowerOf2(img.height); - const texture: ITexture = { + const texture: Texture = { size: [img.width, img.height], format: "rgba8unorm", sources: [{ image: img }], generateMipmap, }; - let sampler: ISampler = {}; + let sampler: Sampler = {}; if (generateMipmap) { sampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "linear" }; diff --git a/examples/src/webgl-examples/sample7.ts b/examples/src/webgl-examples/sample7.ts index 88fb377..b098d34 100644 --- a/examples/src/webgl-examples/sample7.ts +++ b/examples/src/webgl-examples/sample7.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, ISampler, ITexture } from "@feng3d/render-api"; +import { RenderPass, Sampler, Texture, RenderObject } from "@feng3d/render-api"; import { IGLSamplerTexture, WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; @@ -21,7 +21,7 @@ async function main() const texture = await loadTexture("../../cubetexture.png"); - const renderObject: IRenderObject = { + const renderObject: RenderObject = { pipeline: { vertex: { code: ` @@ -88,7 +88,7 @@ async function main() } }; - const renderPass: IRenderPass = { + const renderPass: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], @@ -290,14 +290,14 @@ async function loadTexture(url: string) const generateMipmap = isPowerOf2(img.width) && isPowerOf2(img.height); - const texture: ITexture = { + const texture: Texture = { size: [img.width, img.height], format: "rgba8unorm", sources: [{ image: img }], generateMipmap, }; - let sampler: ISampler = {}; + let sampler: Sampler = {}; if (!generateMipmap) { diff --git a/examples/src/webgl-examples/sample8.ts b/examples/src/webgl-examples/sample8.ts index d19025a..c11d21c 100644 --- a/examples/src/webgl-examples/sample8.ts +++ b/examples/src/webgl-examples/sample8.ts @@ -1,4 +1,4 @@ -import { IRenderObject, IRenderPass, ISampler, ITexture } from "@feng3d/render-api"; +import { RenderPass, Sampler, Texture, RenderObject } from "@feng3d/render-api"; import { IGLSamplerTexture, WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; @@ -25,7 +25,7 @@ function main() const video = setupVideo("../../Firefox.mp4"); - const renderObject: IRenderObject = { + const renderObject: RenderObject = { pipeline: { vertex: { code: ` @@ -92,7 +92,7 @@ function main() uniforms: { uSampler: texture }, }; - const renderPass: IRenderPass = { + const renderPass: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], @@ -322,12 +322,12 @@ function initBuffers() // function initTexture(): IGLSamplerTexture { - const texture: ITexture = { + const texture: Texture = { size: [1, 1], format: "rgba8unorm", sources: [{ __type: "TextureDataSource", size: [1, 1], data: new Uint8Array([0, 0, 255, 255]) }], }; - const sampler: ISampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "linear" }; + const sampler: Sampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "linear" }; return { texture, sampler }; } @@ -335,7 +335,7 @@ function initTexture(): IGLSamplerTexture // // copy the video texture // -function updateTexture(texture: ITexture, video: HTMLVideoElement) +function updateTexture(texture: Texture, video: HTMLVideoElement) { // 修改纹理尺寸 if (texture.size[0] !== video.videoWidth || texture.size[1] !== video.videoHeight) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index c4f382a..636f1ce 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, getBlendConstantColor, IBufferBinding, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderObject, IRenderPass, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, IRenderPassDescriptor, IRenderPassObject, IRenderPipeline, ISampler, IScissorRect, ISubmit, ITextureView, IUniforms, IViewport, PrimitiveState, TypedArray, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; +import { BlendComponent, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, getBlendConstantColor, IBufferBinding, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, Uniforms, IViewport, PrimitiveState, RenderObject, TypedArray, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -38,7 +38,7 @@ declare global { interface WebGLRenderingContext { - _vertexArrays: ChainMap<[IRenderPipeline, VertexAttributes, IIndicesDataTypes], WebGLVertexArrayObject>; + _vertexArrays: ChainMap<[RenderPipeline, VertexAttributes, IIndicesDataTypes], WebGLVertexArrayObject>; } } @@ -59,7 +59,7 @@ declare global export class RunWebGL { - runSubmit(gl: WebGLRenderingContext, submit: ISubmit) + runSubmit(gl: WebGLRenderingContext, submit: Submit) { const commandBuffers = submit.commandEncoders.map((v) => { @@ -78,7 +78,7 @@ export class RunWebGL { if (!passEncoder.__type) { - this.runRenderPass(gl, passEncoder as IRenderPass); + this.runRenderPass(gl, passEncoder as RenderPass); } else if (passEncoder.__type === "RenderPass") { @@ -124,7 +124,7 @@ export class RunWebGL } } - protected runRenderPass(gl: WebGLRenderingContext, renderPass: IRenderPass) + protected runRenderPass(gl: WebGLRenderingContext, renderPass: RenderPass) { // 获取附件尺寸 const attachmentSize = getGLRenderPassAttachmentSize(gl, renderPass.descriptor); @@ -134,7 +134,7 @@ export class RunWebGL // occlusionQuery.init(); - if (renderPass.descriptor?.sampleCount && (renderPass.descriptor.colorAttachments[0].view as ITextureView).texture) + if (renderPass.descriptor?.sampleCount && (renderPass.descriptor.colorAttachments[0].view as TextureView).texture) { const { passDescriptor, blitFramebuffer } = getIGLRenderPassDescriptorWithMultisample(renderPass.descriptor); @@ -154,7 +154,7 @@ export class RunWebGL occlusionQuery.resolve(renderPass); } - private runRenderPassDescriptor(gl: WebGLRenderingContext, passDescriptor: IRenderPassDescriptor) + private runRenderPassDescriptor(gl: WebGLRenderingContext, passDescriptor: RenderPassDescriptor) { passDescriptor = passDescriptor || {}; @@ -198,7 +198,7 @@ export class RunWebGL }); } - private runRenderObject(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObject: IRenderObject) + private runRenderObject(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObject: RenderObject) { const { viewport, scissorRect, pipeline, geometry, uniforms } = renderObject; @@ -320,7 +320,7 @@ export class RunWebGL /** * 激活常量 */ - private runUniforms(gl: WebGLRenderingContext, pipeline: IRenderPipeline, uniforms: IUniforms) + private runUniforms(gl: WebGLRenderingContext, pipeline: RenderPipeline, uniforms: Uniforms) { const webGLProgram = getGLProgram(gl, pipeline); @@ -407,7 +407,7 @@ export class RunWebGL /** * 设置采样参数 */ - private runSampler(gl: WebGLRenderingContext, textureTarget: IGLTextureTarget, webGLTexture: WebGLTexture, sampler: ISampler, textureID: number) + private runSampler(gl: WebGLRenderingContext, textureTarget: IGLTextureTarget, webGLTexture: WebGLTexture, sampler: Sampler, textureID: number) { if (gl instanceof WebGL2RenderingContext) { @@ -544,7 +544,7 @@ export class RunWebGL /** * 执行设置或者上传渲染对象的顶点以及索引数据。 */ - private runVertexArray(gl: WebGLRenderingContext, pipeline: IRenderPipeline, vertices: VertexAttributes, indices: IIndicesDataTypes) + private runVertexArray(gl: WebGLRenderingContext, pipeline: RenderPipeline, vertices: VertexAttributes, indices: IIndicesDataTypes) { if (!vertices && !indices) return; @@ -667,7 +667,7 @@ export class RunWebGL gl.useProgram(program); } - private runRenderPipeline(gl: WebGLRenderingContext, renderPipeline: IRenderPipeline) + private runRenderPipeline(gl: WebGLRenderingContext, renderPipeline: RenderPipeline) { this.runProgram(gl, renderPipeline); @@ -769,7 +769,7 @@ export class RunWebGL } } - private runProgram(gl: WebGLRenderingContext, pipeline: IRenderPipeline) + private runProgram(gl: WebGLRenderingContext, pipeline: RenderPipeline) { const program = getGLProgram(gl, pipeline); gl.useProgram(program); @@ -856,7 +856,7 @@ export class RunWebGL } } - private runScissor(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, scissor: IScissorRect) + private runScissor(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, scissor: ScissorRect) { if (scissor) { @@ -940,5 +940,5 @@ export class RunWebGL } } -export const defaultRenderPassColorAttachment: IRenderPassColorAttachment = { clearValue: [0, 0, 0, 0], loadOp: "clear" }; -export const defaultDepthStencilAttachment: IRenderPassDepthStencilAttachment = { depthClearValue: 1, depthLoadOp: "load", stencilClearValue: 0, stencilLoadOp: "load" }; +export const defaultRenderPassColorAttachment: RenderPassColorAttachment = { clearValue: [0, 0, 0, 0], loadOp: "clear" }; +export const defaultDepthStencilAttachment: RenderPassDepthStencilAttachment = { depthClearValue: 1, depthLoadOp: "load", stencilClearValue: 0, stencilLoadOp: "load" }; diff --git a/src/WebGL.ts b/src/WebGL.ts index 1a28bf4..1e1da75 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -1,4 +1,4 @@ -import { Buffer, IRenderPassDescriptor, IRenderPipeline, ISampler, ISubmit, ITexture } from "@feng3d/render-api"; +import { Buffer, RenderPassDescriptor, RenderPipeline, Sampler, Submit, Texture } from "@feng3d/render-api"; import { RunWebGL } from "./RunWebGL"; import { deleteBuffer } from "./caches/getGLBuffer"; @@ -38,7 +38,7 @@ export class WebGL * @param submit 一次 GPU 提交内容。 * */ - submit(submit: ISubmit) + submit(submit: Submit) { this._runWebGL.runSubmit(this._gl, submit); } @@ -48,7 +48,7 @@ export class WebGL readPixels(this._gl, glReadPixels); } - deleteFramebuffer(passDescriptor: IRenderPassDescriptor) + deleteFramebuffer(passDescriptor: RenderPassDescriptor) { deleteFramebuffer(this._gl, passDescriptor); } @@ -63,17 +63,17 @@ export class WebGL deleteBuffer(this._gl, buffer); } - deleteTexture(texture: ITexture) + deleteTexture(texture: Texture) { deleteTexture(this._gl, texture); } - deleteSampler(sampler: ISampler) + deleteSampler(sampler: Sampler) { deleteSampler(this._gl, sampler); } - deleteProgram(pipeline: IRenderPipeline) + deleteProgram(pipeline: RenderPipeline) { deleteProgram(this._gl, pipeline); } diff --git a/src/caches/getGLFramebuffer.ts b/src/caches/getGLFramebuffer.ts index 57983ea..c5e66c8 100644 --- a/src/caches/getGLFramebuffer.ts +++ b/src/caches/getGLFramebuffer.ts @@ -1,4 +1,4 @@ -import { IRenderPassDescriptor, ITextureView } from "@feng3d/render-api"; +import { RenderPassDescriptor, TextureView } from "@feng3d/render-api"; import { IGLRenderbuffer } from "../data/IGLRenderbuffer"; import { deleteRenderbuffer, getGLRenderbuffer } from "./getGLRenderbuffer"; import { getGLTexture } from "./getGLTexture"; @@ -9,14 +9,14 @@ declare global { interface WebGLRenderingContext { - _framebuffers: Map; + _framebuffers: Map; } } /** * 获取帧缓冲区 */ -export function getGLFramebuffer(gl: WebGLRenderingContext, passDescriptor: IRenderPassDescriptor) +export function getGLFramebuffer(gl: WebGLRenderingContext, passDescriptor: RenderPassDescriptor) { const view = passDescriptor?.colorAttachments?.[0]?.view || passDescriptor?.depthStencilAttachment?.view; if (!view) return null; @@ -34,7 +34,7 @@ export function getGLFramebuffer(gl: WebGLRenderingContext, passDescriptor: IRen const drawBuffers: number[] = []; passDescriptor.colorAttachments?.forEach((item, i) => { - const view = item.view as (ITextureView | IGLRenderbuffer); + const view = item.view as (TextureView | IGLRenderbuffer); const attachment = gl[`COLOR_ATTACHMENT${i}`]; drawBuffers.push(attachment); if ("texture" in view) @@ -117,7 +117,7 @@ export function getGLFramebuffer(gl: WebGLRenderingContext, passDescriptor: IRen * @param handleMultisample 处理存在多重采样的渲染通道描述。 * @returns */ -export function deleteFramebuffer(gl: WebGLRenderingContext, passDescriptor: IRenderPassDescriptor, handleMultisample = true) +export function deleteFramebuffer(gl: WebGLRenderingContext, passDescriptor: RenderPassDescriptor, handleMultisample = true) { if (handleMultisample && passDescriptor?.[_IGLRenderPassDescriptorWithMultisample]) { diff --git a/src/caches/getGLProgram.ts b/src/caches/getGLProgram.ts index 5c38125..782ca7f 100644 --- a/src/caches/getGLProgram.ts +++ b/src/caches/getGLProgram.ts @@ -1,4 +1,4 @@ -import { IRenderPipeline } from "@feng3d/render-api"; +import { RenderPipeline } from "@feng3d/render-api"; import { getWebGLUniformType, IGLUniformBufferType, isWebGLUniformTextureType } from "../const/IGLUniformType"; import { IGLAttributeInfo } from "../data/IGLAttributeInfo"; import { IGLTransformFeedbackPipeline, IGLTransformFeedbackVaryings } from "../data/IGLTransformFeedbackPass"; @@ -38,14 +38,14 @@ declare global /** * 激活渲染程序 */ -export function getGLProgram(gl: WebGLRenderingContext, pipeline: IRenderPipeline | IGLTransformFeedbackPipeline) +export function getGLProgram(gl: WebGLRenderingContext, pipeline: RenderPipeline | IGLTransformFeedbackPipeline) { const shaderKey = getKey(pipeline); let result = gl._programs[shaderKey]; if (result) return result; const vertex = pipeline.vertex.code; - const fragment = (pipeline as IRenderPipeline).fragment?.code || `#version 300 es + const fragment = (pipeline as RenderPipeline).fragment?.code || `#version 300 es precision highp float; precision highp int; @@ -61,7 +61,7 @@ export function getGLProgram(gl: WebGLRenderingContext, pipeline: IRenderPipelin return result; } -export function deleteProgram(gl: WebGLRenderingContext, pipeline: IRenderPipeline) +export function deleteProgram(gl: WebGLRenderingContext, pipeline: RenderPipeline) { const shaderKey = getKey(pipeline); const result = gl._programs[shaderKey]; @@ -72,10 +72,10 @@ export function deleteProgram(gl: WebGLRenderingContext, pipeline: IRenderPipeli } } -function getKey(pipeline: IRenderPipeline | IGLTransformFeedbackPipeline) +function getKey(pipeline: RenderPipeline | IGLTransformFeedbackPipeline) { const vertex = pipeline.vertex.code; - const fragment = (pipeline as IRenderPipeline).fragment?.code; + const fragment = (pipeline as RenderPipeline).fragment?.code; const transformFeedbackVaryings = (pipeline as IGLTransformFeedbackPipeline).transformFeedbackVaryings; return `---vertexShader---\n${vertex}\n---fragment---\n${fragment}\n---feedback---${transformFeedbackVaryings?.varyings.toString()} ${transformFeedbackVaryings?.bufferMode}`; diff --git a/src/caches/getGLRenderOcclusionQuery.ts b/src/caches/getGLRenderOcclusionQuery.ts index 36fba8b..b46fa7f 100644 --- a/src/caches/getGLRenderOcclusionQuery.ts +++ b/src/caches/getGLRenderOcclusionQuery.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassObject } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject } from "@feng3d/render-api"; import { IGLOcclusionQuery, IGLQuery } from "../data/IGLOcclusionQuery"; export function getGLRenderOcclusionQuery(gl: WebGLRenderingContext, renderObjects?: readonly IRenderPassObject[]) @@ -30,7 +30,7 @@ export function getGLRenderOcclusionQuery(gl: WebGLRenderingContext, renderObjec /** * 查询结果。 */ - const resolve = (renderPass: IRenderPass) => + const resolve = (renderPass: RenderPass) => { const results = occlusionQueryObjects.map((v) => v._step.resolve()); @@ -48,7 +48,7 @@ export function getGLRenderOcclusionQuery(gl: WebGLRenderingContext, renderObjec interface GLRenderOcclusionQuery { init: () => void - resolve: (renderPass: IRenderPass) => void + resolve: (renderPass: RenderPass) => void } const defautRenderOcclusionQuery = { init: () => { }, resolve: () => { } }; diff --git a/src/caches/getGLSampler.ts b/src/caches/getGLSampler.ts index 9fe3d6b..cc9b0f4 100644 --- a/src/caches/getGLSampler.ts +++ b/src/caches/getGLSampler.ts @@ -1,4 +1,4 @@ -import { IAddressMode, IFilterMode, ISampler } from "@feng3d/render-api"; +import { IAddressMode, IFilterMode, Sampler } from "@feng3d/render-api"; import { IGLCompareFunction } from "../data/IGLDepthStencilState"; import { IGLSamplerCompareMode, IGLTextureMagFilter, IGLTextureMinFilter, IGLTextureWrap } from "../data/IGLSampler"; import { getIGLCompareFunction } from "../runs/runDepthState"; @@ -7,11 +7,11 @@ declare global { interface WebGLRenderingContext { - _samplers: Map; + _samplers: Map; } } -export function getGLSampler(gl: WebGLRenderingContext, sampler?: ISampler) +export function getGLSampler(gl: WebGLRenderingContext, sampler?: Sampler) { let webGLSampler = gl._samplers.get(sampler); if (webGLSampler) return webGLSampler; @@ -46,7 +46,7 @@ export function getGLSampler(gl: WebGLRenderingContext, sampler?: ISampler) return webGLSampler; } -export function deleteSampler(gl: WebGLRenderingContext, sampler?: ISampler) +export function deleteSampler(gl: WebGLRenderingContext, sampler?: Sampler) { if (gl instanceof WebGL2RenderingContext) { diff --git a/src/caches/getGLTexture.ts b/src/caches/getGLTexture.ts index c8cce70..73efe7d 100644 --- a/src/caches/getGLTexture.ts +++ b/src/caches/getGLTexture.ts @@ -1,4 +1,4 @@ -import { ITexture, ITextureDataSource, ITextureImageSource, ITextureSize } from "@feng3d/render-api"; +import { Texture, ITextureDataSource, ITextureImageSource, ITextureSize } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; import { IGLTexturePixelStore } from "../data/IGLTexturePixelStore"; import { getTextureCubeMapTarget } from "../utils/getTextureCubeMapTarget"; @@ -9,7 +9,7 @@ declare global { interface WebGLRenderingContext { - _textures: Map + _textures: Map } interface WebGLTexture @@ -37,7 +37,7 @@ export const defaultTexturePixelStore: IGLTexturePixelStore = { unpackSkipImages: 0, }; -export function getGLTexture(gl: WebGLRenderingContext, texture: ITexture) +export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) { let webGLTexture = gl._textures.get(texture); if (webGLTexture) return webGLTexture; @@ -423,7 +423,7 @@ return; return webGLTexture; } -export function deleteTexture(gl: WebGLRenderingContext, texture: ITexture) +export function deleteTexture(gl: WebGLRenderingContext, texture: Texture) { const webGLTexture = gl._textures.get(texture); if (!webGLTexture) return; diff --git a/src/caches/getIGLBlitFramebuffer.ts b/src/caches/getIGLBlitFramebuffer.ts index 075b6b7..7dfee95 100644 --- a/src/caches/getIGLBlitFramebuffer.ts +++ b/src/caches/getIGLBlitFramebuffer.ts @@ -1,4 +1,4 @@ -import { CopyTextureToTexture, ImageCopyTexture, IRenderPassColorAttachment, IRenderPassDepthStencilAttachment, ITextureView } from "@feng3d/render-api"; +import { CopyTextureToTexture, ImageCopyTexture, RenderPassColorAttachment, RenderPassDepthStencilAttachment, TextureView } from "@feng3d/render-api"; import { IGLBlitFramebuffer, IGLBlitFramebufferItem } from "../data/IGLBlitFramebuffer"; /** @@ -16,10 +16,10 @@ export function getIGLBlitFramebuffer(copyTextureToTexture: CopyTextureToTexture console.assert(sourceAspect === destinationAspect, `拷贝纹理时两个纹理的 aspect 必须相同！`); - const sourceColorAttachments: IRenderPassColorAttachment[] = []; - let sourceDepthStencilAttachment: IRenderPassDepthStencilAttachment; - const destinationColorAttachments: IRenderPassColorAttachment[] = []; - let destinationDepthStencilAttachment: IRenderPassDepthStencilAttachment; + const sourceColorAttachments: RenderPassColorAttachment[] = []; + let sourceDepthStencilAttachment: RenderPassDepthStencilAttachment; + const destinationColorAttachments: RenderPassColorAttachment[] = []; + let destinationDepthStencilAttachment: RenderPassDepthStencilAttachment; // let mask: "COLOR_BUFFER_BIT" | "DEPTH_BUFFER_BIT" | "STENCIL_BUFFER_BIT"; @@ -71,7 +71,7 @@ function getIGLTextureView(source: ImageCopyTexture) { if (!source.texture) return undefined; - const textureView: ITextureView = { + const textureView: TextureView = { texture: source.texture, baseMipLevel: source.mipLevel, baseArrayLayer: source.origin?.[2], diff --git a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts b/src/caches/getIGLRenderPassDescriptorWithMultisample.ts index d5022c5..5a65932 100644 --- a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts +++ b/src/caches/getIGLRenderPassDescriptorWithMultisample.ts @@ -1,4 +1,4 @@ -import { IRenderPassColorAttachment, IRenderPassDescriptor, ITextureFormat, ITextureView } from "@feng3d/render-api"; +import { RenderPassColorAttachment, RenderPassDescriptor, ITextureFormat, TextureView } from "@feng3d/render-api"; import { IGLBlitFramebuffer } from "../data/IGLBlitFramebuffer"; import { GLRenderbufferInternalformat, IGLRenderbuffer } from "../data/IGLRenderbuffer"; import { getIGLTextureFormats } from "./getIGLTextureFormats"; @@ -11,18 +11,18 @@ import { getIGLTextureFormats } from "./getIGLTextureFormats"; * * @param sourcePassDescriptor 需要渲染到纹理并且开启多重采样的渲染通道描述。 */ -export function getIGLRenderPassDescriptorWithMultisample(sourcePassDescriptor: IRenderPassDescriptor): IGLRenderPassDescriptorWithMultisample +export function getIGLRenderPassDescriptorWithMultisample(sourcePassDescriptor: RenderPassDescriptor): IGLRenderPassDescriptorWithMultisample { if (sourcePassDescriptor[_IGLRenderPassDescriptorWithMultisample]) return sourcePassDescriptor[_IGLRenderPassDescriptorWithMultisample]; - const texture = (sourcePassDescriptor.colorAttachments[0].view as ITextureView).texture; + const texture = (sourcePassDescriptor.colorAttachments[0].view as TextureView).texture; const textureSize = texture.size; const renderbuffers: IGLRenderbuffer[] = []; // 创建支持 多重采样的 渲染通道 - const passDescriptor: IRenderPassDescriptor = { + const passDescriptor: RenderPassDescriptor = { colorAttachments: sourcePassDescriptor.colorAttachments.map((v) => { const texture = v.view.texture; @@ -34,7 +34,7 @@ export function getIGLRenderPassDescriptorWithMultisample(sourcePassDescriptor: }; renderbuffers.push(renderbuffer); - const colorAttachment: IRenderPassColorAttachment = { + const colorAttachment: RenderPassColorAttachment = { ...v, view: renderbuffer as any, }; @@ -77,7 +77,7 @@ export interface IGLRenderPassDescriptorWithMultisample /** * 渲染到渲染缓冲区上。 */ - passDescriptor: IRenderPassDescriptor; + passDescriptor: RenderPassDescriptor; /** * 拷贝渲染缓冲区到目标纹理中。 */ diff --git a/src/data/IGLBlitFramebuffer.ts b/src/data/IGLBlitFramebuffer.ts index 2bd6b55..1b9645e 100644 --- a/src/data/IGLBlitFramebuffer.ts +++ b/src/data/IGLBlitFramebuffer.ts @@ -1,4 +1,4 @@ -import { IRenderPassDescriptor } from "@feng3d/render-api"; +import { RenderPassDescriptor } from "@feng3d/render-api"; /** * 拷贝渲染缓冲与纹理直接拷贝数据。 @@ -10,8 +10,8 @@ export interface IGLBlitFramebuffer */ readonly __type: "BlitFramebuffer"; - read: IRenderPassDescriptor; - draw: IRenderPassDescriptor; + read: RenderPassDescriptor; + draw: RenderPassDescriptor; blitFramebuffers: IGLBlitFramebufferItem[]; } diff --git a/src/data/IGLOcclusionQuery.ts b/src/data/IGLOcclusionQuery.ts index 778c777..6735961 100644 --- a/src/data/IGLOcclusionQuery.ts +++ b/src/data/IGLOcclusionQuery.ts @@ -1,4 +1,4 @@ -import { IRenderObject } from "@feng3d/render-api"; +import { RenderObject } from "@feng3d/render-api"; import { IGLOcclusionQueryStep } from "../caches/getGLRenderOcclusionQuery"; export interface IGLOcclusionQuery @@ -10,7 +10,7 @@ export interface IGLOcclusionQuery /** * 渲染对象列表。 */ - renderObjects: IRenderObject[]; + renderObjects: RenderObject[]; /** * 临时变量, 执行过程中由引擎自动填充。 diff --git a/src/data/IGLReadPixels.ts b/src/data/IGLReadPixels.ts index e697deb..4db1233 100644 --- a/src/data/IGLReadPixels.ts +++ b/src/data/IGLReadPixels.ts @@ -1,4 +1,4 @@ -import { IRenderPassDescriptor } from "@feng3d/render-api"; +import { RenderPassDescriptor } from "@feng3d/render-api"; import { GLAttachmentPoint } from "../gl/WebGLEnums"; import { IGLTextureDataType, IGLTextureFormat } from "./IGLTexture"; @@ -9,7 +9,7 @@ import { IGLTextureDataType, IGLTextureFormat } from "./IGLTexture"; */ export interface IGLReadPixels { - frameBuffer: IRenderPassDescriptor; + frameBuffer: RenderPassDescriptor; /** * 读取那个附件。 diff --git a/src/data/IGLRenderPass.ts b/src/data/IGLRenderPass.ts index f115ef8..457ebe6 100644 --- a/src/data/IGLRenderPass.ts +++ b/src/data/IGLRenderPass.ts @@ -1,4 +1,4 @@ -import { IRenderPass, IRenderPassObject } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject } from "@feng3d/render-api"; import { IGLOcclusionQuery } from "./IGLOcclusionQuery"; declare module "@feng3d/render-api" @@ -8,7 +8,7 @@ declare module "@feng3d/render-api" * * 包含渲染通道描述以及需要渲染的对象列表。 */ - export interface IRenderPass + export interface RenderPass { /** * 渲染不被遮挡查询结果。具体数据保存在各子项的"result"属性中。 diff --git a/src/data/IGLSamplerTexture.ts b/src/data/IGLSamplerTexture.ts index 2a1bb57..6152592 100644 --- a/src/data/IGLSamplerTexture.ts +++ b/src/data/IGLSamplerTexture.ts @@ -1,4 +1,4 @@ -import { ISampler, ITexture } from "@feng3d/render-api"; +import { Sampler, Texture } from "@feng3d/render-api"; /** * 采样纹理。 @@ -10,10 +10,10 @@ export interface IGLSamplerTexture /** * 纹理。 */ - texture: ITexture; + texture: Texture; /** * 采样器。 */ - sampler?: ISampler; + sampler?: Sampler; } diff --git a/src/data/IGLTexture.ts b/src/data/IGLTexture.ts index bd1c0c2..46477d5 100644 --- a/src/data/IGLTexture.ts +++ b/src/data/IGLTexture.ts @@ -1,10 +1,10 @@ -import { ITexture } from "@feng3d/render-api"; +import { Texture } from "@feng3d/render-api"; import { IGLCanvasTexture } from "./IGLCanvasTexture"; /** * 类似纹理，包含画布纹理以及正常纹理。 */ -export type IGLTextureLike = IGLCanvasTexture | ITexture; +export type IGLTextureLike = IGLCanvasTexture | Texture; /** * 纹理绑定点。 diff --git a/src/data/IGLTransformFeedbackPass.ts b/src/data/IGLTransformFeedbackPass.ts index ef1d9d9..b405a9e 100644 --- a/src/data/IGLTransformFeedbackPass.ts +++ b/src/data/IGLTransformFeedbackPass.ts @@ -1,4 +1,4 @@ -import { IDrawVertex, IUniforms, VertexAttributes, IVertexState } from "@feng3d/render-api"; +import { IDrawVertex, Uniforms, VertexAttributes, IVertexState } from "@feng3d/render-api"; import { IGLTransformFeedback } from "./IGLTransformFeedback"; declare module "@feng3d/render-api" @@ -44,7 +44,7 @@ export interface IGLTransformFeedbackObject /** * Uniform渲染数据 */ - uniforms?: IUniforms; + uniforms?: Uniforms; /** * 回写顶点着色器中输出到缓冲区。 diff --git a/src/utils/getGLRenderPassAttachmentSize.ts b/src/utils/getGLRenderPassAttachmentSize.ts index 3cb7a0b..eef69e8 100644 --- a/src/utils/getGLRenderPassAttachmentSize.ts +++ b/src/utils/getGLRenderPassAttachmentSize.ts @@ -1,4 +1,4 @@ -import { IRenderPassDescriptor } from "@feng3d/render-api"; +import { RenderPassDescriptor } from "@feng3d/render-api"; /** * 获取渲染通道附件尺寸。 @@ -6,7 +6,7 @@ import { IRenderPassDescriptor } from "@feng3d/render-api"; * @param gl * @param descriptor */ -export function getGLRenderPassAttachmentSize(gl: WebGLRenderingContext, descriptor: IRenderPassDescriptor): { readonly width: number; readonly height: number; } +export function getGLRenderPassAttachmentSize(gl: WebGLRenderingContext, descriptor: RenderPassDescriptor): { readonly width: number; readonly height: number; } { if (!descriptor) return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; -- Gitee From 7feaf0b2ec970b2c71a9b3de7a55ea82410ca824 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 02:44:28 +0800 Subject: [PATCH 13/57] Uniforms VertexState Viewport BufferBinding --- src/RunWebGL.ts | 8 ++++---- src/data/IGLTransformFeedbackPass.ts | 4 ++-- src/utils/updateBufferBinding.ts | 6 +++--- 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 636f1ce..e14c19d 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, getBlendConstantColor, IBufferBinding, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, Uniforms, IViewport, PrimitiveState, RenderObject, TypedArray, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; +import { BlendComponent, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, getBlendConstantColor, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderPassObject, Viewport, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -359,7 +359,7 @@ export class RunWebGL webGLProgram.uniformBlocks.forEach((uniformBlock) => { const { name, index } = uniformBlock; - const uniformData = uniforms[name] as TypedArray | IBufferBinding; + const uniformData = uniforms[name] as TypedArray | BufferBinding; // let buffer: IGLUniformBuffer; @@ -370,7 +370,7 @@ export class RunWebGL } else { - const bufferBinding = uniforms[name] as IBufferBinding; + const bufferBinding = uniforms[name] as BufferBinding; updateBufferBinding(uniformBlock.bufferBindingInfo, bufferBinding); buffer = getIGLUniformBuffer(bufferBinding.bufferView); } @@ -833,7 +833,7 @@ export class RunWebGL occlusionQuery._step.end(); } - private runViewPort(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, viewport: IViewport) + private runViewPort(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, viewport: Viewport) { if (viewport) { diff --git a/src/data/IGLTransformFeedbackPass.ts b/src/data/IGLTransformFeedbackPass.ts index b405a9e..61d0858 100644 --- a/src/data/IGLTransformFeedbackPass.ts +++ b/src/data/IGLTransformFeedbackPass.ts @@ -1,4 +1,4 @@ -import { IDrawVertex, Uniforms, VertexAttributes, IVertexState } from "@feng3d/render-api"; +import { IDrawVertex, Uniforms, VertexAttributes, VertexState } from "@feng3d/render-api"; import { IGLTransformFeedback } from "./IGLTransformFeedback"; declare module "@feng3d/render-api" @@ -59,7 +59,7 @@ export interface IGLTransformFeedbackPipeline /** * 顶点着色器阶段描述。 */ - readonly vertex: IVertexState; + readonly vertex: VertexState; /** * 回写变量。 diff --git a/src/utils/updateBufferBinding.ts b/src/utils/updateBufferBinding.ts index 032e6c6..8297834 100644 --- a/src/utils/updateBufferBinding.ts +++ b/src/utils/updateBufferBinding.ts @@ -1,4 +1,4 @@ -import { IBufferBinding, UnReadonly } from "@feng3d/render-api"; +import { BufferBinding, UnReadonly } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; import { IBufferBindingInfo } from "../caches/getGLProgram"; import { getIGLBuffer } from "../runs/getIGLBuffer"; @@ -10,7 +10,7 @@ import { getIGLBuffer } from "../runs/getIGLBuffer"; * * @see https://learnopengl-cn.readthedocs.io/zh/latest/04%20Advanced%20OpenGL/08%20Advanced%20GLSL/#uniform_1 */ -export function updateBufferBinding(bufferBindingInfo: IBufferBindingInfo, uniformData: IBufferBinding) +export function updateBufferBinding(bufferBindingInfo: IBufferBindingInfo, uniformData: BufferBinding) { if (uniformData["_bufferBindingInfo"] !== undefined) { @@ -30,7 +30,7 @@ export function updateBufferBinding(bufferBindingInfo: IBufferBindingInfo, unifo const hasDefautValue = !!uniformData.bufferView; if (!hasDefautValue) { - (uniformData as UnReadonly).bufferView = new Uint8Array(size); + (uniformData as UnReadonly).bufferView = new Uint8Array(size); } else { -- Gitee From 2038ef9009c5c9d41c5f378539a6edc099852cee Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 02:59:21 +0800 Subject: [PATCH 14/57] BlendState.getBlendConstantColor?(): IColor --- examples/src/WebGL2Samples/fbo_new_blend_equation.ts | 4 ++-- examples/src/WebGL2Samples/glsl_centroid.ts | 4 ++-- examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts | 4 ++-- src/RunWebGL.ts | 4 ++-- 4 files changed, 8 insertions(+), 8 deletions(-) diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index 26f2d5d..dfd7b30 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, IViewport, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -136,7 +136,7 @@ function render() for (let i = 0; i < Corners.MAX; ++i) { - const viewport0: IViewport = { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }; + const viewport0: Viewport = { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }; if (i === Corners.TOP_LEFT) { diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index 8e5e859..d3ef3c9 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -1,4 +1,4 @@ -import { IPassEncoder, RenderPass, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, Texture, IViewport, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { IPassEncoder, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -24,7 +24,7 @@ const VIEWPORTS = { MAX: 2 }; -const viewport: IViewport[] = new Array(VIEWPORTS.MAX); +const viewport: Viewport[] = new Array(VIEWPORTS.MAX); viewport[VIEWPORTS.LEFT] = { x: 0, diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index 2c44252..227b24b 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, RenderPass, IRenderPassObject, RenderPipeline, VertexAttributes, IViewport } from "@feng3d/render-api"; +import { IIndicesDataTypes, RenderPass, IRenderPassObject, RenderPipeline, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getIVertexFormat, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; @@ -25,7 +25,7 @@ const VIEWPORTS = { MAX: 2 }; -const viewport: IViewport[] = new Array(VIEWPORTS.MAX); +const viewport: Viewport[] = new Array(VIEWPORTS.MAX); viewport[VIEWPORTS.LEFT] = { x: 0, diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index e14c19d..b6a06fb 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, getBlendConstantColor, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderPassObject, Viewport, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes } from "@feng3d/render-api"; +import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderPassObject, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -800,7 +800,7 @@ export class RunWebGL const alphaDstFactor: IGLBlendFactor = getIGLBlendFactor(alpha?.dstFactor, color?.operation) || colorDstFactor; // 当混合系数用到了混合常量值时设置混合常量值。 - const constantColor = getBlendConstantColor(blend); + const constantColor = BlendState.getInstance(blend)?.getBlendConstantColor(); if (constantColor) { const constantColor = blend.constantColor ?? [0, 0, 0, 0]; -- Gitee From e99f1bf8d571ea170a184eb2091aa4a81fb60594 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 03:22:17 +0800 Subject: [PATCH 15/57] TextureImageSource.getTexImageSourceSize Texture.getTextureBytesPerPixel TextureImageSource.getTexImageSourceSize --- src/RunWebGL.ts | 2 +- src/caches/getGLTexture.ts | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index b6a06fb..4989687 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -800,7 +800,7 @@ export class RunWebGL const alphaDstFactor: IGLBlendFactor = getIGLBlendFactor(alpha?.dstFactor, color?.operation) || colorDstFactor; // 当混合系数用到了混合常量值时设置混合常量值。 - const constantColor = BlendState.getInstance(blend)?.getBlendConstantColor(); + const constantColor = BlendState.getBlendConstantColor(blend); if (constantColor) { const constantColor = blend.constantColor ?? [0, 0, 0, 0]; diff --git a/src/caches/getGLTexture.ts b/src/caches/getGLTexture.ts index 73efe7d..9a8527c 100644 --- a/src/caches/getGLTexture.ts +++ b/src/caches/getGLTexture.ts @@ -1,4 +1,4 @@ -import { Texture, ITextureDataSource, ITextureImageSource, ITextureSize } from "@feng3d/render-api"; +import { Texture, ITextureDataSource, TextureImageSource, ITextureSize } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; import { IGLTexturePixelStore } from "../data/IGLTexturePixelStore"; import { getTextureCubeMapTarget } from "../utils/getTextureCubeMapTarget"; @@ -75,7 +75,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) const zoffset = textureOrigin?.[2]; if (gl instanceof WebGL2RenderingContext) { - const imageSource = v as ITextureImageSource; + const imageSource = v as TextureImageSource; if (imageSource.image) { const { image, imageOrigin, flipY, premultipliedAlpha } = imageSource; @@ -145,7 +145,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) } else { - const imageSource = v as ITextureImageSource; + const imageSource = v as TextureImageSource; if (imageSource.image) { const { image, imageOrigin, flipY, premultipliedAlpha } = imageSource; @@ -272,7 +272,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) const zoffset = textureOrigin?.[2]; // 处理图片资源 - const imageSource = v as ITextureImageSource; + const imageSource = v as TextureImageSource; if (imageSource.image) { const { image, imageOrigin, flipY, premultipliedAlpha } = imageSource; -- Gitee From 58a18708f45abe704456ca79a621eb9c143cf11d Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 03:29:21 +0800 Subject: [PATCH 16/57] RenderPipeline -> Material --- examples/src/WebGL2Samples/buffer_copy.ts | 4 ++-- examples/src/WebGL2Samples/buffer_uniform.ts | 4 ++-- examples/src/WebGL2Samples/draw_image_space.ts | 4 ++-- examples/src/WebGL2Samples/draw_instanced.ts | 4 ++-- examples/src/WebGL2Samples/draw_instanced_ubo.ts | 4 ++-- examples/src/WebGL2Samples/draw_primitive_restart.ts | 4 ++-- examples/src/WebGL2Samples/draw_range_arrays.ts | 4 ++-- examples/src/WebGL2Samples/fbo_blit.ts | 4 ++-- examples/src/WebGL2Samples/fbo_multisample.ts | 4 ++-- examples/src/WebGL2Samples/fbo_new_blend_equation.ts | 4 ++-- examples/src/WebGL2Samples/fbo_read_pixels.ts | 6 +++--- examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts | 6 +++--- examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 6 +++--- examples/src/WebGL2Samples/fbo_rtt_texture_array.ts | 6 +++--- examples/src/WebGL2Samples/geo_vertex_format.ts | 4 ++-- examples/src/WebGL2Samples/glsl_centroid.ts | 4 ++-- .../WebGL2Samples/glsl_flat_smooth_interpolators.ts | 4 ++-- examples/src/WebGL2Samples/glsl_non_square_matrix.ts | 4 ++-- examples/src/WebGL2Samples/query_occlusion.ts | 4 ++-- examples/src/WebGL2Samples/sampler_filter.ts | 4 ++-- examples/src/WebGL2Samples/sampler_object.ts | 4 ++-- examples/src/WebGL2Samples/sampler_wrap.ts | 4 ++-- examples/src/WebGL2Samples/texture_2d_array.ts | 4 ++-- examples/src/WebGL2Samples/texture_3d.ts | 4 ++-- examples/src/WebGL2Samples/texture_derivative.ts | 4 ++-- examples/src/WebGL2Samples/texture_fetch.ts | 4 ++-- examples/src/WebGL2Samples/texture_format.ts | 6 +++--- examples/src/WebGL2Samples/texture_grad.ts | 4 ++-- examples/src/WebGL2Samples/texture_immutable.ts | 6 +++--- examples/src/WebGL2Samples/texture_integer.ts | 4 ++-- examples/src/WebGL2Samples/texture_lod.ts | 4 ++-- examples/src/WebGL2Samples/texture_offset.ts | 6 +++--- examples/src/WebGL2Samples/texture_pixel_store.ts | 4 ++-- examples/src/WebGL2Samples/texture_srgb.ts | 4 ++-- examples/src/WebGL2Samples/texture_vertex.ts | 4 ++-- .../WebGL2Samples/transform_feedback_instanced.ts | 6 +++--- .../WebGL2Samples/transform_feedback_interleaved.ts | 4 ++-- .../WebGL2Samples/transform_feedback_separated.ts | 4 ++-- .../WebGL2Samples/transform_feedback_separated_2.ts | 6 +++--- examples/src/regl-examples/batch.ts | 4 ++-- src/RunWebGL.ts | 12 ++++++------ src/WebGL.ts | 4 ++-- src/caches/getGLProgram.ts | 12 ++++++------ 43 files changed, 103 insertions(+), 103 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index 59daf20..cf24fd8 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -1,4 +1,4 @@ -import { CopyBufferToBuffer, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { CopyBufferToBuffer, RenderPass, Material, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -16,7 +16,7 @@ import { getShaderSource } from "./utility"; const webgl = new WebGL(rc); // -- Init Program - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; diff --git a/examples/src/WebGL2Samples/buffer_uniform.ts b/examples/src/WebGL2Samples/buffer_uniform.ts index 1fad68f..9cb5c79 100644 --- a/examples/src/WebGL2Samples/buffer_uniform.ts +++ b/examples/src/WebGL2Samples/buffer_uniform.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPipeline, Submit, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, Material, Submit, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -16,7 +16,7 @@ import { getShaderSource } from "./utility"; const webgl = new WebGL(rc); // -- Init Program - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; diff --git a/examples/src/WebGL2Samples/draw_image_space.ts b/examples/src/WebGL2Samples/draw_image_space.ts index f899953..01ce693 100644 --- a/examples/src/WebGL2Samples/draw_image_space.ts +++ b/examples/src/WebGL2Samples/draw_image_space.ts @@ -1,4 +1,4 @@ -import { RenderPipeline, Sampler, Texture, RenderObject } from "@feng3d/render-api"; +import { Material, Sampler, Texture, RenderObject } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -23,7 +23,7 @@ loadImage("../../assets/img/Di-3d.png", (img) => magFilter: "linear", }; - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index a565d69..05de942 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -1,4 +1,4 @@ -import { RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -18,7 +18,7 @@ const vertexColorBuffer = new Float32Array([ 1.0, 0.5, 0.0, 0.0, 0.5, 1.0]); -const program: RenderPipeline = { +const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs"), targets: [{ blend: {} }] } }; diff --git a/examples/src/WebGL2Samples/draw_instanced_ubo.ts b/examples/src/WebGL2Samples/draw_instanced_ubo.ts index 4b92506..fb49399 100644 --- a/examples/src/WebGL2Samples/draw_instanced_ubo.ts +++ b/examples/src/WebGL2Samples/draw_instanced_ubo.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPipeline } from "@feng3d/render-api"; +import { RenderPass, Material } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -12,7 +12,7 @@ const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program -const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; +const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; // -- Init Buffer const vertices = new Float32Array([ diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index 1b6213d..8cf8109 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -1,4 +1,4 @@ -import { RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -22,7 +22,7 @@ const vertexPosBuffer = new Float32Array([ 1.0, 1.0, ]); -const program: RenderPipeline = { +const program: Material = { vertex: { code: getShaderSource("vs") }, diff --git a/examples/src/WebGL2Samples/draw_range_arrays.ts b/examples/src/WebGL2Samples/draw_range_arrays.ts index 0851438..3fbee78 100644 --- a/examples/src/WebGL2Samples/draw_range_arrays.ts +++ b/examples/src/WebGL2Samples/draw_range_arrays.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -26,7 +26,7 @@ const vertexPosBuffer = new Float32Array([ -0.5, -0.5, ]); -const pipeline: RenderPipeline = { +const pipeline: Material = { vertex: { code: getShaderSource("vs") }, diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 3abec52..56bcf4f 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, TextureView, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, TextureView, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLBlitFramebuffer, IGLBlitFramebufferItem, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ document.body.appendChild(canvas); const renderingContext: IGLCanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); -const program: RenderPipeline = { +const program: Material = { vertex: { code: getShaderSource("vs") }, diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index f7b7bc1..1ff5eb0 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -19,7 +19,7 @@ const PROGRAM = { MAX: 2 }; -const programs: RenderPipeline[] = [ +const programs: Material[] = [ { vertex: { code: getShaderSource("vs-render") }, fragment: { code: getShaderSource("fs-render") }, diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index dfd7b30..e52b155 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -1,4 +1,4 @@ -import { IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { IRenderPassObject, RenderObject, RenderPass, Material, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -59,7 +59,7 @@ viewport[Corners.TOP_LEFT] = { // -- Initialize program -const program: RenderPipeline = { +const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs"), targets: [{ blend: {} }] }, }; diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index e65b8cd..2688abc 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -51,12 +51,12 @@ viewport[Textures.BLUE] = { // -- Initialize program // Multiple out shaders -const multipleOutputProgram: RenderPipeline = { +const multipleOutputProgram: Material = { vertex: { code: getShaderSource("vs-multiple-output") }, fragment: { code: getShaderSource("fs-multiple-output") }, }; // Layer shaders -const layerProgram: RenderPipeline = { +const layerProgram: Material = { vertex: { code: getShaderSource("vs-layer") }, fragment: { code: getShaderSource("fs-layer") }, }; diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index c77f447..ec7aa03 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -19,13 +19,13 @@ const windowSize = { // -- Initialize program // Depth shaders -const depthProgram: RenderPipeline = { +const depthProgram: Material = { vertex: { code: getShaderSource("vs-depth") }, fragment: { code: getShaderSource("fs-depth") }, depthStencil: {}, }; // Draw shaders -const drawProgram: RenderPipeline = { +const drawProgram: Material = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw") }, }; diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index f109cc8..f3f7ee5 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -19,13 +19,13 @@ const windowSize = { // -- Initialize program // Draw buffer shaders -const drawBufferProgram: RenderPipeline = { +const drawBufferProgram: Material = { vertex: { code: getShaderSource("vs-draw-buffer") }, fragment: { code: getShaderSource("fs-draw-buffer") }, }; // Draw shaders -const drawProgram: RenderPipeline = { +const drawProgram: Material = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw") }, }; diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index 5982259..e5a2393 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -51,12 +51,12 @@ viewport[Textures.BLUE] = { // -- Initialize program // Multiple out shaders -const multipleOutputProgram: RenderPipeline = { +const multipleOutputProgram: Material = { vertex: { code: getShaderSource("vs-multiple-output") }, fragment: { code: getShaderSource("fs-multiple-output") }, }; // Layer shaders -const layerProgram: RenderPipeline = { +const layerProgram: Material = { vertex: { code: getShaderSource("vs-layer") }, fragment: { code: getShaderSource("fs-layer") }, }; diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index 053872a..73de50b 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -1,4 +1,4 @@ -import { RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderObject, RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { HalfFloat } from "./third-party/HalfFloatUtility"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: {}, }; diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index d3ef3c9..97edf55 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -1,4 +1,4 @@ -import { IPassEncoder, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { IPassEncoder, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -48,7 +48,7 @@ const PROGRAM = { MAX: 3 }; -const programs: RenderPipeline[] = [ +const programs: Material[] = [ { vertex: { code: getShaderSource("vs-render") }, fragment: { code: getShaderSource("fs-render") }, }, diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index 227b24b..32a4485 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, RenderPass, IRenderPassObject, RenderPipeline, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { IIndicesDataTypes, RenderPass, IRenderPassObject, Material, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getIVertexFormat, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; @@ -42,7 +42,7 @@ viewport[VIEWPORTS.RIGHT] = { }; // -- Initialize program -const programs: RenderPipeline[] = [ +const programs: Material[] = [ { vertex: { code: getShaderSource("vs-flat") }, fragment: { code: getShaderSource("fs-flat") }, depthStencil: { depthCompare: "less-equal" }, diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index f4ab69d..8be72da 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -12,7 +12,7 @@ const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program -const program: RenderPipeline = { +const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index ad75967..322a043 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLOcclusionQuery, WebGL } from "@feng3d/webgl"; import { watcher } from "@feng3d/watcher"; @@ -17,7 +17,7 @@ const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init Program -const program: RenderPipeline = { +const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: {}, }; diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index 87eccc6..27ed484 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -58,7 +58,7 @@ viewport[Corners.TOP_LEFT] = { // -- Initialize program -const program: RenderPipeline = { +const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index 25c9d51..2516c14 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -14,7 +14,7 @@ const webgl = new WebGL(rc); // -- Initialize program -const program: RenderPipeline = { +const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index a51f037..1c7bea5 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -58,7 +58,7 @@ viewport[Corners.TOP_LEFT] = { // -- Initialize program -const program: RenderPipeline = { +const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; diff --git a/examples/src/WebGL2Samples/texture_2d_array.ts b/examples/src/WebGL2Samples/texture_2d_array.ts index f686649..37b89ec 100644 --- a/examples/src/WebGL2Samples/texture_2d_array.ts +++ b/examples/src/WebGL2Samples/texture_2d_array.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -14,7 +14,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; diff --git a/examples/src/WebGL2Samples/texture_3d.ts b/examples/src/WebGL2Samples/texture_3d.ts index df0e1a7..5b3018a 100644 --- a/examples/src/WebGL2Samples/texture_3d.ts +++ b/examples/src/WebGL2Samples/texture_3d.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; import { getShaderSource } from "./utility"; @@ -95,7 +95,7 @@ import { getShaderSource } from "./utility"; }; // -- Initialize program - const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; // -- Initialize buffer const positions = new Float32Array([ diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index eea4100..aa861b2 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs"), targets: [{ diff --git a/examples/src/WebGL2Samples/texture_fetch.ts b/examples/src/WebGL2Samples/texture_fetch.ts index 09cde77..3d3fdd7 100644 --- a/examples/src/WebGL2Samples/texture_fetch.ts +++ b/examples/src/WebGL2Samples/texture_fetch.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -15,7 +15,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; // -- Init buffers: vec2 Position, vec2 Texcoord const positions = new Float32Array([ diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index 41603f5..4240d70 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, ITextureFormat, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, Material, Sampler, Texture, ITextureFormat, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -49,9 +49,9 @@ import { getShaderSource, loadImage } from "./utility"; } // -- Init program - const programUint: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-uint") } }; + const programUint: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-uint") } }; - const programNormalized: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-normalized") } }; + const programNormalized: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-normalized") } }; // -- Init buffers: vec2 Position, vec2 Texcoord const positions = new Float32Array([ diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index 1cea9b6..9a3484c 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: {}, }; diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index 717d637..5af9333 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; @@ -38,9 +38,9 @@ import { getShaderSource, loadImage } from "./utility"; }; // -- Init program - const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; - const program3D: RenderPipeline = { vertex: { code: getShaderSource("vs-3d") }, fragment: { code: getShaderSource("fs-3d") } }; + const program3D: Material = { vertex: { code: getShaderSource("vs-3d") }, fragment: { code: getShaderSource("fs-3d") } }; // -- Init buffers: vec2 Position, vec2 Texcoord const positions = new Float32Array([ diff --git a/examples/src/WebGL2Samples/texture_integer.ts b/examples/src/WebGL2Samples/texture_integer.ts index 483f27e..ebbc4fe 100644 --- a/examples/src/WebGL2Samples/texture_integer.ts +++ b/examples/src/WebGL2Samples/texture_integer.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -15,7 +15,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index 8bab83f..9b935e5 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -87,7 +87,7 @@ import { getShaderSource, loadImage } from "./utility"; }; // -- Initialize program - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index 900289d..d0f728e 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -36,9 +36,9 @@ import { getShaderSource, loadImage } from "./utility"; }; // -- Init program - const programBicubic: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-bicubic") } }; + const programBicubic: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-bicubic") } }; - const programOffsetBicubic: RenderPipeline = { + const programOffsetBicubic: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-offset-bicubic") }, }; diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index a2d9ebe..dbe29c1 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIGLBuffer, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -14,7 +14,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index 13dd9b4..26aba8d 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIGLBuffer, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; // -- Initialize program - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index 06c963f..ba0f0a2 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IPrimitiveTopology, RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IPrimitiveTopology, RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIVertexFormat, IGLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -40,7 +40,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: { depthCompare: "less" }, }; diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index 7838660..618c0e1 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, RenderPipeline, Submit, IVertexDataTypes, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { IIndicesDataTypes, Material, Submit, IVertexDataTypes, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -113,7 +113,7 @@ import { getShaderSource } from "./utility"; }; // Setup program for draw shader - const programDraw: RenderPipeline = { + const programDraw: Material = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw"), targets: [{ @@ -125,7 +125,7 @@ import { getShaderSource } from "./utility"; }, }; - const programs: [IGLTransformFeedbackPipeline, RenderPipeline] = [programTransform, programDraw]; + const programs: [IGLTransformFeedbackPipeline, Material] = [programTransform, programDraw]; return programs; } diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index 2350548..1d3199d 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, RenderPipeline, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, Material, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { getIGLVertexBuffer, IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -29,7 +29,7 @@ import { getShaderSource } from "./utility"; return programTransform; })(getShaderSource("vs-transform"), getShaderSource("fs-transform")); - const programFeedback: RenderPipeline = { + const programFeedback: Material = { vertex: { code: getShaderSource("vs-feedback") }, fragment: { code: getShaderSource("fs-feedback") }, }; diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index 7fd19d0..2cdbf45 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, RenderPipeline, Submit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, Material, Submit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -27,7 +27,7 @@ import { getShaderSource } from "./utility"; return transformFeedbackPipeline; })(getShaderSource("vs-transform"), getShaderSource("fs-transform")); - const programFeedback: RenderPipeline = { + const programFeedback: Material = { vertex: { code: getShaderSource("vs-feedback") }, fragment: { code: getShaderSource("fs-feedback") }, }; diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 2d5293a..e7f09da 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, RenderObject, Material, Submit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -108,14 +108,14 @@ import { getShaderSource } from "./utility"; }; } - function initProgram(): [IGLTransformFeedbackPipeline, RenderPipeline] + function initProgram(): [IGLTransformFeedbackPipeline, Material] { const transformFeedbackPipeline: IGLTransformFeedbackPipeline = { vertex: { code: getShaderSource("vs-emit") }, transformFeedbackVaryings: { varyings: ["v_position", "v_velocity", "v_spawntime", "v_lifetime"], bufferMode: "SEPARATE_ATTRIBS" }, }; - const program: RenderPipeline = { + const program: Material = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw"), diff --git a/examples/src/regl-examples/batch.ts b/examples/src/regl-examples/batch.ts index 825e9bf..f416eb6 100644 --- a/examples/src/regl-examples/batch.ts +++ b/examples/src/regl-examples/batch.ts @@ -1,4 +1,4 @@ -import { RenderPipeline, Submit, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { Material, Submit, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; const canvas = document.createElement("canvas"); @@ -21,7 +21,7 @@ const offsets = [{ offset: [-1, -1] }, { offset: [1, 0] }, { offset: [1, 1] }]; -const pipeline: RenderPipeline = { +const pipeline: Material = { vertex: { code: `precision mediump float; attribute vec2 position; diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 4989687..cfa8110 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderPassObject, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderPassObject, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, Material, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -38,7 +38,7 @@ declare global { interface WebGLRenderingContext { - _vertexArrays: ChainMap<[RenderPipeline, VertexAttributes, IIndicesDataTypes], WebGLVertexArrayObject>; + _vertexArrays: ChainMap<[Material, VertexAttributes, IIndicesDataTypes], WebGLVertexArrayObject>; } } @@ -320,7 +320,7 @@ export class RunWebGL /** * 激活常量 */ - private runUniforms(gl: WebGLRenderingContext, pipeline: RenderPipeline, uniforms: Uniforms) + private runUniforms(gl: WebGLRenderingContext, pipeline: Material, uniforms: Uniforms) { const webGLProgram = getGLProgram(gl, pipeline); @@ -544,7 +544,7 @@ export class RunWebGL /** * 执行设置或者上传渲染对象的顶点以及索引数据。 */ - private runVertexArray(gl: WebGLRenderingContext, pipeline: RenderPipeline, vertices: VertexAttributes, indices: IIndicesDataTypes) + private runVertexArray(gl: WebGLRenderingContext, pipeline: Material, vertices: VertexAttributes, indices: IIndicesDataTypes) { if (!vertices && !indices) return; @@ -667,7 +667,7 @@ export class RunWebGL gl.useProgram(program); } - private runRenderPipeline(gl: WebGLRenderingContext, renderPipeline: RenderPipeline) + private runRenderPipeline(gl: WebGLRenderingContext, renderPipeline: Material) { this.runProgram(gl, renderPipeline); @@ -769,7 +769,7 @@ export class RunWebGL } } - private runProgram(gl: WebGLRenderingContext, pipeline: RenderPipeline) + private runProgram(gl: WebGLRenderingContext, pipeline: Material) { const program = getGLProgram(gl, pipeline); gl.useProgram(program); diff --git a/src/WebGL.ts b/src/WebGL.ts index 1e1da75..07d0f59 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -1,4 +1,4 @@ -import { Buffer, RenderPassDescriptor, RenderPipeline, Sampler, Submit, Texture } from "@feng3d/render-api"; +import { Buffer, RenderPassDescriptor, Material, Sampler, Submit, Texture } from "@feng3d/render-api"; import { RunWebGL } from "./RunWebGL"; import { deleteBuffer } from "./caches/getGLBuffer"; @@ -73,7 +73,7 @@ export class WebGL deleteSampler(this._gl, sampler); } - deleteProgram(pipeline: RenderPipeline) + deleteProgram(pipeline: Material) { deleteProgram(this._gl, pipeline); } diff --git a/src/caches/getGLProgram.ts b/src/caches/getGLProgram.ts index 782ca7f..d6fc832 100644 --- a/src/caches/getGLProgram.ts +++ b/src/caches/getGLProgram.ts @@ -1,4 +1,4 @@ -import { RenderPipeline } from "@feng3d/render-api"; +import { Material } from "@feng3d/render-api"; import { getWebGLUniformType, IGLUniformBufferType, isWebGLUniformTextureType } from "../const/IGLUniformType"; import { IGLAttributeInfo } from "../data/IGLAttributeInfo"; import { IGLTransformFeedbackPipeline, IGLTransformFeedbackVaryings } from "../data/IGLTransformFeedbackPass"; @@ -38,14 +38,14 @@ declare global /** * 激活渲染程序 */ -export function getGLProgram(gl: WebGLRenderingContext, pipeline: RenderPipeline | IGLTransformFeedbackPipeline) +export function getGLProgram(gl: WebGLRenderingContext, pipeline: Material | IGLTransformFeedbackPipeline) { const shaderKey = getKey(pipeline); let result = gl._programs[shaderKey]; if (result) return result; const vertex = pipeline.vertex.code; - const fragment = (pipeline as RenderPipeline).fragment?.code || `#version 300 es + const fragment = (pipeline as Material).fragment?.code || `#version 300 es precision highp float; precision highp int; @@ -61,7 +61,7 @@ export function getGLProgram(gl: WebGLRenderingContext, pipeline: RenderPipeline return result; } -export function deleteProgram(gl: WebGLRenderingContext, pipeline: RenderPipeline) +export function deleteProgram(gl: WebGLRenderingContext, pipeline: Material) { const shaderKey = getKey(pipeline); const result = gl._programs[shaderKey]; @@ -72,10 +72,10 @@ export function deleteProgram(gl: WebGLRenderingContext, pipeline: RenderPipelin } } -function getKey(pipeline: RenderPipeline | IGLTransformFeedbackPipeline) +function getKey(pipeline: Material | IGLTransformFeedbackPipeline) { const vertex = pipeline.vertex.code; - const fragment = (pipeline as RenderPipeline).fragment?.code; + const fragment = (pipeline as Material).fragment?.code; const transformFeedbackVaryings = (pipeline as IGLTransformFeedbackPipeline).transformFeedbackVaryings; return `---vertexShader---\n${vertex}\n---fragment---\n${fragment}\n---feedback---${transformFeedbackVaryings?.varyings.toString()} ${transformFeedbackVaryings?.bufferMode}`; -- Gitee From e1cae85b97faaefedc5741d44f1995b98eb7c889 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 03:47:04 +0800 Subject: [PATCH 17/57] GLCanvasContext --- examples/src/WebGL2Samples/buffer_copy.ts | 4 +- examples/src/WebGL2Samples/buffer_uniform.ts | 4 +- .../src/WebGL2Samples/draw_image_space.ts | 4 +- examples/src/WebGL2Samples/draw_instanced.ts | 4 +- .../src/WebGL2Samples/draw_instanced_ubo.ts | 4 +- .../WebGL2Samples/draw_primitive_restart.ts | 4 +- .../src/WebGL2Samples/draw_range_arrays.ts | 4 +- examples/src/WebGL2Samples/fbo_blit.ts | 4 +- examples/src/WebGL2Samples/fbo_multisample.ts | 4 +- .../WebGL2Samples/fbo_new_blend_equation.ts | 4 +- examples/src/WebGL2Samples/fbo_read_pixels.ts | 4 +- .../WebGL2Samples/fbo_rtt_depth_texture.ts | 4 +- .../src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 4 +- .../WebGL2Samples/fbo_rtt_texture_array.ts | 4 +- .../src/WebGL2Samples/geo_vertex_format.ts | 4 +- examples/src/WebGL2Samples/glsl_centroid.ts | 4 +- .../glsl_flat_smooth_interpolators.ts | 4 +- .../WebGL2Samples/glsl_non_square_matrix.ts | 4 +- examples/src/WebGL2Samples/query_occlusion.ts | 4 +- examples/src/WebGL2Samples/sampler_filter.ts | 4 +- examples/src/WebGL2Samples/sampler_object.ts | 4 +- examples/src/WebGL2Samples/sampler_wrap.ts | 4 +- .../src/WebGL2Samples/texture_2d_array.ts | 4 +- examples/src/WebGL2Samples/texture_3d.ts | 4 +- .../src/WebGL2Samples/texture_derivative.ts | 4 +- examples/src/WebGL2Samples/texture_fetch.ts | 4 +- examples/src/WebGL2Samples/texture_format.ts | 4 +- examples/src/WebGL2Samples/texture_grad.ts | 4 +- .../src/WebGL2Samples/texture_immutable.ts | 4 +- examples/src/WebGL2Samples/texture_integer.ts | 4 +- examples/src/WebGL2Samples/texture_lod.ts | 4 +- examples/src/WebGL2Samples/texture_offset.ts | 4 +- .../src/WebGL2Samples/texture_pixel_store.ts | 4 +- examples/src/WebGL2Samples/texture_srgb.ts | 4 +- examples/src/WebGL2Samples/texture_vertex.ts | 4 +- .../transform_feedback_instanced.ts | 4 +- .../transform_feedback_interleaved.ts | 4 +- .../transform_feedback_separated.ts | 6 +-- .../transform_feedback_separated_2.ts | 4 +- examples/src/test/fractalCube.ts | 4 +- src/WebGL.ts | 6 +-- src/caches/getGLCanvasContext.ts | 11 ++--- src/data/GLCanvasContext.ts | 47 +++++++++++++++++++ src/data/IGLCanvasContext.ts | 17 ------- src/data/IGLCanvasTexture.ts | 4 +- src/defaults/defaults.ts | 15 ------ src/index.ts | 4 +- 47 files changed, 139 insertions(+), 127 deletions(-) create mode 100644 src/data/GLCanvasContext.ts delete mode 100644 src/data/IGLCanvasContext.ts delete mode 100644 src/defaults/defaults.ts diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index cf24fd8..98baa1c 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -1,5 +1,5 @@ import { CopyBufferToBuffer, RenderPass, Material, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, IGLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; +import { GLCanvasContext, IGLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -12,7 +12,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // -- Init WebGL Context - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init Program diff --git a/examples/src/WebGL2Samples/buffer_uniform.ts b/examples/src/WebGL2Samples/buffer_uniform.ts index 9cb5c79..2ba366d 100644 --- a/examples/src/WebGL2Samples/buffer_uniform.ts +++ b/examples/src/WebGL2Samples/buffer_uniform.ts @@ -1,5 +1,5 @@ import { RenderPass, Material, Submit, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -12,7 +12,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // --Init WebGL Context - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init Program diff --git a/examples/src/WebGL2Samples/draw_image_space.ts b/examples/src/WebGL2Samples/draw_image_space.ts index 01ce693..1cb9d25 100644 --- a/examples/src/WebGL2Samples/draw_image_space.ts +++ b/examples/src/WebGL2Samples/draw_image_space.ts @@ -1,5 +1,5 @@ import { Material, Sampler, Texture, RenderObject } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: IGLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); loadImage("../../assets/img/Di-3d.png", (img) => diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index 05de942..8a458d2 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -1,5 +1,5 @@ import { Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const renderingContext: IGLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); const vertexPosBuffer = new Float32Array([-0.3, -0.5, diff --git a/examples/src/WebGL2Samples/draw_instanced_ubo.ts b/examples/src/WebGL2Samples/draw_instanced_ubo.ts index fb49399..cfdc242 100644 --- a/examples/src/WebGL2Samples/draw_instanced_ubo.ts +++ b/examples/src/WebGL2Samples/draw_instanced_ubo.ts @@ -1,5 +1,5 @@ import { RenderPass, Material } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index 8cf8109..fc8624e 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -1,5 +1,5 @@ import { Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: IGLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); // https://www.khronos.org/registry/webgl/specs/latest/2.0/#5.18 diff --git a/examples/src/WebGL2Samples/draw_range_arrays.ts b/examples/src/WebGL2Samples/draw_range_arrays.ts index 3fbee78..76a1c70 100644 --- a/examples/src/WebGL2Samples/draw_range_arrays.ts +++ b/examples/src/WebGL2Samples/draw_range_arrays.ts @@ -1,5 +1,5 @@ import { RenderPass, Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const renderingContext: IGLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); const vertexPosBuffer = new Float32Array([ diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 56bcf4f..8680960 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -1,5 +1,5 @@ import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, TextureView, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLBlitFramebuffer, IGLBlitFramebufferItem, IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { IGLBlitFramebuffer, IGLBlitFramebufferItem, GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: IGLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); const program: Material = { diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index 1ff5eb0..4b8e677 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -1,5 +1,5 @@ import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -9,7 +9,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const renderingContext: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(renderingContext); // -- Init program diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index e52b155..9d0d5c0 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -1,5 +1,5 @@ import { IRenderPassObject, RenderObject, RenderPass, Material, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -9,7 +9,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const renderingContext: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(renderingContext); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index 2688abc..8b90d8c 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -1,5 +1,5 @@ import { RenderPass, RenderPassDescriptor, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const renderingContext: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(renderingContext); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index ec7aa03..c7ae32d 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -1,5 +1,5 @@ import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const renderingContext: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; +const renderingContext: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(renderingContext); const windowSize = { diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index f3f7ee5..1b1f7b6 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -1,5 +1,5 @@ import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const renderingContext: IGLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); const windowSize = { diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index e5a2393..1c2a772 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -1,5 +1,5 @@ import { RenderPass, RenderPassDescriptor, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: IGLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index 73de50b..96d8af8 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -1,5 +1,5 @@ import { RenderObject, RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { HalfFloat } from "./third-party/HalfFloatUtility"; import { getShaderSource, loadImage } from "./utility"; @@ -12,7 +12,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index 97edf55..fb202c3 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -1,5 +1,5 @@ import { IPassEncoder, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -9,7 +9,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index 32a4485..05623ab 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -1,5 +1,5 @@ import { IIndicesDataTypes, RenderPass, IRenderPassObject, Material, VertexAttributes, Viewport } from "@feng3d/render-api"; -import { getIVertexFormat, IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { getIVertexFormat, GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; import { getShaderSource } from "./utility"; @@ -10,7 +10,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index 8be72da..b9de17a 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -1,5 +1,5 @@ import { RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index 322a043..7a665b8 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -1,5 +1,5 @@ import { RenderPass, IRenderPassObject, Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, IGLOcclusionQuery, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, IGLOcclusionQuery, WebGL } from "@feng3d/webgl"; import { watcher } from "@feng3d/watcher"; @@ -13,7 +13,7 @@ canvas.height = window.innerHeight; document.body.appendChild(canvas); // -- Init WebGL Context -const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init Program diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index 27ed484..5093980 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -1,5 +1,5 @@ import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index 2516c14..76454be 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -1,5 +1,5 @@ import { RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -9,7 +9,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Initialize program diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index 1c7bea5..e7dd3ee 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -1,5 +1,5 @@ import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; +const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/texture_2d_array.ts b/examples/src/WebGL2Samples/texture_2d_array.ts index 37b89ec..b3d528c 100644 --- a/examples/src/WebGL2Samples/texture_2d_array.ts +++ b/examples/src/WebGL2Samples/texture_2d_array.ts @@ -1,5 +1,5 @@ import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; (function () @@ -10,7 +10,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.width = canvas.height * 960 / 540; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_3d.ts b/examples/src/WebGL2Samples/texture_3d.ts index 5b3018a..c71e022 100644 --- a/examples/src/WebGL2Samples/texture_3d.ts +++ b/examples/src/WebGL2Samples/texture_3d.ts @@ -1,5 +1,5 @@ import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; import { getShaderSource } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index aa861b2..435f789 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -1,5 +1,5 @@ import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource, loadImage } from "./utility"; @@ -12,7 +12,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_fetch.ts b/examples/src/WebGL2Samples/texture_fetch.ts index 3d3fdd7..1bd9cd4 100644 --- a/examples/src/WebGL2Samples/texture_fetch.ts +++ b/examples/src/WebGL2Samples/texture_fetch.ts @@ -1,5 +1,5 @@ import { RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index 4240d70..d7bbe07 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -1,5 +1,5 @@ import { RenderPass, IRenderPassObject, Material, Sampler, Texture, ITextureFormat, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Viewport diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index 9a3484c..44c68a5 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -1,5 +1,5 @@ import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource, loadImage } from "./utility"; @@ -12,7 +12,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index 5af9333..0aab883 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -1,5 +1,5 @@ import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; import { getShaderSource, loadImage } from "./utility"; @@ -12,7 +12,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); const Corners = { diff --git a/examples/src/WebGL2Samples/texture_integer.ts b/examples/src/WebGL2Samples/texture_integer.ts index ebbc4fe..9ea009f 100644 --- a/examples/src/WebGL2Samples/texture_integer.ts +++ b/examples/src/WebGL2Samples/texture_integer.ts @@ -1,5 +1,5 @@ import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index 9b935e5..4a3b981 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -1,5 +1,5 @@ import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); // -- Mouse Behaviour diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index d0f728e..3cd8c4f 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -1,5 +1,5 @@ import { RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; (function () @@ -10,7 +10,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); const Corners = { diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index dbe29c1..7a5d587 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -1,5 +1,5 @@ import { IIndicesDataTypes, RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; -import { getIGLBuffer, IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { getIGLBuffer, GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; (function () @@ -10,7 +10,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index 26aba8d..9fb9bf4 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -1,5 +1,5 @@ import { RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; -import { getIGLBuffer, IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { getIGLBuffer, GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); // -- Initialize program diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index ba0f0a2..f8789d2 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -1,5 +1,5 @@ import { IIndicesDataTypes, IPrimitiveTopology, RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; -import { getIVertexFormat, IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { getIVertexFormat, GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; @@ -36,7 +36,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index 618c0e1..eded525 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -1,5 +1,5 @@ import { IIndicesDataTypes, Material, Submit, IVertexDataTypes, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -12,7 +12,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // -- Init WebGL Context - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); canvas.addEventListener("webglcontextlost", function (event) diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index 1d3199d..3370803 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -1,5 +1,5 @@ import { IIndicesDataTypes, Material, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; -import { getIGLVertexBuffer, IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { getIGLVertexBuffer, GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -12,7 +12,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // -- Init WebGL Context - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); // -- Init Program diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index 2cdbf45..6eee1a9 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -1,5 +1,5 @@ -import { IIndicesDataTypes, Material, Submit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; -import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { IIndicesDataTypes, IVertexDataTypes, Material, Submit, VertexAttributes } from "@feng3d/render-api"; +import { GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -13,7 +13,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // -- Init WebGL Context - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); // -- Init Program diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index e7f09da..22b98e9 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -1,5 +1,5 @@ import { IIndicesDataTypes, RenderObject, Material, Submit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; -import { IGLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -13,7 +13,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // -- Init WebGL Context - const rc: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; const webgl = new WebGL(rc); canvas.addEventListener("webglcontextlost", function (event) diff --git a/examples/src/test/fractalCube.ts b/examples/src/test/fractalCube.ts index de3099d..e2999b9 100644 --- a/examples/src/test/fractalCube.ts +++ b/examples/src/test/fractalCube.ts @@ -1,5 +1,5 @@ import { Sampler, Submit, Texture, RenderObject } from "@feng3d/render-api"; -import { IGLCanvasContext, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; let cubeRotation = 0.0; @@ -13,7 +13,7 @@ async function main() { const canvas = document.querySelector("#glcanvas") as HTMLCanvasElement; - const renderingContext: IGLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const renderingContext: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(renderingContext); diff --git a/src/WebGL.ts b/src/WebGL.ts index 07d0f59..39aa6c4 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -9,7 +9,7 @@ import { deleteRenderbuffer } from "./caches/getGLRenderbuffer"; import { deleteSampler } from "./caches/getGLSampler"; import { deleteTexture } from "./caches/getGLTexture"; import { deleteTransformFeedback } from "./caches/getGLTransformFeedback"; -import { IGLCanvasContext } from "./data/IGLCanvasContext"; +import { GLCanvasContext } from "./data/GLCanvasContext"; import { IGLReadPixels } from "./data/IGLReadPixels"; import { IGLRenderbuffer } from "./data/IGLRenderbuffer"; import { IGLTransformFeedback } from "./data/IGLTransformFeedback"; @@ -23,10 +23,10 @@ import { readPixels } from "./utils/readPixels"; export class WebGL { private _runWebGL: RunWebGL = new RunWebGL(); - private _renderingContext: IGLCanvasContext; + private _renderingContext: GLCanvasContext; private _gl: WebGLRenderingContext; - constructor(renderingContext?: IGLCanvasContext) + constructor(renderingContext?: GLCanvasContext) { this._renderingContext = renderingContext; this._gl = getGLCanvasContext(this._renderingContext); diff --git a/src/caches/getGLCanvasContext.ts b/src/caches/getGLCanvasContext.ts index f2ad55c..d85c844 100644 --- a/src/caches/getGLCanvasContext.ts +++ b/src/caches/getGLCanvasContext.ts @@ -1,5 +1,4 @@ -import { IGLCanvasContext } from "../data/IGLCanvasContext"; -import { defaultCanvasContext } from "../defaults/defaults"; +import { GLCanvasContext } from "../data/GLCanvasContext"; import { ChainMap } from "../utils/ChainMap"; import { getCapabilities } from "./getCapabilities"; @@ -9,7 +8,7 @@ import { getCapabilities } from "./getCapabilities"; * @param renderingContext * @returns */ -export function getGLCanvasContext(renderingContext: IGLCanvasContext) +export function getGLCanvasContext(renderingContext: GLCanvasContext) { const key = renderingContext.canvasId; let value = canvasContextMap.get(key); @@ -72,7 +71,7 @@ function autoCreateCanvas(canvasId: string) return canvas; } -export function getCanvas(canvasContext: IGLCanvasContext) +export function getCanvas(canvasContext: GLCanvasContext) { let canvas = document.getElementById(canvasContext.canvasId) as HTMLCanvasElement; if (!canvas || !(canvas instanceof HTMLCanvasElement)) @@ -83,9 +82,9 @@ export function getCanvas(canvasContext: IGLCanvasContext) return canvas; } -function getWebGLContext(canvas: HTMLCanvasElement, canvasContext: IGLCanvasContext) +function getWebGLContext(canvas: HTMLCanvasElement, canvasContext: GLCanvasContext) { - const contextAttributes = Object.assign({}, defaultCanvasContext, canvasContext); + const contextAttributes = GLCanvasContext.getInstance(canvasContext); // 使用用户提供参数获取WebGL上下文 let gl = canvas.getContext(contextAttributes.contextId, contextAttributes) as any; diff --git a/src/data/GLCanvasContext.ts b/src/data/GLCanvasContext.ts new file mode 100644 index 0000000..fd645ce --- /dev/null +++ b/src/data/GLCanvasContext.ts @@ -0,0 +1,47 @@ +/** + * 画布(WebGL)上下文信息。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext + */ +export class GLCanvasContext implements WebGLContextAttributes +{ + /** + * 画布编号。 + */ + canvasId?: string + + /** + * WebGL上下文类型 + */ + contextId?: "webgl" | "webgl2" = "webgl2"; + + depth?: boolean = true; + stencil?: boolean = true; + antialias?: boolean = false; + premultipliedAlpha?: boolean = true; + preserveDrawingBuffer?: boolean = false; + powerPreference?: WebGLPowerPreference = "default"; + failIfMajorPerformanceCaveat?: boolean = false; + + constructor(canvasContext?: GLCanvasContext) + { + if (!canvasContext) return; + + for (var key in canvasContext) + { + if (canvasContext.hasOwnProperty(key)) + { + this[key] = canvasContext[key]; + } + } + } + + static getInstance(context: GLCanvasContext): GLCanvasContext + { + if (!context) return undefined; + + if (context instanceof GLCanvasContext) return context; + + return new GLCanvasContext(context); + } +} \ No newline at end of file diff --git a/src/data/IGLCanvasContext.ts b/src/data/IGLCanvasContext.ts deleted file mode 100644 index 0c0a8e6..0000000 --- a/src/data/IGLCanvasContext.ts +++ /dev/null @@ -1,17 +0,0 @@ -/** - * 画布(WebGL)上下文信息。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext - */ -export interface IGLCanvasContext extends WebGLContextAttributes -{ - /** - * 画布编号。 - */ - canvasId?: string - - /** - * WebGL上下文类型 - */ - contextId?: "webgl" | "webgl2" -} \ No newline at end of file diff --git a/src/data/IGLCanvasTexture.ts b/src/data/IGLCanvasTexture.ts index f18c25f..7e96f09 100644 --- a/src/data/IGLCanvasTexture.ts +++ b/src/data/IGLCanvasTexture.ts @@ -1,9 +1,9 @@ -import { IGLCanvasContext } from "./IGLCanvasContext"; +import { GLCanvasContext } from "./GLCanvasContext"; /** * 画布纹理，从画布的WebGPU上下文获取纹理 */ export interface IGLCanvasTexture { - context: IGLCanvasContext; + context: GLCanvasContext; } \ No newline at end of file diff --git a/src/defaults/defaults.ts b/src/defaults/defaults.ts deleted file mode 100644 index 1585277..0000000 --- a/src/defaults/defaults.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { IGLCanvasContext } from "../data/IGLCanvasContext"; - -/** - * 默认WebGL上下文信息。 - */ -export const defaultCanvasContext: IGLCanvasContext = Object.freeze({ - contextId: "webgl2", - depth: true, - stencil: true, - antialias: false, - premultipliedAlpha: true, - preserveDrawingBuffer: false, - powerPreference: "default", - failIfMajorPerformanceCaveat: false, -}); diff --git a/src/index.ts b/src/index.ts index fc06b9c..fa0d5e1 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,6 +1,6 @@ export * from "./data/IGLBlitFramebuffer"; export * from "./data/IGLBuffer"; -export * from "./data/IGLCanvasContext"; +export * from "./data/GLCanvasContext"; export * from "./data/IGLCapabilities"; export * from "./data/IGLCommandEncoder"; export * from "./data/IGLDepthStencilState"; @@ -21,8 +21,6 @@ export * from "./runs/getIGLBuffer"; export * from "./runs/runColorTargetStates"; export * from "./RunWebGL"; -export * from "./defaults/defaults"; - export * from "./gl/WebGLEnums"; export * from "./shader/Macro"; -- Gitee From f6adbe44784feacdcf9b6cbb70f4c2179c143c47 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 04:00:30 +0800 Subject: [PATCH 18/57] GLBlitFramebuffer --- examples/src/WebGL2Samples/fbo_blit.ts | 6 +++--- src/RunWebGL.ts | 6 +++--- src/caches/getGLProgram.ts | 2 +- src/caches/getIGLBlitFramebuffer.ts | 4 ++-- src/caches/getIGLRenderPassDescriptorWithMultisample.ts | 6 +++--- src/data/{IGLBlitFramebuffer.ts => GLBlitFramebuffer.ts} | 4 ++-- src/data/IGLCommandEncoder.ts | 4 ++-- src/index.ts | 2 +- src/{data => internal}/IGLAttributeInfo.ts | 0 9 files changed, 17 insertions(+), 17 deletions(-) rename src/data/{IGLBlitFramebuffer.ts => GLBlitFramebuffer.ts} (85%) rename src/{data => internal}/IGLAttributeInfo.ts (100%) diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 8680960..4f3d90a 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, TextureView, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { IGLBlitFramebuffer, IGLBlitFramebufferItem, GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { Material, RenderObject, RenderPass, RenderPassDescriptor, Sampler, Texture, TextureView, VertexAttributes } from "@feng3d/render-api"; +import { GLBlitFramebuffer, GLCanvasContext, IGLBlitFramebufferItem, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; const canvas = document.createElement("canvas"); @@ -143,7 +143,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => } } - const blitFramebuffer: IGLBlitFramebuffer = { + const blitFramebuffer: GLBlitFramebuffer = { __type: "BlitFramebuffer", read: fboRenderPass.descriptor, draw: renderPassResolve.descriptor, diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index cfa8110..0ca6655 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderPassObject, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, Material, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderPassObject, Material, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -12,7 +12,7 @@ import { getIGLRenderPassDescriptorWithMultisample } from "./caches/getIGLRender import { getIGLTextureTarget } from "./caches/getIGLTextureTarget"; import { _GL_Submit_Times } from "./const/const"; import { IGLUniformBufferType } from "./const/IGLUniformType"; -import { IGLBlitFramebuffer } from "./data/IGLBlitFramebuffer"; +import { GLBlitFramebuffer } from "./data/GLBlitFramebuffer"; import { IGLDrawElementType, IGLUniformBuffer } from "./data/IGLBuffer"; import { IGLCompareFunction, IGLStencilFunc, IGLStencilOp } from "./data/IGLDepthStencilState"; import { IGLOcclusionQuery } from "./data/IGLOcclusionQuery"; @@ -886,7 +886,7 @@ export class RunWebGL this.runBlitFramebuffer(gl, blitFramebuffer); } - private runBlitFramebuffer(gl: WebGLRenderingContext, blitFramebuffer: IGLBlitFramebuffer) + private runBlitFramebuffer(gl: WebGLRenderingContext, blitFramebuffer: GLBlitFramebuffer) { const { read, draw, blitFramebuffers } = blitFramebuffer; diff --git a/src/caches/getGLProgram.ts b/src/caches/getGLProgram.ts index d6fc832..6ddb8de 100644 --- a/src/caches/getGLProgram.ts +++ b/src/caches/getGLProgram.ts @@ -1,6 +1,6 @@ import { Material } from "@feng3d/render-api"; import { getWebGLUniformType, IGLUniformBufferType, isWebGLUniformTextureType } from "../const/IGLUniformType"; -import { IGLAttributeInfo } from "../data/IGLAttributeInfo"; +import { IGLAttributeInfo } from "../internal/IGLAttributeInfo"; import { IGLTransformFeedbackPipeline, IGLTransformFeedbackVaryings } from "../data/IGLTransformFeedbackPass"; import { IGLUniformInfo, IUniformItemInfo } from "../data/IGLUniformInfo"; import { getIGLAttributeType } from "./getIGLAttributeType"; diff --git a/src/caches/getIGLBlitFramebuffer.ts b/src/caches/getIGLBlitFramebuffer.ts index 7dfee95..200ba74 100644 --- a/src/caches/getIGLBlitFramebuffer.ts +++ b/src/caches/getIGLBlitFramebuffer.ts @@ -1,5 +1,5 @@ import { CopyTextureToTexture, ImageCopyTexture, RenderPassColorAttachment, RenderPassDepthStencilAttachment, TextureView } from "@feng3d/render-api"; -import { IGLBlitFramebuffer, IGLBlitFramebufferItem } from "../data/IGLBlitFramebuffer"; +import { GLBlitFramebuffer, IGLBlitFramebufferItem } from "../data/GLBlitFramebuffer"; /** * 通过 IGLBlitFramebuffer 实现纹理之间拷贝并不靠谱。 @@ -51,7 +51,7 @@ export function getIGLBlitFramebuffer(copyTextureToTexture: CopyTextureToTexture mask, "NEAREST", ]; - const blitFramebuffer: IGLBlitFramebuffer = { + const blitFramebuffer: GLBlitFramebuffer = { __type: "BlitFramebuffer", read: { colorAttachments: sourceColorAttachments, diff --git a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts b/src/caches/getIGLRenderPassDescriptorWithMultisample.ts index 5a65932..74de890 100644 --- a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts +++ b/src/caches/getIGLRenderPassDescriptorWithMultisample.ts @@ -1,5 +1,5 @@ import { RenderPassColorAttachment, RenderPassDescriptor, ITextureFormat, TextureView } from "@feng3d/render-api"; -import { IGLBlitFramebuffer } from "../data/IGLBlitFramebuffer"; +import { GLBlitFramebuffer } from "../data/GLBlitFramebuffer"; import { GLRenderbufferInternalformat, IGLRenderbuffer } from "../data/IGLRenderbuffer"; import { getIGLTextureFormats } from "./getIGLTextureFormats"; @@ -46,7 +46,7 @@ return colorAttachment; }; // 拷贝 渲染缓冲区到 IGLTexture - const blitFramebuffer: IGLBlitFramebuffer = { + const blitFramebuffer: GLBlitFramebuffer = { __type: "BlitFramebuffer", read: passDescriptor, draw: sourcePassDescriptor, @@ -81,7 +81,7 @@ export interface IGLRenderPassDescriptorWithMultisample /** * 拷贝渲染缓冲区到目标纹理中。 */ - blitFramebuffer: IGLBlitFramebuffer; + blitFramebuffer: GLBlitFramebuffer; /** * 需要销毁的临时渲染缓冲区。 */ diff --git a/src/data/IGLBlitFramebuffer.ts b/src/data/GLBlitFramebuffer.ts similarity index 85% rename from src/data/IGLBlitFramebuffer.ts rename to src/data/GLBlitFramebuffer.ts index 1b9645e..45640e6 100644 --- a/src/data/IGLBlitFramebuffer.ts +++ b/src/data/GLBlitFramebuffer.ts @@ -3,12 +3,12 @@ import { RenderPassDescriptor } from "@feng3d/render-api"; /** * 拷贝渲染缓冲与纹理直接拷贝数据。 */ -export interface IGLBlitFramebuffer +export class GLBlitFramebuffer { /** * 数据类型。 */ - readonly __type: "BlitFramebuffer"; + readonly __type: "BlitFramebuffer" = "BlitFramebuffer"; read: RenderPassDescriptor; draw: RenderPassDescriptor; diff --git a/src/data/IGLCommandEncoder.ts b/src/data/IGLCommandEncoder.ts index 9f8c576..9d53509 100644 --- a/src/data/IGLCommandEncoder.ts +++ b/src/data/IGLCommandEncoder.ts @@ -1,11 +1,11 @@ import { ITextureLike } from "@feng3d/render-api"; -import { IGLBlitFramebuffer } from "./IGLBlitFramebuffer"; +import { GLBlitFramebuffer } from "./GLBlitFramebuffer"; declare module "@feng3d/render-api" { export interface IPassEncoderMap { - IGLBlitFramebuffer: IGLBlitFramebuffer; + IGLBlitFramebuffer: GLBlitFramebuffer; } /** diff --git a/src/index.ts b/src/index.ts index fa0d5e1..fd23343 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,4 +1,4 @@ -export * from "./data/IGLBlitFramebuffer"; +export * from "./data/GLBlitFramebuffer"; export * from "./data/IGLBuffer"; export * from "./data/GLCanvasContext"; export * from "./data/IGLCapabilities"; diff --git a/src/data/IGLAttributeInfo.ts b/src/internal/IGLAttributeInfo.ts similarity index 100% rename from src/data/IGLAttributeInfo.ts rename to src/internal/IGLAttributeInfo.ts -- Gitee From ae26a21b4afaf3083a83f7113edfd00ed1c0a312 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 11:40:11 +0800 Subject: [PATCH 19/57] GLCanvasTexture --- examples/src/WebGL2Samples/buffer_copy.ts | 6 +++--- src/data/GLCanvasContext.ts | 2 +- src/data/{IGLCanvasTexture.ts => GLCanvasTexture.ts} | 2 +- src/data/IGLBuffer.ts | 6 +++--- src/data/IGLTexture.ts | 4 ++-- src/runs/getIGLBuffer.ts | 4 ++-- 6 files changed, 12 insertions(+), 12 deletions(-) rename src/data/{IGLCanvasTexture.ts => GLCanvasTexture.ts} (81%) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index 98baa1c..bae2d15 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -1,5 +1,5 @@ -import { CopyBufferToBuffer, RenderPass, Material, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, IGLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; +import { CopyBufferToBuffer, Material, RenderPass, VertexAttributes } from "@feng3d/render-api"; +import { GLCanvasContext, GLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -29,7 +29,7 @@ import { getShaderSource } from "./utility"; -1.0, 1.0, -1.0, -1.0 ]); - const vertexPosBufferSrc: IGLVertexBuffer = { target: "ARRAY_BUFFER", size: vertices.byteLength, data: vertices, usage: "STATIC_DRAW" }; + const vertexPosBufferSrc: GLVertexBuffer = { target: "ARRAY_BUFFER", size: vertices.byteLength, data: vertices, usage: "STATIC_DRAW" }; const vertexPosBufferDst = new Float32Array(vertices.length); diff --git a/src/data/GLCanvasContext.ts b/src/data/GLCanvasContext.ts index fd645ce..5139598 100644 --- a/src/data/GLCanvasContext.ts +++ b/src/data/GLCanvasContext.ts @@ -8,7 +8,7 @@ export class GLCanvasContext implements WebGLContextAttributes /** * 画布编号。 */ - canvasId?: string + canvasId?: string; /** * WebGL上下文类型 diff --git a/src/data/IGLCanvasTexture.ts b/src/data/GLCanvasTexture.ts similarity index 81% rename from src/data/IGLCanvasTexture.ts rename to src/data/GLCanvasTexture.ts index 7e96f09..6224a5d 100644 --- a/src/data/IGLCanvasTexture.ts +++ b/src/data/GLCanvasTexture.ts @@ -3,7 +3,7 @@ import { GLCanvasContext } from "./GLCanvasContext"; /** * 画布纹理，从画布的WebGPU上下文获取纹理 */ -export interface IGLCanvasTexture +export class GLCanvasTexture { context: GLCanvasContext; } \ No newline at end of file diff --git a/src/data/IGLBuffer.ts b/src/data/IGLBuffer.ts index f006c61..ef99bdd 100644 --- a/src/data/IGLBuffer.ts +++ b/src/data/IGLBuffer.ts @@ -20,14 +20,14 @@ declare module "@feng3d/render-api" } } -export interface IGLVertexBuffer extends Buffer +export class GLVertexBuffer extends Buffer { - target: "ARRAY_BUFFER"; + target: "ARRAY_BUFFER" = "ARRAY_BUFFER"; /** * 缓冲区数据。 */ - data?: IVertexDataTypes; + declare data?: IVertexDataTypes; } /** diff --git a/src/data/IGLTexture.ts b/src/data/IGLTexture.ts index 46477d5..6e162e9 100644 --- a/src/data/IGLTexture.ts +++ b/src/data/IGLTexture.ts @@ -1,10 +1,10 @@ import { Texture } from "@feng3d/render-api"; -import { IGLCanvasTexture } from "./IGLCanvasTexture"; +import { GLCanvasTexture } from "./GLCanvasTexture"; /** * 类似纹理，包含画布纹理以及正常纹理。 */ -export type IGLTextureLike = IGLCanvasTexture | Texture; +export type IGLTextureLike = GLCanvasTexture | Texture; /** * 纹理绑定点。 diff --git a/src/runs/getIGLBuffer.ts b/src/runs/getIGLBuffer.ts index 544ebae..ecdd73c 100644 --- a/src/runs/getIGLBuffer.ts +++ b/src/runs/getIGLBuffer.ts @@ -1,5 +1,5 @@ import { Buffer, IIndicesDataTypes, IVertexDataTypes, TypedArray } from "@feng3d/render-api"; -import { IGLBufferTarget, IGLBufferUsage, IGLIndexBuffer, IGLUniformBuffer, IGLVertexBuffer } from "../data/IGLBuffer"; +import { IGLBufferTarget, IGLBufferUsage, IGLIndexBuffer, IGLUniformBuffer, GLVertexBuffer } from "../data/IGLBuffer"; export function getIGLBuffer(data: TypedArray, target?: IGLBufferTarget, usage: IGLBufferUsage = "STATIC_DRAW"): Buffer { @@ -26,7 +26,7 @@ export function getIGLUniformBuffer(data: TypedArray, usage?: "DYNAMIC_DRAW") export function getIGLVertexBuffer(data: IVertexDataTypes, usage?: "STREAM_COPY") { - const vertexBuffer: IGLVertexBuffer = data[_IGLBuffer] = data[_IGLBuffer] || getIGLBuffer(data, "ARRAY_BUFFER", usage); + const vertexBuffer: GLVertexBuffer = data[_IGLBuffer] = data[_IGLBuffer] || getIGLBuffer(data, "ARRAY_BUFFER", usage); return vertexBuffer; } -- Gitee From 82b9f39a45de205953df6377e583778539eabfd7 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 12:36:14 +0800 Subject: [PATCH 20/57] TextureImageSource.getInstance --- src/RunWebGL.ts | 8 ++++--- src/data/GLIndexBuffer.ts | 19 ++++++++++++++++ src/data/GLVertexBuffer.ts | 14 ++++++++++++ src/data/IGLBuffer.ts | 33 ---------------------------- src/data/IGLTransformFeedbackPass.ts | 4 ++-- src/data/IGLUniformBuffer.ts | 9 ++++++++ src/index.ts | 5 ++++- src/runs/getIGLBuffer.ts | 7 ++++-- 8 files changed, 58 insertions(+), 41 deletions(-) create mode 100644 src/data/GLIndexBuffer.ts create mode 100644 src/data/GLVertexBuffer.ts create mode 100644 src/data/IGLUniformBuffer.ts diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 0ca6655..18d186d 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, ICullFace, IDrawIndexed, IDrawVertex, IFrontFace, IIndicesDataTypes, IRenderPassObject, Material, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, ICullFace, IDrawIndexed, DrawVertex, IFrontFace, IIndicesDataTypes, IRenderPassObject, Material, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -13,7 +13,7 @@ import { getIGLTextureTarget } from "./caches/getIGLTextureTarget"; import { _GL_Submit_Times } from "./const/const"; import { IGLUniformBufferType } from "./const/IGLUniformType"; import { GLBlitFramebuffer } from "./data/GLBlitFramebuffer"; -import { IGLDrawElementType, IGLUniformBuffer } from "./data/IGLBuffer"; +import { IGLDrawElementType } from "./data/IGLBuffer"; import { IGLCompareFunction, IGLStencilFunc, IGLStencilOp } from "./data/IGLDepthStencilState"; import { IGLOcclusionQuery } from "./data/IGLOcclusionQuery"; import { IGLTextureMagFilter, IGLTextureMinFilter, IGLTextureWrap } from "./data/IGLSampler"; @@ -33,6 +33,7 @@ import { getIGLCullFace, IGLCullFace } from "./utils/getIGLCullFace"; import { getIGLFrontFace, IGLFrontFace } from "./utils/getIGLFrontFace"; import { getIGLVertexFormat } from "./utils/getIVertexFormat"; import { updateBufferBinding } from "./utils/updateBufferBinding"; +import { IGLUniformBuffer } from "./data/IGLUniformBuffer"; declare global { @@ -265,6 +266,7 @@ export class RunWebGL private runDrawIndexed(gl: WebGLRenderingContext, drawMode: IGLDrawMode, indices: IIndicesDataTypes, drawIndexed: IDrawIndexed) { + const type: IGLDrawElementType = indices.BYTES_PER_ELEMENT === 2 ? "UNSIGNED_SHORT" : "UNSIGNED_INT"; // const indexCount = drawIndexed.indexCount; @@ -292,7 +294,7 @@ export class RunWebGL } } - private runDrawVertex(gl: WebGLRenderingContext, drawMode: IGLDrawMode, drawArrays: IDrawVertex) + private runDrawVertex(gl: WebGLRenderingContext, drawMode: IGLDrawMode, drawArrays: DrawVertex) { // const vertexCount = drawArrays.vertexCount; diff --git a/src/data/GLIndexBuffer.ts b/src/data/GLIndexBuffer.ts new file mode 100644 index 0000000..6d57634 --- /dev/null +++ b/src/data/GLIndexBuffer.ts @@ -0,0 +1,19 @@ +import { Buffer, IIndicesDataTypes } from "@feng3d/render-api"; + +/** + * WebGL 顶点索引缓冲。 + * + * 使用 gl.ELEMENT_ARRAY_BUFFER 进行绑定数据。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bindBuffer + * + */ +export class GLIndexBuffer extends Buffer +{ + target: "ELEMENT_ARRAY_BUFFER" = "ELEMENT_ARRAY_BUFFER"; + + /** + * 顶点索引数据。 + */ + declare data?: IIndicesDataTypes; +} \ No newline at end of file diff --git a/src/data/GLVertexBuffer.ts b/src/data/GLVertexBuffer.ts new file mode 100644 index 0000000..c674549 --- /dev/null +++ b/src/data/GLVertexBuffer.ts @@ -0,0 +1,14 @@ +import { Buffer, IVertexDataTypes } from "@feng3d/render-api"; + +/** + * WebGL 顶点缓冲区。 + */ +export class GLVertexBuffer extends Buffer +{ + target: "ARRAY_BUFFER" = "ARRAY_BUFFER"; + + /** + * 缓冲区数据。 + */ + declare data?: IVertexDataTypes; +} diff --git a/src/data/IGLBuffer.ts b/src/data/IGLBuffer.ts index ef99bdd..dade0bc 100644 --- a/src/data/IGLBuffer.ts +++ b/src/data/IGLBuffer.ts @@ -20,39 +20,6 @@ declare module "@feng3d/render-api" } } -export class GLVertexBuffer extends Buffer -{ - target: "ARRAY_BUFFER" = "ARRAY_BUFFER"; - - /** - * 缓冲区数据。 - */ - declare data?: IVertexDataTypes; -} - -/** - * WebGL元素缓冲，顶点索引缓冲。 - * - * 使用 gl.ELEMENT_ARRAY_BUFFER 进行绑定数据。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bindBuffer - * - */ -export interface IGLIndexBuffer extends Buffer -{ - target: "ELEMENT_ARRAY_BUFFER"; - - /** - * 顶点索引数据。 - */ - data: IIndicesDataTypes; -} - -export interface IGLUniformBuffer extends Buffer -{ - target: "UNIFORM_BUFFER"; -} - /** * 元素缓冲数据类型。 * diff --git a/src/data/IGLTransformFeedbackPass.ts b/src/data/IGLTransformFeedbackPass.ts index 61d0858..46a76dd 100644 --- a/src/data/IGLTransformFeedbackPass.ts +++ b/src/data/IGLTransformFeedbackPass.ts @@ -1,4 +1,4 @@ -import { IDrawVertex, Uniforms, VertexAttributes, VertexState } from "@feng3d/render-api"; +import { DrawVertex, Uniforms, VertexAttributes, VertexState } from "@feng3d/render-api"; import { IGLTransformFeedback } from "./IGLTransformFeedback"; declare module "@feng3d/render-api" @@ -39,7 +39,7 @@ export interface IGLTransformFeedbackObject * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawVertex */ - readonly draw: IDrawVertex; + readonly draw: DrawVertex; /** * Uniform渲染数据 diff --git a/src/data/IGLUniformBuffer.ts b/src/data/IGLUniformBuffer.ts new file mode 100644 index 0000000..db28bb3 --- /dev/null +++ b/src/data/IGLUniformBuffer.ts @@ -0,0 +1,9 @@ +import { Buffer } from "@feng3d/render-api"; + +/** + * WebGL 统一缓冲区。 + */ +export class IGLUniformBuffer extends Buffer +{ + target: "UNIFORM_BUFFER" = "UNIFORM_BUFFER"; +} diff --git a/src/index.ts b/src/index.ts index fd23343..227e464 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,6 +1,8 @@ export * from "./data/GLBlitFramebuffer"; -export * from "./data/IGLBuffer"; export * from "./data/GLCanvasContext"; +export * from "./data/GLIndexBuffer"; +export * from "./data/GLVertexBuffer"; +export * from "./data/IGLBuffer"; export * from "./data/IGLCapabilities"; export * from "./data/IGLCommandEncoder"; export * from "./data/IGLDepthStencilState"; @@ -15,6 +17,7 @@ export * from "./data/IGLTexture"; export * from "./data/IGLTexturePixelStore"; export * from "./data/IGLTransformFeedback"; export * from "./data/IGLTransformFeedbackPass"; +export * from "./data/IGLUniformBuffer"; export * from "./data/IGLUniforms"; export * from "./runs/getIGLBuffer"; diff --git a/src/runs/getIGLBuffer.ts b/src/runs/getIGLBuffer.ts index ecdd73c..74ceb9d 100644 --- a/src/runs/getIGLBuffer.ts +++ b/src/runs/getIGLBuffer.ts @@ -1,5 +1,8 @@ import { Buffer, IIndicesDataTypes, IVertexDataTypes, TypedArray } from "@feng3d/render-api"; -import { IGLBufferTarget, IGLBufferUsage, IGLIndexBuffer, IGLUniformBuffer, GLVertexBuffer } from "../data/IGLBuffer"; +import { GLIndexBuffer } from "../data/GLIndexBuffer"; +import { IGLBufferTarget, IGLBufferUsage } from "../data/IGLBuffer"; +import { GLVertexBuffer } from "../data/GLVertexBuffer"; +import { IGLUniformBuffer } from "../data/IGLUniformBuffer"; export function getIGLBuffer(data: TypedArray, target?: IGLBufferTarget, usage: IGLBufferUsage = "STATIC_DRAW"): Buffer { @@ -33,7 +36,7 @@ export function getIGLVertexBuffer(data: IVertexDataTypes, usage?: "STREAM_COPY" export function getIGLIndexBuffer(indices: IIndicesDataTypes) { - const indexBuffer: IGLIndexBuffer = indices[_IGLBuffer] = indices[_IGLBuffer] || getIGLBuffer(indices, "ELEMENT_ARRAY_BUFFER"); + const indexBuffer: GLIndexBuffer = indices[_IGLBuffer] = indices[_IGLBuffer] || getIGLBuffer(indices, "ELEMENT_ARRAY_BUFFER"); return indexBuffer; } -- Gitee From 93b779257dc19e3f963496a33059ee436f36067b Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 14:11:33 +0800 Subject: [PATCH 21/57] DrawIndexed --- src/RunWebGL.ts | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 18d186d..14a45ac 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, ICullFace, IDrawIndexed, DrawVertex, IFrontFace, IIndicesDataTypes, IRenderPassObject, Material, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, DrawIndexed, DrawVertex, ICullFace, IFrontFace, IIndicesDataTypes, IRenderPassObject, Material, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -21,6 +21,7 @@ import { IGLSamplerTexture } from "./data/IGLSamplerTexture"; import { IGLTextureTarget } from "./data/IGLTexture"; import { IGLTransformFeedback } from "./data/IGLTransformFeedback"; import { IGLTransformFeedbackObject, IGLTransformFeedbackPass, IGLTransformFeedbackPipeline } from "./data/IGLTransformFeedbackPass"; +import { IGLUniformBuffer } from "./data/IGLUniformBuffer"; import { IUniformItemInfo } from "./data/IGLUniformInfo"; import { getGLTexture } from "./internal"; import { getIGLIndexBuffer, getIGLUniformBuffer, getIGLVertexBuffer } from "./runs/getIGLBuffer"; @@ -33,7 +34,6 @@ import { getIGLCullFace, IGLCullFace } from "./utils/getIGLCullFace"; import { getIGLFrontFace, IGLFrontFace } from "./utils/getIGLFrontFace"; import { getIGLVertexFormat } from "./utils/getIVertexFormat"; import { updateBufferBinding } from "./utils/updateBufferBinding"; -import { IGLUniformBuffer } from "./data/IGLUniformBuffer"; declare global { @@ -264,9 +264,8 @@ export class RunWebGL } } - private runDrawIndexed(gl: WebGLRenderingContext, drawMode: IGLDrawMode, indices: IIndicesDataTypes, drawIndexed: IDrawIndexed) + private runDrawIndexed(gl: WebGLRenderingContext, drawMode: IGLDrawMode, indices: IIndicesDataTypes, drawIndexed: DrawIndexed) { - const type: IGLDrawElementType = indices.BYTES_PER_ELEMENT === 2 ? "UNSIGNED_SHORT" : "UNSIGNED_INT"; // const indexCount = drawIndexed.indexCount; -- Gitee From cdd773b18d119cf30435fd9b7a244588dfcdceb9 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 14:25:22 +0800 Subject: [PATCH 22/57] extends Data --- src/data/GLCanvasContext.ts | 26 +++----------------------- 1 file changed, 3 insertions(+), 23 deletions(-) diff --git a/src/data/GLCanvasContext.ts b/src/data/GLCanvasContext.ts index 5139598..166010b 100644 --- a/src/data/GLCanvasContext.ts +++ b/src/data/GLCanvasContext.ts @@ -1,9 +1,11 @@ +import { Data } from "@feng3d/render-api"; + /** * 画布(WebGL)上下文信息。 * * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext */ -export class GLCanvasContext implements WebGLContextAttributes +export class GLCanvasContext extends Data implements WebGLContextAttributes { /** * 画布编号。 @@ -22,26 +24,4 @@ export class GLCanvasContext implements WebGLContextAttributes preserveDrawingBuffer?: boolean = false; powerPreference?: WebGLPowerPreference = "default"; failIfMajorPerformanceCaveat?: boolean = false; - - constructor(canvasContext?: GLCanvasContext) - { - if (!canvasContext) return; - - for (var key in canvasContext) - { - if (canvasContext.hasOwnProperty(key)) - { - this[key] = canvasContext[key]; - } - } - } - - static getInstance(context: GLCanvasContext): GLCanvasContext - { - if (!context) return undefined; - - if (context instanceof GLCanvasContext) return context; - - return new GLCanvasContext(context); - } } \ No newline at end of file -- Gitee From 388fd5c4608a488907a657d8f6244ca978bade80 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 19:22:52 +0800 Subject: [PATCH 23/57] =?UTF-8?q?=5F=5Ftype=20=E8=B0=83=E6=95=B4=E4=B8=BA?= =?UTF-8?q?=20=5F=5Ftype=5F=5F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- examples/src/WebGL2Samples/buffer_copy.ts | 4 ++-- examples/src/WebGL2Samples/buffer_uniform.ts | 2 +- examples/src/WebGL2Samples/draw_image_space.ts | 2 +- examples/src/WebGL2Samples/draw_instanced.ts | 2 +- examples/src/WebGL2Samples/draw_instanced_ubo.ts | 2 +- .../src/WebGL2Samples/draw_primitive_restart.ts | 2 +- examples/src/WebGL2Samples/draw_range_arrays.ts | 4 ++-- examples/src/WebGL2Samples/fbo_blit.ts | 6 +++--- examples/src/WebGL2Samples/fbo_multisample.ts | 4 ++-- .../src/WebGL2Samples/fbo_new_blend_equation.ts | 2 +- examples/src/WebGL2Samples/fbo_read_pixels.ts | 4 ++-- .../src/WebGL2Samples/fbo_rtt_depth_texture.ts | 4 ++-- .../src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 4 ++-- .../src/WebGL2Samples/fbo_rtt_texture_array.ts | 6 +++--- examples/src/WebGL2Samples/geo_vertex_format.ts | 2 +- examples/src/WebGL2Samples/glsl_centroid.ts | 6 +++--- .../glsl_flat_smooth_interpolators.ts | 2 +- .../src/WebGL2Samples/glsl_non_square_matrix.ts | 2 +- examples/src/WebGL2Samples/query_occlusion.ts | 6 +++--- examples/src/WebGL2Samples/sampler_filter.ts | 2 +- examples/src/WebGL2Samples/sampler_object.ts | 2 +- examples/src/WebGL2Samples/sampler_wrap.ts | 4 ++-- examples/src/WebGL2Samples/texture_2d_array.ts | 4 ++-- examples/src/WebGL2Samples/texture_3d.ts | 4 ++-- examples/src/WebGL2Samples/texture_derivative.ts | 2 +- examples/src/WebGL2Samples/texture_fetch.ts | 2 +- examples/src/WebGL2Samples/texture_format.ts | 4 ++-- examples/src/WebGL2Samples/texture_grad.ts | 2 +- examples/src/WebGL2Samples/texture_immutable.ts | 4 ++-- examples/src/WebGL2Samples/texture_integer.ts | 2 +- examples/src/WebGL2Samples/texture_lod.ts | 2 +- examples/src/WebGL2Samples/texture_offset.ts | 4 ++-- .../src/WebGL2Samples/texture_pixel_store.ts | 4 ++-- examples/src/WebGL2Samples/texture_srgb.ts | 2 +- examples/src/WebGL2Samples/texture_vertex.ts | 2 +- .../transform_feedback_instanced.ts | 6 +++--- .../transform_feedback_interleaved.ts | 6 +++--- .../transform_feedback_separated.ts | 6 +++--- .../transform_feedback_separated_2.ts | 6 +++--- examples/src/regl-examples/basic.ts | 2 +- examples/src/regl-examples/batch.ts | 2 +- examples/src/regl-examples/bunny.ts | 2 +- examples/src/regl-examples/camera.ts | 2 +- examples/src/regl-examples/cloth.ts | 2 +- examples/src/regl-examples/cube.ts | 2 +- examples/src/test/RenderObjectChanges.ts | 2 +- examples/src/test/fractalCube.ts | 4 ++-- examples/src/webgl-examples/sample1.ts | 2 +- examples/src/webgl-examples/sample2.ts | 2 +- examples/src/webgl-examples/sample3.ts | 2 +- examples/src/webgl-examples/sample4.ts | 2 +- examples/src/webgl-examples/sample5.ts | 2 +- examples/src/webgl-examples/sample6.ts | 2 +- examples/src/webgl-examples/sample7.ts | 2 +- examples/src/webgl-examples/sample8.ts | 4 ++-- src/RunWebGL.ts | 16 ++++++++-------- src/caches/getGLRenderOcclusionQuery.ts | 2 +- src/caches/getIGLBlitFramebuffer.ts | 2 +- .../getIGLRenderPassDescriptorWithMultisample.ts | 2 +- src/data/GLBlitFramebuffer.ts | 2 +- src/data/IGLOcclusionQuery.ts | 2 +- src/data/IGLTransformFeedbackPass.ts | 2 +- 62 files changed, 100 insertions(+), 100 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index bae2d15..5401869 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -34,7 +34,7 @@ import { getShaderSource } from "./utility"; const vertexPosBufferDst = new Float32Array(vertices.length); const cb: CopyBufferToBuffer = { - __type: "CopyBufferToBuffer", + __type__: "CopyBufferToBuffer", source: vertexPosBufferSrc, destination: getIGLBuffer(vertexPosBufferDst, "ARRAY_BUFFER"), sourceOffset: 0, destinationOffset: 0, size: vertices.length * Float32Array.BYTES_PER_ELEMENT @@ -55,7 +55,7 @@ import { getShaderSource } from "./utility"; geometry:{ primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, }, }] }; diff --git a/examples/src/WebGL2Samples/buffer_uniform.ts b/examples/src/WebGL2Samples/buffer_uniform.ts index 2ba366d..8e19248 100644 --- a/examples/src/WebGL2Samples/buffer_uniform.ts +++ b/examples/src/WebGL2Samples/buffer_uniform.ts @@ -91,7 +91,7 @@ import { getShaderSource } from "./utility"; geometry:{ vertices: vertexArray.vertices, indices: elementData, - draw: { __type: "DrawIndexed", indexCount: 6, firstIndex: 0 } + draw: { __type__: "DrawIndexed", indexCount: 6, firstIndex: 0 } }, }; diff --git a/examples/src/WebGL2Samples/draw_image_space.ts b/examples/src/WebGL2Samples/draw_image_space.ts index 1cb9d25..b642697 100644 --- a/examples/src/WebGL2Samples/draw_image_space.ts +++ b/examples/src/WebGL2Samples/draw_image_space.ts @@ -40,7 +40,7 @@ loadImage("../../assets/img/Di-3d.png", (img) => }, geometry: { primitive: { topology: "triangle-list" }, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 3 }, + draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 3 }, }, pipeline: program }; diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index 8a458d2..5dcb747 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -35,7 +35,7 @@ const renderObject: RenderObject = { geometry:{ primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: 2 }, + draw: { __type__: "DrawVertex", vertexCount: 3, instanceCount: 2 }, }, pipeline: program }; diff --git a/examples/src/WebGL2Samples/draw_instanced_ubo.ts b/examples/src/WebGL2Samples/draw_instanced_ubo.ts index cfdc242..39a3240 100644 --- a/examples/src/WebGL2Samples/draw_instanced_ubo.ts +++ b/examples/src/WebGL2Samples/draw_instanced_ubo.ts @@ -58,7 +58,7 @@ const rp: RenderPass = { vertices: { pos: { data: vertices, format: "float32x2" }, }, - draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: 2 }, + draw: { __type__: "DrawVertex", vertexCount: 3, instanceCount: 2 }, } }] }; diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index fc8624e..bf0c714 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -48,7 +48,7 @@ const renderObject: RenderObject = { primitive: { topology: "triangle-strip" }, vertices: vertexArray.vertices, indices, - draw: { __type: "DrawIndexed", indexCount: 7, instanceCount: 2 }, + draw: { __type__: "DrawIndexed", indexCount: 7, instanceCount: 2 }, }, pipeline: program, }; diff --git a/examples/src/WebGL2Samples/draw_range_arrays.ts b/examples/src/WebGL2Samples/draw_range_arrays.ts index 76a1c70..926431c 100644 --- a/examples/src/WebGL2Samples/draw_range_arrays.ts +++ b/examples/src/WebGL2Samples/draw_range_arrays.ts @@ -65,7 +65,7 @@ const rp: RenderPass = { viewport: { x: 0, y: 0, width: canvas.width / 2, height: canvas.height }, geometry: { ...renderObject.geometry, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: vertexCount / 2 }, + draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: vertexCount / 2 }, } }, { @@ -73,7 +73,7 @@ const rp: RenderPass = { viewport: { x: canvas.width / 2, y: 0, width: canvas.width / 2, height: canvas.height }, geometry: { ...renderObject.geometry, - draw: { __type: "DrawVertex", firstVertex: 6, vertexCount: vertexCount / 2 }, + draw: { __type__: "DrawVertex", firstVertex: 6, vertexCount: vertexCount / 2 }, }, }, ], diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 4f3d90a..c3d5bcb 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -93,7 +93,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 6 } + draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 6 } } }; @@ -144,7 +144,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => } const blitFramebuffer: GLBlitFramebuffer = { - __type: "BlitFramebuffer", + __type__: "BlitFramebuffer", read: fboRenderPass.descriptor, draw: renderPassResolve.descriptor, blitFramebuffers, @@ -163,7 +163,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => }, geometry: { vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 6 }, + draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 6 }, }, pipeline: program, }; diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index 4b8e677..5dc4c40 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -106,7 +106,7 @@ const renderPass1: RenderPass = { geometry: { primitive: { topology: "LINE_LOOP" }, vertices: vertexArrays[PROGRAM.TEXTURE].vertices, - draw: { __type: "DrawVertex", vertexCount }, + draw: { __type__: "DrawVertex", vertexCount }, } }] }; @@ -127,7 +127,7 @@ const renderPass2: RenderPass = { geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArrays[PROGRAM.SPLASH].vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } } ], diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index 9d0d5c0..8fbb5de 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -124,7 +124,7 @@ function render() uniforms: { mvp: matrix, diffuse: { texture, sampler } }, geometry:{ vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }; diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index 8b90d8c..ef52199 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -136,7 +136,7 @@ const rp1: RenderPass = { geometry:{ primitive: { topology: "triangle-list" }, vertices: multipleOutputVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }], }; @@ -157,7 +157,7 @@ const ro: RenderObject = { }, geometry:{ vertices: layerVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }; diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index c7ae32d..a9b1201 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -97,7 +97,7 @@ const renderPass: RenderPass = { geometry:{ primitive: { topology: "triangle-list" }, vertices: triVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 3 }, + draw: { __type__: "DrawVertex", vertexCount: 3 }, } }], @@ -114,7 +114,7 @@ const rp2: RenderPass = { geometry:{ primitive: { topology: "triangle-list" }, vertices: quadVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }], }; diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index 1b1f7b6..f46d268 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -103,7 +103,7 @@ const renderPass: RenderPass = { geometry:{ primitive: { topology: "triangle-list" }, vertices: triVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 3 }, + draw: { __type__: "DrawVertex", vertexCount: 3 }, } }], }; @@ -120,7 +120,7 @@ const renderPass2: RenderPass = { geometry:{ primitive: { topology: "triangle-list" }, vertices: quadVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }], }; diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index 1c2a772..c513eef 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -138,7 +138,7 @@ const renderPass1: RenderPass = { geometry:{ primitive: { topology: "triangle-list" }, vertices: multipleOutputVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }] }; @@ -158,7 +158,7 @@ const renderObject: RenderObject = { geometry: { primitive: { topology: "triangle-list" }, vertices: layerVertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }; @@ -172,7 +172,7 @@ for (let i = 0; i < Textures.MAX; ++i) uniforms: { ...renderObject.uniforms, layer: i }, geometry: { ...renderObject.geometry, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } } ); diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index 96d8af8..511a800 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -212,7 +212,7 @@ import { getShaderSource, loadImage } from "./utility"; primitive: { topology: "triangle-list", cullFace: "back" }, vertices: vertexArray.vertices, indices: new Uint16Array(cubeVertexIndices), - draw: { __type: "DrawIndexed", indexCount: 36 }, + draw: { __type__: "DrawIndexed", indexCount: 36 }, } }; diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index fb202c3..baa1c2f 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -165,7 +165,7 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArrays[i].vertices, - draw: { __type: "DrawVertex", vertexCount }, + draw: { __type__: "DrawVertex", vertexCount }, } }] }; @@ -182,7 +182,7 @@ const ro: RenderObject = { geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArrays[PROGRAM.SPLASH].vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, }, }; @@ -203,7 +203,7 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) diffuse: { texture: textures[i], sampler: samplers[i] }, }, geometry: { - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } } ); diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index 05623ab..6b5f718 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -177,7 +177,7 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, indices, - draw: { __type: "DrawIndexed", indexCount: primitive.indices.length, firstIndex: 0 }, + draw: { __type__: "DrawIndexed", indexCount: primitive.indices.length, firstIndex: 0 }, }, }); } diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index b9de17a..faa3a26 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -71,7 +71,7 @@ loadImage("../../assets/img/Di-3d.png", function (image) geometry:{ primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }] }; diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index 7a665b8..d0c1d5b 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -55,18 +55,18 @@ const ro: RenderObject = { geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 3 }, + draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 3 }, } }; renderObjects.push(ro); const occlusionQuery: IGLOcclusionQuery = { - __type: "OcclusionQuery", + __type__: "OcclusionQuery", renderObjects: [{ ...ro, geometry: { ...ro.geometry, - draw: { __type: "DrawVertex", firstVertex: 3, vertexCount: 3 }, + draw: { __type__: "DrawVertex", firstVertex: 3, vertexCount: 3 }, } }] }; diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index 5093980..a2921ac 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -153,7 +153,7 @@ function render() geometry:{ primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + draw: { __type__: "DrawVertex", vertexCount: 6, instanceCount: 1 }, } }; diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index 76454be..fc3d846 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -97,7 +97,7 @@ function render() geometry:{ primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + draw: { __type__: "DrawVertex", vertexCount: 6, instanceCount: 1 }, } }], }; diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index e7dd3ee..8898eea 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -151,7 +151,7 @@ function render() geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + draw: { __type__: "DrawVertex", vertexCount: 6, instanceCount: 1 }, } }; @@ -167,7 +167,7 @@ function render() }, geometry: { ...ro.geometry, - draw: { __type: "DrawVertex", vertexCount: 6, instanceCount: 1 }, + draw: { __type__: "DrawVertex", vertexCount: 6, instanceCount: 1 }, } }); } diff --git a/examples/src/WebGL2Samples/texture_2d_array.ts b/examples/src/WebGL2Samples/texture_2d_array.ts index b3d528c..8c2c355 100644 --- a/examples/src/WebGL2Samples/texture_2d_array.ts +++ b/examples/src/WebGL2Samples/texture_2d_array.ts @@ -68,7 +68,7 @@ import { getShaderSource, loadImage } from "./utility"; size: [IMAGE_SIZE.width, IMAGE_SIZE.height, NUM_IMAGES], dimension: "2d-array", format: "rgba8unorm", - sources: [{ __type: "TextureDataSource", size: [IMAGE_SIZE.width, IMAGE_SIZE.height, NUM_IMAGES], data: pixels }], + sources: [{ __type__: "TextureDataSource", size: [IMAGE_SIZE.width, IMAGE_SIZE.height, NUM_IMAGES], data: pixels }], }; sampler = { minFilter: "linear", @@ -90,7 +90,7 @@ import { getShaderSource, loadImage } from "./utility"; }, geometry:{ vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }; diff --git a/examples/src/WebGL2Samples/texture_3d.ts b/examples/src/WebGL2Samples/texture_3d.ts index c71e022..295a28d 100644 --- a/examples/src/WebGL2Samples/texture_3d.ts +++ b/examples/src/WebGL2Samples/texture_3d.ts @@ -84,7 +84,7 @@ import { getShaderSource } from "./utility"; dimension: "3d", format: "r8unorm", generateMipmap: true, - sources: [{ __type: "TextureDataSource", mipLevel: 0, size: [SIZE, SIZE, SIZE], data }], + sources: [{ __type__: "TextureDataSource", mipLevel: 0, size: [SIZE, SIZE, SIZE], data }], }; const sampler: Sampler = { lodMinClamp: 0, @@ -164,7 +164,7 @@ import { getShaderSource } from "./utility"; }, geometry:{ vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 } + draw: { __type__: "DrawVertex", vertexCount: 6 } } }; diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index 435f789..8716464 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -212,7 +212,7 @@ import { getShaderSource, loadImage } from "./utility"; primitive: { topology: "triangle-list", cullFace: "back" }, vertices: vertexArray.vertices, indices: new Uint16Array(cubeVertexIndices), - draw: { __type: "DrawIndexed", indexCount: 36 }, + draw: { __type__: "DrawIndexed", indexCount: 36 }, } }; diff --git a/examples/src/WebGL2Samples/texture_fetch.ts b/examples/src/WebGL2Samples/texture_fetch.ts index 1bd9cd4..d02de3a 100644 --- a/examples/src/WebGL2Samples/texture_fetch.ts +++ b/examples/src/WebGL2Samples/texture_fetch.ts @@ -79,7 +79,7 @@ import { getShaderSource, loadImage } from "./utility"; }, geometry:{ vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } } ], diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index d7bbe07..5b72450 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -181,7 +181,7 @@ import { getShaderSource, loadImage } from "./utility"; }, geometry:{ vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }); } @@ -199,7 +199,7 @@ import { getShaderSource, loadImage } from "./utility"; }, geometry:{ vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }); } diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index 44c68a5..ad2c0c5 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -203,7 +203,7 @@ import { getShaderSource, loadImage } from "./utility"; primitive: { cullFace: "back" }, vertices: vertexArray.vertices, indices: new Uint16Array(cubeVertexIndices), - draw: { __type: "DrawIndexed", indexCount: 36 }, + draw: { __type__: "DrawIndexed", indexCount: 36 }, } }; diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index 0aab883..40060f0 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -106,7 +106,7 @@ import { getShaderSource, loadImage } from "./utility"; }, geometry:{ vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }; @@ -174,7 +174,7 @@ import { getShaderSource, loadImage } from "./utility"; generateMipmap: true, mipLevelCount: Math.log2(SIZE), size: [SIZE, SIZE, SIZE], - sources: [{ __type: "TextureDataSource", size: [SIZE, SIZE, SIZE], data }], + sources: [{ __type__: "TextureDataSource", size: [SIZE, SIZE, SIZE], data }], }; const sampler3D: Sampler = { lodMinClamp: 0, diff --git a/examples/src/WebGL2Samples/texture_integer.ts b/examples/src/WebGL2Samples/texture_integer.ts index 9ea009f..31f4107 100644 --- a/examples/src/WebGL2Samples/texture_integer.ts +++ b/examples/src/WebGL2Samples/texture_integer.ts @@ -77,7 +77,7 @@ import { getShaderSource, loadImage } from "./utility"; }, geometry:{ vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }; diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index 4a3b981..30f6f1f 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -204,7 +204,7 @@ import { getShaderSource, loadImage } from "./utility"; }, geometry:{ vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }; diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index 3cd8c4f..eb6811b 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -109,7 +109,7 @@ import { getShaderSource, loadImage } from "./utility"; }, geometry: { vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }); @@ -127,7 +127,7 @@ import { getShaderSource, loadImage } from "./utility"; }, geometry: { vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }); diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index 7a5d587..f328556 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -63,7 +63,7 @@ import { getShaderSource, loadImage } from "./utility"; size: [image.width / 2, image.height / 2], format: "rgba8unorm", sources: [{ - __type: "TextureDataSource", + __type__: "TextureDataSource", mipLevel: 0, size: [image.width / 2, image.height / 2], data: pixels, @@ -99,7 +99,7 @@ import { getShaderSource, loadImage } from "./utility"; geometry:{ vertices: vertexArray.vertices, indices: vertexArray.indices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }); diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index 9fb9bf4..25b02d7 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -89,7 +89,7 @@ import { getShaderSource, loadImage } from "./utility"; }, geometry:{ vertices, - draw: { __type: "DrawVertex", vertexCount: 6 }, + draw: { __type__: "DrawVertex", vertexCount: 6 }, } }); diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index f8789d2..8c657f8 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -224,7 +224,7 @@ import { getShaderSource, loadImage } from "./utility"; primitive: { topology: IDrawMode2Name[primitive.mode] }, vertices: vertexArrayMaps[mid][i].vertices, indices: vertexArrayMaps[mid][i].indices, - draw: { __type: "DrawIndexed", indexCount: primitive.indices.length } + draw: { __type__: "DrawIndexed", indexCount: primitive.indices.length } } }); } diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index eded525..5f7fc00 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -135,7 +135,7 @@ import { getShaderSource } from "./utility"; vertices: null, transformFeedback: null, uniforms: {}, - draw: { __type: "DrawVertex", vertexCount: NUM_INSTANCES }, + draw: { __type__: "DrawVertex", vertexCount: NUM_INSTANCES }, }; const renderRO: RenderObject = { @@ -144,7 +144,7 @@ import { getShaderSource } from "./utility"; uniforms: {}, geometry:{ primitive: { topology: "triangle-list" }, - draw: { __type: "DrawVertex", vertexCount: 3, instanceCount: NUM_INSTANCES }, + draw: { __type__: "DrawVertex", vertexCount: 3, instanceCount: NUM_INSTANCES }, } }; @@ -152,7 +152,7 @@ import { getShaderSource } from "./utility"; commandEncoders: [{ passEncoders: [ { - __type: "TransformFeedbackPass", + __type__: "TransformFeedbackPass", transformFeedbackObjects: [transformRO], }, { diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index 3370803..90d67c9 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -88,14 +88,14 @@ import { getShaderSource } from "./utility"; commandEncoders: [{ passEncoders: [ { - __type: "TransformFeedbackPass", + __type__: "TransformFeedbackPass", transformFeedbackObjects: [ { pipeline: programTransform, vertices: vertexArrays[PROGRAM_TRANSFORM].vertices, uniforms: { MVP: matrix }, transformFeedback, - draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, + draw: { __type__: "DrawVertex", vertexCount: VERTEX_COUNT }, } ], }, @@ -108,7 +108,7 @@ import { getShaderSource } from "./utility"; geometry:{ vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, indices: vertexArrays[PROGRAM_FEEDBACK].indices, - draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, + draw: { __type__: "DrawVertex", vertexCount: VERTEX_COUNT }, }, } ], diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index 6eee1a9..608ec64 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -99,14 +99,14 @@ import { getShaderSource } from "./utility"; commandEncoders: [{ passEncoders: [ { - __type: "TransformFeedbackPass", + __type__: "TransformFeedbackPass", transformFeedbackObjects: [ { pipeline: programTransform, vertices: vertexArrays[PROGRAM_TRANSFORM].vertices, uniforms: { MVP: matrix }, transformFeedback, - draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, + draw: { __type__: "DrawVertex", vertexCount: VERTEX_COUNT }, } ] }, @@ -119,7 +119,7 @@ import { getShaderSource } from "./utility"; geometry: { vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, indices: vertexArrays[PROGRAM_FEEDBACK].indices, - draw: { __type: "DrawVertex", vertexCount: VERTEX_COUNT }, + draw: { __type__: "DrawVertex", vertexCount: VERTEX_COUNT }, } } ], diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 22b98e9..6a11804 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -138,7 +138,7 @@ import { getShaderSource } from "./utility"; uniforms: { u_acceleration: [0.0, ACCELERATION], }, - draw: { __type: "DrawVertex", vertexCount: NUM_PARTICLES }, + draw: { __type__: "DrawVertex", vertexCount: NUM_PARTICLES }, }; const renderRO: RenderObject = { @@ -148,7 +148,7 @@ import { getShaderSource } from "./utility"; u_color: [0.0, 1.0, 1.0, 1.0], }, geometry:{ - draw: { __type: "DrawVertex", vertexCount: NUM_PARTICLES }, + draw: { __type__: "DrawVertex", vertexCount: NUM_PARTICLES }, primitive: { topology: "point-list" }, } }; @@ -157,7 +157,7 @@ import { getShaderSource } from "./utility"; commandEncoders: [{ passEncoders: [ { - __type: "TransformFeedbackPass", + __type__: "TransformFeedbackPass", transformFeedbackObjects: [transformRO], }, { diff --git a/examples/src/regl-examples/basic.ts b/examples/src/regl-examples/basic.ts index 49634e3..86ff395 100644 --- a/examples/src/regl-examples/basic.ts +++ b/examples/src/regl-examples/basic.ts @@ -28,7 +28,7 @@ const renderObject: RenderObject = { format: "float32x2", }, }, - draw: { __type: "DrawVertex", vertexCount: 3 }, + draw: { __type__: "DrawVertex", vertexCount: 3 }, }, uniforms: { color: [1, 0, 0, 1] }, pipeline: { diff --git a/examples/src/regl-examples/batch.ts b/examples/src/regl-examples/batch.ts index f416eb6..42148cf 100644 --- a/examples/src/regl-examples/batch.ts +++ b/examples/src/regl-examples/batch.ts @@ -59,7 +59,7 @@ function getRenderObject(batchId: number) const renderObject: RenderObject = { geometry: { vertices: vertexArray.vertices, - draw: { __type: "DrawVertex", vertexCount: 3 } + draw: { __type__: "DrawVertex", vertexCount: 3 } }, uniforms: { offset: offsets[batchId].offset, diff --git a/examples/src/regl-examples/bunny.ts b/examples/src/regl-examples/bunny.ts index e2d3b4c..6b97135 100644 --- a/examples/src/regl-examples/bunny.ts +++ b/examples/src/regl-examples/bunny.ts @@ -36,7 +36,7 @@ const renderObject: RenderObject = { position: { data: new Float32Array(positions), format: "float32x3" }, }, indices: new Uint16Array(indices), - draw: { __type: "DrawIndexed", indexCount: indices.length }, + draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, uniforms: { model: mat4.identity([]), diff --git a/examples/src/regl-examples/camera.ts b/examples/src/regl-examples/camera.ts index fbe1b28..0527643 100644 --- a/examples/src/regl-examples/camera.ts +++ b/examples/src/regl-examples/camera.ts @@ -28,7 +28,7 @@ const renderObject: RenderObject = { normal: { data: new Float32Array(normals), format: "float32x3" }, }, indices: new Uint16Array(indices), - draw: { __type: "DrawIndexed", indexCount: indices.length }, + draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, uniforms: {}, pipeline: { diff --git a/examples/src/regl-examples/cloth.ts b/examples/src/regl-examples/cloth.ts index feaa7dc..f89317c 100644 --- a/examples/src/regl-examples/cloth.ts +++ b/examples/src/regl-examples/cloth.ts @@ -172,7 +172,7 @@ import * as vec3 from "./stackgl/gl-vec3"; uv: { data: new Float32Array(uvs), format: "float32x2" }, }, indices: new Uint16Array(indices), - draw: { __type: "DrawIndexed", indexCount: indices.length }, + draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, uniforms: {}, pipeline: { diff --git a/examples/src/regl-examples/cube.ts b/examples/src/regl-examples/cube.ts index 3261afb..90861b4 100644 --- a/examples/src/regl-examples/cube.ts +++ b/examples/src/regl-examples/cube.ts @@ -71,7 +71,7 @@ import * as mat4 from "./stackgl/gl-mat4"; uv: { data: new Float32Array(uvs), format: "float32x2" }, }, indices: new Uint16Array(indices), - draw: { __type: "DrawIndexed", indexCount: indices.length }, + draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, uniforms: {}, pipeline: { diff --git a/examples/src/test/RenderObjectChanges.ts b/examples/src/test/RenderObjectChanges.ts index d394572..abfa6ad 100644 --- a/examples/src/test/RenderObjectChanges.ts +++ b/examples/src/test/RenderObjectChanges.ts @@ -33,7 +33,7 @@ const init = async (canvas: HTMLCanvasElement) => position: { data: new Float32Array([0.0, 0.5, -0.5, -0.5, 0.5, -0.5]), format: "float32x2" }, // 顶点坐标数据 }, indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 - draw: { __type: "DrawIndexed", indexCount: 3 }, // 绘制命令 + draw: { __type__: "DrawIndexed", indexCount: 3 }, // 绘制命令 }, uniforms: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 }; diff --git a/examples/src/test/fractalCube.ts b/examples/src/test/fractalCube.ts index e2999b9..b1890c6 100644 --- a/examples/src/test/fractalCube.ts +++ b/examples/src/test/fractalCube.ts @@ -74,7 +74,7 @@ async function main() }, }, indices: buffers.indices, - draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, + draw: { __type__: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, uniforms: { uSampler: texture }, }; @@ -92,7 +92,7 @@ async function main() }, // 从画布中拷贝到纹理。 { - __type: "CopyTextureToTexture", + __type__: "CopyTextureToTexture", source: { texture: null }, // 当值设置为 null或者undefined时表示当前画布。 destination: { texture: texture.texture }, copySize: [canvas.width, canvas.height], diff --git a/examples/src/webgl-examples/sample1.ts b/examples/src/webgl-examples/sample1.ts index eef5b55..92e4a71 100644 --- a/examples/src/webgl-examples/sample1.ts +++ b/examples/src/webgl-examples/sample1.ts @@ -44,7 +44,7 @@ const init = async (canvas: HTMLCanvasElement) => position: { data: new Float32Array([0.0, 0.5, -0.5, -0.5, 0.5, -0.5]), format: "float32x2" }, // 顶点坐标数据 }, indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 - draw: { __type: "DrawIndexed", indexCount: 3 }, // 绘制命令 + draw: { __type__: "DrawIndexed", indexCount: 3 }, // 绘制命令 }, uniforms: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 }] diff --git a/examples/src/webgl-examples/sample2.ts b/examples/src/webgl-examples/sample2.ts index 400ee66..488fc85 100644 --- a/examples/src/webgl-examples/sample2.ts +++ b/examples/src/webgl-examples/sample2.ts @@ -54,7 +54,7 @@ function main() ]), } }, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, + draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }, uniforms: { uProjectionMatrix: projectionMatrix, diff --git a/examples/src/webgl-examples/sample3.ts b/examples/src/webgl-examples/sample3.ts index 5d5b9f8..3af150d 100644 --- a/examples/src/webgl-examples/sample3.ts +++ b/examples/src/webgl-examples/sample3.ts @@ -75,7 +75,7 @@ function main() ]), }, }, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, + draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }, uniforms: { uProjectionMatrix: projectionMatrix, diff --git a/examples/src/webgl-examples/sample4.ts b/examples/src/webgl-examples/sample4.ts index 9cbdd82..bb34470 100644 --- a/examples/src/webgl-examples/sample4.ts +++ b/examples/src/webgl-examples/sample4.ts @@ -63,7 +63,7 @@ function main() ]), }, }, - draw: { __type: "DrawVertex", firstVertex: 0, vertexCount: 4 }, + draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }, uniforms: {}, }; diff --git a/examples/src/webgl-examples/sample5.ts b/examples/src/webgl-examples/sample5.ts index 848fa03..1fde12a 100644 --- a/examples/src/webgl-examples/sample5.ts +++ b/examples/src/webgl-examples/sample5.ts @@ -58,7 +58,7 @@ function main() }, }, indices: buffers.indices, - draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, + draw: { __type__: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, uniforms: {}, }; diff --git a/examples/src/webgl-examples/sample6.ts b/examples/src/webgl-examples/sample6.ts index 54a8699..d8b9c89 100644 --- a/examples/src/webgl-examples/sample6.ts +++ b/examples/src/webgl-examples/sample6.ts @@ -62,7 +62,7 @@ async function main() }, }, indices: buffers.indices, - draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, + draw: { __type__: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, uniforms: { uSampler: texture }, }; diff --git a/examples/src/webgl-examples/sample7.ts b/examples/src/webgl-examples/sample7.ts index b098d34..e40fc46 100644 --- a/examples/src/webgl-examples/sample7.ts +++ b/examples/src/webgl-examples/sample7.ts @@ -84,7 +84,7 @@ async function main() }, }, indices: buffers.indices, - draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, + draw: { __type__: "DrawIndexed", firstIndex: 0, indexCount: 36 }, } }; diff --git a/examples/src/webgl-examples/sample8.ts b/examples/src/webgl-examples/sample8.ts index c11d21c..af59189 100644 --- a/examples/src/webgl-examples/sample8.ts +++ b/examples/src/webgl-examples/sample8.ts @@ -87,7 +87,7 @@ function main() }, }, indices: buffers.indices, - draw: { __type: "DrawIndexed", firstIndex: 0, indexCount: 36 }, + draw: { __type__: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, uniforms: { uSampler: texture }, }; @@ -325,7 +325,7 @@ function initTexture(): IGLSamplerTexture const texture: Texture = { size: [1, 1], format: "rgba8unorm", - sources: [{ __type: "TextureDataSource", size: [1, 1], data: new Uint8Array([0, 0, 255, 255]) }], + sources: [{ __type__: "TextureDataSource", size: [1, 1], data: new Uint8Array([0, 0, 255, 255]) }], }; const sampler: Sampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "linear" }; diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 14a45ac..9122f2a 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -77,27 +77,27 @@ export class RunWebGL { commandEncoder.passEncoders.forEach((passEncoder) => { - if (!passEncoder.__type) + if (!passEncoder.__type__) { this.runRenderPass(gl, passEncoder as RenderPass); } - else if (passEncoder.__type === "RenderPass") + else if (passEncoder.__type__ === "RenderPass") { this.runRenderPass(gl, passEncoder); } - else if (passEncoder.__type === "TransformFeedbackPass") + else if (passEncoder.__type__ === "TransformFeedbackPass") { this.runTransformFeedbackPass(gl, passEncoder); } - else if (passEncoder.__type === "BlitFramebuffer") + else if (passEncoder.__type__ === "BlitFramebuffer") { this.runBlitFramebuffer(gl, passEncoder); } - else if (passEncoder.__type === "CopyTextureToTexture") + else if (passEncoder.__type__ === "CopyTextureToTexture") { this.runCopyTextureToTexture(gl, passEncoder); } - else if (passEncoder.__type === "CopyBufferToBuffer") + else if (passEncoder.__type__ === "CopyBufferToBuffer") { this.runCopyBuffer(gl, passEncoder); } @@ -188,7 +188,7 @@ export class RunWebGL { renderObjects?.forEach((renderObject) => { - if (renderObject.__type === "OcclusionQuery") + if (renderObject.__type__ === "OcclusionQuery") { this.runOcclusionQuery(gl, attachmentSize, renderObject); } @@ -220,7 +220,7 @@ export class RunWebGL const topology = primitive?.topology || "triangle-list"; const drawMode = getIGLDrawMode(topology); - if (draw.__type === 'DrawVertex') + if (draw.__type__ === 'DrawVertex') { this.runDrawVertex(gl, drawMode, draw); } diff --git a/src/caches/getGLRenderOcclusionQuery.ts b/src/caches/getGLRenderOcclusionQuery.ts index b46fa7f..b743745 100644 --- a/src/caches/getGLRenderOcclusionQuery.ts +++ b/src/caches/getGLRenderOcclusionQuery.ts @@ -8,7 +8,7 @@ export function getGLRenderOcclusionQuery(gl: WebGLRenderingContext, renderObjec let renderOcclusionQuery: GLRenderOcclusionQuery = renderObjects["_GLRenderOcclusionQuery"]; if (renderOcclusionQuery) return renderOcclusionQuery; - const occlusionQueryObjects: IGLOcclusionQuery[] = renderObjects.filter((cv) => cv.__type === "OcclusionQuery") as any; + const occlusionQueryObjects: IGLOcclusionQuery[] = renderObjects.filter((cv) => cv.__type__ === "OcclusionQuery") as any; if (occlusionQueryObjects.length === 0) { renderObjects["_GLRenderOcclusionQuery"] = defautRenderOcclusionQuery; diff --git a/src/caches/getIGLBlitFramebuffer.ts b/src/caches/getIGLBlitFramebuffer.ts index 200ba74..576cc34 100644 --- a/src/caches/getIGLBlitFramebuffer.ts +++ b/src/caches/getIGLBlitFramebuffer.ts @@ -52,7 +52,7 @@ export function getIGLBlitFramebuffer(copyTextureToTexture: CopyTextureToTexture ]; const blitFramebuffer: GLBlitFramebuffer = { - __type: "BlitFramebuffer", + __type__: "BlitFramebuffer", read: { colorAttachments: sourceColorAttachments, depthStencilAttachment: sourceDepthStencilAttachment, diff --git a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts b/src/caches/getIGLRenderPassDescriptorWithMultisample.ts index 74de890..51c74f1 100644 --- a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts +++ b/src/caches/getIGLRenderPassDescriptorWithMultisample.ts @@ -47,7 +47,7 @@ return colorAttachment; // 拷贝 渲染缓冲区到 IGLTexture const blitFramebuffer: GLBlitFramebuffer = { - __type: "BlitFramebuffer", + __type__: "BlitFramebuffer", read: passDescriptor, draw: sourcePassDescriptor, blitFramebuffers: [[0, 0, textureSize[0], textureSize[1], diff --git a/src/data/GLBlitFramebuffer.ts b/src/data/GLBlitFramebuffer.ts index 45640e6..e858f6d 100644 --- a/src/data/GLBlitFramebuffer.ts +++ b/src/data/GLBlitFramebuffer.ts @@ -8,7 +8,7 @@ export class GLBlitFramebuffer /** * 数据类型。 */ - readonly __type: "BlitFramebuffer" = "BlitFramebuffer"; + readonly __type__: "BlitFramebuffer" = "BlitFramebuffer"; read: RenderPassDescriptor; draw: RenderPassDescriptor; diff --git a/src/data/IGLOcclusionQuery.ts b/src/data/IGLOcclusionQuery.ts index 6735961..82ac49b 100644 --- a/src/data/IGLOcclusionQuery.ts +++ b/src/data/IGLOcclusionQuery.ts @@ -6,7 +6,7 @@ export interface IGLOcclusionQuery /** * 数据类型。 */ - readonly __type: "OcclusionQuery"; + readonly __type__: "OcclusionQuery"; /** * 渲染对象列表。 */ diff --git a/src/data/IGLTransformFeedbackPass.ts b/src/data/IGLTransformFeedbackPass.ts index 46a76dd..80cc94b 100644 --- a/src/data/IGLTransformFeedbackPass.ts +++ b/src/data/IGLTransformFeedbackPass.ts @@ -14,7 +14,7 @@ export interface IGLTransformFeedbackPass /** * 数据类型。 */ - readonly __type: "TransformFeedbackPass"; + readonly __type__: "TransformFeedbackPass"; /** * 变换反馈对象列表。 -- Gitee From f353d9c7c9b3f074ecc206280eadebaa94f2d74e Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 22:31:17 +0800 Subject: [PATCH 24/57] @Data.type --- src/caches/getGLTexture.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/caches/getGLTexture.ts b/src/caches/getGLTexture.ts index 9a8527c..234bf19 100644 --- a/src/caches/getGLTexture.ts +++ b/src/caches/getGLTexture.ts @@ -1,4 +1,4 @@ -import { Texture, ITextureDataSource, TextureImageSource, ITextureSize } from "@feng3d/render-api"; +import { ITextureSize, Texture, TextureDataSource, TextureImageSource } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; import { IGLTexturePixelStore } from "../data/IGLTexturePixelStore"; import { getTextureCubeMapTarget } from "../utils/getTextureCubeMapTarget"; @@ -112,7 +112,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) } else { - const bufferSource = v as ITextureDataSource; + const bufferSource = v as TextureDataSource; const { data, dataLayout, dataImageOrigin } = bufferSource; // @@ -171,7 +171,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) } else { - const bufferSource = v as ITextureDataSource; + const bufferSource = v as TextureDataSource; const { data, dataLayout, dataImageOrigin } = bufferSource; // @@ -330,7 +330,7 @@ return; } // 处理数据资源 - const bufferSource = v as ITextureDataSource; + const bufferSource = v as TextureDataSource; const { data, dataLayout, dataImageOrigin } = bufferSource; // -- Gitee From 596126ef2458b42fe7463baf62b2789366d79695 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 22:37:23 +0800 Subject: [PATCH 25/57] RenderObject.material: Material --- examples/src/WebGL2Samples/texture_offset.ts | 4 ++-- examples/src/WebGL2Samples/texture_pixel_store.ts | 2 +- examples/src/WebGL2Samples/texture_srgb.ts | 2 +- examples/src/WebGL2Samples/texture_vertex.ts | 2 +- .../src/WebGL2Samples/transform_feedback_instanced.ts | 2 +- .../src/WebGL2Samples/transform_feedback_interleaved.ts | 2 +- .../src/WebGL2Samples/transform_feedback_separated.ts | 2 +- .../src/WebGL2Samples/transform_feedback_separated_2.ts | 2 +- src/RunWebGL.ts | 8 ++++---- 9 files changed, 13 insertions(+), 13 deletions(-) diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index eb6811b..d1d8cb4 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -102,7 +102,7 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewports[Corners.RIGHT].x, y: viewports[Corners.RIGHT].y, width: viewports[Corners.RIGHT].z, height: viewports[Corners.RIGHT].w }, - pipeline: programBicubic, + material: programBicubic, uniforms: { MVP: matrix, diffuse: { texture, sampler }, @@ -119,7 +119,7 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewports[Corners.LEFT].x, y: viewports[Corners.LEFT].y, width: viewports[Corners.LEFT].z, height: viewports[Corners.LEFT].w }, - pipeline: programOffsetBicubic, + material: programOffsetBicubic, uniforms: { MVP: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index f328556..3fb2d47 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -91,7 +91,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); renderObjects.push({ - pipeline: program, + material: program, uniforms: { MVP: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index 25b02d7..0785c48 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -82,7 +82,7 @@ import { getShaderSource, loadImage } from "./utility"; 0.0, 0.0, 0.0, 1.0 ]); renderObjects.push({ - pipeline: program, + material: program, uniforms: { mvp: matrix, materialDiffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index 8c657f8..035a167 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -211,7 +211,7 @@ import { getShaderSource, loadImage } from "./utility"; mat4.multiply(localMV, mvMatrix, primitive.matrix); renderObjects.push({ - pipeline: { + material: { ...program, }, uniforms: { diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index 5f7fc00..eea1fad 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -140,7 +140,7 @@ import { getShaderSource } from "./utility"; const renderRO: RenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height - 10 }, - pipeline: programs[PROGRAM_DRAW], + material: programs[PROGRAM_DRAW], uniforms: {}, geometry:{ primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index 90d67c9..f43b054 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -104,7 +104,7 @@ import { getShaderSource } from "./utility"; renderObjects: [ // Second draw, reuse captured attributes { - pipeline: programFeedback, + material: programFeedback, geometry:{ vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, indices: vertexArrays[PROGRAM_FEEDBACK].indices, diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index 608ec64..1c3b2c3 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -115,7 +115,7 @@ import { getShaderSource } from "./utility"; renderObjects: [ // Second draw, reuse captured attributes { - pipeline: programs[PROGRAM_FEEDBACK], + material: programs[PROGRAM_FEEDBACK], geometry: { vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, indices: vertexArrays[PROGRAM_FEEDBACK].indices, diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 6a11804..8f514ef 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -143,7 +143,7 @@ import { getShaderSource } from "./utility"; const renderRO: RenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height - 10 }, - pipeline: program, + material: program, uniforms: { u_color: [0.0, 1.0, 1.0, 1.0], }, diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 9122f2a..e090ac4 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -201,19 +201,19 @@ export class RunWebGL private runRenderObject(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObject: RenderObject) { - const { viewport, scissorRect, pipeline, geometry, uniforms } = renderObject; + const { viewport, scissorRect, material, geometry, uniforms } = renderObject; this.runViewPort(gl, attachmentSize, viewport); this.runScissor(gl, attachmentSize, scissorRect); - this.runRenderPipeline(gl, pipeline); + this.runRenderPipeline(gl, material); - this.runUniforms(gl, pipeline, uniforms); + this.runUniforms(gl, material, uniforms); const { vertices, indices, draw, primitive } = geometry; - this.runVertexArray(gl, pipeline, vertices, indices); + this.runVertexArray(gl, material, vertices, indices); this.runPrimitiveState(gl, primitive); -- Gitee From 00b92bddaca7a93d3c95e1360f26af2ee9815857 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 22 Feb 2025 22:47:08 +0800 Subject: [PATCH 26/57] RenderObject.material: Material --- examples/src/WebGL2Samples/buffer_copy.ts | 2 +- examples/src/WebGL2Samples/buffer_uniform.ts | 2 +- .../src/WebGL2Samples/draw_image_space.ts | 2 +- examples/src/WebGL2Samples/draw_instanced.ts | 2 +- .../src/WebGL2Samples/draw_instanced_ubo.ts | 2 +- .../WebGL2Samples/draw_primitive_restart.ts | 2 +- .../src/WebGL2Samples/draw_range_arrays.ts | 8 +++--- examples/src/WebGL2Samples/fbo_blit.ts | 4 +-- examples/src/WebGL2Samples/fbo_multisample.ts | 4 +-- .../WebGL2Samples/fbo_new_blend_equation.ts | 6 ++--- examples/src/WebGL2Samples/fbo_read_pixels.ts | 4 +-- .../WebGL2Samples/fbo_rtt_depth_texture.ts | 4 +-- .../src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 4 +-- .../WebGL2Samples/fbo_rtt_texture_array.ts | 4 +-- .../src/WebGL2Samples/geo_vertex_format.ts | 2 +- examples/src/WebGL2Samples/glsl_centroid.ts | 4 +-- .../glsl_flat_smooth_interpolators.ts | 2 +- .../WebGL2Samples/glsl_non_square_matrix.ts | 2 +- examples/src/WebGL2Samples/query_occlusion.ts | 2 +- examples/src/WebGL2Samples/sampler_filter.ts | 2 +- examples/src/WebGL2Samples/sampler_object.ts | 2 +- examples/src/WebGL2Samples/sampler_wrap.ts | 2 +- .../src/WebGL2Samples/texture_2d_array.ts | 2 +- examples/src/WebGL2Samples/texture_3d.ts | 2 +- .../src/WebGL2Samples/texture_derivative.ts | 2 +- examples/src/WebGL2Samples/texture_fetch.ts | 2 +- examples/src/WebGL2Samples/texture_format.ts | 4 +-- examples/src/WebGL2Samples/texture_grad.ts | 2 +- .../src/WebGL2Samples/texture_immutable.ts | 6 ++--- examples/src/WebGL2Samples/texture_integer.ts | 2 +- examples/src/WebGL2Samples/texture_lod.ts | 2 +- .../transform_feedback_instanced.ts | 2 +- .../transform_feedback_interleaved.ts | 2 +- .../transform_feedback_separated.ts | 2 +- .../transform_feedback_separated_2.ts | 2 +- examples/src/regl-examples/basic.ts | 2 +- examples/src/regl-examples/batch.ts | 4 +-- examples/src/regl-examples/bunny.ts | 2 +- examples/src/regl-examples/camera.ts | 2 +- examples/src/regl-examples/cloth.ts | 2 +- examples/src/regl-examples/cube.ts | 2 +- examples/src/test/RenderObjectChanges.ts | 6 ++--- examples/src/test/fractalCube.ts | 2 +- examples/src/webgl-examples/sample1.ts | 2 +- examples/src/webgl-examples/sample2.ts | 2 +- examples/src/webgl-examples/sample3.ts | 2 +- examples/src/webgl-examples/sample4.ts | 2 +- examples/src/webgl-examples/sample5.ts | 2 +- examples/src/webgl-examples/sample6.ts | 2 +- examples/src/webgl-examples/sample7.ts | 2 +- examples/src/webgl-examples/sample8.ts | 2 +- src/RunWebGL.ts | 26 +++++++++---------- src/WebGL.ts | 4 +-- src/caches/getGLProgram.ts | 22 ++++++++-------- src/data/IGLTransformFeedbackPass.ts | 2 +- 55 files changed, 96 insertions(+), 96 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index 5401869..87d86b8 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -51,7 +51,7 @@ import { getShaderSource } from "./utility"; const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ - pipeline: program, + material: program, geometry:{ primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, diff --git a/examples/src/WebGL2Samples/buffer_uniform.ts b/examples/src/WebGL2Samples/buffer_uniform.ts index 8e19248..88898c8 100644 --- a/examples/src/WebGL2Samples/buffer_uniform.ts +++ b/examples/src/WebGL2Samples/buffer_uniform.ts @@ -82,7 +82,7 @@ import { getShaderSource } from "./utility"; }; const ro: RenderObject = { - pipeline: program, + material: program, uniforms: { PerDraw: transforms, PerPass: lightPos, diff --git a/examples/src/WebGL2Samples/draw_image_space.ts b/examples/src/WebGL2Samples/draw_image_space.ts index b642697..f8032f0 100644 --- a/examples/src/WebGL2Samples/draw_image_space.ts +++ b/examples/src/WebGL2Samples/draw_image_space.ts @@ -42,7 +42,7 @@ loadImage("../../assets/img/Di-3d.png", (img) => primitive: { topology: "triangle-list" }, draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 3 }, }, - pipeline: program + material: program }; webgl.submit({ diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index 5dcb747..bbf4da2 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -37,7 +37,7 @@ const renderObject: RenderObject = { vertices: vertexArray.vertices, draw: { __type__: "DrawVertex", vertexCount: 3, instanceCount: 2 }, }, - pipeline: program + material: program }; canvas.width = window.innerWidth; diff --git a/examples/src/WebGL2Samples/draw_instanced_ubo.ts b/examples/src/WebGL2Samples/draw_instanced_ubo.ts index 39a3240..ae6e7d4 100644 --- a/examples/src/WebGL2Samples/draw_instanced_ubo.ts +++ b/examples/src/WebGL2Samples/draw_instanced_ubo.ts @@ -49,7 +49,7 @@ const materials = { const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0, 0, 0, 1], loadOp: "clear" }] }, renderObjects: [{ - pipeline: program, + material: program, uniforms: { Transform: transforms, Material: materials, diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index bf0c714..3435341 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -50,7 +50,7 @@ const renderObject: RenderObject = { indices, draw: { __type__: "DrawIndexed", indexCount: 7, instanceCount: 2 }, }, - pipeline: program, + material: program, }; webgl.submit({ diff --git a/examples/src/WebGL2Samples/draw_range_arrays.ts b/examples/src/WebGL2Samples/draw_range_arrays.ts index 926431c..821822d 100644 --- a/examples/src/WebGL2Samples/draw_range_arrays.ts +++ b/examples/src/WebGL2Samples/draw_range_arrays.ts @@ -1,4 +1,4 @@ -import { RenderPass, Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { Material, RenderObject, RenderPass, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -26,7 +26,7 @@ const vertexPosBuffer = new Float32Array([ -0.5, -0.5, ]); -const pipeline: Material = { +const material: Material = { vertex: { code: getShaderSource("vs") }, @@ -44,7 +44,7 @@ const vertexArray: { vertices?: VertexAttributes } = { const vertexCount = 12; const renderObject: RenderObject = { - pipeline, + material, geometry: { primitive: { topology: "triangle-strip" }, vertices: vertexArray.vertices, @@ -81,4 +81,4 @@ const rp: RenderPass = { webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); -webgl.deleteProgram(pipeline); +webgl.deleteProgram(material); diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index c3d5bcb..5f2a167 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -80,7 +80,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => const renderObject: RenderObject = { viewport: { x: 0, y: 0, width: FRAMEBUFFER_SIZE.x, height: FRAMEBUFFER_SIZE.y }, - pipeline: program, + material: program, uniforms: { MVP: new Float32Array([ 0.8, 0.0, 0.0, 0.0, @@ -165,7 +165,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => vertices: vertexArray.vertices, draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 6 }, }, - pipeline: program, + material: program, }; const renderPass2: RenderPass = { diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index 5dc4c40..2c96c8f 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -101,7 +101,7 @@ const IDENTITY = mat4.create(); const renderPass1: RenderPass = { descriptor: framebuffer, renderObjects: [{ - pipeline: programs[PROGRAM.TEXTURE], + material: programs[PROGRAM.TEXTURE], uniforms: { MVP: IDENTITY }, geometry: { primitive: { topology: "LINE_LOOP" }, @@ -122,7 +122,7 @@ const renderPass2: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [ { - pipeline: programs[PROGRAM.SPLASH], + material: programs[PROGRAM.SPLASH], uniforms: { diffuse: { texture, sampler }, MVP: mvp }, geometry: { primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index 8fbb5de..bea6273 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -120,7 +120,7 @@ function render() ]); const renderObject: RenderObject = { - pipeline: program, + material: program, uniforms: { mvp: matrix, diffuse: { texture, sampler } }, geometry:{ vertices: vertexArray.vertices, @@ -156,7 +156,7 @@ function render() { ...renderObject, viewport: viewport0, - pipeline: { + material: { ...program, fragment: { ...program.fragment, targets: [{ @@ -177,7 +177,7 @@ function render() { ...renderObject, viewport: viewport0, - pipeline: { + material: { ...program, fragment: { ...program.fragment, targets: [{ diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index ef52199..bd2068a 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -131,7 +131,7 @@ const rp1: RenderPass = { renderObjects: [ { viewport: { x: 0, y: 0, width: w, height: h }, - pipeline: multipleOutputProgram, + material: multipleOutputProgram, uniforms: { mvp: matrix }, geometry:{ primitive: { topology: "triangle-list" }, @@ -149,7 +149,7 @@ const rp: RenderPass = { }; const ro: RenderObject = { - pipeline: layerProgram, + material: layerProgram, uniforms: { mvp: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index a9b1201..99934da 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -93,7 +93,7 @@ const frameBuffer: RenderPassDescriptor = { const renderPass: RenderPass = { descriptor: frameBuffer, renderObjects: [{ - pipeline: depthProgram, + material: depthProgram, geometry:{ primitive: { topology: "triangle-list" }, vertices: triVertexArray.vertices, @@ -109,7 +109,7 @@ const rp2: RenderPass = { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }], }, renderObjects: [{ - pipeline: drawProgram, + material: drawProgram, uniforms: { depthMap: { texture: depthTexture, sampler: depthSampler } }, geometry:{ primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index f46d268..d009b0d 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -99,7 +99,7 @@ const frameBuffer: RenderPassDescriptor = { const renderPass: RenderPass = { descriptor: frameBuffer, renderObjects: [{ - pipeline: drawBufferProgram, + material: drawBufferProgram, geometry:{ primitive: { topology: "triangle-list" }, vertices: triVertexArray.vertices, @@ -112,7 +112,7 @@ const renderPass: RenderPass = { const renderPass2: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ - pipeline: drawProgram, + material: drawProgram, uniforms: { color1Map: { texture: color1Texture, sampler: color1Sampler }, color2Map: { texture: color2Texture, sampler: color2Sampler }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index c513eef..d976945 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -133,7 +133,7 @@ const renderPass1: RenderPass = { renderObjects: [ { viewport: { x: 0, y: 0, width: w, height: h }, - pipeline: multipleOutputProgram, + material: multipleOutputProgram, uniforms: { mvp: matrix }, geometry:{ primitive: { topology: "triangle-list" }, @@ -153,7 +153,7 @@ const renderPass: RenderPass = { }; const renderObject: RenderObject = { - pipeline: layerProgram, + material: layerProgram, uniforms: { mvp: matrix, diffuse: { texture, sampler } }, geometry: { primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index 511a800..e690c1b 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -201,7 +201,7 @@ import { getShaderSource, loadImage } from "./utility"; const lightPosition = [0.0, 0.0, 5.0]; const ro: RenderObject = { - pipeline: program, + material: program, uniforms: { u_model: modelMatrix, u_modelInvTrans: modelInvTrans, diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index baa1c2f..3648bd4 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -160,7 +160,7 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) const rp: RenderPass = { descriptor: framebuffers[i], renderObjects: [{ - pipeline: programs[i], + material: programs[i], uniforms: { MVP: IDENTITY }, geometry: { primitive: { topology: "triangle-list" }, @@ -178,7 +178,7 @@ const rp2: RenderPass = { renderObjects, }; const ro: RenderObject = { - pipeline: programs[PROGRAM.SPLASH], + material: programs[PROGRAM.SPLASH], geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArrays[PROGRAM.SPLASH].vertices, diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index 6b5f718..a356287 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -168,7 +168,7 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) renderObjects.push( { viewport: viewport[i], - pipeline: programs[i], + material: programs[i], uniforms: { mvp: localMVP, mvNormal: localMVNormal, diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index faa3a26..cc529df 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -66,7 +66,7 @@ loadImage("../../assets/img/Di-3d.png", function (image) const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ - pipeline: program, + material: program, uniforms: { MVP: matrix, diffuse: { texture, sampler } }, geometry:{ primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index d0c1d5b..ee220b2 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -51,7 +51,7 @@ const rp: RenderPass = { }; const ro: RenderObject = { - pipeline: program, + material: program, geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index a2921ac..9f1072f 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -148,7 +148,7 @@ function render() }; const ro: RenderObject = { - pipeline: program, + material: program, uniforms: { mvp: matrix }, geometry:{ primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index fc3d846..c3d4c92 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -88,7 +88,7 @@ function render() const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ - pipeline: program, + material: program, uniforms: { mvp: matrix, materialDiffuse0: { texture, sampler: samplerA }, diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index 8898eea..1c56e2d 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -146,7 +146,7 @@ function render() ]); const ro: RenderObject = { - pipeline: program, + material: program, uniforms: { mvp: matrix }, geometry: { primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/texture_2d_array.ts b/examples/src/WebGL2Samples/texture_2d_array.ts index 8c2c355..96676d5 100644 --- a/examples/src/WebGL2Samples/texture_2d_array.ts +++ b/examples/src/WebGL2Samples/texture_2d_array.ts @@ -83,7 +83,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); const ro: RenderObject = { - pipeline: program, + material: program, uniforms: { MVP: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_3d.ts b/examples/src/WebGL2Samples/texture_3d.ts index 295a28d..c8118ab 100644 --- a/examples/src/WebGL2Samples/texture_3d.ts +++ b/examples/src/WebGL2Samples/texture_3d.ts @@ -158,7 +158,7 @@ import { getShaderSource } from "./utility"; } const ro: RenderObject = { - pipeline: program, + material: program, uniforms: { diffuse: { texture, sampler }, }, diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index 8716464..0ef0e50 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -206,7 +206,7 @@ import { getShaderSource, loadImage } from "./utility"; }; const ro: RenderObject = { - pipeline: program, + material: program, uniforms: {}, geometry:{ primitive: { topology: "triangle-list", cullFace: "back" }, diff --git a/examples/src/WebGL2Samples/texture_fetch.ts b/examples/src/WebGL2Samples/texture_fetch.ts index d02de3a..8270ac2 100644 --- a/examples/src/WebGL2Samples/texture_fetch.ts +++ b/examples/src/WebGL2Samples/texture_fetch.ts @@ -72,7 +72,7 @@ import { getShaderSource, loadImage } from "./utility"; descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [ { - pipeline: program, + material: program, uniforms: { MVP: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index 5b72450..6f17b08 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -174,7 +174,7 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, - pipeline: programNormalized, + material: programNormalized, uniforms: { MVP: matrix, diffuse: { texture: textures[i], sampler: samplers[i] }, @@ -192,7 +192,7 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, - pipeline: programUint, + material: programUint, uniforms: { MVP: matrix, diffuse: { texture: textures[i], sampler: samplers[i] }, diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index ad2c0c5..0e94a2e 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -197,7 +197,7 @@ import { getShaderSource, loadImage } from "./utility"; }; const ro: RenderObject = { - pipeline: program, + material: program, uniforms: {}, geometry:{ primitive: { cullFace: "back" }, diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index 40060f0..4e1e343 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -100,7 +100,7 @@ import { getShaderSource, loadImage } from "./utility"; // -- Render const ro: RenderObject = { - pipeline: program, + material: program, uniforms: { MVP: matrix, }, @@ -120,7 +120,7 @@ import { getShaderSource, loadImage } from "./utility"; { viewport: { x: viewports[Corners.LEFT].x, y: viewports[Corners.LEFT].y, width: viewports[Corners.LEFT].z, height: viewports[Corners.LEFT].w }, ...ro, - pipeline: program, + material: program, uniforms: { ...ro.uniforms, diffuse: { texture: texture2D, sampler: sampler2D }, @@ -132,7 +132,7 @@ import { getShaderSource, loadImage } from "./utility"; { viewport: { x: viewports[Corners.RIGHT].x, y: viewports[Corners.RIGHT].y, width: viewports[Corners.RIGHT].z, height: viewports[Corners.RIGHT].w }, ...ro, - pipeline: program3D, + material: program3D, uniforms: { ...ro.uniforms, diffuse: { texture: texture3D, sampler: sampler3D }, diff --git a/examples/src/WebGL2Samples/texture_integer.ts b/examples/src/WebGL2Samples/texture_integer.ts index 31f4107..3dc991c 100644 --- a/examples/src/WebGL2Samples/texture_integer.ts +++ b/examples/src/WebGL2Samples/texture_integer.ts @@ -70,7 +70,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); const ro: RenderObject = { - pipeline: program, + material: program, uniforms: { MVP: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index 30f6f1f..2bf03c2 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -198,7 +198,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); const ro: RenderObject = { - pipeline: program, + material: program, uniforms: { mvp: matrix, }, diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index eea1fad..3e3feec 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -131,7 +131,7 @@ import { getShaderSource } from "./utility"; } const transformRO: IGLTransformFeedbackObject = { - pipeline: programs[PROGRAM_TRANSFORM], + material: programs[PROGRAM_TRANSFORM], vertices: null, transformFeedback: null, uniforms: {}, diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index f43b054..001cc19 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -91,7 +91,7 @@ import { getShaderSource } from "./utility"; __type__: "TransformFeedbackPass", transformFeedbackObjects: [ { - pipeline: programTransform, + material: programTransform, vertices: vertexArrays[PROGRAM_TRANSFORM].vertices, uniforms: { MVP: matrix }, transformFeedback, diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index 1c3b2c3..c201088 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -102,7 +102,7 @@ import { getShaderSource } from "./utility"; __type__: "TransformFeedbackPass", transformFeedbackObjects: [ { - pipeline: programTransform, + material: programTransform, vertices: vertexArrays[PROGRAM_TRANSFORM].vertices, uniforms: { MVP: matrix }, transformFeedback, diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 8f514ef..71c0e69 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -132,7 +132,7 @@ import { getShaderSource } from "./utility"; } const transformRO: IGLTransformFeedbackObject = { - pipeline: transformFeedbackPipeline, + material: transformFeedbackPipeline, vertices: null, transformFeedback: null, uniforms: { diff --git a/examples/src/regl-examples/basic.ts b/examples/src/regl-examples/basic.ts index 86ff395..7610ff7 100644 --- a/examples/src/regl-examples/basic.ts +++ b/examples/src/regl-examples/basic.ts @@ -31,7 +31,7 @@ const renderObject: RenderObject = { draw: { __type__: "DrawVertex", vertexCount: 3 }, }, uniforms: { color: [1, 0, 0, 1] }, - pipeline: { + material: { vertex: { code: ` precision mediump float; diff --git a/examples/src/regl-examples/batch.ts b/examples/src/regl-examples/batch.ts index 42148cf..b5e0c6a 100644 --- a/examples/src/regl-examples/batch.ts +++ b/examples/src/regl-examples/batch.ts @@ -21,7 +21,7 @@ const offsets = [{ offset: [-1, -1] }, { offset: [1, 0] }, { offset: [1, 1] }]; -const pipeline: Material = { +const material: Material = { vertex: { code: `precision mediump float; attribute vec2 position; @@ -64,7 +64,7 @@ function getRenderObject(batchId: number) uniforms: { offset: offsets[batchId].offset, }, - pipeline, + material, }; return renderObject; diff --git a/examples/src/regl-examples/bunny.ts b/examples/src/regl-examples/bunny.ts index 6b97135..a62f902 100644 --- a/examples/src/regl-examples/bunny.ts +++ b/examples/src/regl-examples/bunny.ts @@ -41,7 +41,7 @@ const renderObject: RenderObject = { uniforms: { model: mat4.identity([]), }, - pipeline: { + material: { vertex: { code: `precision mediump float; attribute vec3 position; diff --git a/examples/src/regl-examples/camera.ts b/examples/src/regl-examples/camera.ts index 0527643..dcde425 100644 --- a/examples/src/regl-examples/camera.ts +++ b/examples/src/regl-examples/camera.ts @@ -31,7 +31,7 @@ const renderObject: RenderObject = { draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, uniforms: {}, - pipeline: { + material: { vertex: { code: `precision mediump float; uniform mat4 projection, view; diff --git a/examples/src/regl-examples/cloth.ts b/examples/src/regl-examples/cloth.ts index f89317c..d90dc04 100644 --- a/examples/src/regl-examples/cloth.ts +++ b/examples/src/regl-examples/cloth.ts @@ -175,7 +175,7 @@ import * as vec3 from "./stackgl/gl-vec3"; draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, uniforms: {}, - pipeline: { + material: { vertex: { code: `precision mediump float; diff --git a/examples/src/regl-examples/cube.ts b/examples/src/regl-examples/cube.ts index 90861b4..e5982e9 100644 --- a/examples/src/regl-examples/cube.ts +++ b/examples/src/regl-examples/cube.ts @@ -74,7 +74,7 @@ import * as mat4 from "./stackgl/gl-mat4"; draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, uniforms: {}, - pipeline: { + material: { vertex: { code: `precision mediump float; attribute vec3 position; diff --git a/examples/src/test/RenderObjectChanges.ts b/examples/src/test/RenderObjectChanges.ts index abfa6ad..1398bc3 100644 --- a/examples/src/test/RenderObjectChanges.ts +++ b/examples/src/test/RenderObjectChanges.ts @@ -10,7 +10,7 @@ const init = async (canvas: HTMLCanvasElement) => const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); // 初始化WebGL const renderObject: RenderObject = { // 渲染对象 - pipeline: { // 渲染管线 + material: { // 渲染管线 vertex: { // 顶点着色器 code: ` attribute vec4 position; @@ -66,7 +66,7 @@ const init = async (canvas: HTMLCanvasElement) => window.onclick = () => { // 修改顶点着色器代码 - renderObject.pipeline.vertex.code = ` + renderObject.material.vertex.code = ` attribute vec4 position; void main() { @@ -77,7 +77,7 @@ const init = async (canvas: HTMLCanvasElement) => `; // 修改片段着色器代码 - renderObject.pipeline.fragment.code = ` + renderObject.material.fragment.code = ` precision highp float; uniform vec4 color; void main() { diff --git a/examples/src/test/fractalCube.ts b/examples/src/test/fractalCube.ts index b1890c6..c1b5059 100644 --- a/examples/src/test/fractalCube.ts +++ b/examples/src/test/fractalCube.ts @@ -27,7 +27,7 @@ async function main() } = { texture: { size: [canvas.width, canvas.height] }, sampler: {} }; const renderObject: RenderObject = { - pipeline: { + material: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample1.ts b/examples/src/webgl-examples/sample1.ts index 92e4a71..70093bf 100644 --- a/examples/src/webgl-examples/sample1.ts +++ b/examples/src/webgl-examples/sample1.ts @@ -20,7 +20,7 @@ const init = async (canvas: HTMLCanvasElement) => }], }, renderObjects: [{ // 渲染对象 - pipeline: { // 渲染管线 + material: { // 渲染管线 vertex: { // 顶点着色器 code: ` attribute vec4 position; diff --git a/examples/src/webgl-examples/sample2.ts b/examples/src/webgl-examples/sample2.ts index 488fc85..0d6beb7 100644 --- a/examples/src/webgl-examples/sample2.ts +++ b/examples/src/webgl-examples/sample2.ts @@ -24,7 +24,7 @@ function main() }, }, renderObjects: [{ - pipeline: { + material: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample3.ts b/examples/src/webgl-examples/sample3.ts index 3af150d..830bb2f 100644 --- a/examples/src/webgl-examples/sample3.ts +++ b/examples/src/webgl-examples/sample3.ts @@ -28,7 +28,7 @@ function main() }, }, renderObjects: [{ - pipeline: { + material: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample4.ts b/examples/src/webgl-examples/sample4.ts index bb34470..41cdc36 100644 --- a/examples/src/webgl-examples/sample4.ts +++ b/examples/src/webgl-examples/sample4.ts @@ -16,7 +16,7 @@ function main() const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); const renderObject: RenderObject = { - pipeline: { + material: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample5.ts b/examples/src/webgl-examples/sample5.ts index 1fde12a..d36f86f 100644 --- a/examples/src/webgl-examples/sample5.ts +++ b/examples/src/webgl-examples/sample5.ts @@ -20,7 +20,7 @@ function main() const buffers = initBuffers(); const renderObject: RenderObject = { - pipeline: { + material: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample6.ts b/examples/src/webgl-examples/sample6.ts index d8b9c89..8bb1794 100644 --- a/examples/src/webgl-examples/sample6.ts +++ b/examples/src/webgl-examples/sample6.ts @@ -22,7 +22,7 @@ async function main() const texture = await loadTexture("../../cubetexture.png"); const renderObject: RenderObject = { - pipeline: { + material: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample7.ts b/examples/src/webgl-examples/sample7.ts index e40fc46..3a04cbc 100644 --- a/examples/src/webgl-examples/sample7.ts +++ b/examples/src/webgl-examples/sample7.ts @@ -22,7 +22,7 @@ async function main() const texture = await loadTexture("../../cubetexture.png"); const renderObject: RenderObject = { - pipeline: { + material: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample8.ts b/examples/src/webgl-examples/sample8.ts index af59189..2654ead 100644 --- a/examples/src/webgl-examples/sample8.ts +++ b/examples/src/webgl-examples/sample8.ts @@ -26,7 +26,7 @@ function main() const video = setupVideo("../../Firefox.mp4"); const renderObject: RenderObject = { - pipeline: { + material: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index e090ac4..0eaead1 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -232,15 +232,15 @@ export class RunWebGL private runTransformFeedbackObject(gl: WebGLRenderingContext, renderObject: IGLTransformFeedbackObject) { - const { pipeline, vertices, uniforms, transformFeedback, draw } = renderObject; + const { material, vertices, uniforms, transformFeedback, draw } = renderObject; const drawMode = getIGLDrawMode("point-list"); - this.runTransformFeedbackPipeline(gl, pipeline); + this.runTransformFeedbackPipeline(gl, material); - this.runVertexArray(gl, pipeline, vertices, undefined); + this.runVertexArray(gl, material, vertices, undefined); - this.runUniforms(gl, pipeline, uniforms); + this.runUniforms(gl, material, uniforms); this.runTransformFeedback(gl, transformFeedback, drawMode); @@ -321,9 +321,9 @@ export class RunWebGL /** * 激活常量 */ - private runUniforms(gl: WebGLRenderingContext, pipeline: Material, uniforms: Uniforms) + private runUniforms(gl: WebGLRenderingContext, material: Material, uniforms: Uniforms) { - const webGLProgram = getGLProgram(gl, pipeline); + const webGLProgram = getGLProgram(gl, material); webGLProgram.uniforms.forEach((uniformInfo) => { @@ -545,14 +545,14 @@ export class RunWebGL /** * 执行设置或者上传渲染对象的顶点以及索引数据。 */ - private runVertexArray(gl: WebGLRenderingContext, pipeline: Material, vertices: VertexAttributes, indices: IIndicesDataTypes) + private runVertexArray(gl: WebGLRenderingContext, material: Material, vertices: VertexAttributes, indices: IIndicesDataTypes) { if (!vertices && !indices) return; let webGLVertexArrayObject: WebGLVertexArrayObject; if (gl instanceof WebGL2RenderingContext) { - webGLVertexArrayObject = gl._vertexArrays.get([pipeline, vertices, indices]); + webGLVertexArrayObject = gl._vertexArrays.get([material, vertices, indices]); if (webGLVertexArrayObject) { gl.bindVertexArray(webGLVertexArrayObject); @@ -562,10 +562,10 @@ export class RunWebGL webGLVertexArrayObject = gl.createVertexArray(); gl.bindVertexArray(webGLVertexArrayObject); - gl._vertexArrays.set([pipeline, vertices, indices], webGLVertexArrayObject); + gl._vertexArrays.set([material, vertices, indices], webGLVertexArrayObject); } - const shaderResult = getGLProgram(gl, pipeline); + const shaderResult = getGLProgram(gl, material); // shaderResult.attributes.forEach((activeInfo) => @@ -770,13 +770,13 @@ export class RunWebGL } } - private runProgram(gl: WebGLRenderingContext, pipeline: Material) + private runProgram(gl: WebGLRenderingContext, material: Material) { - const program = getGLProgram(gl, pipeline); + const program = getGLProgram(gl, material); gl.useProgram(program); // - this.runColorTargetStates(gl, pipeline.fragment.targets); + this.runColorTargetStates(gl, material.fragment.targets); } private runColorTargetStates(gl: WebGLRenderingContext, targets?: readonly ColorTargetState[]) diff --git a/src/WebGL.ts b/src/WebGL.ts index 39aa6c4..a51265c 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -73,9 +73,9 @@ export class WebGL deleteSampler(this._gl, sampler); } - deleteProgram(pipeline: Material) + deleteProgram(material: Material) { - deleteProgram(this._gl, pipeline); + deleteProgram(this._gl, material); } deleteTransformFeedback(transformFeedback: IGLTransformFeedback) diff --git a/src/caches/getGLProgram.ts b/src/caches/getGLProgram.ts index 6ddb8de..56acb39 100644 --- a/src/caches/getGLProgram.ts +++ b/src/caches/getGLProgram.ts @@ -38,14 +38,14 @@ declare global /** * 激活渲染程序 */ -export function getGLProgram(gl: WebGLRenderingContext, pipeline: Material | IGLTransformFeedbackPipeline) +export function getGLProgram(gl: WebGLRenderingContext, material: Material | IGLTransformFeedbackPipeline) { - const shaderKey = getKey(pipeline); + const shaderKey = getKey(material); let result = gl._programs[shaderKey]; if (result) return result; - const vertex = pipeline.vertex.code; - const fragment = (pipeline as Material).fragment?.code || `#version 300 es + const vertex = material.vertex.code; + const fragment = (material as Material).fragment?.code || `#version 300 es precision highp float; precision highp int; @@ -53,7 +53,7 @@ export function getGLProgram(gl: WebGLRenderingContext, pipeline: Material | IGL { } `; - const transformFeedbackVaryings = (pipeline as IGLTransformFeedbackPipeline).transformFeedbackVaryings; + const transformFeedbackVaryings = (material as IGLTransformFeedbackPipeline).transformFeedbackVaryings; result = getWebGLProgram(gl, vertex, fragment, transformFeedbackVaryings); gl._programs[shaderKey] = result; @@ -61,9 +61,9 @@ export function getGLProgram(gl: WebGLRenderingContext, pipeline: Material | IGL return result; } -export function deleteProgram(gl: WebGLRenderingContext, pipeline: Material) +export function deleteProgram(gl: WebGLRenderingContext, material: Material) { - const shaderKey = getKey(pipeline); + const shaderKey = getKey(material); const result = gl._programs[shaderKey]; if (result) { @@ -72,11 +72,11 @@ export function deleteProgram(gl: WebGLRenderingContext, pipeline: Material) } } -function getKey(pipeline: Material | IGLTransformFeedbackPipeline) +function getKey(material: Material | IGLTransformFeedbackPipeline) { - const vertex = pipeline.vertex.code; - const fragment = (pipeline as Material).fragment?.code; - const transformFeedbackVaryings = (pipeline as IGLTransformFeedbackPipeline).transformFeedbackVaryings; + const vertex = material.vertex.code; + const fragment = (material as Material).fragment?.code; + const transformFeedbackVaryings = (material as IGLTransformFeedbackPipeline).transformFeedbackVaryings; return `---vertexShader---\n${vertex}\n---fragment---\n${fragment}\n---feedback---${transformFeedbackVaryings?.varyings.toString()} ${transformFeedbackVaryings?.bufferMode}`; } diff --git a/src/data/IGLTransformFeedbackPass.ts b/src/data/IGLTransformFeedbackPass.ts index 80cc94b..51022b8 100644 --- a/src/data/IGLTransformFeedbackPass.ts +++ b/src/data/IGLTransformFeedbackPass.ts @@ -27,7 +27,7 @@ export interface IGLTransformFeedbackObject /** * 渲染管线描述。 */ - readonly pipeline: IGLTransformFeedbackPipeline; + readonly material: IGLTransformFeedbackPipeline; /** * 顶点属性数据映射。 -- Gitee From 3749999709f388cbb6f7fb36e77a9be9e106e43d Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 5 Mar 2025 22:02:11 +0800 Subject: [PATCH 27/57] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E8=BF=90=E8=A1=8C?= =?UTF-8?q?=E9=94=99=E8=AF=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/RunWebGL.ts | 1 + src/caches/getGLTexture.ts | 8 ++++---- src/shader/ShaderLib.ts | 2 +- 3 files changed, 6 insertions(+), 5 deletions(-) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 0eaead1..9dd0fcd 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -467,6 +467,7 @@ export class RunWebGL { data = [data]; } + if (data.toArray) data = data.toArray(); const location = uniformInfo.location; switch (type) { diff --git a/src/caches/getGLTexture.ts b/src/caches/getGLTexture.ts index 234bf19..6985dc0 100644 --- a/src/caches/getGLTexture.ts +++ b/src/caches/getGLTexture.ts @@ -91,7 +91,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) if (target === "TEXTURE_2D" || target === "TEXTURE_CUBE_MAP") { - const bindTarget = target === "TEXTURE_CUBE_MAP" ? getTextureCubeMapTarget(depthOrArrayLayers) : target; + const bindTarget = target === "TEXTURE_CUBE_MAP" ? getTextureCubeMapTarget(zoffset) : target; if (width && height) { gl.texImage2D(gl[bindTarget], mipLevel, gl[internalformat], width, height, 0, gl[format], gl[type], image); @@ -130,7 +130,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) if (target === "TEXTURE_2D" || target === "TEXTURE_CUBE_MAP") { - const bindTarget = target === "TEXTURE_CUBE_MAP" ? getTextureCubeMapTarget(depthOrArrayLayers) : target; + const bindTarget = target === "TEXTURE_CUBE_MAP" ? getTextureCubeMapTarget(zoffset) : target; gl.texImage2D(gl[bindTarget], mipLevel, gl[internalformat], width, height, 0, gl[format], gl[type], data, offset); } else if (target === "TEXTURE_3D" || target === "TEXTURE_2D_ARRAY") @@ -161,7 +161,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) if (target === "TEXTURE_2D" || target === "TEXTURE_CUBE_MAP") { - const bindTarget = target === "TEXTURE_CUBE_MAP" ? getTextureCubeMapTarget(depthOrArrayLayers) : target; + const bindTarget = target === "TEXTURE_CUBE_MAP" ? getTextureCubeMapTarget(zoffset) : target; gl.texImage2D(gl[bindTarget], mipLevel, gl[format], gl[format], gl[type], image); } else @@ -189,7 +189,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) if (target === "TEXTURE_2D" || target === "TEXTURE_CUBE_MAP") { - const bindTarget = target === "TEXTURE_CUBE_MAP" ? getTextureCubeMapTarget(depthOrArrayLayers) : target; + const bindTarget = target === "TEXTURE_CUBE_MAP" ? getTextureCubeMapTarget(zoffset) : target; console.assert(offset === 0, `WebGL1中ITextureDataLayout.offset必须为0`); gl.texImage2D(gl[bindTarget], mipLevel, gl[format], width, height, 0, gl[format], gl[type], data); } diff --git a/src/shader/ShaderLib.ts b/src/shader/ShaderLib.ts index 84ba3af..d0a1e0f 100644 --- a/src/shader/ShaderLib.ts +++ b/src/shader/ShaderLib.ts @@ -127,7 +127,7 @@ export class ShaderLib this._shaderCache = {}; } - private getMacroCode(variables: string[], valueObj: Object) + getMacroCode(variables: string[], valueObj: Object) { let macroHeader = ""; variables.forEach((macroName) => -- Gitee From d0277dc78d1d76eac60d3a5515aa9253d6eecd4b Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 7 Mar 2025 21:08:12 +0800 Subject: [PATCH 28/57] =?UTF-8?q?feat(RunWebGL):=20=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E6=9D=90=E8=B4=A8=E5=88=9D=E5=A7=8B=E5=8C=96=E6=93=8D=E4=BD=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在渲染对象执行前添加材质初始化操作 - 确保材质在使用前被正确设置和处理 --- src/RunWebGL.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 9dd0fcd..38de573 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -202,6 +202,7 @@ export class RunWebGL private runRenderObject(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObject: RenderObject) { const { viewport, scissorRect, material, geometry, uniforms } = renderObject; + Material.init(material); this.runViewPort(gl, attachmentSize, viewport); -- Gitee From db97fcba4e64dc03d2ce0eb30fa40a50ea0f1172 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 8 Mar 2025 23:01:40 +0800 Subject: [PATCH 29/57] =?UTF-8?q?build:=20=E6=9B=B4=E6=96=B0=20@feng3d/wat?= =?UTF-8?q?cher=20=E4=BE=9D=E8=B5=96=E7=89=88=E6=9C=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 @feng3d/watcher 依赖版本从 ^0.8.9 升级到 ^0.8.11 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index d0b62d3..a3a96ed 100644 --- a/package.json +++ b/package.json @@ -64,6 +64,6 @@ }, "dependencies": { "@feng3d/render-api": "0.0.2", - "@feng3d/watcher": "^0.8.9" + "@feng3d/watcher": "^0.8.11" } } \ No newline at end of file -- Gitee From 72b26a8677a727c955b4fdf00b8383d50d89a9ab Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 8 Mar 2025 23:30:56 +0800 Subject: [PATCH 30/57] =?UTF-8?q?refactor(webgl):=20=E9=87=8D=E6=9E=84=20W?= =?UTF-8?q?ebGL=20=E6=B8=B2=E6=9F=93=E6=B5=81=E7=A8=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 Material 类替换为 RenderPipeline 类，以更准确地表示渲染管道 - 更新相关方法和属性，以适应新的 RenderPipeline 结构 - 优化部分代码，提高渲染效率 --- src/RunWebGL.ts | 14 +++++++------- src/WebGL.ts | 4 ++-- src/caches/getGLProgram.ts | 12 ++++++------ 3 files changed, 15 insertions(+), 15 deletions(-) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 38de573..d05d079 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, DrawIndexed, DrawVertex, ICullFace, IFrontFace, IIndicesDataTypes, IRenderPassObject, Material, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, DrawIndexed, DrawVertex, ICullFace, IFrontFace, IIndicesDataTypes, IRenderPassObject, RenderPipeline, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -39,7 +39,7 @@ declare global { interface WebGLRenderingContext { - _vertexArrays: ChainMap<[Material, VertexAttributes, IIndicesDataTypes], WebGLVertexArrayObject>; + _vertexArrays: ChainMap<[RenderPipeline, VertexAttributes, IIndicesDataTypes], WebGLVertexArrayObject>; } } @@ -202,7 +202,7 @@ export class RunWebGL private runRenderObject(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObject: RenderObject) { const { viewport, scissorRect, material, geometry, uniforms } = renderObject; - Material.init(material); + RenderPipeline.init(material); this.runViewPort(gl, attachmentSize, viewport); @@ -322,7 +322,7 @@ export class RunWebGL /** * 激活常量 */ - private runUniforms(gl: WebGLRenderingContext, material: Material, uniforms: Uniforms) + private runUniforms(gl: WebGLRenderingContext, material: RenderPipeline, uniforms: Uniforms) { const webGLProgram = getGLProgram(gl, material); @@ -547,7 +547,7 @@ export class RunWebGL /** * 执行设置或者上传渲染对象的顶点以及索引数据。 */ - private runVertexArray(gl: WebGLRenderingContext, material: Material, vertices: VertexAttributes, indices: IIndicesDataTypes) + private runVertexArray(gl: WebGLRenderingContext, material: RenderPipeline, vertices: VertexAttributes, indices: IIndicesDataTypes) { if (!vertices && !indices) return; @@ -670,7 +670,7 @@ export class RunWebGL gl.useProgram(program); } - private runRenderPipeline(gl: WebGLRenderingContext, renderPipeline: Material) + private runRenderPipeline(gl: WebGLRenderingContext, renderPipeline: RenderPipeline) { this.runProgram(gl, renderPipeline); @@ -772,7 +772,7 @@ export class RunWebGL } } - private runProgram(gl: WebGLRenderingContext, material: Material) + private runProgram(gl: WebGLRenderingContext, material: RenderPipeline) { const program = getGLProgram(gl, material); gl.useProgram(program); diff --git a/src/WebGL.ts b/src/WebGL.ts index a51265c..f1a3eb3 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -1,4 +1,4 @@ -import { Buffer, RenderPassDescriptor, Material, Sampler, Submit, Texture } from "@feng3d/render-api"; +import { Buffer, RenderPassDescriptor, RenderPipeline, Sampler, Submit, Texture } from "@feng3d/render-api"; import { RunWebGL } from "./RunWebGL"; import { deleteBuffer } from "./caches/getGLBuffer"; @@ -73,7 +73,7 @@ export class WebGL deleteSampler(this._gl, sampler); } - deleteProgram(material: Material) + deleteProgram(material: RenderPipeline) { deleteProgram(this._gl, material); } diff --git a/src/caches/getGLProgram.ts b/src/caches/getGLProgram.ts index 56acb39..ba4818e 100644 --- a/src/caches/getGLProgram.ts +++ b/src/caches/getGLProgram.ts @@ -1,4 +1,4 @@ -import { Material } from "@feng3d/render-api"; +import { RenderPipeline } from "@feng3d/render-api"; import { getWebGLUniformType, IGLUniformBufferType, isWebGLUniformTextureType } from "../const/IGLUniformType"; import { IGLAttributeInfo } from "../internal/IGLAttributeInfo"; import { IGLTransformFeedbackPipeline, IGLTransformFeedbackVaryings } from "../data/IGLTransformFeedbackPass"; @@ -38,14 +38,14 @@ declare global /** * 激活渲染程序 */ -export function getGLProgram(gl: WebGLRenderingContext, material: Material | IGLTransformFeedbackPipeline) +export function getGLProgram(gl: WebGLRenderingContext, material: RenderPipeline | IGLTransformFeedbackPipeline) { const shaderKey = getKey(material); let result = gl._programs[shaderKey]; if (result) return result; const vertex = material.vertex.code; - const fragment = (material as Material).fragment?.code || `#version 300 es + const fragment = (material as RenderPipeline).fragment?.code || `#version 300 es precision highp float; precision highp int; @@ -61,7 +61,7 @@ export function getGLProgram(gl: WebGLRenderingContext, material: Material | IGL return result; } -export function deleteProgram(gl: WebGLRenderingContext, material: Material) +export function deleteProgram(gl: WebGLRenderingContext, material: RenderPipeline) { const shaderKey = getKey(material); const result = gl._programs[shaderKey]; @@ -72,10 +72,10 @@ export function deleteProgram(gl: WebGLRenderingContext, material: Material) } } -function getKey(material: Material | IGLTransformFeedbackPipeline) +function getKey(material: RenderPipeline | IGLTransformFeedbackPipeline) { const vertex = material.vertex.code; - const fragment = (material as Material).fragment?.code; + const fragment = (material as RenderPipeline).fragment?.code; const transformFeedbackVaryings = (material as IGLTransformFeedbackPipeline).transformFeedbackVaryings; return `---vertexShader---\n${vertex}\n---fragment---\n${fragment}\n---feedback---${transformFeedbackVaryings?.varyings.toString()} ${transformFeedbackVaryings?.bufferMode}`; -- Gitee From eecd2b59c5aa9b4dc08c982958f832e030137841 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 00:19:07 +0800 Subject: [PATCH 31/57] =?UTF-8?q?refactor(examples):=20=E5=B0=86=20Materia?= =?UTF-8?q?l=20=E9=87=8D=E5=91=BD=E5=90=8D=E4=B8=BA=20RenderPipeline?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 在多个示例文件中，将 Material 类重命名为 RenderPipeline，以更好地反映其功能和用途。同时更新了相关引用和使用方式。 --- examples/src/WebGL2Samples/buffer_copy.ts | 6 +++--- examples/src/WebGL2Samples/buffer_uniform.ts | 6 +++--- examples/src/WebGL2Samples/draw_image_space.ts | 6 +++--- examples/src/WebGL2Samples/draw_instanced.ts | 6 +++--- examples/src/WebGL2Samples/draw_instanced_ubo.ts | 6 +++--- examples/src/WebGL2Samples/draw_primitive_restart.ts | 6 +++--- examples/src/WebGL2Samples/draw_range_arrays.ts | 8 ++++---- examples/src/WebGL2Samples/fbo_blit.ts | 8 ++++---- examples/src/WebGL2Samples/fbo_multisample.ts | 8 ++++---- examples/src/WebGL2Samples/fbo_new_blend_equation.ts | 10 +++++----- examples/src/WebGL2Samples/fbo_read_pixels.ts | 10 +++++----- examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts | 10 +++++----- examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 10 +++++----- examples/src/WebGL2Samples/fbo_rtt_texture_array.ts | 10 +++++----- examples/src/WebGL2Samples/geo_vertex_format.ts | 6 +++--- examples/src/WebGL2Samples/glsl_centroid.ts | 8 ++++---- .../WebGL2Samples/glsl_flat_smooth_interpolators.ts | 6 +++--- examples/src/WebGL2Samples/glsl_non_square_matrix.ts | 6 +++--- examples/src/WebGL2Samples/query_occlusion.ts | 6 +++--- examples/src/WebGL2Samples/sampler_filter.ts | 6 +++--- examples/src/WebGL2Samples/sampler_object.ts | 6 +++--- examples/src/WebGL2Samples/sampler_wrap.ts | 6 +++--- examples/src/WebGL2Samples/texture_2d_array.ts | 6 +++--- examples/src/WebGL2Samples/texture_3d.ts | 6 +++--- examples/src/WebGL2Samples/texture_derivative.ts | 6 +++--- examples/src/WebGL2Samples/texture_fetch.ts | 6 +++--- examples/src/WebGL2Samples/texture_format.ts | 10 +++++----- examples/src/WebGL2Samples/texture_grad.ts | 6 +++--- examples/src/WebGL2Samples/texture_immutable.ts | 12 ++++++------ examples/src/WebGL2Samples/texture_integer.ts | 6 +++--- examples/src/WebGL2Samples/texture_lod.ts | 6 +++--- examples/src/WebGL2Samples/texture_offset.ts | 10 +++++----- examples/src/WebGL2Samples/texture_pixel_store.ts | 6 +++--- examples/src/WebGL2Samples/texture_srgb.ts | 6 +++--- examples/src/WebGL2Samples/texture_vertex.ts | 6 +++--- .../WebGL2Samples/transform_feedback_instanced.ts | 10 +++++----- .../WebGL2Samples/transform_feedback_interleaved.ts | 8 ++++---- .../WebGL2Samples/transform_feedback_separated.ts | 8 ++++---- .../WebGL2Samples/transform_feedback_separated_2.ts | 10 +++++----- examples/src/regl-examples/basic.ts | 2 +- examples/src/regl-examples/batch.ts | 6 +++--- examples/src/regl-examples/bunny.ts | 2 +- examples/src/regl-examples/camera.ts | 2 +- examples/src/regl-examples/cloth.ts | 6 +++--- examples/src/regl-examples/cube.ts | 2 +- examples/src/test/RenderObjectChanges.ts | 6 +++--- examples/src/test/fractalCube.ts | 2 +- examples/src/webgl-examples/sample1.ts | 2 +- examples/src/webgl-examples/sample2.ts | 2 +- examples/src/webgl-examples/sample3.ts | 2 +- examples/src/webgl-examples/sample4.ts | 2 +- examples/src/webgl-examples/sample5.ts | 2 +- examples/src/webgl-examples/sample6.ts | 2 +- examples/src/webgl-examples/sample7.ts | 2 +- examples/src/webgl-examples/sample8.ts | 2 +- src/RunWebGL.ts | 4 ++-- src/data/IGLTransformFeedbackPass.ts | 2 +- 57 files changed, 169 insertions(+), 169 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index 87d86b8..fcb0314 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -1,4 +1,4 @@ -import { CopyBufferToBuffer, Material, RenderPass, VertexAttributes } from "@feng3d/render-api"; +import { CopyBufferToBuffer, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, GLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -16,7 +16,7 @@ import { getShaderSource } from "./utility"; const webgl = new WebGL(rc); // -- Init Program - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -51,7 +51,7 @@ import { getShaderSource } from "./utility"; const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ - material: program, + pipeline: program, geometry:{ primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, diff --git a/examples/src/WebGL2Samples/buffer_uniform.ts b/examples/src/WebGL2Samples/buffer_uniform.ts index 88898c8..c30dd48 100644 --- a/examples/src/WebGL2Samples/buffer_uniform.ts +++ b/examples/src/WebGL2Samples/buffer_uniform.ts @@ -1,4 +1,4 @@ -import { RenderPass, Material, Submit, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Submit, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -16,7 +16,7 @@ import { getShaderSource } from "./utility"; const webgl = new WebGL(rc); // -- Init Program - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -82,7 +82,7 @@ import { getShaderSource } from "./utility"; }; const ro: RenderObject = { - material: program, + pipeline: program, uniforms: { PerDraw: transforms, PerPass: lightPos, diff --git a/examples/src/WebGL2Samples/draw_image_space.ts b/examples/src/WebGL2Samples/draw_image_space.ts index f8032f0..adf37a5 100644 --- a/examples/src/WebGL2Samples/draw_image_space.ts +++ b/examples/src/WebGL2Samples/draw_image_space.ts @@ -1,4 +1,4 @@ -import { Material, Sampler, Texture, RenderObject } from "@feng3d/render-api"; +import { RenderPipeline, Sampler, Texture, RenderObject } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -23,7 +23,7 @@ loadImage("../../assets/img/Di-3d.png", (img) => magFilter: "linear", }; - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, @@ -42,7 +42,7 @@ loadImage("../../assets/img/Di-3d.png", (img) => primitive: { topology: "triangle-list" }, draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 3 }, }, - material: program + pipeline: program }; webgl.submit({ diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index bbf4da2..410c17f 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -1,4 +1,4 @@ -import { Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderObject, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -18,7 +18,7 @@ const vertexColorBuffer = new Float32Array([ 1.0, 0.5, 0.0, 0.0, 0.5, 1.0]); -const program: Material = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs"), targets: [{ blend: {} }] } }; @@ -37,7 +37,7 @@ const renderObject: RenderObject = { vertices: vertexArray.vertices, draw: { __type__: "DrawVertex", vertexCount: 3, instanceCount: 2 }, }, - material: program + pipeline: program }; canvas.width = window.innerWidth; diff --git a/examples/src/WebGL2Samples/draw_instanced_ubo.ts b/examples/src/WebGL2Samples/draw_instanced_ubo.ts index ae6e7d4..89a0799 100644 --- a/examples/src/WebGL2Samples/draw_instanced_ubo.ts +++ b/examples/src/WebGL2Samples/draw_instanced_ubo.ts @@ -1,4 +1,4 @@ -import { RenderPass, Material } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -12,7 +12,7 @@ const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program -const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; // -- Init Buffer const vertices = new Float32Array([ @@ -49,7 +49,7 @@ const materials = { const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0, 0, 0, 1], loadOp: "clear" }] }, renderObjects: [{ - material: program, + pipeline: program, uniforms: { Transform: transforms, Material: materials, diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index 3435341..41ec5f7 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -1,4 +1,4 @@ -import { Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -22,7 +22,7 @@ const vertexPosBuffer = new Float32Array([ 1.0, 1.0, ]); -const program: Material = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, @@ -50,7 +50,7 @@ const renderObject: RenderObject = { indices, draw: { __type__: "DrawIndexed", indexCount: 7, instanceCount: 2 }, }, - material: program, + pipeline: program, }; webgl.submit({ diff --git a/examples/src/WebGL2Samples/draw_range_arrays.ts b/examples/src/WebGL2Samples/draw_range_arrays.ts index 821822d..659fd2e 100644 --- a/examples/src/WebGL2Samples/draw_range_arrays.ts +++ b/examples/src/WebGL2Samples/draw_range_arrays.ts @@ -1,4 +1,4 @@ -import { Material, RenderObject, RenderPass, VertexAttributes } from "@feng3d/render-api"; +import { RenderObject, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -26,7 +26,7 @@ const vertexPosBuffer = new Float32Array([ -0.5, -0.5, ]); -const material: Material = { +const pipeline: RenderPipeline = { vertex: { code: getShaderSource("vs") }, @@ -44,7 +44,7 @@ const vertexArray: { vertices?: VertexAttributes } = { const vertexCount = 12; const renderObject: RenderObject = { - material, + pipeline: pipeline, geometry: { primitive: { topology: "triangle-strip" }, vertices: vertexArray.vertices, @@ -81,4 +81,4 @@ const rp: RenderPass = { webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); -webgl.deleteProgram(material); +webgl.deleteProgram(pipeline); diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 5f2a167..3f20bc1 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -1,4 +1,4 @@ -import { Material, RenderObject, RenderPass, RenderPassDescriptor, Sampler, Texture, TextureView, VertexAttributes } from "@feng3d/render-api"; +import { RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, TextureView, VertexAttributes } from "@feng3d/render-api"; import { GLBlitFramebuffer, GLCanvasContext, IGLBlitFramebufferItem, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ document.body.appendChild(canvas); const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); -const program: Material = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, @@ -80,7 +80,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => const renderObject: RenderObject = { viewport: { x: 0, y: 0, width: FRAMEBUFFER_SIZE.x, height: FRAMEBUFFER_SIZE.y }, - material: program, + pipeline: program, uniforms: { MVP: new Float32Array([ 0.8, 0.0, 0.0, 0.0, @@ -165,7 +165,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => vertices: vertexArray.vertices, draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 6 }, }, - material: program, + pipeline: program, }; const renderPass2: RenderPass = { diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index 2c96c8f..444a1f6 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -19,7 +19,7 @@ const PROGRAM = { MAX: 2 }; -const programs: Material[] = [ +const programs: RenderPipeline[] = [ { vertex: { code: getShaderSource("vs-render") }, fragment: { code: getShaderSource("fs-render") }, @@ -101,7 +101,7 @@ const IDENTITY = mat4.create(); const renderPass1: RenderPass = { descriptor: framebuffer, renderObjects: [{ - material: programs[PROGRAM.TEXTURE], + pipeline: programs[PROGRAM.TEXTURE], uniforms: { MVP: IDENTITY }, geometry: { primitive: { topology: "LINE_LOOP" }, @@ -122,7 +122,7 @@ const renderPass2: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [ { - material: programs[PROGRAM.SPLASH], + pipeline: programs[PROGRAM.SPLASH], uniforms: { diffuse: { texture, sampler }, MVP: mvp }, geometry: { primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index bea6273..5c6a776 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -1,4 +1,4 @@ -import { IRenderPassObject, RenderObject, RenderPass, Material, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -59,7 +59,7 @@ viewport[Corners.TOP_LEFT] = { // -- Initialize program -const program: Material = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs"), targets: [{ blend: {} }] }, }; @@ -120,7 +120,7 @@ function render() ]); const renderObject: RenderObject = { - material: program, + pipeline: program, uniforms: { mvp: matrix, diffuse: { texture, sampler } }, geometry:{ vertices: vertexArray.vertices, @@ -156,7 +156,7 @@ function render() { ...renderObject, viewport: viewport0, - material: { + pipeline: { ...program, fragment: { ...program.fragment, targets: [{ @@ -177,7 +177,7 @@ function render() { ...renderObject, viewport: viewport0, - material: { + pipeline: { ...program, fragment: { ...program.fragment, targets: [{ diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index bd2068a..25a95e9 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPassDescriptor, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -51,12 +51,12 @@ viewport[Textures.BLUE] = { // -- Initialize program // Multiple out shaders -const multipleOutputProgram: Material = { +const multipleOutputProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-multiple-output") }, fragment: { code: getShaderSource("fs-multiple-output") }, }; // Layer shaders -const layerProgram: Material = { +const layerProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-layer") }, fragment: { code: getShaderSource("fs-layer") }, }; @@ -131,7 +131,7 @@ const rp1: RenderPass = { renderObjects: [ { viewport: { x: 0, y: 0, width: w, height: h }, - material: multipleOutputProgram, + pipeline: multipleOutputProgram, uniforms: { mvp: matrix }, geometry:{ primitive: { topology: "triangle-list" }, @@ -149,7 +149,7 @@ const rp: RenderPass = { }; const ro: RenderObject = { - material: layerProgram, + pipeline: layerProgram, uniforms: { mvp: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index 99934da..98637f9 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -19,13 +19,13 @@ const windowSize = { // -- Initialize program // Depth shaders -const depthProgram: Material = { +const depthProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-depth") }, fragment: { code: getShaderSource("fs-depth") }, depthStencil: {}, }; // Draw shaders -const drawProgram: Material = { +const drawProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw") }, }; @@ -93,7 +93,7 @@ const frameBuffer: RenderPassDescriptor = { const renderPass: RenderPass = { descriptor: frameBuffer, renderObjects: [{ - material: depthProgram, + pipeline: depthProgram, geometry:{ primitive: { topology: "triangle-list" }, vertices: triVertexArray.vertices, @@ -109,7 +109,7 @@ const rp2: RenderPass = { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }], }, renderObjects: [{ - material: drawProgram, + pipeline: drawProgram, uniforms: { depthMap: { texture: depthTexture, sampler: depthSampler } }, geometry:{ primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index d009b0d..137ba1d 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -19,13 +19,13 @@ const windowSize = { // -- Initialize program // Draw buffer shaders -const drawBufferProgram: Material = { +const drawBufferProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-draw-buffer") }, fragment: { code: getShaderSource("fs-draw-buffer") }, }; // Draw shaders -const drawProgram: Material = { +const drawProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw") }, }; @@ -99,7 +99,7 @@ const frameBuffer: RenderPassDescriptor = { const renderPass: RenderPass = { descriptor: frameBuffer, renderObjects: [{ - material: drawBufferProgram, + pipeline: drawBufferProgram, geometry:{ primitive: { topology: "triangle-list" }, vertices: triVertexArray.vertices, @@ -112,7 +112,7 @@ const renderPass: RenderPass = { const renderPass2: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ - material: drawProgram, + pipeline: drawProgram, uniforms: { color1Map: { texture: color1Texture, sampler: color1Sampler }, color2Map: { texture: color2Texture, sampler: color2Sampler }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index d976945..f0ee5bf 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -1,4 +1,4 @@ -import { RenderPass, RenderPassDescriptor, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -51,12 +51,12 @@ viewport[Textures.BLUE] = { // -- Initialize program // Multiple out shaders -const multipleOutputProgram: Material = { +const multipleOutputProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-multiple-output") }, fragment: { code: getShaderSource("fs-multiple-output") }, }; // Layer shaders -const layerProgram: Material = { +const layerProgram: RenderPipeline = { vertex: { code: getShaderSource("vs-layer") }, fragment: { code: getShaderSource("fs-layer") }, }; @@ -133,7 +133,7 @@ const renderPass1: RenderPass = { renderObjects: [ { viewport: { x: 0, y: 0, width: w, height: h }, - material: multipleOutputProgram, + pipeline: multipleOutputProgram, uniforms: { mvp: matrix }, geometry:{ primitive: { topology: "triangle-list" }, @@ -153,7 +153,7 @@ const renderPass: RenderPass = { }; const renderObject: RenderObject = { - material: layerProgram, + pipeline: layerProgram, uniforms: { mvp: matrix, diffuse: { texture, sampler } }, geometry: { primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index e690c1b..8905d3d 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -1,4 +1,4 @@ -import { RenderObject, RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { HalfFloat } from "./third-party/HalfFloatUtility"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: {}, }; @@ -201,7 +201,7 @@ import { getShaderSource, loadImage } from "./utility"; const lightPosition = [0.0, 0.0, 5.0]; const ro: RenderObject = { - material: program, + pipeline: program, uniforms: { u_model: modelMatrix, u_modelInvTrans: modelInvTrans, diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index 3648bd4..dab0a03 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -1,4 +1,4 @@ -import { IPassEncoder, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, Material, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { IPassEncoder, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -48,7 +48,7 @@ const PROGRAM = { MAX: 3 }; -const programs: Material[] = [ +const programs: RenderPipeline[] = [ { vertex: { code: getShaderSource("vs-render") }, fragment: { code: getShaderSource("fs-render") }, }, @@ -160,7 +160,7 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) const rp: RenderPass = { descriptor: framebuffers[i], renderObjects: [{ - material: programs[i], + pipeline: programs[i], uniforms: { MVP: IDENTITY }, geometry: { primitive: { topology: "triangle-list" }, @@ -178,7 +178,7 @@ const rp2: RenderPass = { renderObjects, }; const ro: RenderObject = { - material: programs[PROGRAM.SPLASH], + pipeline: programs[PROGRAM.SPLASH], geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArrays[PROGRAM.SPLASH].vertices, diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index a356287..639e275 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, RenderPass, IRenderPassObject, Material, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { IIndicesDataTypes, RenderPass, IRenderPassObject, RenderPipeline, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getIVertexFormat, GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; @@ -42,7 +42,7 @@ viewport[VIEWPORTS.RIGHT] = { }; // -- Initialize program -const programs: Material[] = [ +const programs: RenderPipeline[] = [ { vertex: { code: getShaderSource("vs-flat") }, fragment: { code: getShaderSource("fs-flat") }, depthStencil: { depthCompare: "less-equal" }, @@ -168,7 +168,7 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) renderObjects.push( { viewport: viewport[i], - material: programs[i], + pipeline: programs[i], uniforms: { mvp: localMVP, mvNormal: localMVNormal, diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index cc529df..66902e3 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -1,4 +1,4 @@ -import { RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -12,7 +12,7 @@ const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program -const program: Material = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -66,7 +66,7 @@ loadImage("../../assets/img/Di-3d.png", function (image) const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ - material: program, + pipeline: program, uniforms: { MVP: matrix, diffuse: { texture, sampler } }, geometry:{ primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index ee220b2..77a1206 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, Material, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, IGLOcclusionQuery, WebGL } from "@feng3d/webgl"; import { watcher } from "@feng3d/watcher"; @@ -17,7 +17,7 @@ const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init Program -const program: Material = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: {}, }; @@ -51,7 +51,7 @@ const rp: RenderPass = { }; const ro: RenderObject = { - material: program, + pipeline: program, geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index 9f1072f..5f061cb 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -58,7 +58,7 @@ viewport[Corners.TOP_LEFT] = { // -- Initialize program -const program: Material = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -148,7 +148,7 @@ function render() }; const ro: RenderObject = { - material: program, + pipeline: program, uniforms: { mvp: matrix }, geometry:{ primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index c3d4c92..80f2d19 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -1,4 +1,4 @@ -import { RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -14,7 +14,7 @@ const webgl = new WebGL(rc); // -- Initialize program -const program: Material = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -88,7 +88,7 @@ function render() const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ - material: program, + pipeline: program, uniforms: { mvp: matrix, materialDiffuse0: { texture, sampler: samplerA }, diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index 1c56e2d..5f93ddc 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -58,7 +58,7 @@ viewport[Corners.TOP_LEFT] = { // -- Initialize program -const program: Material = { +const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -146,7 +146,7 @@ function render() ]); const ro: RenderObject = { - material: program, + pipeline: program, uniforms: { mvp: matrix }, geometry: { primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/texture_2d_array.ts b/examples/src/WebGL2Samples/texture_2d_array.ts index 96676d5..722258a 100644 --- a/examples/src/WebGL2Samples/texture_2d_array.ts +++ b/examples/src/WebGL2Samples/texture_2d_array.ts @@ -1,4 +1,4 @@ -import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -14,7 +14,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -83,7 +83,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); const ro: RenderObject = { - material: program, + pipeline: program, uniforms: { MVP: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_3d.ts b/examples/src/WebGL2Samples/texture_3d.ts index c8118ab..f89e587 100644 --- a/examples/src/WebGL2Samples/texture_3d.ts +++ b/examples/src/WebGL2Samples/texture_3d.ts @@ -1,4 +1,4 @@ -import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; import { getShaderSource } from "./utility"; @@ -95,7 +95,7 @@ import { getShaderSource } from "./utility"; }; // -- Initialize program - const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; // -- Initialize buffer const positions = new Float32Array([ @@ -158,7 +158,7 @@ import { getShaderSource } from "./utility"; } const ro: RenderObject = { - material: program, + pipeline: program, uniforms: { diffuse: { texture, sampler }, }, diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index 0ef0e50..7c67a86 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -1,4 +1,4 @@ -import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs"), targets: [{ @@ -206,7 +206,7 @@ import { getShaderSource, loadImage } from "./utility"; }; const ro: RenderObject = { - material: program, + pipeline: program, uniforms: {}, geometry:{ primitive: { topology: "triangle-list", cullFace: "back" }, diff --git a/examples/src/WebGL2Samples/texture_fetch.ts b/examples/src/WebGL2Samples/texture_fetch.ts index 8270ac2..6c6ae30 100644 --- a/examples/src/WebGL2Samples/texture_fetch.ts +++ b/examples/src/WebGL2Samples/texture_fetch.ts @@ -1,4 +1,4 @@ -import { RenderPass, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -15,7 +15,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; // -- Init buffers: vec2 Position, vec2 Texcoord const positions = new Float32Array([ @@ -72,7 +72,7 @@ import { getShaderSource, loadImage } from "./utility"; descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [ { - material: program, + pipeline: program, uniforms: { MVP: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index 6f17b08..b22dc32 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, Material, Sampler, Texture, ITextureFormat, VertexAttributes } from "@feng3d/render-api"; +import { IRenderPassObject, ITextureFormat, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -49,9 +49,9 @@ import { getShaderSource, loadImage } from "./utility"; } // -- Init program - const programUint: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-uint") } }; + const programUint: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-uint") } }; - const programNormalized: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-normalized") } }; + const programNormalized: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-normalized") } }; // -- Init buffers: vec2 Position, vec2 Texcoord const positions = new Float32Array([ @@ -174,7 +174,7 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, - material: programNormalized, + pipeline: programNormalized, uniforms: { MVP: matrix, diffuse: { texture: textures[i], sampler: samplers[i] }, @@ -192,7 +192,7 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, - material: programUint, + pipeline: programUint, uniforms: { MVP: matrix, diffuse: { texture: textures[i], sampler: samplers[i] }, diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index 0e94a2e..a561f8d 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -1,4 +1,4 @@ -import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: {}, }; @@ -197,7 +197,7 @@ import { getShaderSource, loadImage } from "./utility"; }; const ro: RenderObject = { - material: program, + pipeline: program, uniforms: {}, geometry:{ primitive: { cullFace: "back" }, diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index 4e1e343..30e3642 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; @@ -38,9 +38,9 @@ import { getShaderSource, loadImage } from "./utility"; }; // -- Init program - const program: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") } }; - const program3D: Material = { vertex: { code: getShaderSource("vs-3d") }, fragment: { code: getShaderSource("fs-3d") } }; + const program3D: RenderPipeline = { vertex: { code: getShaderSource("vs-3d") }, fragment: { code: getShaderSource("fs-3d") } }; // -- Init buffers: vec2 Position, vec2 Texcoord const positions = new Float32Array([ @@ -100,7 +100,7 @@ import { getShaderSource, loadImage } from "./utility"; // -- Render const ro: RenderObject = { - material: program, + pipeline: program, uniforms: { MVP: matrix, }, @@ -120,7 +120,7 @@ import { getShaderSource, loadImage } from "./utility"; { viewport: { x: viewports[Corners.LEFT].x, y: viewports[Corners.LEFT].y, width: viewports[Corners.LEFT].z, height: viewports[Corners.LEFT].w }, ...ro, - material: program, + pipeline: program, uniforms: { ...ro.uniforms, diffuse: { texture: texture2D, sampler: sampler2D }, @@ -132,7 +132,7 @@ import { getShaderSource, loadImage } from "./utility"; { viewport: { x: viewports[Corners.RIGHT].x, y: viewports[Corners.RIGHT].y, width: viewports[Corners.RIGHT].z, height: viewports[Corners.RIGHT].w }, ...ro, - material: program3D, + pipeline: program3D, uniforms: { ...ro.uniforms, diffuse: { texture: texture3D, sampler: sampler3D }, diff --git a/examples/src/WebGL2Samples/texture_integer.ts b/examples/src/WebGL2Samples/texture_integer.ts index 3dc991c..bc99249 100644 --- a/examples/src/WebGL2Samples/texture_integer.ts +++ b/examples/src/WebGL2Samples/texture_integer.ts @@ -1,4 +1,4 @@ -import { RenderPass, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -15,7 +15,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -70,7 +70,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); const ro: RenderObject = { - material: program, + pipeline: program, uniforms: { MVP: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index 2bf03c2..7594c8e 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, Material, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -87,7 +87,7 @@ import { getShaderSource, loadImage } from "./utility"; }; // -- Initialize program - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -198,7 +198,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); const ro: RenderObject = { - material: program, + pipeline: program, uniforms: { mvp: matrix, }, diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index d1d8cb4..1fdc345 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { IRenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -36,9 +36,9 @@ import { getShaderSource, loadImage } from "./utility"; }; // -- Init program - const programBicubic: Material = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-bicubic") } }; + const programBicubic: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-bicubic") } }; - const programOffsetBicubic: Material = { + const programOffsetBicubic: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs-offset-bicubic") }, }; @@ -102,7 +102,7 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewports[Corners.RIGHT].x, y: viewports[Corners.RIGHT].y, width: viewports[Corners.RIGHT].z, height: viewports[Corners.RIGHT].w }, - material: programBicubic, + pipeline: programBicubic, uniforms: { MVP: matrix, diffuse: { texture, sampler }, @@ -119,7 +119,7 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push( { viewport: { x: viewports[Corners.LEFT].x, y: viewports[Corners.LEFT].y, width: viewports[Corners.LEFT].z, height: viewports[Corners.LEFT].w }, - material: programOffsetBicubic, + pipeline: programOffsetBicubic, uniforms: { MVP: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index 3fb2d47..6f7e8ae 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { getIGLBuffer, GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -14,7 +14,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -91,7 +91,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); renderObjects.push({ - material: program, + pipeline: program, uniforms: { MVP: matrix, diffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index 0785c48..4c9b175 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { getIGLBuffer, GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -16,7 +16,7 @@ import { getShaderSource, loadImage } from "./utility"; // -- Initialize program - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, }; @@ -82,7 +82,7 @@ import { getShaderSource, loadImage } from "./utility"; 0.0, 0.0, 0.0, 1.0 ]); renderObjects.push({ - material: program, + pipeline: program, uniforms: { mvp: matrix, materialDiffuse: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index 035a167..3222e71 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IPrimitiveTopology, RenderPass, IRenderPassObject, Material, Sampler, Texture, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IPrimitiveTopology, IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { getIVertexFormat, GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -40,7 +40,7 @@ import { getShaderSource, loadImage } from "./utility"; const webgl = new WebGL(rc); // -- Init program - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs") }, fragment: { code: getShaderSource("fs") }, depthStencil: { depthCompare: "less" }, }; @@ -211,7 +211,7 @@ import { getShaderSource, loadImage } from "./utility"; mat4.multiply(localMV, mvMatrix, primitive.matrix); renderObjects.push({ - material: { + pipeline: { ...program, }, uniforms: { diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index 3e3feec..91019f7 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, Material, Submit, IVertexDataTypes, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IVertexDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -113,7 +113,7 @@ import { getShaderSource } from "./utility"; }; // Setup program for draw shader - const programDraw: Material = { + const programDraw: RenderPipeline = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw"), targets: [{ @@ -125,13 +125,13 @@ import { getShaderSource } from "./utility"; }, }; - const programs: [IGLTransformFeedbackPipeline, Material] = [programTransform, programDraw]; + const programs: [IGLTransformFeedbackPipeline, RenderPipeline] = [programTransform, programDraw]; return programs; } const transformRO: IGLTransformFeedbackObject = { - material: programs[PROGRAM_TRANSFORM], + pipeline: programs[PROGRAM_TRANSFORM], vertices: null, transformFeedback: null, uniforms: {}, @@ -140,7 +140,7 @@ import { getShaderSource } from "./utility"; const renderRO: RenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height - 10 }, - material: programs[PROGRAM_DRAW], + pipeline: programs[PROGRAM_DRAW], uniforms: {}, geometry:{ primitive: { topology: "triangle-list" }, diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index 001cc19..9413983 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, Material, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IVertexDataTypes, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { getIGLVertexBuffer, GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -29,7 +29,7 @@ import { getShaderSource } from "./utility"; return programTransform; })(getShaderSource("vs-transform"), getShaderSource("fs-transform")); - const programFeedback: Material = { + const programFeedback: RenderPipeline = { vertex: { code: getShaderSource("vs-feedback") }, fragment: { code: getShaderSource("fs-feedback") }, }; @@ -91,7 +91,7 @@ import { getShaderSource } from "./utility"; __type__: "TransformFeedbackPass", transformFeedbackObjects: [ { - material: programTransform, + pipeline: programTransform, vertices: vertexArrays[PROGRAM_TRANSFORM].vertices, uniforms: { MVP: matrix }, transformFeedback, @@ -104,7 +104,7 @@ import { getShaderSource } from "./utility"; renderObjects: [ // Second draw, reuse captured attributes { - material: programFeedback, + pipeline: programFeedback, geometry:{ vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, indices: vertexArrays[PROGRAM_FEEDBACK].indices, diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index c201088..5b04e42 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IVertexDataTypes, Material, Submit, VertexAttributes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IVertexDataTypes, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -27,7 +27,7 @@ import { getShaderSource } from "./utility"; return transformFeedbackPipeline; })(getShaderSource("vs-transform"), getShaderSource("fs-transform")); - const programFeedback: Material = { + const programFeedback: RenderPipeline = { vertex: { code: getShaderSource("vs-feedback") }, fragment: { code: getShaderSource("fs-feedback") }, }; @@ -102,7 +102,7 @@ import { getShaderSource } from "./utility"; __type__: "TransformFeedbackPass", transformFeedbackObjects: [ { - material: programTransform, + pipeline: programTransform, vertices: vertexArrays[PROGRAM_TRANSFORM].vertices, uniforms: { MVP: matrix }, transformFeedback, @@ -115,7 +115,7 @@ import { getShaderSource } from "./utility"; renderObjects: [ // Second draw, reuse captured attributes { - material: programs[PROGRAM_FEEDBACK], + pipeline: programs[PROGRAM_FEEDBACK], geometry: { vertices: vertexArrays[PROGRAM_FEEDBACK].vertices, indices: vertexArrays[PROGRAM_FEEDBACK].indices, diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 71c0e69..14a353a 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, RenderObject, Material, Submit, VertexAttributes, IVertexDataTypes } from "@feng3d/render-api"; +import { IIndicesDataTypes, IVertexDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -108,14 +108,14 @@ import { getShaderSource } from "./utility"; }; } - function initProgram(): [IGLTransformFeedbackPipeline, Material] + function initProgram(): [IGLTransformFeedbackPipeline, RenderPipeline] { const transformFeedbackPipeline: IGLTransformFeedbackPipeline = { vertex: { code: getShaderSource("vs-emit") }, transformFeedbackVaryings: { varyings: ["v_position", "v_velocity", "v_spawntime", "v_lifetime"], bufferMode: "SEPARATE_ATTRIBS" }, }; - const program: Material = { + const program: RenderPipeline = { vertex: { code: getShaderSource("vs-draw") }, fragment: { code: getShaderSource("fs-draw"), @@ -132,7 +132,7 @@ import { getShaderSource } from "./utility"; } const transformRO: IGLTransformFeedbackObject = { - material: transformFeedbackPipeline, + pipeline: transformFeedbackPipeline, vertices: null, transformFeedback: null, uniforms: { @@ -143,7 +143,7 @@ import { getShaderSource } from "./utility"; const renderRO: RenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height - 10 }, - material: program, + pipeline: program, uniforms: { u_color: [0.0, 1.0, 1.0, 1.0], }, diff --git a/examples/src/regl-examples/basic.ts b/examples/src/regl-examples/basic.ts index 7610ff7..86ff395 100644 --- a/examples/src/regl-examples/basic.ts +++ b/examples/src/regl-examples/basic.ts @@ -31,7 +31,7 @@ const renderObject: RenderObject = { draw: { __type__: "DrawVertex", vertexCount: 3 }, }, uniforms: { color: [1, 0, 0, 1] }, - material: { + pipeline: { vertex: { code: ` precision mediump float; diff --git a/examples/src/regl-examples/batch.ts b/examples/src/regl-examples/batch.ts index b5e0c6a..7f74182 100644 --- a/examples/src/regl-examples/batch.ts +++ b/examples/src/regl-examples/batch.ts @@ -1,4 +1,4 @@ -import { Material, Submit, RenderObject, VertexAttributes } from "@feng3d/render-api"; +import { RenderObject, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; const canvas = document.createElement("canvas"); @@ -21,7 +21,7 @@ const offsets = [{ offset: [-1, -1] }, { offset: [1, 0] }, { offset: [1, 1] }]; -const material: Material = { +const pipeline: RenderPipeline = { vertex: { code: `precision mediump float; attribute vec2 position; @@ -64,7 +64,7 @@ function getRenderObject(batchId: number) uniforms: { offset: offsets[batchId].offset, }, - material, + pipeline: pipeline, }; return renderObject; diff --git a/examples/src/regl-examples/bunny.ts b/examples/src/regl-examples/bunny.ts index a62f902..6b97135 100644 --- a/examples/src/regl-examples/bunny.ts +++ b/examples/src/regl-examples/bunny.ts @@ -41,7 +41,7 @@ const renderObject: RenderObject = { uniforms: { model: mat4.identity([]), }, - material: { + pipeline: { vertex: { code: `precision mediump float; attribute vec3 position; diff --git a/examples/src/regl-examples/camera.ts b/examples/src/regl-examples/camera.ts index dcde425..0527643 100644 --- a/examples/src/regl-examples/camera.ts +++ b/examples/src/regl-examples/camera.ts @@ -31,7 +31,7 @@ const renderObject: RenderObject = { draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, uniforms: {}, - material: { + pipeline: { vertex: { code: `precision mediump float; uniform mat4 projection, view; diff --git a/examples/src/regl-examples/cloth.ts b/examples/src/regl-examples/cloth.ts index d90dc04..ff5d0f3 100644 --- a/examples/src/regl-examples/cloth.ts +++ b/examples/src/regl-examples/cloth.ts @@ -175,9 +175,9 @@ import * as vec3 from "./stackgl/gl-vec3"; draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, uniforms: {}, - material: { + pipeline: { vertex: { - code: `precision mediump float; + code: /* wgsl */`precision mediump float; attribute vec3 position; attribute vec3 normal; @@ -194,7 +194,7 @@ import * as vec3 from "./stackgl/gl-vec3"; gl_Position = projection * view * vec4(position, 1); }` }, fragment: { - code: `precision mediump float; + code: /* wgsl */`precision mediump float; varying vec2 vUv; varying vec3 vNormal; diff --git a/examples/src/regl-examples/cube.ts b/examples/src/regl-examples/cube.ts index e5982e9..90861b4 100644 --- a/examples/src/regl-examples/cube.ts +++ b/examples/src/regl-examples/cube.ts @@ -74,7 +74,7 @@ import * as mat4 from "./stackgl/gl-mat4"; draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, uniforms: {}, - material: { + pipeline: { vertex: { code: `precision mediump float; attribute vec3 position; diff --git a/examples/src/test/RenderObjectChanges.ts b/examples/src/test/RenderObjectChanges.ts index 1398bc3..abfa6ad 100644 --- a/examples/src/test/RenderObjectChanges.ts +++ b/examples/src/test/RenderObjectChanges.ts @@ -10,7 +10,7 @@ const init = async (canvas: HTMLCanvasElement) => const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); // 初始化WebGL const renderObject: RenderObject = { // 渲染对象 - material: { // 渲染管线 + pipeline: { // 渲染管线 vertex: { // 顶点着色器 code: ` attribute vec4 position; @@ -66,7 +66,7 @@ const init = async (canvas: HTMLCanvasElement) => window.onclick = () => { // 修改顶点着色器代码 - renderObject.material.vertex.code = ` + renderObject.pipeline.vertex.code = ` attribute vec4 position; void main() { @@ -77,7 +77,7 @@ const init = async (canvas: HTMLCanvasElement) => `; // 修改片段着色器代码 - renderObject.material.fragment.code = ` + renderObject.pipeline.fragment.code = ` precision highp float; uniform vec4 color; void main() { diff --git a/examples/src/test/fractalCube.ts b/examples/src/test/fractalCube.ts index c1b5059..b1890c6 100644 --- a/examples/src/test/fractalCube.ts +++ b/examples/src/test/fractalCube.ts @@ -27,7 +27,7 @@ async function main() } = { texture: { size: [canvas.width, canvas.height] }, sampler: {} }; const renderObject: RenderObject = { - material: { + pipeline: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample1.ts b/examples/src/webgl-examples/sample1.ts index 70093bf..92e4a71 100644 --- a/examples/src/webgl-examples/sample1.ts +++ b/examples/src/webgl-examples/sample1.ts @@ -20,7 +20,7 @@ const init = async (canvas: HTMLCanvasElement) => }], }, renderObjects: [{ // 渲染对象 - material: { // 渲染管线 + pipeline: { // 渲染管线 vertex: { // 顶点着色器 code: ` attribute vec4 position; diff --git a/examples/src/webgl-examples/sample2.ts b/examples/src/webgl-examples/sample2.ts index 0d6beb7..488fc85 100644 --- a/examples/src/webgl-examples/sample2.ts +++ b/examples/src/webgl-examples/sample2.ts @@ -24,7 +24,7 @@ function main() }, }, renderObjects: [{ - material: { + pipeline: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample3.ts b/examples/src/webgl-examples/sample3.ts index 830bb2f..3af150d 100644 --- a/examples/src/webgl-examples/sample3.ts +++ b/examples/src/webgl-examples/sample3.ts @@ -28,7 +28,7 @@ function main() }, }, renderObjects: [{ - material: { + pipeline: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample4.ts b/examples/src/webgl-examples/sample4.ts index 41cdc36..bb34470 100644 --- a/examples/src/webgl-examples/sample4.ts +++ b/examples/src/webgl-examples/sample4.ts @@ -16,7 +16,7 @@ function main() const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); const renderObject: RenderObject = { - material: { + pipeline: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample5.ts b/examples/src/webgl-examples/sample5.ts index d36f86f..1fde12a 100644 --- a/examples/src/webgl-examples/sample5.ts +++ b/examples/src/webgl-examples/sample5.ts @@ -20,7 +20,7 @@ function main() const buffers = initBuffers(); const renderObject: RenderObject = { - material: { + pipeline: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample6.ts b/examples/src/webgl-examples/sample6.ts index 8bb1794..d8b9c89 100644 --- a/examples/src/webgl-examples/sample6.ts +++ b/examples/src/webgl-examples/sample6.ts @@ -22,7 +22,7 @@ async function main() const texture = await loadTexture("../../cubetexture.png"); const renderObject: RenderObject = { - material: { + pipeline: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample7.ts b/examples/src/webgl-examples/sample7.ts index 3a04cbc..e40fc46 100644 --- a/examples/src/webgl-examples/sample7.ts +++ b/examples/src/webgl-examples/sample7.ts @@ -22,7 +22,7 @@ async function main() const texture = await loadTexture("../../cubetexture.png"); const renderObject: RenderObject = { - material: { + pipeline: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/examples/src/webgl-examples/sample8.ts b/examples/src/webgl-examples/sample8.ts index 2654ead..af59189 100644 --- a/examples/src/webgl-examples/sample8.ts +++ b/examples/src/webgl-examples/sample8.ts @@ -26,7 +26,7 @@ function main() const video = setupVideo("../../Firefox.mp4"); const renderObject: RenderObject = { - material: { + pipeline: { vertex: { code: ` attribute vec4 aVertexPosition; diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index d05d079..ee997ef 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -201,7 +201,7 @@ export class RunWebGL private runRenderObject(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObject: RenderObject) { - const { viewport, scissorRect, material, geometry, uniforms } = renderObject; + const { viewport, scissorRect, pipeline: material, geometry, uniforms } = renderObject; RenderPipeline.init(material); this.runViewPort(gl, attachmentSize, viewport); @@ -233,7 +233,7 @@ export class RunWebGL private runTransformFeedbackObject(gl: WebGLRenderingContext, renderObject: IGLTransformFeedbackObject) { - const { material, vertices, uniforms, transformFeedback, draw } = renderObject; + const { pipeline: material, vertices, uniforms, transformFeedback, draw } = renderObject; const drawMode = getIGLDrawMode("point-list"); diff --git a/src/data/IGLTransformFeedbackPass.ts b/src/data/IGLTransformFeedbackPass.ts index 51022b8..80cc94b 100644 --- a/src/data/IGLTransformFeedbackPass.ts +++ b/src/data/IGLTransformFeedbackPass.ts @@ -27,7 +27,7 @@ export interface IGLTransformFeedbackObject /** * 渲染管线描述。 */ - readonly material: IGLTransformFeedbackPipeline; + readonly pipeline: IGLTransformFeedbackPipeline; /** * 顶点属性数据映射。 -- Gitee From 18c71ca799df99eb3f7bdd957d2def3d5c44dfa3 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 01:34:57 +0800 Subject: [PATCH 32/57] =?UTF-8?q?refactor(getGLCanvasContext):=20=E9=87=8D?= =?UTF-8?q?=E6=9E=84=E8=8E=B7=E5=8F=96=20WebGL=20=E4=B8=8A=E4=B8=8B?= =?UTF-8?q?=E6=96=87=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 修改了 getWebGLContext 函数的实现，优化了获取 WebGL 上下文的流程 - 重构了 GLCanvasContext 类，改为接口和类的组合结构 - 引入了 DataProxy 模式，用于初始化和管理 GLCanvasContext 实例 - 优化了警告和错误信息的输出格式 --- src/caches/getGLCanvasContext.ts | 7 ++--- src/data/GLCanvasContext.ts | 46 ++++++++++++++++++++++++-------- 2 files changed, 39 insertions(+), 14 deletions(-) diff --git a/src/caches/getGLCanvasContext.ts b/src/caches/getGLCanvasContext.ts index d85c844..550ab57 100644 --- a/src/caches/getGLCanvasContext.ts +++ b/src/caches/getGLCanvasContext.ts @@ -84,19 +84,20 @@ export function getCanvas(canvasContext: GLCanvasContext) function getWebGLContext(canvas: HTMLCanvasElement, canvasContext: GLCanvasContext) { - const contextAttributes = GLCanvasContext.getInstance(canvasContext); + GLCanvasContext.init(canvasContext); + const contextAttributes = canvasContext; // 使用用户提供参数获取WebGL上下文 let gl = canvas.getContext(contextAttributes.contextId, contextAttributes) as any; if (gl) return gl; gl = canvas.getContext("webgl", contextAttributes) || canvas.getContext("webgl2", contextAttributes); - gl && console.warn(`无法使用用户提供参数获取指定WebGL上下文，${canvasContext}`); + gl && console.warn(`无法使用用户提供参数获取指定WebGL上下文`, canvasContext); if (gl) return gl; // 使用默认参数获取WebGL上下文 gl = canvas.getContext("webgl") || canvas.getContext("webgl2"); - gl && console.warn(`无法使用用户提供参数获取WebGL上下文，${canvasContext}`); + gl && console.warn(`无法使用用户提供参数获取WebGL上下文`, canvasContext); if (gl) return gl; console.error(`无法获取WebGL上下文。`); diff --git a/src/data/GLCanvasContext.ts b/src/data/GLCanvasContext.ts index 166010b..5a764e8 100644 --- a/src/data/GLCanvasContext.ts +++ b/src/data/GLCanvasContext.ts @@ -1,11 +1,11 @@ -import { Data } from "@feng3d/render-api"; +import { DataProxy } from "@feng3d/render-api"; /** * 画布(WebGL)上下文信息。 * * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext */ -export class GLCanvasContext extends Data implements WebGLContextAttributes +export interface GLCanvasContext extends WebGLContextAttributes { /** * 画布编号。 @@ -15,13 +15,37 @@ export class GLCanvasContext extends Data implements WebGLContextAttributes /** * WebGL上下文类型 */ - contextId?: "webgl" | "webgl2" = "webgl2"; + contextId?: "webgl" | "webgl2"; - depth?: boolean = true; - stencil?: boolean = true; - antialias?: boolean = false; - premultipliedAlpha?: boolean = true; - preserveDrawingBuffer?: boolean = false; - powerPreference?: WebGLPowerPreference = "default"; - failIfMajorPerformanceCaveat?: boolean = false; -} \ No newline at end of file + depth?: boolean; + stencil?: boolean; + antialias?: boolean; + premultipliedAlpha?: boolean; + preserveDrawingBuffer?: boolean; + powerPreference?: WebGLPowerPreference; + failIfMajorPerformanceCaveat?: boolean; +} + +export class GLCanvasContext +{ + static addInitFunc: (func: (material: GLCanvasContext) => ((material: GLCanvasContext) => void)) => void = DataProxy.addInitFunc; + static init: (material: Partial) => GLCanvasContext = DataProxy.init; + static del: (material: GLCanvasContext) => GLCanvasContext = DataProxy.del; +} + +GLCanvasContext.addInitFunc((context) => +{ + context.contextId ??= "webgl2"; + context.depth ??= true; + context.stencil ??= true; + context.antialias ??= false; + context.premultipliedAlpha ??= true; + context.preserveDrawingBuffer ??= false; + context.powerPreference ??= "default"; + context.failIfMajorPerformanceCaveat ??= false; + + return (material) => + { + + }; +}); \ No newline at end of file -- Gitee From 4d7f923ef75bcb5f230090abb7986e51498b9fdd Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 17:29:10 +0800 Subject: [PATCH 33/57] =?UTF-8?q?refactor(WebGL):=20=E9=87=8D=E6=9E=84=20W?= =?UTF-8?q?ebGL=20=E6=B8=B2=E6=9F=93=E6=B5=81=E7=A8=8B=E5=92=8C=E4=B8=8A?= =?UTF-8?q?=E4=B8=8B=E6=96=87=E7=AE=A1=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 优化 RunWebGL 类中的渲染流程，使用 pipeline 代替 material - 重构 GLCanvasContext 类，移除不必要的静态方法 - 调整 getWebGLContext 函数，直接使用 GLCanvasContext._init --- src/RunWebGL.ts | 10 +++++----- src/caches/getGLCanvasContext.ts | 3 +-- src/data/GLCanvasContext.ts | 12 +++--------- 3 files changed, 9 insertions(+), 16 deletions(-) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index ee997ef..6b47083 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -201,20 +201,20 @@ export class RunWebGL private runRenderObject(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObject: RenderObject) { - const { viewport, scissorRect, pipeline: material, geometry, uniforms } = renderObject; - RenderPipeline.init(material); + const { viewport, scissorRect, pipeline, geometry, uniforms } = renderObject; + RenderPipeline._init(pipeline); this.runViewPort(gl, attachmentSize, viewport); this.runScissor(gl, attachmentSize, scissorRect); - this.runRenderPipeline(gl, material); + this.runRenderPipeline(gl, pipeline); - this.runUniforms(gl, material, uniforms); + this.runUniforms(gl, pipeline, uniforms); const { vertices, indices, draw, primitive } = geometry; - this.runVertexArray(gl, material, vertices, indices); + this.runVertexArray(gl, pipeline, vertices, indices); this.runPrimitiveState(gl, primitive); diff --git a/src/caches/getGLCanvasContext.ts b/src/caches/getGLCanvasContext.ts index 550ab57..9924070 100644 --- a/src/caches/getGLCanvasContext.ts +++ b/src/caches/getGLCanvasContext.ts @@ -84,8 +84,7 @@ export function getCanvas(canvasContext: GLCanvasContext) function getWebGLContext(canvas: HTMLCanvasElement, canvasContext: GLCanvasContext) { - GLCanvasContext.init(canvasContext); - const contextAttributes = canvasContext; + const contextAttributes = GLCanvasContext._init(canvasContext); // 使用用户提供参数获取WebGL上下文 let gl = canvas.getContext(contextAttributes.contextId, contextAttributes) as any; diff --git a/src/data/GLCanvasContext.ts b/src/data/GLCanvasContext.ts index 5a764e8..cf4f745 100644 --- a/src/data/GLCanvasContext.ts +++ b/src/data/GLCanvasContext.ts @@ -1,4 +1,3 @@ -import { DataProxy } from "@feng3d/render-api"; /** * 画布(WebGL)上下文信息。 @@ -26,14 +25,9 @@ export interface GLCanvasContext extends WebGLContextAttributes failIfMajorPerformanceCaveat?: boolean; } -export class GLCanvasContext -{ - static addInitFunc: (func: (material: GLCanvasContext) => ((material: GLCanvasContext) => void)) => void = DataProxy.addInitFunc; - static init: (material: Partial) => GLCanvasContext = DataProxy.init; - static del: (material: GLCanvasContext) => GLCanvasContext = DataProxy.del; -} +export class GLCanvasContext { } -GLCanvasContext.addInitFunc((context) => +GLCanvasContext._reg((context) => { context.contextId ??= "webgl2"; context.depth ??= true; @@ -44,7 +38,7 @@ GLCanvasContext.addInitFunc((context) => context.powerPreference ??= "default"; context.failIfMajorPerformanceCaveat ??= false; - return (material) => + return () => { }; -- Gitee From e42358908e7e929a474c1d6565e37ad39a04daca Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 9 Mar 2025 21:10:25 +0800 Subject: [PATCH 34/57] 1 --- src/RunWebGL.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 6b47083..93c118d 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -202,7 +202,6 @@ export class RunWebGL private runRenderObject(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObject: RenderObject) { const { viewport, scissorRect, pipeline, geometry, uniforms } = renderObject; - RenderPipeline._init(pipeline); this.runViewPort(gl, attachmentSize, viewport); -- Gitee From d3e0b8359849093e73ec9ff7c2c3a995cc86d92e Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 12:38:13 +0800 Subject: [PATCH 35/57] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E6=8E=A5=E5=8F=A3=E5=B9=B6=E4=BC=98=E5=8C=96?= =?UTF-8?q?=20WebGL=20=E4=B8=8A=E4=B8=8B=E6=96=87=E5=88=9B=E5=BB=BA?= =?UTF-8?q?=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 GLCanvasContext 从类改为接口，并添加 defaultGLCanvasContext 对象 - 优化 getWebGLContext 函数，使用 Object.assign 合并上下文属性 - 将多个类接口改为纯接口定义，提高代码可读性和维护性 - 调整 warn 日志输出，使用合并后的上下文属性 --- src/caches/getGLCanvasContext.ts | 8 ++++---- src/data/GLBlitFramebuffer.ts | 4 ++-- src/data/GLCanvasContext.ts | 31 +++++++++++++------------------ src/data/GLCanvasTexture.ts | 2 +- src/data/GLIndexBuffer.ts | 6 +++--- src/data/GLVertexBuffer.ts | 6 +++--- src/data/IGLUniformBuffer.ts | 4 ++-- 7 files changed, 28 insertions(+), 33 deletions(-) diff --git a/src/caches/getGLCanvasContext.ts b/src/caches/getGLCanvasContext.ts index 9924070..3e78228 100644 --- a/src/caches/getGLCanvasContext.ts +++ b/src/caches/getGLCanvasContext.ts @@ -1,4 +1,4 @@ -import { GLCanvasContext } from "../data/GLCanvasContext"; +import { defaultGLCanvasContext, GLCanvasContext } from "../data/GLCanvasContext"; import { ChainMap } from "../utils/ChainMap"; import { getCapabilities } from "./getCapabilities"; @@ -84,19 +84,19 @@ export function getCanvas(canvasContext: GLCanvasContext) function getWebGLContext(canvas: HTMLCanvasElement, canvasContext: GLCanvasContext) { - const contextAttributes = GLCanvasContext._init(canvasContext); + const contextAttributes = Object.assign({}, defaultGLCanvasContext, canvasContext); // 使用用户提供参数获取WebGL上下文 let gl = canvas.getContext(contextAttributes.contextId, contextAttributes) as any; if (gl) return gl; gl = canvas.getContext("webgl", contextAttributes) || canvas.getContext("webgl2", contextAttributes); - gl && console.warn(`无法使用用户提供参数获取指定WebGL上下文`, canvasContext); + gl && console.warn(`无法使用用户提供参数获取指定WebGL上下文`, contextAttributes); if (gl) return gl; // 使用默认参数获取WebGL上下文 gl = canvas.getContext("webgl") || canvas.getContext("webgl2"); - gl && console.warn(`无法使用用户提供参数获取WebGL上下文`, canvasContext); + gl && console.warn(`无法使用用户提供参数获取WebGL上下文`, contextAttributes); if (gl) return gl; console.error(`无法获取WebGL上下文。`); diff --git a/src/data/GLBlitFramebuffer.ts b/src/data/GLBlitFramebuffer.ts index e858f6d..d0f0171 100644 --- a/src/data/GLBlitFramebuffer.ts +++ b/src/data/GLBlitFramebuffer.ts @@ -3,12 +3,12 @@ import { RenderPassDescriptor } from "@feng3d/render-api"; /** * 拷贝渲染缓冲与纹理直接拷贝数据。 */ -export class GLBlitFramebuffer +export interface GLBlitFramebuffer { /** * 数据类型。 */ - readonly __type__: "BlitFramebuffer" = "BlitFramebuffer"; + readonly __type__: "BlitFramebuffer"; read: RenderPassDescriptor; draw: RenderPassDescriptor; diff --git a/src/data/GLCanvasContext.ts b/src/data/GLCanvasContext.ts index cf4f745..6e9009a 100644 --- a/src/data/GLCanvasContext.ts +++ b/src/data/GLCanvasContext.ts @@ -25,21 +25,16 @@ export interface GLCanvasContext extends WebGLContextAttributes failIfMajorPerformanceCaveat?: boolean; } -export class GLCanvasContext { } - -GLCanvasContext._reg((context) => -{ - context.contextId ??= "webgl2"; - context.depth ??= true; - context.stencil ??= true; - context.antialias ??= false; - context.premultipliedAlpha ??= true; - context.preserveDrawingBuffer ??= false; - context.powerPreference ??= "default"; - context.failIfMajorPerformanceCaveat ??= false; - - return () => - { - - }; -}); \ No newline at end of file +/** + * 默认画布(WebGL)上下文信息。 + */ +export const defaultGLCanvasContext: GLCanvasContext = { + contextId: "webgl2", + depth: true, + stencil: true, + antialias: false, + premultipliedAlpha: true, + preserveDrawingBuffer: false, + powerPreference: "default", + failIfMajorPerformanceCaveat: false, +} diff --git a/src/data/GLCanvasTexture.ts b/src/data/GLCanvasTexture.ts index 6224a5d..5c0bd90 100644 --- a/src/data/GLCanvasTexture.ts +++ b/src/data/GLCanvasTexture.ts @@ -3,7 +3,7 @@ import { GLCanvasContext } from "./GLCanvasContext"; /** * 画布纹理，从画布的WebGPU上下文获取纹理 */ -export class GLCanvasTexture +export interface GLCanvasTexture { context: GLCanvasContext; } \ No newline at end of file diff --git a/src/data/GLIndexBuffer.ts b/src/data/GLIndexBuffer.ts index 6d57634..3071d17 100644 --- a/src/data/GLIndexBuffer.ts +++ b/src/data/GLIndexBuffer.ts @@ -8,12 +8,12 @@ import { Buffer, IIndicesDataTypes } from "@feng3d/render-api"; * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bindBuffer * */ -export class GLIndexBuffer extends Buffer +export interface GLIndexBuffer extends Buffer { - target: "ELEMENT_ARRAY_BUFFER" = "ELEMENT_ARRAY_BUFFER"; + target: "ELEMENT_ARRAY_BUFFER"; /** * 顶点索引数据。 */ - declare data?: IIndicesDataTypes; + data?: IIndicesDataTypes; } \ No newline at end of file diff --git a/src/data/GLVertexBuffer.ts b/src/data/GLVertexBuffer.ts index c674549..8742e52 100644 --- a/src/data/GLVertexBuffer.ts +++ b/src/data/GLVertexBuffer.ts @@ -3,12 +3,12 @@ import { Buffer, IVertexDataTypes } from "@feng3d/render-api"; /** * WebGL 顶点缓冲区。 */ -export class GLVertexBuffer extends Buffer +export interface GLVertexBuffer extends Buffer { - target: "ARRAY_BUFFER" = "ARRAY_BUFFER"; + target: "ARRAY_BUFFER"; /** * 缓冲区数据。 */ - declare data?: IVertexDataTypes; + data?: IVertexDataTypes; } diff --git a/src/data/IGLUniformBuffer.ts b/src/data/IGLUniformBuffer.ts index db28bb3..522d3c8 100644 --- a/src/data/IGLUniformBuffer.ts +++ b/src/data/IGLUniformBuffer.ts @@ -3,7 +3,7 @@ import { Buffer } from "@feng3d/render-api"; /** * WebGL 统一缓冲区。 */ -export class IGLUniformBuffer extends Buffer +export interface IGLUniformBuffer extends Buffer { - target: "UNIFORM_BUFFER" = "UNIFORM_BUFFER"; + target: "UNIFORM_BUFFER"; } -- Gitee From d41c733746cd36f81e2f609ce146a2e3179f6935 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 13:30:12 +0800 Subject: [PATCH 36/57] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E6=8E=A5=E5=8F=A3=E5=B9=B6=E6=9B=B4=E6=96=B0?= =?UTF-8?q?=E5=BC=95=E7=94=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 IGLBuffer 接口移至 @feng3d/render-api 包 - 将 IGLCapabilities 接口移至 @feng3d/render-api 包 - 将 IGLCommandEncoder 接口移至 @feng3d/render-api 包 - 更新相关文件中的引用 --- src/RunWebGL.ts | 2 +- src/caches/getCapabilities.ts | 4 ++-- src/data/{IGLBuffer.ts => Buffer.ts} | 0 src/data/{IGLCapabilities.ts => GLCapabilities.ts} | 4 ++-- src/data/{IGLCommandEncoder.ts => GLCommandEncoder.ts} | 2 +- src/index.ts | 6 +++--- src/runs/getIGLBuffer.ts | 2 +- 7 files changed, 10 insertions(+), 10 deletions(-) rename src/data/{IGLBuffer.ts => Buffer.ts} (100%) rename src/data/{IGLCapabilities.ts => GLCapabilities.ts} (95%) rename src/data/{IGLCommandEncoder.ts => GLCommandEncoder.ts} (92%) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 93c118d..ef6eaaa 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -13,7 +13,7 @@ import { getIGLTextureTarget } from "./caches/getIGLTextureTarget"; import { _GL_Submit_Times } from "./const/const"; import { IGLUniformBufferType } from "./const/IGLUniformType"; import { GLBlitFramebuffer } from "./data/GLBlitFramebuffer"; -import { IGLDrawElementType } from "./data/IGLBuffer"; +import { IGLDrawElementType } from "./data/Buffer"; import { IGLCompareFunction, IGLStencilFunc, IGLStencilOp } from "./data/IGLDepthStencilState"; import { IGLOcclusionQuery } from "./data/IGLOcclusionQuery"; import { IGLTextureMagFilter, IGLTextureMinFilter, IGLTextureWrap } from "./data/IGLSampler"; diff --git a/src/caches/getCapabilities.ts b/src/caches/getCapabilities.ts index 7df0183..381d1b2 100644 --- a/src/caches/getCapabilities.ts +++ b/src/caches/getCapabilities.ts @@ -1,8 +1,8 @@ -import { IGLCapabilities } from "../data/IGLCapabilities"; +import { GLCapabilities } from "../data/GLCapabilities"; export function getCapabilities(gl: WebGLRenderingContext, precision: "highp" | "mediump" | "lowp" = "highp") { - const capabilities: IGLCapabilities = {} as any; + const capabilities: GLCapabilities = {} as any; gl._capabilities = capabilities; // capabilities.maxAnisotropy = gl.getExtension("EXT_texture_filter_anisotropic") ? gl.getParameter(gl.getExtension("EXT_texture_filter_anisotropic").MAX_TEXTURE_MAX_ANISOTROPY_EXT) : 0; diff --git a/src/data/IGLBuffer.ts b/src/data/Buffer.ts similarity index 100% rename from src/data/IGLBuffer.ts rename to src/data/Buffer.ts diff --git a/src/data/IGLCapabilities.ts b/src/data/GLCapabilities.ts similarity index 95% rename from src/data/IGLCapabilities.ts rename to src/data/GLCapabilities.ts index 630abf6..4896d07 100644 --- a/src/data/IGLCapabilities.ts +++ b/src/data/GLCapabilities.ts @@ -5,7 +5,7 @@ declare global /** * WEBGL支持功能 */ - _capabilities: IGLCapabilities; + _capabilities: GLCapabilities; } } @@ -15,7 +15,7 @@ declare global * @see https://webglreport.com * @see http://html5test.com */ -export interface IGLCapabilities +export interface GLCapabilities { /** * 纹理各向异性过滤最大值 diff --git a/src/data/IGLCommandEncoder.ts b/src/data/GLCommandEncoder.ts similarity index 92% rename from src/data/IGLCommandEncoder.ts rename to src/data/GLCommandEncoder.ts index 9d53509..f9bb30a 100644 --- a/src/data/IGLCommandEncoder.ts +++ b/src/data/GLCommandEncoder.ts @@ -5,7 +5,7 @@ declare module "@feng3d/render-api" { export interface IPassEncoderMap { - IGLBlitFramebuffer: GLBlitFramebuffer; + GLBlitFramebuffer: GLBlitFramebuffer; } /** diff --git a/src/index.ts b/src/index.ts index 227e464..79c3fc9 100644 --- a/src/index.ts +++ b/src/index.ts @@ -2,9 +2,9 @@ export * from "./data/GLBlitFramebuffer"; export * from "./data/GLCanvasContext"; export * from "./data/GLIndexBuffer"; export * from "./data/GLVertexBuffer"; -export * from "./data/IGLBuffer"; -export * from "./data/IGLCapabilities"; -export * from "./data/IGLCommandEncoder"; +export * from "./data/Buffer"; +export * from "./data/GLCapabilities"; +export * from "./data/GLCommandEncoder"; export * from "./data/IGLDepthStencilState"; export * from "./data/IGLOcclusionQuery"; export * from "./data/IGLPrimitiveState"; diff --git a/src/runs/getIGLBuffer.ts b/src/runs/getIGLBuffer.ts index 74ceb9d..a0a09a6 100644 --- a/src/runs/getIGLBuffer.ts +++ b/src/runs/getIGLBuffer.ts @@ -1,6 +1,6 @@ import { Buffer, IIndicesDataTypes, IVertexDataTypes, TypedArray } from "@feng3d/render-api"; import { GLIndexBuffer } from "../data/GLIndexBuffer"; -import { IGLBufferTarget, IGLBufferUsage } from "../data/IGLBuffer"; +import { IGLBufferTarget, IGLBufferUsage } from "../data/Buffer"; import { GLVertexBuffer } from "../data/GLVertexBuffer"; import { IGLUniformBuffer } from "../data/IGLUniformBuffer"; -- Gitee From a62fe5f6fcd8369c85ffcad19e829fae1f7459ec Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 13:42:44 +0800 Subject: [PATCH 37/57] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E6=B7=B1=E5=BA=A6=E6=A8=A1=E6=9D=BF=E7=8A=B6=E6=80=81=E7=9B=B8?= =?UTF-8?q?=E5=85=B3=E7=B1=BB=E5=9E=8B=E5=AE=9A=E4=B9=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除 IGLDepthStencilState、IGLCompareFunction、IGLStencilFunc、IGLStencilOp 等类型定义 - 新增 GLCompareFunction、GLStencilFunc、GLStencilOp 等类型定义 - 更新相关引用，统一使用新的类型定义 - 优化部分代码结构，提高可读性 --- src/RunWebGL.ts | 23 ++-- src/caches/getGLProgram.ts | 27 +++- src/caches/getGLSampler.ts | 7 +- src/data/IGLDepthStencilState.ts | 208 ------------------------------- src/data/IGLOcclusionQuery.ts | 1 + src/data/IGLSampler.ts | 2 +- src/index.ts | 1 - src/internal/IGLAttributeInfo.ts | 24 ---- src/runs/runDepthState.ts | 25 +++- src/runs/runStencilState.ts | 45 ++++++- src/utils/getIVertexFormat.ts | 6 +- 11 files changed, 104 insertions(+), 265 deletions(-) delete mode 100644 src/data/IGLDepthStencilState.ts delete mode 100644 src/internal/IGLAttributeInfo.ts diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index ef6eaaa..f9536da 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, DrawIndexed, DrawVertex, ICullFace, IFrontFace, IIndicesDataTypes, IRenderPassObject, RenderPipeline, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, DrawIndexed, DrawVertex, ICullFace, IFrontFace, IIndicesDataTypes, IRenderPassObject, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -12,9 +12,8 @@ import { getIGLRenderPassDescriptorWithMultisample } from "./caches/getIGLRender import { getIGLTextureTarget } from "./caches/getIGLTextureTarget"; import { _GL_Submit_Times } from "./const/const"; import { IGLUniformBufferType } from "./const/IGLUniformType"; -import { GLBlitFramebuffer } from "./data/GLBlitFramebuffer"; import { IGLDrawElementType } from "./data/Buffer"; -import { IGLCompareFunction, IGLStencilFunc, IGLStencilOp } from "./data/IGLDepthStencilState"; +import { GLBlitFramebuffer } from "./data/GLBlitFramebuffer"; import { IGLOcclusionQuery } from "./data/IGLOcclusionQuery"; import { IGLTextureMagFilter, IGLTextureMinFilter, IGLTextureWrap } from "./data/IGLSampler"; import { IGLSamplerTexture } from "./data/IGLSamplerTexture"; @@ -691,10 +690,10 @@ export class RunWebGL if (stencilFront) { - const func: IGLStencilFunc = getIGLStencilFunc(stencilFront.compare ?? "always"); - const fail: IGLStencilOp = getIGLStencilOp(stencilFront.failOp); - const zfail: IGLStencilOp = getIGLStencilOp(stencilFront.depthFailOp); - const zpass: IGLStencilOp = getIGLStencilOp(stencilFront.passOp); + const func = getIGLStencilFunc(stencilFront.compare ?? "always"); + const fail = getIGLStencilOp(stencilFront.failOp); + const zfail = getIGLStencilOp(stencilFront.depthFailOp); + const zpass = getIGLStencilOp(stencilFront.passOp); // gl.stencilFuncSeparate(gl.FRONT, gl[func], ref, readMask); gl.stencilOpSeparate(gl.FRONT, gl[fail], gl[zfail], gl[zpass]); @@ -702,10 +701,10 @@ export class RunWebGL } if (stencilBack) { - const func: IGLStencilFunc = getIGLStencilFunc(stencilBack.compare ?? "always"); - const fail: IGLStencilOp = getIGLStencilOp(stencilBack.failOp); - const zfail: IGLStencilOp = getIGLStencilOp(stencilBack.depthFailOp); - const zpass: IGLStencilOp = getIGLStencilOp(stencilBack.passOp); + const func = getIGLStencilFunc(stencilBack.compare ?? "always"); + const fail = getIGLStencilOp(stencilBack.failOp); + const zfail = getIGLStencilOp(stencilBack.depthFailOp); + const zpass = getIGLStencilOp(stencilBack.passOp); // gl.stencilFuncSeparate(gl.BACK, gl[func], ref, readMask); gl.stencilOpSeparate(gl.BACK, gl[fail], gl[zfail], gl[zpass]); @@ -722,7 +721,7 @@ export class RunWebGL { if (depthStencil && (depthStencil.depthWriteEnabled || depthStencil.depthCompare !== "always")) { - const depthCompare: IGLCompareFunction = getIGLCompareFunction(depthStencil.depthCompare ?? "less"); + const depthCompare = getIGLCompareFunction(depthStencil.depthCompare ?? "less"); const depthWriteEnabled = depthStencil.depthWriteEnabled ?? true; // gl.enable(gl.DEPTH_TEST); diff --git a/src/caches/getGLProgram.ts b/src/caches/getGLProgram.ts index ba4818e..63fd068 100644 --- a/src/caches/getGLProgram.ts +++ b/src/caches/getGLProgram.ts @@ -1,6 +1,5 @@ -import { RenderPipeline } from "@feng3d/render-api"; +import { GLVertexAttributeTypes, RenderPipeline } from "@feng3d/render-api"; import { getWebGLUniformType, IGLUniformBufferType, isWebGLUniformTextureType } from "../const/IGLUniformType"; -import { IGLAttributeInfo } from "../internal/IGLAttributeInfo"; import { IGLTransformFeedbackPipeline, IGLTransformFeedbackVaryings } from "../data/IGLTransformFeedbackPass"; import { IGLUniformInfo, IUniformItemInfo } from "../data/IGLUniformInfo"; import { getIGLAttributeType } from "./getIGLAttributeType"; @@ -35,6 +34,30 @@ declare global } } +export interface IGLAttributeInfo +{ + /** + * 名称。 + */ + name: string; + + /** + * 顶点尺寸。 + */ + size: number; + + /** + * 属性缓冲数据类型 + */ + type?: GLVertexAttributeTypes; + + /** + * 属性地址 + */ + location: number; +} + + /** * 激活渲染程序 */ diff --git a/src/caches/getGLSampler.ts b/src/caches/getGLSampler.ts index cc9b0f4..230d1a9 100644 --- a/src/caches/getGLSampler.ts +++ b/src/caches/getGLSampler.ts @@ -1,6 +1,5 @@ import { IAddressMode, IFilterMode, Sampler } from "@feng3d/render-api"; -import { IGLCompareFunction } from "../data/IGLDepthStencilState"; -import { IGLSamplerCompareMode, IGLTextureMagFilter, IGLTextureMinFilter, IGLTextureWrap } from "../data/IGLSampler"; +import { GLSamplerCompareMode, IGLTextureMagFilter, IGLTextureMinFilter, IGLTextureWrap } from "../data/IGLSampler"; import { getIGLCompareFunction } from "../runs/runDepthState"; declare global @@ -28,8 +27,8 @@ export function getGLSampler(gl: WebGLRenderingContext, sampler?: Sampler) const wrapR: IGLTextureWrap = getIGLTextureWrap(sampler.addressModeW); const lodMinClamp = sampler.lodMinClamp || 0; const lodMaxClamp = sampler.lodMaxClamp || 16; - const compareMode: IGLSamplerCompareMode = sampler.compare ? "COMPARE_REF_TO_TEXTURE" : "NONE"; - const compare: IGLCompareFunction = getIGLCompareFunction(sampler.compare ?? "less-equal"); + const compareMode: GLSamplerCompareMode = sampler.compare ? "COMPARE_REF_TO_TEXTURE" : "NONE"; + const compare = getIGLCompareFunction(sampler.compare ?? "less-equal"); // gl.samplerParameteri(webGLSampler, gl.TEXTURE_MIN_FILTER, gl[minFilter]); diff --git a/src/data/IGLDepthStencilState.ts b/src/data/IGLDepthStencilState.ts deleted file mode 100644 index 6e4f1db..0000000 --- a/src/data/IGLDepthStencilState.ts +++ /dev/null @@ -1,208 +0,0 @@ -/** - * 深度状态。 - */ -export interface IGLDepthState -{ - /** - * 是否开启深度检查，默认 true，开启深度检测。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/depthFunc - */ - depthtest?: boolean; - - /** - * 是否写入深度。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/depthMask - */ - depthWriteEnabled?: boolean; - - /** - * 指定深度比较函数的枚举，该函数设置绘制像素的条件。 - * - * 默认 LESS，如果传入值小于深度缓冲区值则通过。 - * - * A GLenum specifying the depth comparison function, which sets the conditions under which the pixel will be drawn. The default value is gl.LESS. - * - * @see IGLCompareFunction - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/depthFunc - */ - depthCompare?: IGLCompareFunction; - - /** - * 深度偏移。 - * - * 用于在深度测试中提供偏移量，以避免Z-fighting和其他深度相关的渲染问题。 - */ - depthBias?: IDepthBias; -} - -/** - * 深度偏移。 - * - * 用于在深度测试中提供偏移量，以避免Z-fighting和其他深度相关的渲染问题。 - */ -export interface IDepthBias -{ - /** - * 它设置特定于实现的值乘以的乘数，以创建恒定的深度偏移量。缺省值为0。 - * - * 对应WebGPU中的 GPUDepthStencilState.depthBias 。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/polygonOffset - */ - units: number; - - /** - * 为每个多边形设置可变深度偏移的比例因子。缺省值为0。 - * - * 对应WebGPU中的 GPUDepthStencilState.depthBiasSlopeScale 。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/polygonOffset - */ - factor: number; -} - -/** - * 模板状态。 - */ -export interface IGLStencilState -{ - /** - * 是否开启模板测试与更新模板缓冲。 - * - * Activates stencil testing and updates to the stencil buffer. - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilFunc - */ - useStencil?: boolean; - - /** - * 模板正面状态。 - */ - stencilFront?: IStencilFaceState; - - /** - * 模板正面状态。 - */ - stencilBack?: IStencilFaceState; -} - -/** - * 模板单面状态。定义如何比较与运算模板值。 - */ -export interface IStencilFaceState -{ - /** - * 一个为模板测试指定参考值。这个值被限制在0到2^n -1的范围内，其中n是模板缓冲区中的位数。默认0。 - * - * A GLint specifying the reference value for the stencil test. This value is clamped to the range 0 to 2^n -1 where n is the number of bitplanes in the stencil buffer. The default value is 0. - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilFunc - */ - stencilFuncRef?: number; - - /** - * 模板测试时使用的mask值，默认全为1（0xFFFFFFFF）。 - * - * A GLuint specifying a bit-wise mask that is used to AND the reference value and the stored stencil value when the test is done. The default value is all 1. - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilFunc - */ - stencilFuncMask?: number; - - /** - * 指定位掩码以启用或禁用在模板平面中写入单个位的正整数。默认全为1（0xFFFFFFFF）。 - * - * A GLuint specifying a bit mask to enable or disable writing of individual bits in the stencil planes. By default, the mask is all 1. - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilMask - */ - stencilMask?: number; - - /** - * 描述模板测试的方法。默认ALWAYS，总是通过。 - * - * A GLenum specifying the test function. The default function is gl.ALWAYS. - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilFunc - */ - stencilFunc?: IGLStencilFunc; - - /** - * 指定模板测试失败时使用的函数的枚举。默认KEEP，保持当前值。 - * - * A GLenum specifying the function to use when the stencil test fails. The default value is gl.KEEP. - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilOp - */ - stencilOpFail?: IGLStencilOp; - - /** - * 指定在模板测试通过但深度测试失败时使用的函数枚举。默认KEEP，保持当前值。 - * - * A GLenum specifying the function to use when the stencil test passes, but the depth test fails. The default value is gl.KEEP. - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilOp - */ - stencilOpZFail?: IGLStencilOp; - - /** - * 指定在模板测试和深度测试通过时使用的函数枚举，或在模板测试通过且没有深度缓冲或禁用深度测试时使用的函数枚举。默认KEEP，保持当前值。 - * - * A GLenum specifying the function to use when both the stencil test and the depth test pass, or when the stencil test passes and there is no depth buffer or depth testing is disabled. The default value is gl.KEEP. - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilOp - */ - stencilOpZPass?: IGLStencilOp; -} - -/** - * 指定深度比较函数的枚举，该函数设置绘制像素的条件，默认 LESS，如果传入值小于深度缓冲区值则通过。 - * - * A GLenum specifying the depth comparison function, which sets the conditions under which the pixel will be drawn. The default value is gl.LESS. - * - * * `NEVER` 总是不通过。 - * * `LESS` 如果传入值小于深度缓冲区值则通过。 - * * `EQUAL` 如果传入值等于深度缓冲区值则通过。 - * * `LEQUAL` 如果传入值小于或等于深度缓冲区值则通过。 - * * `GREATER` 如果传入值大于深度缓冲区值则通过。 - * * `NOTEQUAL` 如果传入值不等于深度缓冲区值则通过。 - * * `GEQUAL` 如果传入值大于或等于深度缓冲区值则通过。 - * * `ALWAYS` 总是通过。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/depthFunc - */ -export type IGLCompareFunction = "NEVER" | "LESS" | "EQUAL" | "LEQUAL" | "GREATER" | "NOTEQUAL" | "GEQUAL" | "ALWAYS"; - -/** - * A GLenum specifying the test function. The default function is gl.ALWAYS. - * - * * `NEVER` 总是不通过。 - * * `LESS` 如果 (ref & mask) < (stencil & mask) 则通过。 - * * `EQUAL` 如果 (ref & mask) = (stencil & mask) 则通过。 - * * `LEQUAL` 如果 (ref & mask) <= (stencil & mask) 则通过。 - * * `GREATER` 如果 (ref & mask) > (stencil & mask) 则通过。 - * * `NOTEQUAL` 如果 (ref & mask) != (stencil & mask) 则通过。 - * * `GEQUAL` 如果 (ref & mask) >= (stencil & mask) 则通过。 - * * `ALWAYS` 总是通过。 - * - * https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilFunc - */ -export type IGLStencilFunc = "NEVER" | "LESS" | "EQUAL" | "LEQUAL" | "GREATER" | "NOTEQUAL" | "GEQUAL" | "ALWAYS"; - -/** - * The WebGLRenderingContext.stencilOp() method of the WebGL API sets both the front and back-facing stencil test actions. - * - * * `KEEP` 保持当前值。 - * * `ZERO` 设置模板缓冲值为0 - * * `REPLACE` 将模板缓冲区的值设置为WebGLRenderingContext.stencilFunc()指定的参考值。 - * * `INCR` 增加当前模板缓冲区的值。最大到可表示的无符号值的最大值。 - * * `INCR_WRAP` 增加当前模板缓冲区的值。当增加最大的可表示无符号值时，将模板缓冲区值包装为零。 - * * `DECR` 递减当前模板缓冲区的值。最小为0。 - * * `DECR_WRAP` 递减当前模板缓冲区的值。当模板缓冲区值减为0时，将模板缓冲区值包装为可表示的最大无符号值。 - * * `INVERT` 按位反转当前模板缓冲区值。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilOp - */ -export type IGLStencilOp = "KEEP" | "ZERO" | "REPLACE" | "INCR" | "INCR_WRAP" | "DECR" | "DECR_WRAP" | "INVERT"; diff --git a/src/data/IGLOcclusionQuery.ts b/src/data/IGLOcclusionQuery.ts index 82ac49b..e24a94d 100644 --- a/src/data/IGLOcclusionQuery.ts +++ b/src/data/IGLOcclusionQuery.ts @@ -7,6 +7,7 @@ export interface IGLOcclusionQuery * 数据类型。 */ readonly __type__: "OcclusionQuery"; + /** * 渲染对象列表。 */ diff --git a/src/data/IGLSampler.ts b/src/data/IGLSampler.ts index 681070d..844657a 100644 --- a/src/data/IGLSampler.ts +++ b/src/data/IGLSampler.ts @@ -1,4 +1,4 @@ -export type IGLSamplerCompareMode = "NONE" | "COMPARE_REF_TO_TEXTURE"; +export type GLSamplerCompareMode = "NONE" | "COMPARE_REF_TO_TEXTURE"; /** * 纹理放大滤波器 diff --git a/src/index.ts b/src/index.ts index 79c3fc9..8e1609e 100644 --- a/src/index.ts +++ b/src/index.ts @@ -5,7 +5,6 @@ export * from "./data/GLVertexBuffer"; export * from "./data/Buffer"; export * from "./data/GLCapabilities"; export * from "./data/GLCommandEncoder"; -export * from "./data/IGLDepthStencilState"; export * from "./data/IGLOcclusionQuery"; export * from "./data/IGLPrimitiveState"; export * from "./data/IGLReadPixels"; diff --git a/src/internal/IGLAttributeInfo.ts b/src/internal/IGLAttributeInfo.ts deleted file mode 100644 index 7fe1029..0000000 --- a/src/internal/IGLAttributeInfo.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { IGLVertexAttributeTypes } from "@feng3d/render-api"; - -export interface IGLAttributeInfo -{ - /** - * 名称。 - */ - name: string; - - /** - * 顶点尺寸。 - */ - size: number; - - /** - * 属性缓冲数据类型 - */ - type?: IGLVertexAttributeTypes; - - /** - * 属性地址 - */ - location: number; -} diff --git a/src/runs/runDepthState.ts b/src/runs/runDepthState.ts index fcd686b..286b16e 100644 --- a/src/runs/runDepthState.ts +++ b/src/runs/runDepthState.ts @@ -1,16 +1,15 @@ import { ICompareFunction, DepthStencilState } from "@feng3d/render-api"; -import { IGLCompareFunction } from "../data/IGLDepthStencilState"; export function getIGLCompareFunction(depthCompare: ICompareFunction) { - const glDepthCompare: IGLCompareFunction = depthCompareMap[depthCompare]; + const glDepthCompare: GLCompareFunction = depthCompareMap[depthCompare]; console.assert(!!glDepthCompare, `接收到错误值，请从 ${Object.keys(depthCompareMap).toString()} 中取值！`); return glDepthCompare; } -const depthCompareMap: { [key: string]: IGLCompareFunction } = { +const depthCompareMap: { [key: string]: GLCompareFunction } = { never: "NEVER", less: "LESS", equal: "EQUAL", @@ -19,4 +18,22 @@ const depthCompareMap: { [key: string]: IGLCompareFunction } = { "not-equal": "NOTEQUAL", "greater-equal": "GEQUAL", always: "ALWAYS", -}; \ No newline at end of file +}; + +/** + * 指定深度比较函数的枚举，该函数设置绘制像素的条件，默认 LESS，如果传入值小于深度缓冲区值则通过。 + * + * A GLenum specifying the depth comparison function, which sets the conditions under which the pixel will be drawn. The default value is gl.LESS. + * + * * `NEVER` 总是不通过。 + * * `LESS` 如果传入值小于深度缓冲区值则通过。 + * * `EQUAL` 如果传入值等于深度缓冲区值则通过。 + * * `LEQUAL` 如果传入值小于或等于深度缓冲区值则通过。 + * * `GREATER` 如果传入值大于深度缓冲区值则通过。 + * * `NOTEQUAL` 如果传入值不等于深度缓冲区值则通过。 + * * `GEQUAL` 如果传入值大于或等于深度缓冲区值则通过。 + * * `ALWAYS` 总是通过。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/depthFunc + */ +export type GLCompareFunction = "NEVER" | "LESS" | "EQUAL" | "LEQUAL" | "GREATER" | "NOTEQUAL" | "GEQUAL" | "ALWAYS"; diff --git a/src/runs/runStencilState.ts b/src/runs/runStencilState.ts index e27ab19..7287600 100644 --- a/src/runs/runStencilState.ts +++ b/src/runs/runStencilState.ts @@ -1,13 +1,13 @@ import { ICompareFunction, IStencilOperation } from "@feng3d/render-api"; -import { IGLStencilFunc, IGLStencilOp } from "../data/IGLDepthStencilState"; export function getIGLStencilFunc(compare: ICompareFunction) { - const stencilFunc: IGLStencilFunc = compareMap[compare]; + const stencilFunc: GLStencilFunc = compareMap[compare]; return stencilFunc; } -const compareMap: { [key: string]: IGLStencilFunc } = { + +const compareMap: { [key: string]: GLStencilFunc } = { never: "NEVER", less: "LESS", equal: "EQUAL", @@ -18,13 +18,30 @@ const compareMap: { [key: string]: IGLStencilFunc } = { always: "ALWAYS", }; +/** + * A GLenum specifying the test function. The default function is gl.ALWAYS. + * + * * `NEVER` 总是不通过。 + * * `LESS` 如果 (ref & mask) < (stencil & mask) 则通过。 + * * `EQUAL` 如果 (ref & mask) = (stencil & mask) 则通过。 + * * `LEQUAL` 如果 (ref & mask) <= (stencil & mask) 则通过。 + * * `GREATER` 如果 (ref & mask) > (stencil & mask) 则通过。 + * * `NOTEQUAL` 如果 (ref & mask) != (stencil & mask) 则通过。 + * * `GEQUAL` 如果 (ref & mask) >= (stencil & mask) 则通过。 + * * `ALWAYS` 总是通过。 + * + * https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilFunc + */ +export type GLStencilFunc = "NEVER" | "LESS" | "EQUAL" | "LEQUAL" | "GREATER" | "NOTEQUAL" | "GEQUAL" | "ALWAYS"; + + export function getIGLStencilOp(stencilOperation?: IStencilOperation) { - const glStencilOp: IGLStencilOp = stencilOperationMap[stencilOperation]; + const glStencilOp: GLStencilOp = stencilOperationMap[stencilOperation]; return glStencilOp; } -const stencilOperationMap: { [key: string]: IGLStencilOp } = { +const stencilOperationMap: { [key: string]: GLStencilOp } = { keep: "KEEP", zero: "ZERO", replace: "REPLACE", @@ -33,4 +50,20 @@ const stencilOperationMap: { [key: string]: IGLStencilOp } = { "decrement-clamp": "DECR", "increment-wrap": "INCR_WRAP", "decrement-wrap": "DECR_WRAP", -}; \ No newline at end of file +}; + +/** + * The WebGLRenderingContext.stencilOp() method of the WebGL API sets both the front and back-facing stencil test actions. + * + * * `KEEP` 保持当前值。 + * * `ZERO` 设置模板缓冲值为0 + * * `REPLACE` 将模板缓冲区的值设置为WebGLRenderingContext.stencilFunc()指定的参考值。 + * * `INCR` 增加当前模板缓冲区的值。最大到可表示的无符号值的最大值。 + * * `INCR_WRAP` 增加当前模板缓冲区的值。当增加最大的可表示无符号值时，将模板缓冲区值包装为零。 + * * `DECR` 递减当前模板缓冲区的值。最小为0。 + * * `DECR_WRAP` 递减当前模板缓冲区的值。当模板缓冲区值减为0时，将模板缓冲区值包装为可表示的最大无符号值。 + * * `INVERT` 按位反转当前模板缓冲区值。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/stencilOp + */ +export type GLStencilOp = "KEEP" | "ZERO" | "REPLACE" | "INCR" | "INCR_WRAP" | "DECR" | "DECR_WRAP" | "INVERT"; diff --git a/src/utils/getIVertexFormat.ts b/src/utils/getIVertexFormat.ts index c835812..07b3844 100644 --- a/src/utils/getIVertexFormat.ts +++ b/src/utils/getIVertexFormat.ts @@ -1,6 +1,6 @@ -import { IGLVertexAttributeTypes, IVertexFormat, IVertexAttributeFormatInfo, vertexFormatMap } from "@feng3d/render-api"; +import { GLVertexAttributeTypes, IVertexFormat, VertexAttributeFormatInfo, vertexFormatMap } from "@feng3d/render-api"; -export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: IGLVertexAttributeTypes = "FLOAT", normalized = false): IVertexFormat +export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: GLVertexAttributeTypes = "FLOAT", normalized = false): IVertexFormat { for (const key in vertexFormatMap) { @@ -20,7 +20,7 @@ export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: IGLVertexAt return undefined; } -export function getIGLVertexFormat(format: IVertexFormat): IVertexAttributeFormatInfo +export function getIGLVertexFormat(format: IVertexFormat): VertexAttributeFormatInfo { const glVertexFormat = vertexFormatMap[format]; -- Gitee From 73b16b2b118ca074a194492581cb54393e1851c2 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 14:15:44 +0800 Subject: [PATCH 38/57] =?UTF-8?q?refactor(data):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E6=8E=A5=E5=8F=A3=E5=92=8C=E5=91=BD=E5=90=8D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 修改了多个文件中的接口和类命名，以更好地符合 Feng3D Render API 的命名规范 - 例如：IGLOcclusionQuery 改为 OcclusionQuery，ICullFace 改为 CullFace 等 - 更新了相关引用，以确保代码的一致性和可维护性 --- examples/src/WebGL2Samples/fbo_read_pixels.ts | 6 +-- examples/src/WebGL2Samples/query_occlusion.ts | 6 +-- examples/src/WebGL2Samples/texture_vertex.ts | 4 +- src/RunWebGL.ts | 11 ++--- src/WebGL.ts | 2 +- src/caches/getGLRenderOcclusionQuery.ts | 19 ++++----- src/caches/getIGLDrawMode.ts | 4 +- src/data/GLCommandEncoder.ts | 4 +- ...LPrimitiveState.ts => GLPrimitiveState.ts} | 10 +++-- src/data/IGLOcclusionQuery.ts | 42 ------------------- src/data/IGLReadPixels.ts | 4 +- src/data/IGLRenderPass.ts | 5 +-- src/data/OcclusionQuery.ts | 16 +++++++ src/index.ts | 3 +- src/utils/getIGLCullFace.ts | 4 +- src/utils/getIGLFrontFace.ts | 4 +- 16 files changed, 60 insertions(+), 84 deletions(-) rename src/data/{IGLPrimitiveState.ts => GLPrimitiveState.ts} (55%) delete mode 100644 src/data/IGLOcclusionQuery.ts create mode 100644 src/data/OcclusionQuery.ts diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index 25a95e9..20f8c5d 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -175,15 +175,15 @@ webgl.submit({ commandEncoders: [{ passEncoders: [rp1, rp] }] }); const data = new Uint8Array(w * h * 4 * 3); -webgl.runReadPixels({ +webgl.readPixels({ frameBuffer, attachmentPoint: "COLOR_ATTACHMENT0", x: 0, y: 0, width: w, height: h, format: "RGBA", type: "UNSIGNED_BYTE", dstData: data, dstOffset: 0 }); -webgl.runReadPixels({ +webgl.readPixels({ frameBuffer, attachmentPoint: "COLOR_ATTACHMENT1", x: 0, y: 0, width: w, height: h, format: "RGBA", type: "UNSIGNED_BYTE", dstData: data, dstOffset: w * h * 4 }); -webgl.runReadPixels({ +webgl.readPixels({ frameBuffer, attachmentPoint: "COLOR_ATTACHMENT1", x: 0, y: 0, width: w, height: h, format: "RGBA", type: "UNSIGNED_BYTE", dstData: data, dstOffset: w * h * 4 * 2 }); diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index 77a1206..e55aa24 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -1,5 +1,5 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, IGLOcclusionQuery, WebGL } from "@feng3d/webgl"; +import { IRenderPassObject, OcclusionQuery, RenderObject, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { watcher } from "@feng3d/watcher"; @@ -60,7 +60,7 @@ const ro: RenderObject = { }; renderObjects.push(ro); -const occlusionQuery: IGLOcclusionQuery = { +const occlusionQuery: OcclusionQuery = { __type__: "OcclusionQuery", renderObjects: [{ ...ro, diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index 3222e71..d50ac96 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -1,4 +1,4 @@ -import { IIndicesDataTypes, IPrimitiveTopology, IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { IIndicesDataTypes, PrimitiveTopology, IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { getIVertexFormat, GLCanvasContext, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -7,7 +7,7 @@ import { getShaderSource, loadImage } from "./utility"; (function () { - const IDrawMode2Name: { [key: string]: IPrimitiveTopology } = { + const IDrawMode2Name: { [key: string]: PrimitiveTopology } = { 0: "point-list", 3: "line-strip", 2: "LINE_LOOP", diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index f9536da..8fafda1 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, DrawIndexed, DrawVertex, ICullFace, IFrontFace, IIndicesDataTypes, IRenderPassObject, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, DrawIndexed, DrawVertex, CullFace, FrontFace, IIndicesDataTypes, IRenderPassObject, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; @@ -14,7 +14,6 @@ import { _GL_Submit_Times } from "./const/const"; import { IGLUniformBufferType } from "./const/IGLUniformType"; import { IGLDrawElementType } from "./data/Buffer"; import { GLBlitFramebuffer } from "./data/GLBlitFramebuffer"; -import { IGLOcclusionQuery } from "./data/IGLOcclusionQuery"; import { IGLTextureMagFilter, IGLTextureMinFilter, IGLTextureWrap } from "./data/IGLSampler"; import { IGLSamplerTexture } from "./data/IGLSamplerTexture"; import { IGLTextureTarget } from "./data/IGLTexture"; @@ -34,6 +33,8 @@ import { getIGLFrontFace, IGLFrontFace } from "./utils/getIGLFrontFace"; import { getIGLVertexFormat } from "./utils/getIVertexFormat"; import { updateBufferBinding } from "./utils/updateBufferBinding"; +import "./data/OcclusionQuery"; + declare global { interface WebGLRenderingContext @@ -751,8 +752,8 @@ export class RunWebGL private runPrimitiveState(gl: WebGLRenderingContext, primitive?: PrimitiveState) { - const cullFace: ICullFace = primitive?.cullFace || "none"; - const frontFace: IFrontFace = primitive?.frontFace || "ccw"; + const cullFace: CullFace = primitive?.cullFace || "none"; + const frontFace: FrontFace = primitive?.frontFace || "ccw"; const enableCullFace = cullFace !== "none"; const glCullMode: IGLCullFace = getIGLCullFace(cullFace); @@ -819,7 +820,7 @@ export class RunWebGL } } - private runOcclusionQuery(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, occlusionQuery: IGLOcclusionQuery) + private runOcclusionQuery(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, occlusionQuery: OcclusionQuery) { // 开始查询 occlusionQuery._step.begin(); diff --git a/src/WebGL.ts b/src/WebGL.ts index f1a3eb3..6890ea9 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -43,7 +43,7 @@ export class WebGL this._runWebGL.runSubmit(this._gl, submit); } - runReadPixels(glReadPixels: IGLReadPixels) + readPixels(glReadPixels: IGLReadPixels) { readPixels(this._gl, glReadPixels); } diff --git a/src/caches/getGLRenderOcclusionQuery.ts b/src/caches/getGLRenderOcclusionQuery.ts index b743745..eafa7da 100644 --- a/src/caches/getGLRenderOcclusionQuery.ts +++ b/src/caches/getGLRenderOcclusionQuery.ts @@ -1,5 +1,4 @@ -import { RenderPass, IRenderPassObject } from "@feng3d/render-api"; -import { IGLOcclusionQuery, IGLQuery } from "../data/IGLOcclusionQuery"; +import { IRenderPassObject, OcclusionQuery, RenderPass } from "@feng3d/render-api"; export function getGLRenderOcclusionQuery(gl: WebGLRenderingContext, renderObjects?: readonly IRenderPassObject[]) { @@ -8,7 +7,7 @@ export function getGLRenderOcclusionQuery(gl: WebGLRenderingContext, renderObjec let renderOcclusionQuery: GLRenderOcclusionQuery = renderObjects["_GLRenderOcclusionQuery"]; if (renderOcclusionQuery) return renderOcclusionQuery; - const occlusionQueryObjects: IGLOcclusionQuery[] = renderObjects.filter((cv) => cv.__type__ === "OcclusionQuery") as any; + const occlusionQueryObjects: OcclusionQuery[] = renderObjects.filter((cv) => cv.__type__ === "OcclusionQuery") as any; if (occlusionQueryObjects.length === 0) { renderObjects["_GLRenderOcclusionQuery"] = defautRenderOcclusionQuery; @@ -53,9 +52,9 @@ interface GLRenderOcclusionQuery const defautRenderOcclusionQuery = { init: () => { }, resolve: () => { } }; -export function getGLOcclusionQueryStep(gl: WebGL2RenderingContext, occlusionQuery: IGLOcclusionQuery) +export function getGLOcclusionQueryStep(gl: WebGL2RenderingContext, occlusionQuery: OcclusionQuery) { - const query: IGLQuery = {} as any; + const query: { result?: number } = {}; let webGLQuery: WebGLQuery; // 开始查询 @@ -81,7 +80,7 @@ export function getGLOcclusionQueryStep(gl: WebGL2RenderingContext, occlusionQue if (gl instanceof WebGL2RenderingContext) { - const result: IGLOcclusionQuery = await new Promise((resolve, reject) => + const result: OcclusionQuery = await new Promise((resolve, reject) => { (function tick() { @@ -96,7 +95,7 @@ export function getGLOcclusionQueryStep(gl: WebGL2RenderingContext, occlusionQue query.result = gl.getQueryParameter(webGLQuery, gl.QUERY_RESULT); - occlusionQuery.result = query; + occlusionQuery.result = query as any; resolve(occlusionQuery); @@ -110,13 +109,13 @@ export function getGLOcclusionQueryStep(gl: WebGL2RenderingContext, occlusionQue return undefined; }; - return { begin, end, resolve } as IGLOcclusionQueryStep; + return { begin, end, resolve } as GLOcclusionQueryStep; } /** * 不被遮挡查询步骤。 */ -export interface IGLOcclusionQueryStep +export interface GLOcclusionQueryStep { /** * 开始查询 @@ -131,5 +130,5 @@ export interface IGLOcclusionQueryStep /** * 获取查询结果，将获取被赋值新结果的遮挡查询对象。 */ - resolve: () => Promise + resolve: () => Promise } \ No newline at end of file diff --git a/src/caches/getIGLDrawMode.ts b/src/caches/getIGLDrawMode.ts index 77980f0..de4d552 100644 --- a/src/caches/getIGLDrawMode.ts +++ b/src/caches/getIGLDrawMode.ts @@ -1,6 +1,6 @@ -import { IPrimitiveTopology } from "@feng3d/render-api"; +import { PrimitiveTopology } from "@feng3d/render-api"; -export function getIGLDrawMode(topology: IPrimitiveTopology): IGLDrawMode +export function getIGLDrawMode(topology: PrimitiveTopology): IGLDrawMode { let drawMode = drawModeMap[topology]; diff --git a/src/data/GLCommandEncoder.ts b/src/data/GLCommandEncoder.ts index f9bb30a..ed5ff35 100644 --- a/src/data/GLCommandEncoder.ts +++ b/src/data/GLCommandEncoder.ts @@ -1,4 +1,4 @@ -import { ITextureLike } from "@feng3d/render-api"; +import { TextureLike } from "@feng3d/render-api"; import { GLBlitFramebuffer } from "./GLBlitFramebuffer"; declare module "@feng3d/render-api" @@ -20,6 +20,6 @@ declare module "@feng3d/render-api" * * 注：当值设置为 null或者undefined时表示当前画布。 */ - texture: ITextureLike; + texture: TextureLike; } } diff --git a/src/data/IGLPrimitiveState.ts b/src/data/GLPrimitiveState.ts similarity index 55% rename from src/data/IGLPrimitiveState.ts rename to src/data/GLPrimitiveState.ts index a994d97..9433058 100644 --- a/src/data/IGLPrimitiveState.ts +++ b/src/data/GLPrimitiveState.ts @@ -1,21 +1,25 @@ -import { ICullFace, IFrontFace, IPrimitiveTopology } from "@feng3d/render-api"; +import { CullFace, FrontFace, PrimitiveTopology } from "@feng3d/render-api"; declare module "@feng3d/render-api" { - export interface IPrimitiveTopologyMap + export interface PrimitiveTopologyMap { /** * 绘制循环连线。 + * + * 仅在WebGL生效。 */ "LINE_LOOP": "LINE_LOOP", /** * 绘制三角扇形。 + * + * 仅在WebGL生效。 */ "TRIANGLE_FAN": "TRIANGLE_FAN", } - export interface ICullFaceMap + export interface CullFaceMap { "FRONT_AND_BACK": "FRONT_AND_BACK"; } diff --git a/src/data/IGLOcclusionQuery.ts b/src/data/IGLOcclusionQuery.ts deleted file mode 100644 index e24a94d..0000000 --- a/src/data/IGLOcclusionQuery.ts +++ /dev/null @@ -1,42 +0,0 @@ -import { RenderObject } from "@feng3d/render-api"; -import { IGLOcclusionQueryStep } from "../caches/getGLRenderOcclusionQuery"; - -export interface IGLOcclusionQuery -{ - /** - * 数据类型。 - */ - readonly __type__: "OcclusionQuery"; - - /** - * 渲染对象列表。 - */ - renderObjects: RenderObject[]; - - /** - * 临时变量, 执行过程中由引擎自动填充。 - * - * @internal - */ - _step?: IGLOcclusionQueryStep; - - /** - * 渲染完成后由引擎自动填充。 - */ - result?: IGLQuery; -} - -/** - * 查询对象。 - * - * 一次查询周期。 - * - * 仅 WebGL2 支持。 - */ -export interface IGLQuery -{ - /** - * 查询结果。 - */ - result: number; -} \ No newline at end of file diff --git a/src/data/IGLReadPixels.ts b/src/data/IGLReadPixels.ts index 4db1233..ebdfd73 100644 --- a/src/data/IGLReadPixels.ts +++ b/src/data/IGLReadPixels.ts @@ -1,4 +1,4 @@ -import { RenderPassDescriptor } from "@feng3d/render-api"; +import { ReadPixels, RenderPassDescriptor } from "@feng3d/render-api"; import { GLAttachmentPoint } from "../gl/WebGLEnums"; import { IGLTextureDataType, IGLTextureFormat } from "./IGLTexture"; @@ -7,7 +7,7 @@ import { IGLTextureDataType, IGLTextureFormat } from "./IGLTexture"; * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/readPixels */ -export interface IGLReadPixels +export interface IGLReadPixels extends ReadPixels { frameBuffer: RenderPassDescriptor; diff --git a/src/data/IGLRenderPass.ts b/src/data/IGLRenderPass.ts index 457ebe6..5c672a1 100644 --- a/src/data/IGLRenderPass.ts +++ b/src/data/IGLRenderPass.ts @@ -1,5 +1,4 @@ import { RenderPass, IRenderPassObject } from "@feng3d/render-api"; -import { IGLOcclusionQuery } from "./IGLOcclusionQuery"; declare module "@feng3d/render-api" { @@ -15,11 +14,11 @@ declare module "@feng3d/render-api" * * 当提交WebGL后自动获取结果后填充该属性。 */ - occlusionQueryResults?: IGLOcclusionQuery[]; + occlusionQueryResults?: OcclusionQuery[]; } export interface IRenderPassObjectMap { - IGLOcclusionQuery: IGLOcclusionQuery + OcclusionQuery: OcclusionQuery } } diff --git a/src/data/OcclusionQuery.ts b/src/data/OcclusionQuery.ts new file mode 100644 index 0000000..435e3d6 --- /dev/null +++ b/src/data/OcclusionQuery.ts @@ -0,0 +1,16 @@ +import { } from "@feng3d/render-api"; +import { GLOcclusionQueryStep } from "../caches/getGLRenderOcclusionQuery"; + +declare module "@feng3d/render-api" +{ + export interface OcclusionQuery + { + /** + * 临时变量, 执行过程中由引擎自动填充。 + * + * @internal + */ + _step?: GLOcclusionQueryStep; + } + +} diff --git a/src/index.ts b/src/index.ts index 8e1609e..e71c122 100644 --- a/src/index.ts +++ b/src/index.ts @@ -5,8 +5,7 @@ export * from "./data/GLVertexBuffer"; export * from "./data/Buffer"; export * from "./data/GLCapabilities"; export * from "./data/GLCommandEncoder"; -export * from "./data/IGLOcclusionQuery"; -export * from "./data/IGLPrimitiveState"; +export * from "./data/GLPrimitiveState"; export * from "./data/IGLReadPixels"; export * from "./data/IGLRenderbuffer"; export * from "./data/IGLRenderPass"; diff --git a/src/utils/getIGLCullFace.ts b/src/utils/getIGLCullFace.ts index fb670de..b332f7e 100644 --- a/src/utils/getIGLCullFace.ts +++ b/src/utils/getIGLCullFace.ts @@ -1,6 +1,6 @@ -import { ICullFace } from "@feng3d/render-api"; +import { CullFace } from "@feng3d/render-api"; -export function getIGLCullFace(cullFace: ICullFace) +export function getIGLCullFace(cullFace: CullFace) { const glCullMode: IGLCullFace = cullFaceMap[cullFace]; diff --git a/src/utils/getIGLFrontFace.ts b/src/utils/getIGLFrontFace.ts index de4c926..3c352b6 100644 --- a/src/utils/getIGLFrontFace.ts +++ b/src/utils/getIGLFrontFace.ts @@ -1,6 +1,6 @@ -import { IFrontFace } from "@feng3d/render-api"; +import { FrontFace } from "@feng3d/render-api"; -export function getIGLFrontFace(frontFace: IFrontFace) +export function getIGLFrontFace(frontFace: FrontFace) { const glFrontFace: IGLFrontFace = frontFaceMap[frontFace]; -- Gitee From 879f566508c2724eea11786e283810ef55e099c4 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 15:38:15 +0800 Subject: [PATCH 39/57] =?UTF-8?q?refactor(WebGL):=20=E9=87=8D=E6=9E=84=20r?= =?UTF-8?q?eadPixels=20=E6=8E=A5=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除 IGLReadPixels 接口，改为使用 RenderApi 的 ReadPixels 接口 - 修改 WebGL 类中的 readPixels 方法，返回读取到的像素数据 - 更新相关示例和工具函数，以适应新的 ReadPixels 接口 - 优化 readPixels 工具函数，支持 WebGL2 的 readBuffer/readPixels --- examples/src/WebGL2Samples/fbo_read_pixels.ts | 28 ++++++++----- examples/src/WebGL2Samples/texture_format.ts | 4 +- src/WebGL.ts | 9 +++-- src/caches/getGLFramebuffer.ts | 2 +- src/caches/getGLTexture.ts | 4 +- ...tIGLRenderPassDescriptorWithMultisample.ts | 4 +- src/caches/getIGLTextureFormats.ts | 4 +- src/caches/getIGLTextureTarget.ts | 4 +- src/data/IGLReadPixels.ts | 40 ------------------- src/index.ts | 1 - src/utils/readPixels.ts | 38 +++++++++++++++--- 11 files changed, 65 insertions(+), 73 deletions(-) delete mode 100644 src/data/IGLReadPixels.ts diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index 20f8c5d..8ed63b0 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -133,7 +133,7 @@ const rp1: RenderPass = { viewport: { x: 0, y: 0, width: w, height: h }, pipeline: multipleOutputProgram, uniforms: { mvp: matrix }, - geometry:{ + geometry: { primitive: { topology: "triangle-list" }, vertices: multipleOutputVertexArray.vertices, draw: { __type__: "DrawVertex", vertexCount: 6 }, @@ -155,7 +155,7 @@ const ro: RenderObject = { diffuse: { texture, sampler }, layer: 0, }, - geometry:{ + geometry: { vertices: layerVertexArray.vertices, draw: { __type__: "DrawVertex", vertexCount: 6 }, } @@ -175,18 +175,24 @@ webgl.submit({ commandEncoders: [{ passEncoders: [rp1, rp] }] }); const data = new Uint8Array(w * h * 4 * 3); -webgl.readPixels({ - frameBuffer, attachmentPoint: "COLOR_ATTACHMENT0", - x: 0, y: 0, width: w, height: h, format: "RGBA", type: "UNSIGNED_BYTE", dstData: data, dstOffset: 0 +let result = webgl.readPixels({ + textureView: frameBuffer.colorAttachments[0].view, + origin: [0, 0], + copySize: [w, h], }); -webgl.readPixels({ - frameBuffer, attachmentPoint: "COLOR_ATTACHMENT1", - x: 0, y: 0, width: w, height: h, format: "RGBA", type: "UNSIGNED_BYTE", dstData: data, dstOffset: w * h * 4 +data.set(new Uint8Array(result.buffer), 0); +result = webgl.readPixels({ + textureView: frameBuffer.colorAttachments[1].view, + origin: [0, 0], + copySize: [w, h], }); -webgl.readPixels({ - frameBuffer, attachmentPoint: "COLOR_ATTACHMENT1", - x: 0, y: 0, width: w, height: h, format: "RGBA", type: "UNSIGNED_BYTE", dstData: data, dstOffset: w * h * 4 * 2 +data.set(new Uint8Array(result.buffer), w * h * 4); +result = webgl.readPixels({ + textureView: frameBuffer.colorAttachments[2].view, + origin: [0, 0], + copySize: [w, h], }); +data.set(new Uint8Array(result.buffer), w * h * 4 * 2); console.log(data); diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index b22dc32..4d3c707 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -1,4 +1,4 @@ -import { IRenderPassObject, ITextureFormat, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { IRenderPassObject, TextureFormat, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { GLCanvasContext, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -95,7 +95,7 @@ import { getShaderSource, loadImage } from "./utility"; MAX: 9 }; - const textureFormats: { format: ITextureFormat }[] = new Array(TextureTypes.MAX); + const textureFormats: { format: TextureFormat }[] = new Array(TextureTypes.MAX); textureFormats[TextureTypes.RGB] = { format: "rgba8unorm", diff --git a/src/WebGL.ts b/src/WebGL.ts index 6890ea9..02a840b 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -1,4 +1,4 @@ -import { Buffer, RenderPassDescriptor, RenderPipeline, Sampler, Submit, Texture } from "@feng3d/render-api"; +import { Buffer, ReadPixels, RenderPassDescriptor, RenderPipeline, Sampler, Submit, Texture } from "@feng3d/render-api"; import { RunWebGL } from "./RunWebGL"; import { deleteBuffer } from "./caches/getGLBuffer"; @@ -10,7 +10,6 @@ import { deleteSampler } from "./caches/getGLSampler"; import { deleteTexture } from "./caches/getGLTexture"; import { deleteTransformFeedback } from "./caches/getGLTransformFeedback"; import { GLCanvasContext } from "./data/GLCanvasContext"; -import { IGLReadPixels } from "./data/IGLReadPixels"; import { IGLRenderbuffer } from "./data/IGLRenderbuffer"; import { IGLTransformFeedback } from "./data/IGLTransformFeedback"; import { readPixels } from "./utils/readPixels"; @@ -43,9 +42,11 @@ export class WebGL this._runWebGL.runSubmit(this._gl, submit); } - readPixels(glReadPixels: IGLReadPixels) + readPixels(glReadPixels: ReadPixels) { - readPixels(this._gl, glReadPixels); + glReadPixels.result = readPixels(this._gl, glReadPixels); + + return glReadPixels.result; } deleteFramebuffer(passDescriptor: RenderPassDescriptor) diff --git a/src/caches/getGLFramebuffer.ts b/src/caches/getGLFramebuffer.ts index c5e66c8..0f8198c 100644 --- a/src/caches/getGLFramebuffer.ts +++ b/src/caches/getGLFramebuffer.ts @@ -123,7 +123,7 @@ export function deleteFramebuffer(gl: WebGLRenderingContext, passDescriptor: Ren { deleteRenderPassDescriptorWithMultisample(gl, passDescriptor[_IGLRenderPassDescriptorWithMultisample]); -return; + return; } const webGLFramebuffer = gl._framebuffers.get(passDescriptor); diff --git a/src/caches/getGLTexture.ts b/src/caches/getGLTexture.ts index 6985dc0..35d3b35 100644 --- a/src/caches/getGLTexture.ts +++ b/src/caches/getGLTexture.ts @@ -1,4 +1,4 @@ -import { ITextureSize, Texture, TextureDataSource, TextureImageSource } from "@feng3d/render-api"; +import { TextureSize, Texture, TextureDataSource, TextureImageSource } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; import { IGLTexturePixelStore } from "../data/IGLTexturePixelStore"; import { getTextureCubeMapTarget } from "../utils/getTextureCubeMapTarget"; @@ -389,7 +389,7 @@ return; watcher.watch(texture, "writeTextures", updateTexture); // 监听纹理尺寸发生变化 - const resize = (newValue: ITextureSize, oldValue: ITextureSize) => + const resize = (newValue: TextureSize, oldValue: TextureSize) => { if (!!newValue && !!oldValue) { diff --git a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts b/src/caches/getIGLRenderPassDescriptorWithMultisample.ts index 51c74f1..16e6d00 100644 --- a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts +++ b/src/caches/getIGLRenderPassDescriptorWithMultisample.ts @@ -1,4 +1,4 @@ -import { RenderPassColorAttachment, RenderPassDescriptor, ITextureFormat, TextureView } from "@feng3d/render-api"; +import { RenderPassColorAttachment, RenderPassDescriptor, TextureFormat, TextureView } from "@feng3d/render-api"; import { GLBlitFramebuffer } from "../data/GLBlitFramebuffer"; import { GLRenderbufferInternalformat, IGLRenderbuffer } from "../data/IGLRenderbuffer"; import { getIGLTextureFormats } from "./getIGLTextureFormats"; @@ -60,7 +60,7 @@ return colorAttachment; return sourcePassDescriptor[_IGLRenderPassDescriptorWithMultisample]; } -function getGLRenderbufferInternalformat(format?: ITextureFormat) +function getGLRenderbufferInternalformat(format?: TextureFormat) { const { internalformat } = getIGLTextureFormats(format); diff --git a/src/caches/getIGLTextureFormats.ts b/src/caches/getIGLTextureFormats.ts index f688e6c..c4a1c2b 100644 --- a/src/caches/getIGLTextureFormats.ts +++ b/src/caches/getIGLTextureFormats.ts @@ -1,7 +1,7 @@ -import { ITextureFormat } from "@feng3d/render-api"; +import { TextureFormat } from "@feng3d/render-api"; import { IGLTextureFormats } from "../data/IGLTextureFormats"; -export function getIGLTextureFormats(format: ITextureFormat = "rgba8unorm") +export function getIGLTextureFormats(format: TextureFormat = "rgba8unorm") { const glTextureFormat: IGLTextureFormats = formatMap[format]; diff --git a/src/caches/getIGLTextureTarget.ts b/src/caches/getIGLTextureTarget.ts index 77e7f47..29937d0 100644 --- a/src/caches/getIGLTextureTarget.ts +++ b/src/caches/getIGLTextureTarget.ts @@ -1,7 +1,7 @@ -import { ITextureDimension } from "@feng3d/render-api"; +import { TextureDimension } from "@feng3d/render-api"; import { IGLTextureTarget } from "../data/IGLTexture"; -export function getIGLTextureTarget(dimension: ITextureDimension = "2d") +export function getIGLTextureTarget(dimension: TextureDimension = "2d") { const target: IGLTextureTarget = dimensionMap[dimension]; diff --git a/src/data/IGLReadPixels.ts b/src/data/IGLReadPixels.ts deleted file mode 100644 index ebdfd73..0000000 --- a/src/data/IGLReadPixels.ts +++ /dev/null @@ -1,40 +0,0 @@ -import { ReadPixels, RenderPassDescriptor } from "@feng3d/render-api"; -import { GLAttachmentPoint } from "../gl/WebGLEnums"; -import { IGLTextureDataType, IGLTextureFormat } from "./IGLTexture"; - -/** - * 读取渲染缓冲区或者纹理视图中的像素值。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/readPixels - */ -export interface IGLReadPixels extends ReadPixels -{ - frameBuffer: RenderPassDescriptor; - - /** - * 读取那个附件。 - */ - attachmentPoint: GLAttachmentPoint; - - x: number, - y: number, - width: number, - height: number, - - /** - * 纹理格式。 - * - * 默认 "RGBA"。 - */ - format?: IGLTextureFormat; - - /** - * 数据类型。 - * - * 默认 "UNSIGNED_BYTE"。 - */ - type?: IGLTextureDataType; - - dstData: ArrayBufferView, - dstOffset: number -} diff --git a/src/index.ts b/src/index.ts index e71c122..f8e3277 100644 --- a/src/index.ts +++ b/src/index.ts @@ -6,7 +6,6 @@ export * from "./data/Buffer"; export * from "./data/GLCapabilities"; export * from "./data/GLCommandEncoder"; export * from "./data/GLPrimitiveState"; -export * from "./data/IGLReadPixels"; export * from "./data/IGLRenderbuffer"; export * from "./data/IGLRenderPass"; export * from "./data/IGLSampler"; diff --git a/src/utils/readPixels.ts b/src/utils/readPixels.ts index 058272d..9575a88 100644 --- a/src/utils/readPixels.ts +++ b/src/utils/readPixels.ts @@ -1,20 +1,46 @@ -import { getGLFramebuffer } from "../caches/getGLFramebuffer"; -import { IGLReadPixels } from "../data/IGLReadPixels"; +import { ReadPixels, RenderPassDescriptor, Texture } from "@feng3d/render-api"; +import { deleteFramebuffer, getGLFramebuffer } from "../caches/getGLFramebuffer"; +import { getIGLTextureFormats } from "../caches/getIGLTextureFormats"; +import { GLAttachmentPoint } from "../gl/WebGLEnums"; -export function readPixels(gl: WebGLRenderingContext, readPixels: IGLReadPixels) +export function readPixels(gl: WebGLRenderingContext, readPixels: ReadPixels) { + let bufferData:ArrayBufferView; + if (gl instanceof WebGL2RenderingContext) { - const { frameBuffer, attachmentPoint, x, y, width, height, format, type, dstData, dstOffset } = readPixels; - + const { textureView, origin, copySize } = readPixels; + const attachmentPoint: GLAttachmentPoint = "COLOR_ATTACHMENT0"; + const [width, height] = copySize; + // + const { format, type } = getIGLTextureFormats(textureView.texture.format); + const bytesPerPixel = Texture.getTextureBytesPerPixel(textureView.texture.format); + const dataConstructor = Texture.getTextureDataConstructor(textureView.texture.format); + // + const bytesPerRow = width * bytesPerPixel; + const bufferSize = bytesPerRow * height; + bufferData = new dataConstructor(bufferSize / dataConstructor.BYTES_PER_ELEMENT); + // + const frameBuffer: RenderPassDescriptor = { + colorAttachments: [ + { view: textureView }, + ] + }; + // const webGLFramebuffer = getGLFramebuffer(gl, frameBuffer); gl.bindFramebuffer(gl.FRAMEBUFFER, webGLFramebuffer); + // gl.readBuffer(gl[attachmentPoint]); - gl.readPixels(x, y, width, height, gl[format], gl[type], dstData, dstOffset); + gl.readPixels(origin[0], origin[1], width, height, gl[format], gl[type], bufferData, 0); + + // 释放 + deleteFramebuffer(gl, frameBuffer); } else { console.error(`WebGL1 不支持 readBuffer/readPixels ！`); } + + return bufferData; } -- Gitee From 8ea323bf4611c311a9e050f9e9dbef84bb0e70c5 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 18:05:08 +0800 Subject: [PATCH 40/57] =?UTF-8?q?refactor(webgl):=20=E9=87=8D=E6=9E=84=20W?= =?UTF-8?q?ebGL=20=E7=9B=B8=E5=85=B3=E7=B1=BB=E5=9E=8B=E5=92=8C=E6=8E=A5?= =?UTF-8?q?=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 IGL 开头的接口统一改为 GL 开头，如 IGLTransformFeedback 改为 GLTransformFeedback - GLSamplerTexture、GLTransformFeedback 等新类型替代原有的 IGLSamplerTexture、IGLTransformFeedback - 修改相关方法和属性，以适应新的类型命名 - 删除部分冗余代码，优化代码结构 --- .../transform_feedback_instanced.ts | 10 +- .../transform_feedback_interleaved.ts | 6 +- .../transform_feedback_separated.ts | 6 +- .../transform_feedback_separated_2.ts | 10 +- examples/src/regl-examples/cloth.ts | 6 +- examples/src/regl-examples/cube.ts | 6 +- examples/src/webgl-examples/sample7.ts | 4 +- examples/src/webgl-examples/sample8.ts | 6 +- src/RunWebGL.ts | 61 ++--- src/WebGL.ts | 8 +- src/caches/getGLFramebuffer.ts | 4 +- src/caches/getGLProgram.ts | 87 ++++-- src/caches/getGLRenderOcclusionQuery.ts | 2 + src/caches/getGLRenderbuffer.ts | 8 +- src/caches/getGLSampler.ts | 61 ++++- src/caches/getGLTexture.ts | 169 +++++++++++- src/caches/getGLTransformFeedback.ts | 8 +- ...tIGLRenderPassDescriptorWithMultisample.ts | 8 +- src/caches/getIGLTextureFormats.ts | 70 ++++- src/caches/getIGLTextureTarget.ts | 22 +- .../{IGLRenderbuffer.ts => GLRenderbuffer.ts} | 2 +- ...LSamplerTexture.ts => GLSamplerTexture.ts} | 2 +- ...formFeedback.ts => GLTransformFeedback.ts} | 6 +- ...backPass.ts => GLTransformFeedbackPass.ts} | 22 +- ...IGLUniformBuffer.ts => GLUniformBuffer.ts} | 2 +- src/data/IGLSampler.ts | 39 --- src/data/IGLTexture.ts | 65 ----- src/data/IGLTextureFormats.ts | 25 -- src/data/IGLTexturePixelStore.ts | 249 ------------------ src/data/IGLUniformInfo.ts | 50 ---- src/data/IGLUniforms.ts | 11 - src/data/{ => polyfills}/Buffer.ts | 0 .../CommandEncoder.ts} | 4 +- src/data/{ => polyfills}/OcclusionQuery.ts | 2 +- .../PrimitiveState.ts} | 0 .../RenderPass.ts} | 2 +- src/data/polyfills/Uniforms.ts | 11 + src/gl/WebGLEnums.ts | 32 +-- src/index.ts | 26 +- src/runs/getIGLBuffer.ts | 6 +- 40 files changed, 487 insertions(+), 631 deletions(-) rename src/data/{IGLRenderbuffer.ts => GLRenderbuffer.ts} (98%) rename src/data/{IGLSamplerTexture.ts => GLSamplerTexture.ts} (86%) rename src/data/{IGLTransformFeedback.ts => GLTransformFeedback.ts} (66%) rename src/data/{IGLTransformFeedbackPass.ts => GLTransformFeedbackPass.ts} (69%) rename src/data/{IGLUniformBuffer.ts => GLUniformBuffer.ts} (70%) delete mode 100644 src/data/IGLSampler.ts delete mode 100644 src/data/IGLTexture.ts delete mode 100644 src/data/IGLTextureFormats.ts delete mode 100644 src/data/IGLTexturePixelStore.ts delete mode 100644 src/data/IGLUniformInfo.ts delete mode 100644 src/data/IGLUniforms.ts rename src/data/{ => polyfills}/Buffer.ts (100%) rename src/data/{GLCommandEncoder.ts => polyfills/CommandEncoder.ts} (84%) rename src/data/{ => polyfills}/OcclusionQuery.ts (78%) rename src/data/{GLPrimitiveState.ts => polyfills/PrimitiveState.ts} (100%) rename src/data/{IGLRenderPass.ts => polyfills/RenderPass.ts} (93%) create mode 100644 src/data/polyfills/Uniforms.ts diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index 91019f7..d203459 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -1,5 +1,5 @@ import { IIndicesDataTypes, IVertexDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, GLTransformFeedback, GLTransformFeedbackObject, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -68,7 +68,7 @@ import { getShaderSource } from "./utility"; const vertexArrays: { vertices?: VertexAttributes, indices?: IIndicesDataTypes }[][] = []; // Transform feedback objects track output buffer state - const transformFeedbacks: IGLTransformFeedback[] = []; + const transformFeedbacks: GLTransformFeedback[] = []; const vertexBuffers: IVertexDataTypes[][] = new Array(vertexArrays.length); @@ -107,7 +107,7 @@ import { getShaderSource } from "./utility"; function initPrograms() { - const programTransform: IGLTransformFeedbackPipeline = { + const programTransform: GLTransformFeedbackPipeline = { vertex: { code: getShaderSource("vs-emit") }, transformFeedbackVaryings: { varyings: ["v_offset", "v_rotation"], bufferMode: "SEPARATE_ATTRIBS" }, }; @@ -125,12 +125,12 @@ import { getShaderSource } from "./utility"; }, }; - const programs: [IGLTransformFeedbackPipeline, RenderPipeline] = [programTransform, programDraw]; + const programs: [GLTransformFeedbackPipeline, RenderPipeline] = [programTransform, programDraw]; return programs; } - const transformRO: IGLTransformFeedbackObject = { + const transformRO: GLTransformFeedbackObject = { pipeline: programs[PROGRAM_TRANSFORM], vertices: null, transformFeedback: null, diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index 9413983..165c742 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -1,5 +1,5 @@ import { IIndicesDataTypes, IVertexDataTypes, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; -import { getIGLVertexBuffer, GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { getIGLVertexBuffer, GLCanvasContext, GLTransformFeedback, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -21,7 +21,7 @@ import { getShaderSource } from "./utility"; const programTransform = (function (vertexShaderSourceTransform, fragmentShaderSourceTransform) { - const programTransform: IGLTransformFeedbackPipeline = { + const programTransform: GLTransformFeedbackPipeline = { vertex: { code: vertexShaderSourceTransform }, transformFeedbackVaryings: { varyings: ["gl_Position", "v_color"], bufferMode: "INTERLEAVED_ATTRIBS" }, }; @@ -68,7 +68,7 @@ import { getShaderSource } from "./utility"; ]; // -- Init TransformFeedback - const transformFeedback: IGLTransformFeedback = { + const transformFeedback: GLTransformFeedback = { bindBuffers: [ { index: 0, data: buffers[PROGRAM_FEEDBACK] } ] diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index 5b04e42..c6a4f74 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -1,5 +1,5 @@ import { IIndicesDataTypes, IVertexDataTypes, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, GLTransformFeedback, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -19,7 +19,7 @@ import { getShaderSource } from "./utility"; // -- Init Program const programTransform = (function (vertexShaderSourceTransform, fragmentShaderSourceTransform) { - const transformFeedbackPipeline: IGLTransformFeedbackPipeline = { + const transformFeedbackPipeline: GLTransformFeedbackPipeline = { vertex: { code: vertexShaderSourceTransform }, transformFeedbackVaryings: { varyings: ["gl_Position", "v_color"], bufferMode: "SEPARATE_ATTRIBS" }, }; @@ -78,7 +78,7 @@ import { getShaderSource } from "./utility"; ]; // -- Init TransformFeedback - const transformFeedback: IGLTransformFeedback = { + const transformFeedback: GLTransformFeedback = { bindBuffers: [ { index: 0, data: buffers[BufferType.POSITION] }, { index: 1, data: buffers[BufferType.COLOR] }, diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 14a353a..4d166fe 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -1,5 +1,5 @@ import { IIndicesDataTypes, IVertexDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, IGLTransformFeedback, IGLTransformFeedbackObject, IGLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { GLCanvasContext, GLTransformFeedback, GLTransformFeedbackObject, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -61,7 +61,7 @@ import { getShaderSource } from "./utility"; const vertexArrays: { vertices?: VertexAttributes, indices?: IIndicesDataTypes }[][] = []; // Transform feedback objects track output buffer state - const transformFeedbacks: IGLTransformFeedback[] = []; + const transformFeedbacks: GLTransformFeedback[] = []; const vertexBuffers: IVertexDataTypes[][] = new Array(vertexArrays.length); @@ -108,9 +108,9 @@ import { getShaderSource } from "./utility"; }; } - function initProgram(): [IGLTransformFeedbackPipeline, RenderPipeline] + function initProgram(): [GLTransformFeedbackPipeline, RenderPipeline] { - const transformFeedbackPipeline: IGLTransformFeedbackPipeline = { + const transformFeedbackPipeline: GLTransformFeedbackPipeline = { vertex: { code: getShaderSource("vs-emit") }, transformFeedbackVaryings: { varyings: ["v_position", "v_velocity", "v_spawntime", "v_lifetime"], bufferMode: "SEPARATE_ATTRIBS" }, }; @@ -131,7 +131,7 @@ import { getShaderSource } from "./utility"; return [transformFeedbackPipeline, program]; } - const transformRO: IGLTransformFeedbackObject = { + const transformRO: GLTransformFeedbackObject = { pipeline: transformFeedbackPipeline, vertices: null, transformFeedback: null, diff --git a/examples/src/regl-examples/cloth.ts b/examples/src/regl-examples/cloth.ts index ff5d0f3..9cfae98 100644 --- a/examples/src/regl-examples/cloth.ts +++ b/examples/src/regl-examples/cloth.ts @@ -1,5 +1,5 @@ -import { Submit, RenderObject } from "@feng3d/render-api"; -import { getIGLVertexBuffer, IGLSamplerTexture, WebGL } from "@feng3d/webgl"; +import { RenderObject, Submit } from "@feng3d/render-api"; +import { getIGLVertexBuffer, GLSamplerTexture, WebGL } from "@feng3d/webgl"; import { fit } from "./hughsk/canvas-fit"; import { attachCamera } from "./hughsk/canvas-orbit-camera"; @@ -388,7 +388,7 @@ import * as vec3 from "./stackgl/gl-vec3"; img.src = "../../assets/cloth.png"; await img.decode(); - const diffuse: IGLSamplerTexture = { + const diffuse: GLSamplerTexture = { texture: { size: [img.width, img.height], generateMipmap: true, diff --git a/examples/src/regl-examples/cube.ts b/examples/src/regl-examples/cube.ts index 90861b4..3e51c65 100644 --- a/examples/src/regl-examples/cube.ts +++ b/examples/src/regl-examples/cube.ts @@ -1,5 +1,5 @@ -import { Submit, RenderObject } from "@feng3d/render-api"; -import { IGLSamplerTexture, WebGL } from "@feng3d/webgl"; +import { RenderObject, Submit } from "@feng3d/render-api"; +import { GLSamplerTexture, WebGL } from "@feng3d/webgl"; import * as mat4 from "./stackgl/gl-mat4"; (async () => @@ -136,7 +136,7 @@ import * as mat4 from "./stackgl/gl-mat4"; img.src = "../../assets/peppers.png"; await img.decode(); - const diffuse: IGLSamplerTexture = { + const diffuse: GLSamplerTexture = { texture: { size: [img.width, img.height], sources: [{ image: img }] diff --git a/examples/src/webgl-examples/sample7.ts b/examples/src/webgl-examples/sample7.ts index e40fc46..d65b6ec 100644 --- a/examples/src/webgl-examples/sample7.ts +++ b/examples/src/webgl-examples/sample7.ts @@ -1,5 +1,5 @@ import { RenderPass, Sampler, Texture, RenderObject } from "@feng3d/render-api"; -import { IGLSamplerTexture, WebGL } from "@feng3d/webgl"; +import { GLSamplerTexture, WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; let cubeRotation = 0.0; @@ -304,7 +304,7 @@ async function loadTexture(url: string) sampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "linear" }; } - return { texture, sampler } as IGLSamplerTexture; + return { texture, sampler } as GLSamplerTexture; } function isPowerOf2(value: number) diff --git a/examples/src/webgl-examples/sample8.ts b/examples/src/webgl-examples/sample8.ts index af59189..81c9f43 100644 --- a/examples/src/webgl-examples/sample8.ts +++ b/examples/src/webgl-examples/sample8.ts @@ -1,5 +1,5 @@ -import { RenderPass, Sampler, Texture, RenderObject } from "@feng3d/render-api"; -import { IGLSamplerTexture, WebGL } from "@feng3d/webgl"; +import { RenderObject, RenderPass, Sampler, Texture } from "@feng3d/render-api"; +import { GLSamplerTexture, WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; let cubeRotation = 0.0; @@ -320,7 +320,7 @@ function initBuffers() // // Initialize a texture. // -function initTexture(): IGLSamplerTexture +function initTexture(): GLSamplerTexture { const texture: Texture = { size: [1, 1], diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 8fafda1..bd26d73 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,26 +1,23 @@ -import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, DepthStencilState, DrawIndexed, DrawVertex, CullFace, FrontFace, IIndicesDataTypes, IRenderPassObject, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, CullFace, DepthStencilState, DrawIndexed, DrawVertex, FrontFace, IIndicesDataTypes, IRenderPassObject, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getGLBuffer } from "./caches/getGLBuffer"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; -import { getGLProgram } from "./caches/getGLProgram"; +import { getGLProgram, UniformItemInfo } from "./caches/getGLProgram"; import { getGLRenderOcclusionQuery } from "./caches/getGLRenderOcclusionQuery"; -import { getGLSampler, getIGLTextureMagFilter, getIGLTextureMinFilter, getIGLTextureWrap } from "./caches/getGLSampler"; +import { getGLSampler, getIGLTextureMagFilter, getIGLTextureMinFilter, getIGLTextureWrap, GLTextureMagFilter, GLTextureMinFilter, GLTextureWrap } from "./caches/getGLSampler"; import { getGLTransformFeedback } from "./caches/getGLTransformFeedback"; import { getIGLBlitFramebuffer } from "./caches/getIGLBlitFramebuffer"; import { getIGLDrawMode, IGLDrawMode } from "./caches/getIGLDrawMode"; import { getIGLRenderPassDescriptorWithMultisample } from "./caches/getIGLRenderPassDescriptorWithMultisample"; -import { getIGLTextureTarget } from "./caches/getIGLTextureTarget"; +import { getIGLTextureTarget, GLTextureTarget } from "./caches/getIGLTextureTarget"; import { _GL_Submit_Times } from "./const/const"; import { IGLUniformBufferType } from "./const/IGLUniformType"; -import { IGLDrawElementType } from "./data/Buffer"; import { GLBlitFramebuffer } from "./data/GLBlitFramebuffer"; -import { IGLTextureMagFilter, IGLTextureMinFilter, IGLTextureWrap } from "./data/IGLSampler"; -import { IGLSamplerTexture } from "./data/IGLSamplerTexture"; -import { IGLTextureTarget } from "./data/IGLTexture"; -import { IGLTransformFeedback } from "./data/IGLTransformFeedback"; -import { IGLTransformFeedbackObject, IGLTransformFeedbackPass, IGLTransformFeedbackPipeline } from "./data/IGLTransformFeedbackPass"; -import { IGLUniformBuffer } from "./data/IGLUniformBuffer"; -import { IUniformItemInfo } from "./data/IGLUniformInfo"; +import { GLSamplerTexture } from "./data/GLSamplerTexture"; +import { GLTransformFeedback } from "./data/GLTransformFeedback"; +import { GLTransformFeedbackObject, GLTransformFeedbackPass, GLTransformFeedbackPipeline } from "./data/GLTransformFeedbackPass"; +import { GLUniformBuffer } from "./data/GLUniformBuffer"; +import { IGLDrawElementType } from "./data/polyfills/Buffer"; import { getGLTexture } from "./internal"; import { getIGLIndexBuffer, getIGLUniformBuffer, getIGLVertexBuffer } from "./runs/getIGLBuffer"; import { getIGLBlendEquation, getIGLBlendFactor, IGLBlendEquation, IGLBlendFactor } from "./runs/runColorTargetStates"; @@ -47,11 +44,11 @@ declare global { interface WebGLTexture { - minFilter?: IGLTextureMinFilter, - magFilter?: IGLTextureMagFilter, - wrapS?: IGLTextureWrap, - wrapT?: IGLTextureWrap, - wrapR?: IGLTextureWrap, + minFilter?: GLTextureMinFilter, + magFilter?: GLTextureMagFilter, + wrapS?: GLTextureWrap, + wrapT?: GLTextureWrap, + wrapR?: GLTextureWrap, maxAnisotropy?: number, lodMinClamp?: number; lodMaxClamp?: number; @@ -108,7 +105,7 @@ export class RunWebGL }); } - protected runTransformFeedbackPass(gl: WebGLRenderingContext, transformFeedbackPass: IGLTransformFeedbackPass) + protected runTransformFeedbackPass(gl: WebGLRenderingContext, transformFeedbackPass: GLTransformFeedbackPass) { // 执行变换反馈通道时关闭光栅化功能 if (gl instanceof WebGL2RenderingContext) @@ -230,7 +227,7 @@ export class RunWebGL } } - private runTransformFeedbackObject(gl: WebGLRenderingContext, renderObject: IGLTransformFeedbackObject) + private runTransformFeedbackObject(gl: WebGLRenderingContext, renderObject: GLTransformFeedbackObject) { const { pipeline: material, vertices, uniforms, transformFeedback, draw } = renderObject; @@ -249,7 +246,7 @@ export class RunWebGL this.endTransformFeedback(gl, transformFeedback); } - private endTransformFeedback(gl: WebGLRenderingContext, transformFeedback: IGLTransformFeedback) + private endTransformFeedback(gl: WebGLRenderingContext, transformFeedback: GLTransformFeedback) { // if (transformFeedback) @@ -346,7 +343,7 @@ export class RunWebGL if (isTexture) { - this.runSamplerTexture(gl, v, uniformData as IGLSamplerTexture); + this.runSamplerTexture(gl, v, uniformData as GLSamplerTexture); } else { @@ -363,7 +360,7 @@ export class RunWebGL const uniformData = uniforms[name] as TypedArray | BufferBinding; // - let buffer: IGLUniformBuffer; + let buffer: GLUniformBuffer; const typedArray = uniformData as TypedArray; if (typedArray.buffer && typedArray.BYTES_PER_ELEMENT) { @@ -375,7 +372,7 @@ export class RunWebGL updateBufferBinding(uniformBlock.bufferBindingInfo, bufferBinding); buffer = getIGLUniformBuffer(bufferBinding.bufferView); } - (buffer as UnReadonly).label = buffer.label || (`UniformBuffer ${name}`); + (buffer as UnReadonly).label = buffer.label || (`UniformBuffer ${name}`); // const webGLBuffer = getGLBuffer(gl, buffer); @@ -384,7 +381,7 @@ export class RunWebGL } } - private runSamplerTexture(gl: WebGLRenderingContext, uniformInfo: IUniformItemInfo, samplerTexture: IGLSamplerTexture) + private runSamplerTexture(gl: WebGLRenderingContext, uniformInfo: UniformItemInfo, samplerTexture: GLSamplerTexture) { const { texture, sampler } = samplerTexture; const { location, textureID } = uniformInfo; @@ -408,7 +405,7 @@ export class RunWebGL /** * 设置采样参数 */ - private runSampler(gl: WebGLRenderingContext, textureTarget: IGLTextureTarget, webGLTexture: WebGLTexture, sampler: Sampler, textureID: number) + private runSampler(gl: WebGLRenderingContext, textureTarget: GLTextureTarget, webGLTexture: WebGLTexture, sampler: Sampler, textureID: number) { if (gl instanceof WebGL2RenderingContext) { @@ -417,10 +414,10 @@ export class RunWebGL } else { - const minFilter: IGLTextureMinFilter = getIGLTextureMinFilter(sampler.minFilter, sampler.mipmapFilter); - const magFilter: IGLTextureMagFilter = getIGLTextureMagFilter(sampler.magFilter); - const wrapS: IGLTextureWrap = getIGLTextureWrap(sampler.addressModeU); - const wrapT: IGLTextureWrap = getIGLTextureWrap(sampler.addressModeV); + const minFilter = getIGLTextureMinFilter(sampler.minFilter, sampler.mipmapFilter); + const magFilter = getIGLTextureMagFilter(sampler.magFilter); + const wrapS = getIGLTextureWrap(sampler.addressModeU); + const wrapT = getIGLTextureWrap(sampler.addressModeV); // 设置纹理参数 if (webGLTexture.minFilter !== minFilter) @@ -461,7 +458,7 @@ export class RunWebGL /** * 设置环境Uniform数据 */ - private runUniform(gl: WebGLRenderingContext, type: IGLUniformBufferType, uniformInfo: IUniformItemInfo, data: any) + private runUniform(gl: WebGLRenderingContext, type: IGLUniformBufferType, uniformInfo: UniformItemInfo, data: any) { if (typeof data === "number") { @@ -640,7 +637,7 @@ export class RunWebGL } } - private runTransformFeedback(gl: WebGLRenderingContext, transformFeedback: IGLTransformFeedback, topology: IGLDrawMode) + private runTransformFeedback(gl: WebGLRenderingContext, transformFeedback: GLTransformFeedback, topology: IGLDrawMode) { if (gl instanceof WebGL2RenderingContext) { @@ -663,7 +660,7 @@ export class RunWebGL } } - private runTransformFeedbackPipeline(gl: WebGLRenderingContext, renderPipeline: IGLTransformFeedbackPipeline) + private runTransformFeedbackPipeline(gl: WebGLRenderingContext, renderPipeline: GLTransformFeedbackPipeline) { const program = getGLProgram(gl, renderPipeline); gl.useProgram(program); diff --git a/src/WebGL.ts b/src/WebGL.ts index 02a840b..9edac31 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -10,8 +10,8 @@ import { deleteSampler } from "./caches/getGLSampler"; import { deleteTexture } from "./caches/getGLTexture"; import { deleteTransformFeedback } from "./caches/getGLTransformFeedback"; import { GLCanvasContext } from "./data/GLCanvasContext"; -import { IGLRenderbuffer } from "./data/IGLRenderbuffer"; -import { IGLTransformFeedback } from "./data/IGLTransformFeedback"; +import { GLRenderbuffer } from "./data/GLRenderbuffer"; +import { GLTransformFeedback } from "./data/GLTransformFeedback"; import { readPixels } from "./utils/readPixels"; /** @@ -54,7 +54,7 @@ export class WebGL deleteFramebuffer(this._gl, passDescriptor); } - deleteRenderbuffer(renderbuffer: IGLRenderbuffer) + deleteRenderbuffer(renderbuffer: GLRenderbuffer) { deleteRenderbuffer(this._gl, renderbuffer); } @@ -79,7 +79,7 @@ export class WebGL deleteProgram(this._gl, material); } - deleteTransformFeedback(transformFeedback: IGLTransformFeedback) + deleteTransformFeedback(transformFeedback: GLTransformFeedback) { deleteTransformFeedback(this._gl, transformFeedback); } diff --git a/src/caches/getGLFramebuffer.ts b/src/caches/getGLFramebuffer.ts index 0f8198c..e28657a 100644 --- a/src/caches/getGLFramebuffer.ts +++ b/src/caches/getGLFramebuffer.ts @@ -1,5 +1,5 @@ import { RenderPassDescriptor, TextureView } from "@feng3d/render-api"; -import { IGLRenderbuffer } from "../data/IGLRenderbuffer"; +import { GLRenderbuffer } from "../data/GLRenderbuffer"; import { deleteRenderbuffer, getGLRenderbuffer } from "./getGLRenderbuffer"; import { getGLTexture } from "./getGLTexture"; import { _IGLRenderPassDescriptorWithMultisample, IGLRenderPassDescriptorWithMultisample } from "./getIGLRenderPassDescriptorWithMultisample"; @@ -34,7 +34,7 @@ export function getGLFramebuffer(gl: WebGLRenderingContext, passDescriptor: Rend const drawBuffers: number[] = []; passDescriptor.colorAttachments?.forEach((item, i) => { - const view = item.view as (TextureView | IGLRenderbuffer); + const view = item.view as (TextureView | GLRenderbuffer); const attachment = gl[`COLOR_ATTACHMENT${i}`]; drawBuffers.push(attachment); if ("texture" in view) diff --git a/src/caches/getGLProgram.ts b/src/caches/getGLProgram.ts index 63fd068..0dd6f23 100644 --- a/src/caches/getGLProgram.ts +++ b/src/caches/getGLProgram.ts @@ -1,7 +1,6 @@ import { GLVertexAttributeTypes, RenderPipeline } from "@feng3d/render-api"; -import { getWebGLUniformType, IGLUniformBufferType, isWebGLUniformTextureType } from "../const/IGLUniformType"; -import { IGLTransformFeedbackPipeline, IGLTransformFeedbackVaryings } from "../data/IGLTransformFeedbackPass"; -import { IGLUniformInfo, IUniformItemInfo } from "../data/IGLUniformInfo"; +import { getWebGLUniformType, IGLUniformBufferType, IGLUniformType, isWebGLUniformTextureType } from "../const/IGLUniformType"; +import { GLTransformFeedbackPipeline, GLTransformFeedbackVaryings } from "../data/GLTransformFeedbackPass"; import { getIGLAttributeType } from "./getIGLAttributeType"; declare global @@ -23,14 +22,14 @@ declare global /** * uniform信息列表 */ - uniforms: IGLUniformInfo[]; + uniforms: GLUniformInfo[]; /** * 统一变量块信息列表。 * * 仅 WebGL2 中存在。 */ - uniformBlocks: IUniformBlockInfo[]; + uniformBlocks: UniformBlockInfo[]; } } @@ -61,7 +60,7 @@ export interface IGLAttributeInfo /** * 激活渲染程序 */ -export function getGLProgram(gl: WebGLRenderingContext, material: RenderPipeline | IGLTransformFeedbackPipeline) +export function getGLProgram(gl: WebGLRenderingContext, material: RenderPipeline | GLTransformFeedbackPipeline) { const shaderKey = getKey(material); let result = gl._programs[shaderKey]; @@ -76,7 +75,7 @@ export function getGLProgram(gl: WebGLRenderingContext, material: RenderPipeline { } `; - const transformFeedbackVaryings = (material as IGLTransformFeedbackPipeline).transformFeedbackVaryings; + const transformFeedbackVaryings = (material as GLTransformFeedbackPipeline).transformFeedbackVaryings; result = getWebGLProgram(gl, vertex, fragment, transformFeedbackVaryings); gl._programs[shaderKey] = result; @@ -95,16 +94,16 @@ export function deleteProgram(gl: WebGLRenderingContext, material: RenderPipelin } } -function getKey(material: RenderPipeline | IGLTransformFeedbackPipeline) +function getKey(material: RenderPipeline | GLTransformFeedbackPipeline) { const vertex = material.vertex.code; const fragment = (material as RenderPipeline).fragment?.code; - const transformFeedbackVaryings = (material as IGLTransformFeedbackPipeline).transformFeedbackVaryings; + const transformFeedbackVaryings = (material as GLTransformFeedbackPipeline).transformFeedbackVaryings; return `---vertexShader---\n${vertex}\n---fragment---\n${fragment}\n---feedback---${transformFeedbackVaryings?.varyings.toString()} ${transformFeedbackVaryings?.bufferMode}`; } -function getWebGLProgram(gl: WebGLRenderingContext, vshader: string, fshader: string, transformFeedbackVaryings: IGLTransformFeedbackVaryings) +function getWebGLProgram(gl: WebGLRenderingContext, vshader: string, fshader: string, transformFeedbackVaryings: GLTransformFeedbackVaryings) { // 编译顶点着色器 const vertexShader = getWebGLShader(gl, "VERTEX_SHADER", vshader); @@ -128,7 +127,7 @@ function getWebGLProgram(gl: WebGLRenderingContext, vshader: string, fshader: st } // 获取uniform信息 const numUniforms = gl.getProgramParameter(program, gl.ACTIVE_UNIFORMS); - const uniforms: IGLUniformInfo[] = []; + const uniforms: GLUniformInfo[] = []; let textureID = 0; for (let i = 0; i < numUniforms; i++) { @@ -150,7 +149,7 @@ function getWebGLProgram(gl: WebGLRenderingContext, vshader: string, fshader: st } } - const items: IUniformItemInfo[] = []; + const items: UniformItemInfo[] = []; for (let j = 0; j < names.length; j++) { const name = names[j]; @@ -184,7 +183,7 @@ function getWebGLProgram(gl: WebGLRenderingContext, vshader: string, fshader: st gl.uniformBlockBinding(program, i, i); // 获取包含的统一变量列表。 const uniformIndices: Uint32Array = gl.getActiveUniformBlockParameter(program, i, gl.UNIFORM_BLOCK_ACTIVE_UNIFORM_INDICES); - const uniformList: IGLUniformInfo[] = []; + const uniformList: GLUniformInfo[] = []; for (let i = 0; i < uniformIndices.length; i++) { const unifrom = uniforms[uniformIndices[i]]; @@ -193,7 +192,7 @@ function getWebGLProgram(gl: WebGLRenderingContext, vshader: string, fshader: st } const name = gl.getActiveUniformBlockName(program, i); // - const info: IUniformBlockInfo = { + const info: UniformBlockInfo = { name, index: i, dataSize: gl.getActiveUniformBlockParameter(program, i, gl.UNIFORM_BLOCK_DATA_SIZE), @@ -221,7 +220,7 @@ function getWebGLProgram(gl: WebGLRenderingContext, vshader: string, fshader: st /** * 统一变量块信息。 */ -export interface IUniformBlockInfo +export interface UniformBlockInfo { /** * 名称。 @@ -241,7 +240,7 @@ export interface IUniformBlockInfo /** * 包含的统一变量列表。 */ - uniforms: IGLUniformInfo[]; + uniforms: GLUniformInfo[]; /** * 缓冲区绑定信息。 @@ -279,7 +278,7 @@ function getWebGLShader(gl: WebGLRenderingContext, type: ShaderType, code: strin return shader; } -function createLinkProgram(gl: WebGLRenderingContext, vertexShader: WebGLShader, fragmentShader: WebGLShader, transformFeedbackVaryings: IGLTransformFeedbackVaryings) +function createLinkProgram(gl: WebGLRenderingContext, vertexShader: WebGLShader, fragmentShader: WebGLShader, transformFeedbackVaryings: GLTransformFeedbackVaryings) { // 创建程序对象 const program = gl.createProgram(); @@ -338,7 +337,7 @@ export interface IBufferBindingInfo }[] } -function getBufferBindingInfo(uniformBlock: IUniformBlockInfo): IBufferBindingInfo +function getBufferBindingInfo(uniformBlock: UniformBlockInfo): IBufferBindingInfo { const size = uniformBlock.dataSize; // @@ -429,4 +428,54 @@ const uniformBufferTypeAlignSizeMap: { FLOAT_MAT3x4: { align: 16, size: 48, clsType: Float32Array }, FLOAT_MAT4x2: { align: 8, size: 32, clsType: Float32Array }, FLOAT_MAT4x3: { align: 16, size: 64, clsType: Float32Array }, -}; \ No newline at end of file +}; + + +/** + * WebGL统一变量 + */ +export interface GLUniformInfo +{ + /** + * 名称。 + */ + name: string; + + type: IGLUniformType; + + /** + * 是否纹理。 + */ + isTexture: boolean; + + /** + * 子项信息列表。 + */ + items: UniformItemInfo[] + + /** + * 是否在Block中。 + */ + inBlock?: boolean; +} + +/** + * WebGL统一变量 + */ +export interface UniformItemInfo +{ + /** + * uniform地址 + */ + location: WebGLUniformLocation; + + /** + * texture索引 + */ + textureID: number; + + /** + * Uniform数组索引，当Uniform数据为数组数据时生效 + */ + paths: string[]; +} \ No newline at end of file diff --git a/src/caches/getGLRenderOcclusionQuery.ts b/src/caches/getGLRenderOcclusionQuery.ts index eafa7da..88a9f3a 100644 --- a/src/caches/getGLRenderOcclusionQuery.ts +++ b/src/caches/getGLRenderOcclusionQuery.ts @@ -1,5 +1,7 @@ import { IRenderPassObject, OcclusionQuery, RenderPass } from "@feng3d/render-api"; +import "../data/polyfills/OcclusionQuery"; + export function getGLRenderOcclusionQuery(gl: WebGLRenderingContext, renderObjects?: readonly IRenderPassObject[]) { if (!renderObjects) return defautRenderOcclusionQuery; diff --git a/src/caches/getGLRenderbuffer.ts b/src/caches/getGLRenderbuffer.ts index 3fe8b02..83a0914 100644 --- a/src/caches/getGLRenderbuffer.ts +++ b/src/caches/getGLRenderbuffer.ts @@ -1,14 +1,14 @@ -import { IGLRenderbuffer } from "../data/IGLRenderbuffer"; +import { GLRenderbuffer } from "../data/GLRenderbuffer"; declare global { interface WebGLRenderingContext { - _renderbuffers: Map; + _renderbuffers: Map; } } -export function getGLRenderbuffer(gl: WebGLRenderingContext, renderbuffer: IGLRenderbuffer, sampleCount?: 4) +export function getGLRenderbuffer(gl: WebGLRenderingContext, renderbuffer: GLRenderbuffer, sampleCount?: 4) { let webGLRenderbuffer = gl._renderbuffers.get(renderbuffer); if (webGLRenderbuffer) return webGLRenderbuffer; @@ -31,7 +31,7 @@ export function getGLRenderbuffer(gl: WebGLRenderingContext, renderbuffer: IGLRe return webGLRenderbuffer; } -export function deleteRenderbuffer(gl: WebGLRenderingContext, renderbuffer: IGLRenderbuffer) +export function deleteRenderbuffer(gl: WebGLRenderingContext, renderbuffer: GLRenderbuffer) { const webGLRenderbuffer = gl._renderbuffers.get(renderbuffer); gl._renderbuffers.delete(renderbuffer); diff --git a/src/caches/getGLSampler.ts b/src/caches/getGLSampler.ts index 230d1a9..32a9f6b 100644 --- a/src/caches/getGLSampler.ts +++ b/src/caches/getGLSampler.ts @@ -1,5 +1,4 @@ import { IAddressMode, IFilterMode, Sampler } from "@feng3d/render-api"; -import { GLSamplerCompareMode, IGLTextureMagFilter, IGLTextureMinFilter, IGLTextureWrap } from "../data/IGLSampler"; import { getIGLCompareFunction } from "../runs/runDepthState"; declare global @@ -9,6 +8,7 @@ declare global _samplers: Map; } } +export type GLSamplerCompareMode = "NONE" | "COMPARE_REF_TO_TEXTURE"; export function getGLSampler(gl: WebGLRenderingContext, sampler?: Sampler) { @@ -20,11 +20,11 @@ export function getGLSampler(gl: WebGLRenderingContext, sampler?: Sampler) webGLSampler = gl.createSampler(); gl._samplers.set(sampler, webGLSampler); - const minFilter: IGLTextureMinFilter = getIGLTextureMinFilter(sampler.minFilter, sampler.mipmapFilter); - const magFilter: IGLTextureMagFilter = getIGLTextureMagFilter(sampler.magFilter); - const wrapS: IGLTextureWrap = getIGLTextureWrap(sampler.addressModeU); - const wrapT: IGLTextureWrap = getIGLTextureWrap(sampler.addressModeV); - const wrapR: IGLTextureWrap = getIGLTextureWrap(sampler.addressModeW); + const minFilter: GLTextureMinFilter = getIGLTextureMinFilter(sampler.minFilter, sampler.mipmapFilter); + const magFilter: GLTextureMagFilter = getIGLTextureMagFilter(sampler.magFilter); + const wrapS: GLTextureWrap = getIGLTextureWrap(sampler.addressModeU); + const wrapT: GLTextureWrap = getIGLTextureWrap(sampler.addressModeV); + const wrapR: GLTextureWrap = getIGLTextureWrap(sampler.addressModeW); const lodMinClamp = sampler.lodMinClamp || 0; const lodMaxClamp = sampler.lodMaxClamp || 16; const compareMode: GLSamplerCompareMode = sampler.compare ? "COMPARE_REF_TO_TEXTURE" : "NONE"; @@ -55,24 +55,51 @@ export function deleteSampler(gl: WebGLRenderingContext, sampler?: Sampler) } } +/** + * 纹理坐标s包装函数枚举 + * Wrapping function for texture coordinate s + * + * * `REPEAT` + * * `CLAMP_TO_EDGE` + * * `MIRRORED_REPEAT` + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texParameter + */ +export type GLTextureWrap = "REPEAT" | "CLAMP_TO_EDGE" | "MIRRORED_REPEAT"; + export function getIGLTextureWrap(addressMode: IAddressMode = "repeat") { - const textureWrap: IGLTextureWrap = addressModeMap[addressMode]; + const textureWrap: GLTextureWrap = addressModeMap[addressMode]; console.assert(!!textureWrap, `接收到错误值，请从 ${Object.keys(addressModeMap).toString()} 中取值！`); return textureWrap; } -const addressModeMap: { [key: string]: IGLTextureWrap } = { +const addressModeMap: { [key: string]: GLTextureWrap } = { "clamp-to-edge": "CLAMP_TO_EDGE", repeat: "REPEAT", "mirror-repeat": "MIRRORED_REPEAT", }; -export function getIGLTextureMinFilter(minFilter: IFilterMode = "nearest", mipmapFilter?: IFilterMode): IGLTextureMinFilter +/** + * 纹理缩小过滤器 + * Texture minification filter + * + * * `LINEAR` + * * `NEAREST` + * * `NEAREST_MIPMAP_NEAREST` + * * `LINEAR_MIPMAP_NEAREST` + * * `NEAREST_MIPMAP_LINEAR` + * * `LINEAR_MIPMAP_LINEAR` + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texParameter + */ +export type GLTextureMinFilter = "LINEAR" | "NEAREST" | "NEAREST_MIPMAP_NEAREST" | "LINEAR_MIPMAP_NEAREST" | "NEAREST_MIPMAP_LINEAR" | "LINEAR_MIPMAP_LINEAR"; + +export function getIGLTextureMinFilter(minFilter: IFilterMode = "nearest", mipmapFilter?: IFilterMode): GLTextureMinFilter { - let glMinFilter: IGLTextureMinFilter; + let glMinFilter: GLTextureMinFilter; if (minFilter === "linear") { if (mipmapFilter === "linear") @@ -106,17 +133,27 @@ export function getIGLTextureMinFilter(minFilter: IFilterMode = "nearest", mipma return glMinFilter; } +/** + * 纹理放大滤波器 + * Texture magnification filter + * + * * `LINEAR` + * * `NEAREST` + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texParameter + */ +export type GLTextureMagFilter = "LINEAR" | "NEAREST"; export function getIGLTextureMagFilter(magFilter: IFilterMode = "nearest") { - const glMagFilter: IGLTextureMagFilter = magFilterMap[magFilter]; + const glMagFilter: GLTextureMagFilter = magFilterMap[magFilter]; console.assert(!!glMagFilter, `接收到错误值，请从 ${Object.keys(magFilterMap).toString()} 中取值！`); return glMagFilter; } -const magFilterMap: { [key: string]: IGLTextureMagFilter } = { +const magFilterMap: { [key: string]: GLTextureMagFilter } = { nearest: "NEAREST", linear: "LINEAR", }; \ No newline at end of file diff --git a/src/caches/getGLTexture.ts b/src/caches/getGLTexture.ts index 35d3b35..28fb147 100644 --- a/src/caches/getGLTexture.ts +++ b/src/caches/getGLTexture.ts @@ -1,6 +1,5 @@ -import { TextureSize, Texture, TextureDataSource, TextureImageSource } from "@feng3d/render-api"; +import { Texture, TextureDataSource, TextureImageSource, TextureSize } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; -import { IGLTexturePixelStore } from "../data/IGLTexturePixelStore"; import { getTextureCubeMapTarget } from "../utils/getTextureCubeMapTarget"; import { getIGLTextureFormats } from "./getIGLTextureFormats"; import { getIGLTextureTarget } from "./getIGLTextureTarget"; @@ -21,7 +20,7 @@ declare global } } -export const defaultTexturePixelStore: IGLTexturePixelStore = { +export const defaultTexturePixelStore: GLTexturePixelStore = { packAlignment: 4, unpackAlignment: 4, unpackFlipY: false, @@ -81,7 +80,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) const { image, imageOrigin, flipY, premultipliedAlpha } = imageSource; // - const pixelStore: IGLTexturePixelStore = {}; + const pixelStore: GLTexturePixelStore = {}; pixelStore.unpackSkipPixels = imageOrigin?.[0] || 0; pixelStore.unpackSkipRows = imageOrigin?.[1] || 0; pixelStore.unpackFlipY = flipY || false; @@ -119,7 +118,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) const offset = dataLayout?.offset || 0; // - const pixelStore: IGLTexturePixelStore = {}; + const pixelStore: GLTexturePixelStore = {}; pixelStore.unpackSkipPixels = dataImageOrigin?.[0] || 0; pixelStore.unpackSkipRows = dataImageOrigin?.[1] || 0; pixelStore.unpackSkipImages = dataImageOrigin?.[2] || 0; @@ -151,7 +150,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) const { image, imageOrigin, flipY, premultipliedAlpha } = imageSource; // - const pixelStore: IGLTexturePixelStore = {}; + const pixelStore: GLTexturePixelStore = {}; pixelStore.unpackSkipPixels = imageOrigin?.[0] || 0; pixelStore.unpackSkipRows = imageOrigin?.[1] || 0; pixelStore.unpackFlipY = flipY || false; @@ -178,7 +177,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) const offset = dataLayout?.offset || 0; // - const pixelStore: IGLTexturePixelStore = {}; + const pixelStore: GLTexturePixelStore = {}; pixelStore.unpackSkipPixels = dataImageOrigin?.[0] || 0; pixelStore.unpackSkipRows = dataImageOrigin?.[1] || 0; pixelStore.unpackSkipImages = dataImageOrigin?.[2] || 0; @@ -278,7 +277,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) const { image, imageOrigin, flipY, premultipliedAlpha } = imageSource; // - const pixelStore: IGLTexturePixelStore = {}; + const pixelStore: GLTexturePixelStore = {}; pixelStore.unpackSkipPixels = imageOrigin?.[0] || 0; pixelStore.unpackSkipRows = imageOrigin?.[1] || 0; pixelStore.unpackFlipY = flipY || false; @@ -337,7 +336,7 @@ return; const offset = dataLayout?.offset || 0; // - const pixelStore: IGLTexturePixelStore = {}; + const pixelStore: GLTexturePixelStore = {}; pixelStore.unpackSkipPixels = dataImageOrigin?.[0] || 0; pixelStore.unpackSkipRows = dataImageOrigin?.[1] || 0; pixelStore.unpackSkipImages = dataImageOrigin?.[2] || 0; @@ -437,7 +436,7 @@ export function deleteTexture(gl: WebGLRenderingContext, texture: Texture) * @param gl * @param pixelStore 像素解包打包时参数。 */ -function setTexturePixelStore(gl: WebGLRenderingContext, pixelStore: IGLTexturePixelStore) +function setTexturePixelStore(gl: WebGLRenderingContext, pixelStore: GLTexturePixelStore) { const { packAlignment, @@ -473,4 +472,152 @@ function setTexturePixelStore(gl: WebGLRenderingContext, pixelStore: IGLTextureP gl.pixelStorei(gl.UNPACK_SKIP_ROWS, unpackSkipRows); gl.pixelStorei(gl.UNPACK_SKIP_IMAGES, unpackSkipImages); } -} \ No newline at end of file +} + +/** + * 像素解包打包时参数。 + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/pixelStorei + */ +interface GLTexturePixelStore +{ + /** + * Packing of pixel data into memory + * + * gl.PACK_ALIGNMENT + * + * 默认值为 4 。 + */ + packAlignment?: 1 | 2 | 4 | 8; + + /** + * Unpacking of pixel data from memory. + * + * gl.UNPACK_ALIGNMENT + * + * 默认值为 4 。 + */ + unpackAlignment?: 1 | 2 | 4 | 8; + + /** + * 解包图像数据时进行Y轴反转。 + * + * Flips the source data along its vertical axis if true. + * + * gl.UNPACK_FLIP_Y_WEBGL + * + * 默认为 false。 + */ + unpackFlipY?: boolean; + + /** + * 将图像RGB颜色值得每一个分量乘以A。 + * + * Multiplies the alpha channel into the other color channels + * + * gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL + * + * 默认为 false。 + */ + unpackPremulAlpha?: boolean; + + /** + * Default color space conversion or no color space conversion. + * + * gl.UNPACK_COLORSPACE_CONVERSION_WEBGL + * + * 默认为 "BROWSER_DEFAULT_WEBGL" 。 + */ + unpackColorSpaceConversion?: "BROWSER_DEFAULT_WEBGL" | "NONE"; + + /** + * Number of pixels in a row. + * + * gl.PACK_ROW_LENGTH + * + * 默认值为 0 。 + * + * 仅 WebGL2。 + */ + packRowLength?: number; + + /** + * Number of pixel locations skipped before the first pixel is written into memory. + * + * gl.PACK_SKIP_PIXELS + * + * 默认值为 0 。 + * + * 仅 WebGL2。 + */ + packSkipPixels?: number; + + /** + * Number of rows of pixel locations skipped before the first pixel is written into memory + * + * gl.PACK_SKIP_ROWS + * + * 默认值为 0 。 + * + * 仅 WebGL2。 + */ + packSkipRows?: number; + + /** + * Number of pixels in a row. + * + * gl.UNPACK_ROW_LENGTH + * + * 默认值为 0 。 + * + * 仅 WebGL2。 + */ + unpackRowLength?: number; + + /** + * Image height used for reading pixel data from memory + * + * gl.UNPACK_IMAGE_HEIGHT + * + * 默认值为 0 。 + * + * 仅 WebGL2。 + */ + unpackImageHeight?: number; + + /** + * + * Number of pixel images skipped before the first pixel is read from memory + * + * gl.UNPACK_SKIP_PIXELS + * + * 默认值为 0 。 + * + * 仅 WebGL2。 + */ + unpackSkipPixels?: number; + + /** + * + * Number of rows of pixel locations skipped before the first pixel is read from memory + * + * gl.UNPACK_SKIP_ROWS + * + * 默认值为 0 。 + * + * 仅 WebGL2。 + */ + unpackSkipRows?: number; + + /** + * + * Number of pixel images skipped before the first pixel is read from memory + * + * gl.UNPACK_SKIP_IMAGES + * + * 默认值为 0 。 + * + * 仅 WebGL2。 + */ + unpackSkipImages?: number; +} diff --git a/src/caches/getGLTransformFeedback.ts b/src/caches/getGLTransformFeedback.ts index d18e3ad..8abbd8b 100644 --- a/src/caches/getGLTransformFeedback.ts +++ b/src/caches/getGLTransformFeedback.ts @@ -1,4 +1,4 @@ -import { IGLTransformFeedback } from "../data/IGLTransformFeedback"; +import { GLTransformFeedback } from "../data/GLTransformFeedback"; import { getIGLVertexBuffer } from "../runs/getIGLBuffer"; import { getGLBuffer } from "./getGLBuffer"; @@ -6,11 +6,11 @@ declare global { interface WebGLRenderingContext { - _transforms: Map; + _transforms: Map; } } -export function getGLTransformFeedback(gl: WebGLRenderingContext, transformFeedback: IGLTransformFeedback) +export function getGLTransformFeedback(gl: WebGLRenderingContext, transformFeedback: GLTransformFeedback) { let webGLTransformFeedback = gl._transforms.get(transformFeedback); if (webGLTransformFeedback) return webGLTransformFeedback; @@ -36,7 +36,7 @@ export function getGLTransformFeedback(gl: WebGLRenderingContext, transformFeedb return webGLTransformFeedback; } -export function deleteTransformFeedback(gl: WebGLRenderingContext, transformFeedback: IGLTransformFeedback) +export function deleteTransformFeedback(gl: WebGLRenderingContext, transformFeedback: GLTransformFeedback) { const webGLTransformFeedback = gl._transforms.get(transformFeedback); if (!webGLTransformFeedback) return; diff --git a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts b/src/caches/getIGLRenderPassDescriptorWithMultisample.ts index 16e6d00..9402e1b 100644 --- a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts +++ b/src/caches/getIGLRenderPassDescriptorWithMultisample.ts @@ -1,6 +1,6 @@ import { RenderPassColorAttachment, RenderPassDescriptor, TextureFormat, TextureView } from "@feng3d/render-api"; import { GLBlitFramebuffer } from "../data/GLBlitFramebuffer"; -import { GLRenderbufferInternalformat, IGLRenderbuffer } from "../data/IGLRenderbuffer"; +import { GLRenderbufferInternalformat, GLRenderbuffer } from "../data/GLRenderbuffer"; import { getIGLTextureFormats } from "./getIGLTextureFormats"; /** @@ -19,7 +19,7 @@ export function getIGLRenderPassDescriptorWithMultisample(sourcePassDescriptor: const textureSize = texture.size; - const renderbuffers: IGLRenderbuffer[] = []; + const renderbuffers: GLRenderbuffer[] = []; // 创建支持 多重采样的 渲染通道 const passDescriptor: RenderPassDescriptor = { @@ -27,7 +27,7 @@ export function getIGLRenderPassDescriptorWithMultisample(sourcePassDescriptor: { const texture = v.view.texture; - const renderbuffer: IGLRenderbuffer = { + const renderbuffer: GLRenderbuffer = { internalformat: getGLRenderbufferInternalformat(texture.format), width: textureSize[0], height: textureSize[1], @@ -85,5 +85,5 @@ export interface IGLRenderPassDescriptorWithMultisample /** * 需要销毁的临时渲染缓冲区。 */ - renderbuffers: IGLRenderbuffer[]; + renderbuffers: GLRenderbuffer[]; } \ No newline at end of file diff --git a/src/caches/getIGLTextureFormats.ts b/src/caches/getIGLTextureFormats.ts index c4a1c2b..f71d929 100644 --- a/src/caches/getIGLTextureFormats.ts +++ b/src/caches/getIGLTextureFormats.ts @@ -1,5 +1,4 @@ import { TextureFormat } from "@feng3d/render-api"; -import { IGLTextureFormats } from "../data/IGLTextureFormats"; export function getIGLTextureFormats(format: TextureFormat = "rgba8unorm") { @@ -10,6 +9,30 @@ export function getIGLTextureFormats(format: TextureFormat = "rgba8unorm") return glTextureFormat; } +export interface IGLTextureFormats +{ + /** + * 内部纹理格式。 + * + * 默认 "RGBA"。 + */ + readonly internalformat?: GLTextureInternalFormat, + + /** + * 纹理格式。 + * + * 默认 "RGBA"。 + */ + readonly format?: GLTextureFormat; + + /** + * 数据类型。 + * + * 默认 "UNSIGNED_BYTE"。 + */ + readonly type?: GLTextureDataType; +} + const formatMap: { [key: string]: IGLTextureFormats } = { r8unorm: { internalformat: "R8", format: "RED", type: "UNSIGNED_BYTE" }, r8snorm: undefined, @@ -106,4 +129,47 @@ const formatMap: { [key: string]: IGLTextureFormats } = { "astc-12x10-unorm-srgb": undefined, "astc-12x12-unorm": undefined, "astc-12x12-unorm-srgb": undefined, -}; \ No newline at end of file +}; + +/** + * internalformat format type + * + * @see https://registry.khronos.org/webgl/specs/latest/2.0/#TEXTURE_TYPES_FORMATS_FROM_DOM_ELEMENTS_TABLE + */ +type IGLTextureTypes = + | { internalformat: "RGB", format: "RGB", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_5_6_5" } + | { internalformat: "RGBA", format: "RGBA", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_4_4_4_4" | "UNSIGNED_SHORT_5_5_5_1" } + | { internalformat: "LUMINANCE_ALPHA", format: "LUMINANCE_ALPHA", type: "UNSIGNED_BYTE" } + | { internalformat: "LUMINANCE", format: "LUMINANCE", type: "UNSIGNED_BYTE" } + | { internalformat: "ALPHA", format: "ALPHA", type: "UNSIGNED_BYTE" } + | { internalformat: "R8", format: "RED", type: "UNSIGNED_BYTE" } + | { internalformat: "R16F", format: "RED", type: "HALF_FLOAT" | " FLOAT" } + | { internalformat: "R32F", format: "RED", type: "FLOAT" } + | { internalformat: "R8UI", format: "RED_INTEGER", type: "UNSIGNED_BYTE" } + | { internalformat: "RG8", format: "RG", type: "UNSIGNED_BYTE" } + | { internalformat: "RG16F", format: "RG", type: "HALF_FLOAT" | "FLOAT" } + | { internalformat: "RG32F", format: "RG", type: "FLOAT" } + | { internalformat: "RG8UI", format: "RG_INTEGER", type: "UNSIGNED_BYTE" } + | { internalformat: "RGB8", format: "RGB", type: "UNSIGNED_BYTE" } + | { internalformat: "SRGB8", format: "RGB", type: "UNSIGNED_BYTE" } + | { internalformat: "RGB565", format: "RGB", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_5_6_5" } + | { internalformat: "R11F_G11F_B10F", format: "RGB", type: "UNSIGNED_INT_10F_11F_11F_REV" | "HALF_FLOAT" | "FLOAT" } + | { internalformat: "RGB9_E5", format: "RGB", type: "HALF_FLOAT" | "FLOAT" } + | { internalformat: "RGB16F", format: "RGB", type: "HALF_FLOAT" | "FLOAT" } + | { internalformat: "RGB32F", format: "RGB", type: "FLOAT" } + | { internalformat: "RGB8UI", format: "RGB_INTEGER", type: "UNSIGNED_BYTE" } + | { internalformat: "RGBA8", format: "RGBA", type: "UNSIGNED_BYTE" } + | { internalformat: "SRGB8_ALPHA8", format: "RGBA", type: "UNSIGNED_BYTE" } + | { internalformat: "RGB5_A1", format: "RGBA", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_5_5_5_1" } + | { internalformat: "RGB10_A2", format: "RGBA", type: "UNSIGNED_INT_2_10_10_10_REV" } + | { internalformat: "RGBA4", format: "RGBA", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_4_4_4_4" } + | { internalformat: "RGBA16F", format: "RGBA", type: "HALF_FLOAT" | "FLOAT" } + | { internalformat: "RGBA32F", format: "RGBA", type: "FLOAT" } + | { internalformat: "RGBA8UI", format: "RGBA_INTEGER", type: "UNSIGNED_BYTE" } + // 深度纹理 + | { internalformat: "DEPTH_COMPONENT16", format: "DEPTH_COMPONENT", type: "UNSIGNED_SHORT", } + ; + +export type GLTextureInternalFormat = IGLTextureTypes["internalformat"]; +export type GLTextureFormat = IGLTextureTypes["format"]; +export type GLTextureDataType = IGLTextureTypes["type"]; diff --git a/src/caches/getIGLTextureTarget.ts b/src/caches/getIGLTextureTarget.ts index 29937d0..42becde 100644 --- a/src/caches/getIGLTextureTarget.ts +++ b/src/caches/getIGLTextureTarget.ts @@ -1,15 +1,31 @@ import { TextureDimension } from "@feng3d/render-api"; -import { IGLTextureTarget } from "../data/IGLTexture"; + +/** + * 纹理绑定点。 + * + * * gl.TEXTURE_2D: A two-dimensional texture. + * * gl.TEXTURE_CUBE_MAP: A cube-mapped texture. + * + * When using a WebGL 2 context, the following values are available additionally: + * + * * gl.TEXTURE_3D: A three-dimensional texture. + * * gl.TEXTURE_2D_ARRAY: A two-dimensional array texture. + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bindTexture + */ +export type GLTextureTarget = "TEXTURE_2D" | "TEXTURE_CUBE_MAP" | "TEXTURE_3D" | "TEXTURE_2D_ARRAY"; + export function getIGLTextureTarget(dimension: TextureDimension = "2d") { - const target: IGLTextureTarget = dimensionMap[dimension]; + const target: GLTextureTarget = dimensionMap[dimension]; console.assert(!!target, `WebGL 不支持纹理维度 ${dimension} , 该维度只在WebGPU中支持！`); return target; } -const dimensionMap: { [key: string]: IGLTextureTarget } = { + +const dimensionMap: { [key: string]: GLTextureTarget } = { "1d": undefined, "2d": "TEXTURE_2D", "2d-array": "TEXTURE_2D_ARRAY", diff --git a/src/data/IGLRenderbuffer.ts b/src/data/GLRenderbuffer.ts similarity index 98% rename from src/data/IGLRenderbuffer.ts rename to src/data/GLRenderbuffer.ts index ddc6f19..0d4c05c 100644 --- a/src/data/IGLRenderbuffer.ts +++ b/src/data/GLRenderbuffer.ts @@ -4,7 +4,7 @@ * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/renderbufferStorage * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/renderbufferStorageMultisample */ -export interface IGLRenderbuffer +export interface GLRenderbuffer { /** * 渲染缓冲区内部格式。 diff --git a/src/data/IGLSamplerTexture.ts b/src/data/GLSamplerTexture.ts similarity index 86% rename from src/data/IGLSamplerTexture.ts rename to src/data/GLSamplerTexture.ts index 6152592..079fd94 100644 --- a/src/data/IGLSamplerTexture.ts +++ b/src/data/GLSamplerTexture.ts @@ -5,7 +5,7 @@ import { Sampler, Texture } from "@feng3d/render-api"; * * 采样器与纹理。 */ -export interface IGLSamplerTexture +export interface GLSamplerTexture { /** * 纹理。 diff --git a/src/data/IGLTransformFeedback.ts b/src/data/GLTransformFeedback.ts similarity index 66% rename from src/data/IGLTransformFeedback.ts rename to src/data/GLTransformFeedback.ts index 8ad7504..72e70ea 100644 --- a/src/data/IGLTransformFeedback.ts +++ b/src/data/GLTransformFeedback.ts @@ -3,15 +3,15 @@ import { IVertexDataTypes } from "@feng3d/render-api"; /** * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/createTransformFeedback */ -export interface IGLTransformFeedback +export interface GLTransformFeedback { /** * 绑定缓冲区列表。 */ - bindBuffers: IGLTransformFeedbacBindBuffer[]; + bindBuffers: GLTransformFeedbacBindBuffer[]; } -export interface IGLTransformFeedbacBindBuffer +export interface GLTransformFeedbacBindBuffer { index: number; diff --git a/src/data/IGLTransformFeedbackPass.ts b/src/data/GLTransformFeedbackPass.ts similarity index 69% rename from src/data/IGLTransformFeedbackPass.ts rename to src/data/GLTransformFeedbackPass.ts index 80cc94b..20750f5 100644 --- a/src/data/IGLTransformFeedbackPass.ts +++ b/src/data/GLTransformFeedbackPass.ts @@ -1,15 +1,15 @@ import { DrawVertex, Uniforms, VertexAttributes, VertexState } from "@feng3d/render-api"; -import { IGLTransformFeedback } from "./IGLTransformFeedback"; +import { GLTransformFeedback } from "./GLTransformFeedback"; declare module "@feng3d/render-api" { - export interface IPassEncoderMap + export interface PassEncoderMap { - IGLTransformFeedbackPass: IGLTransformFeedbackPass, + GLTransformFeedbackPass: GLTransformFeedbackPass, } } -export interface IGLTransformFeedbackPass +export interface GLTransformFeedbackPass { /** * 数据类型。 @@ -19,15 +19,15 @@ export interface IGLTransformFeedbackPass /** * 变换反馈对象列表。 */ - transformFeedbackObjects: IGLTransformFeedbackObject[]; + transformFeedbackObjects: GLTransformFeedbackObject[]; } -export interface IGLTransformFeedbackObject +export interface GLTransformFeedbackObject { /** * 渲染管线描述。 */ - readonly pipeline: IGLTransformFeedbackPipeline; + readonly pipeline: GLTransformFeedbackPipeline; /** * 顶点属性数据映射。 @@ -51,10 +51,10 @@ export interface IGLTransformFeedbackObject * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/bindTransformFeedback */ - transformFeedback: IGLTransformFeedback; + transformFeedback: GLTransformFeedback; } -export interface IGLTransformFeedbackPipeline +export interface GLTransformFeedbackPipeline { /** * 顶点着色器阶段描述。 @@ -66,10 +66,10 @@ export interface IGLTransformFeedbackPipeline * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/transformFeedbackVaryings */ - transformFeedbackVaryings: IGLTransformFeedbackVaryings; + transformFeedbackVaryings: GLTransformFeedbackVaryings; } -export interface IGLTransformFeedbackVaryings +export interface GLTransformFeedbackVaryings { /** * 回写变量列表。 diff --git a/src/data/IGLUniformBuffer.ts b/src/data/GLUniformBuffer.ts similarity index 70% rename from src/data/IGLUniformBuffer.ts rename to src/data/GLUniformBuffer.ts index 522d3c8..91f1687 100644 --- a/src/data/IGLUniformBuffer.ts +++ b/src/data/GLUniformBuffer.ts @@ -3,7 +3,7 @@ import { Buffer } from "@feng3d/render-api"; /** * WebGL 统一缓冲区。 */ -export interface IGLUniformBuffer extends Buffer +export interface GLUniformBuffer extends Buffer { target: "UNIFORM_BUFFER"; } diff --git a/src/data/IGLSampler.ts b/src/data/IGLSampler.ts deleted file mode 100644 index 844657a..0000000 --- a/src/data/IGLSampler.ts +++ /dev/null @@ -1,39 +0,0 @@ -export type GLSamplerCompareMode = "NONE" | "COMPARE_REF_TO_TEXTURE"; - -/** - * 纹理放大滤波器 - * Texture magnification filter - * - * * `LINEAR` - * * `NEAREST` - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texParameter - */ -export type IGLTextureMagFilter = "LINEAR" | "NEAREST"; - -/** - * 纹理缩小过滤器 - * Texture minification filter - * - * * `LINEAR` - * * `NEAREST` - * * `NEAREST_MIPMAP_NEAREST` - * * `LINEAR_MIPMAP_NEAREST` - * * `NEAREST_MIPMAP_LINEAR` - * * `LINEAR_MIPMAP_LINEAR` - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texParameter - */ -export type IGLTextureMinFilter = "LINEAR" | "NEAREST" | "NEAREST_MIPMAP_NEAREST" | "LINEAR_MIPMAP_NEAREST" | "NEAREST_MIPMAP_LINEAR" | "LINEAR_MIPMAP_LINEAR"; - -/** - * 纹理坐标s包装函数枚举 - * Wrapping function for texture coordinate s - * - * * `REPEAT` - * * `CLAMP_TO_EDGE` - * * `MIRRORED_REPEAT` - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texParameter - */ -export type IGLTextureWrap = "REPEAT" | "CLAMP_TO_EDGE" | "MIRRORED_REPEAT"; \ No newline at end of file diff --git a/src/data/IGLTexture.ts b/src/data/IGLTexture.ts deleted file mode 100644 index 6e162e9..0000000 --- a/src/data/IGLTexture.ts +++ /dev/null @@ -1,65 +0,0 @@ -import { Texture } from "@feng3d/render-api"; -import { GLCanvasTexture } from "./GLCanvasTexture"; - -/** - * 类似纹理，包含画布纹理以及正常纹理。 - */ -export type IGLTextureLike = GLCanvasTexture | Texture; - -/** - * 纹理绑定点。 - * - * * gl.TEXTURE_2D: A two-dimensional texture. - * * gl.TEXTURE_CUBE_MAP: A cube-mapped texture. - * - * When using a WebGL 2 context, the following values are available additionally: - * - * * gl.TEXTURE_3D: A three-dimensional texture. - * * gl.TEXTURE_2D_ARRAY: A two-dimensional array texture. - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bindTexture - */ -export type IGLTextureTarget = "TEXTURE_2D" | "TEXTURE_CUBE_MAP" | "TEXTURE_3D" | "TEXTURE_2D_ARRAY"; - -/** - * internalformat format type - * - * @see https://registry.khronos.org/webgl/specs/latest/2.0/#TEXTURE_TYPES_FORMATS_FROM_DOM_ELEMENTS_TABLE - */ -export type IGLTextureTypes = - | { internalformat: "RGB", format: "RGB", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_5_6_5" } - | { internalformat: "RGBA", format: "RGBA", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_4_4_4_4" | "UNSIGNED_SHORT_5_5_5_1" } - | { internalformat: "LUMINANCE_ALPHA", format: "LUMINANCE_ALPHA", type: "UNSIGNED_BYTE" } - | { internalformat: "LUMINANCE", format: "LUMINANCE", type: "UNSIGNED_BYTE" } - | { internalformat: "ALPHA", format: "ALPHA", type: "UNSIGNED_BYTE" } - | { internalformat: "R8", format: "RED", type: "UNSIGNED_BYTE" } - | { internalformat: "R16F", format: "RED", type: "HALF_FLOAT" | " FLOAT" } - | { internalformat: "R32F", format: "RED", type: "FLOAT" } - | { internalformat: "R8UI", format: "RED_INTEGER", type: "UNSIGNED_BYTE" } - | { internalformat: "RG8", format: "RG", type: "UNSIGNED_BYTE" } - | { internalformat: "RG16F", format: "RG", type: "HALF_FLOAT" | "FLOAT" } - | { internalformat: "RG32F", format: "RG", type: "FLOAT" } - | { internalformat: "RG8UI", format: "RG_INTEGER", type: "UNSIGNED_BYTE" } - | { internalformat: "RGB8", format: "RGB", type: "UNSIGNED_BYTE" } - | { internalformat: "SRGB8", format: "RGB", type: "UNSIGNED_BYTE" } - | { internalformat: "RGB565", format: "RGB", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_5_6_5" } - | { internalformat: "R11F_G11F_B10F", format: "RGB", type: "UNSIGNED_INT_10F_11F_11F_REV" | "HALF_FLOAT" | "FLOAT" } - | { internalformat: "RGB9_E5", format: "RGB", type: "HALF_FLOAT" | "FLOAT" } - | { internalformat: "RGB16F", format: "RGB", type: "HALF_FLOAT" | "FLOAT" } - | { internalformat: "RGB32F", format: "RGB", type: "FLOAT" } - | { internalformat: "RGB8UI", format: "RGB_INTEGER", type: "UNSIGNED_BYTE" } - | { internalformat: "RGBA8", format: "RGBA", type: "UNSIGNED_BYTE" } - | { internalformat: "SRGB8_ALPHA8", format: "RGBA", type: "UNSIGNED_BYTE" } - | { internalformat: "RGB5_A1", format: "RGBA", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_5_5_5_1" } - | { internalformat: "RGB10_A2", format: "RGBA", type: "UNSIGNED_INT_2_10_10_10_REV" } - | { internalformat: "RGBA4", format: "RGBA", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_4_4_4_4" } - | { internalformat: "RGBA16F", format: "RGBA", type: "HALF_FLOAT" | "FLOAT" } - | { internalformat: "RGBA32F", format: "RGBA", type: "FLOAT" } - | { internalformat: "RGBA8UI", format: "RGBA_INTEGER", type: "UNSIGNED_BYTE" } - // 深度纹理 - | { internalformat: "DEPTH_COMPONENT16", format: "DEPTH_COMPONENT", type: "UNSIGNED_SHORT", } - ; - -export type IGLTextureInternalFormat = IGLTextureTypes["internalformat"]; -export type IGLTextureFormat = IGLTextureTypes["format"]; -export type IGLTextureDataType = IGLTextureTypes["type"]; diff --git a/src/data/IGLTextureFormats.ts b/src/data/IGLTextureFormats.ts deleted file mode 100644 index 5c2dc14..0000000 --- a/src/data/IGLTextureFormats.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { IGLTextureDataType, IGLTextureFormat, IGLTextureInternalFormat } from "./IGLTexture"; - -export interface IGLTextureFormats -{ - /** - * 内部纹理格式。 - * - * 默认 "RGBA"。 - */ - readonly internalformat?: IGLTextureInternalFormat, - - /** - * 纹理格式。 - * - * 默认 "RGBA"。 - */ - readonly format?: IGLTextureFormat; - - /** - * 数据类型。 - * - * 默认 "UNSIGNED_BYTE"。 - */ - readonly type?: IGLTextureDataType; -} \ No newline at end of file diff --git a/src/data/IGLTexturePixelStore.ts b/src/data/IGLTexturePixelStore.ts deleted file mode 100644 index 381a7bb..0000000 --- a/src/data/IGLTexturePixelStore.ts +++ /dev/null @@ -1,249 +0,0 @@ -/** - * 像素解包打包时参数。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/pixelStorei - */ -export interface IGLTexturePixelStore1 -{ - /** - * Packing of pixel data into memory - * - * gl.PACK_ALIGNMENT - * - * 默认值为 4 。 - */ - packAlignment?: 1 | 2 | 4 | 8; - - /** - * Unpacking of pixel data from memory. - * - * gl.UNPACK_ALIGNMENT - * - * 默认值为 4 。 - */ - unpackAlignment?: 1 | 2 | 4 | 8; - - /** - * Default color space conversion or no color space conversion. - * - * gl.UNPACK_COLORSPACE_CONVERSION_WEBGL - * - * 默认为 "BROWSER_DEFAULT_WEBGL" 。 - */ - unpackColorSpaceConversion?: "BROWSER_DEFAULT_WEBGL" | "NONE"; - - /** - * Number of pixels in a row. - * - * gl.PACK_ROW_LENGTH - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - packRowLength?: number; - - /** - * Number of pixel locations skipped before the first pixel is written into memory. - * - * gl.PACK_SKIP_PIXELS - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - packSkipPixels?: number; - - /** - * Number of rows of pixel locations skipped before the first pixel is written into memory - * - * gl.PACK_SKIP_ROWS - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - packSkipRows?: number; - - /** - * Number of pixels in a row. - * - * gl.UNPACK_ROW_LENGTH - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - unpackRowLength?: number; - - /** - * Image height used for reading pixel data from memory - * - * gl.UNPACK_IMAGE_HEIGHT - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - unpackImageHeight?: number; - - /** - * - * Number of pixel images skipped before the first pixel is read from memory - * - * gl.UNPACK_SKIP_IMAGES - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - unpackSkipImages?: number; -} - -/** - * 像素解包打包时参数。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/pixelStorei - */ -export interface IGLTexturePixelStore -{ - /** - * Packing of pixel data into memory - * - * gl.PACK_ALIGNMENT - * - * 默认值为 4 。 - */ - packAlignment?: 1 | 2 | 4 | 8; - - /** - * Unpacking of pixel data from memory. - * - * gl.UNPACK_ALIGNMENT - * - * 默认值为 4 。 - */ - unpackAlignment?: 1 | 2 | 4 | 8; - - /** - * 解包图像数据时进行Y轴反转。 - * - * Flips the source data along its vertical axis if true. - * - * gl.UNPACK_FLIP_Y_WEBGL - * - * 默认为 false。 - */ - unpackFlipY?: boolean; - - /** - * 将图像RGB颜色值得每一个分量乘以A。 - * - * Multiplies the alpha channel into the other color channels - * - * gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL - * - * 默认为 false。 - */ - unpackPremulAlpha?: boolean; - - /** - * Default color space conversion or no color space conversion. - * - * gl.UNPACK_COLORSPACE_CONVERSION_WEBGL - * - * 默认为 "BROWSER_DEFAULT_WEBGL" 。 - */ - unpackColorSpaceConversion?: "BROWSER_DEFAULT_WEBGL" | "NONE"; - - /** - * Number of pixels in a row. - * - * gl.PACK_ROW_LENGTH - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - packRowLength?: number; - - /** - * Number of pixel locations skipped before the first pixel is written into memory. - * - * gl.PACK_SKIP_PIXELS - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - packSkipPixels?: number; - - /** - * Number of rows of pixel locations skipped before the first pixel is written into memory - * - * gl.PACK_SKIP_ROWS - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - packSkipRows?: number; - - /** - * Number of pixels in a row. - * - * gl.UNPACK_ROW_LENGTH - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - unpackRowLength?: number; - - /** - * Image height used for reading pixel data from memory - * - * gl.UNPACK_IMAGE_HEIGHT - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - unpackImageHeight?: number; - - /** - * - * Number of pixel images skipped before the first pixel is read from memory - * - * gl.UNPACK_SKIP_PIXELS - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - unpackSkipPixels?: number; - - /** - * - * Number of rows of pixel locations skipped before the first pixel is read from memory - * - * gl.UNPACK_SKIP_ROWS - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - unpackSkipRows?: number; - - /** - * - * Number of pixel images skipped before the first pixel is read from memory - * - * gl.UNPACK_SKIP_IMAGES - * - * 默认值为 0 。 - * - * 仅 WebGL2。 - */ - unpackSkipImages?: number; -} diff --git a/src/data/IGLUniformInfo.ts b/src/data/IGLUniformInfo.ts deleted file mode 100644 index 45c6883..0000000 --- a/src/data/IGLUniformInfo.ts +++ /dev/null @@ -1,50 +0,0 @@ -import { IGLUniformType } from "../const/IGLUniformType"; - -/** - * WebGL统一变量 - */ -export interface IGLUniformInfo -{ - /** - * 名称。 - */ - name: string; - - type: IGLUniformType; - - /** - * 是否纹理。 - */ - isTexture: boolean; - - /** - * 子项信息列表。 - */ - items: IUniformItemInfo[] - - /** - * 是否在Block中。 - */ - inBlock?: boolean; -} - -/** - * WebGL统一变量 - */ -export interface IUniformItemInfo -{ - /** - * uniform地址 - */ - location: WebGLUniformLocation; - - /** - * texture索引 - */ - textureID: number; - - /** - * Uniform数组索引，当Uniform数据为数组数据时生效 - */ - paths: string[]; -} \ No newline at end of file diff --git a/src/data/IGLUniforms.ts b/src/data/IGLUniforms.ts deleted file mode 100644 index a1bf151..0000000 --- a/src/data/IGLUniforms.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { IUniformDataItem } from "@feng3d/render-api"; -import { IGLSamplerTexture } from "./IGLSamplerTexture"; - -declare module "@feng3d/render-api" -{ - export interface IUniformTypeMap - { - IGLSamplerTexture: IGLSamplerTexture; - IUniformDataItem: IUniformDataItem; - } -} diff --git a/src/data/Buffer.ts b/src/data/polyfills/Buffer.ts similarity index 100% rename from src/data/Buffer.ts rename to src/data/polyfills/Buffer.ts diff --git a/src/data/GLCommandEncoder.ts b/src/data/polyfills/CommandEncoder.ts similarity index 84% rename from src/data/GLCommandEncoder.ts rename to src/data/polyfills/CommandEncoder.ts index ed5ff35..d5ab8b5 100644 --- a/src/data/GLCommandEncoder.ts +++ b/src/data/polyfills/CommandEncoder.ts @@ -1,9 +1,9 @@ import { TextureLike } from "@feng3d/render-api"; -import { GLBlitFramebuffer } from "./GLBlitFramebuffer"; +import { GLBlitFramebuffer } from "../GLBlitFramebuffer"; declare module "@feng3d/render-api" { - export interface IPassEncoderMap + export interface PassEncoderMap { GLBlitFramebuffer: GLBlitFramebuffer; } diff --git a/src/data/OcclusionQuery.ts b/src/data/polyfills/OcclusionQuery.ts similarity index 78% rename from src/data/OcclusionQuery.ts rename to src/data/polyfills/OcclusionQuery.ts index 435e3d6..4e21592 100644 --- a/src/data/OcclusionQuery.ts +++ b/src/data/polyfills/OcclusionQuery.ts @@ -1,5 +1,5 @@ import { } from "@feng3d/render-api"; -import { GLOcclusionQueryStep } from "../caches/getGLRenderOcclusionQuery"; +import { GLOcclusionQueryStep } from "../../caches/getGLRenderOcclusionQuery"; declare module "@feng3d/render-api" { diff --git a/src/data/GLPrimitiveState.ts b/src/data/polyfills/PrimitiveState.ts similarity index 100% rename from src/data/GLPrimitiveState.ts rename to src/data/polyfills/PrimitiveState.ts diff --git a/src/data/IGLRenderPass.ts b/src/data/polyfills/RenderPass.ts similarity index 93% rename from src/data/IGLRenderPass.ts rename to src/data/polyfills/RenderPass.ts index 5c672a1..6f3fd18 100644 --- a/src/data/IGLRenderPass.ts +++ b/src/data/polyfills/RenderPass.ts @@ -17,7 +17,7 @@ declare module "@feng3d/render-api" occlusionQueryResults?: OcclusionQuery[]; } - export interface IRenderPassObjectMap + export interface RenderPassObjectMap { OcclusionQuery: OcclusionQuery } diff --git a/src/data/polyfills/Uniforms.ts b/src/data/polyfills/Uniforms.ts new file mode 100644 index 0000000..cd320f8 --- /dev/null +++ b/src/data/polyfills/Uniforms.ts @@ -0,0 +1,11 @@ +import { UniformDataItem } from "@feng3d/render-api"; +import { GLSamplerTexture } from "../GLSamplerTexture"; + +declare module "@feng3d/render-api" +{ + export interface UniformTypeMap + { + GLSamplerTexture: GLSamplerTexture; + UniformDataItem: UniformDataItem; + } +} diff --git a/src/gl/WebGLEnums.ts b/src/gl/WebGLEnums.ts index 52d9450..159e736 100644 --- a/src/gl/WebGLEnums.ts +++ b/src/gl/WebGLEnums.ts @@ -1,4 +1,4 @@ -import { IGLTextureMagFilter, IGLTextureMinFilter, IGLTextureWrap } from "../data/IGLSampler"; +import { GLTextureWrap } from "../caches/getGLSampler"; /** * A GLenum specifying which WebGL capability to enable. Possible values: @@ -85,34 +85,6 @@ export type ReadPixelsType = | "UNSIGNED_INT_5_9_9_9_REV" ; -/** - * The pname parameter is a GLenum specifying the texture parameter to set. - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texParameter - */ -export interface TexParameteri extends TexParameteri_WebGL2 -{ - /** - * Texture magnification filter - */ - TEXTURE_MAG_FILTER: IGLTextureMagFilter; - - /** - * Texture minification filter - */ - TEXTURE_MIN_FILTER: IGLTextureMinFilter; - - /** - * Wrapping function for texture coordinate s - */ - TEXTURE_WRAP_S: IGLTextureWrap; - - /** - * Wrapping function for texture coordinate t - */ - TEXTURE_WRAP_T: IGLTextureWrap; -} - /** * The pname parameter is a GLenum specifying the texture parameter to set. * @@ -163,7 +135,7 @@ export interface TexParameteri_WebGL2 /** * Wrapping function for texture coordinate r */ - TEXTURE_WRAP_R: IGLTextureWrap; + TEXTURE_WRAP_R: GLTextureWrap; } /** diff --git a/src/index.ts b/src/index.ts index f8e3277..d2c0624 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,21 +1,19 @@ export * from "./data/GLBlitFramebuffer"; export * from "./data/GLCanvasContext"; +export * from "./data/GLCapabilities"; export * from "./data/GLIndexBuffer"; +export * from "./data/GLRenderbuffer"; +export * from "./data/GLSamplerTexture"; +export * from "./data/GLTransformFeedback"; +export * from "./data/GLTransformFeedbackPass"; +export * from "./data/GLUniformBuffer"; export * from "./data/GLVertexBuffer"; -export * from "./data/Buffer"; -export * from "./data/GLCapabilities"; -export * from "./data/GLCommandEncoder"; -export * from "./data/GLPrimitiveState"; -export * from "./data/IGLRenderbuffer"; -export * from "./data/IGLRenderPass"; -export * from "./data/IGLSampler"; -export * from "./data/IGLSamplerTexture"; -export * from "./data/IGLTexture"; -export * from "./data/IGLTexturePixelStore"; -export * from "./data/IGLTransformFeedback"; -export * from "./data/IGLTransformFeedbackPass"; -export * from "./data/IGLUniformBuffer"; -export * from "./data/IGLUniforms"; + +export * from "./data/polyfills/Buffer"; +export * from "./data/polyfills/CommandEncoder"; +export * from "./data/polyfills/PrimitiveState"; +export * from "./data/polyfills/RenderPass"; +export * from "./data/polyfills/Uniforms"; export * from "./runs/getIGLBuffer"; export * from "./runs/runColorTargetStates"; diff --git a/src/runs/getIGLBuffer.ts b/src/runs/getIGLBuffer.ts index a0a09a6..299fe4c 100644 --- a/src/runs/getIGLBuffer.ts +++ b/src/runs/getIGLBuffer.ts @@ -1,8 +1,8 @@ import { Buffer, IIndicesDataTypes, IVertexDataTypes, TypedArray } from "@feng3d/render-api"; import { GLIndexBuffer } from "../data/GLIndexBuffer"; -import { IGLBufferTarget, IGLBufferUsage } from "../data/Buffer"; +import { GLUniformBuffer } from "../data/GLUniformBuffer"; import { GLVertexBuffer } from "../data/GLVertexBuffer"; -import { IGLUniformBuffer } from "../data/IGLUniformBuffer"; +import { IGLBufferTarget, IGLBufferUsage } from "../data/polyfills/Buffer"; export function getIGLBuffer(data: TypedArray, target?: IGLBufferTarget, usage: IGLBufferUsage = "STATIC_DRAW"): Buffer { @@ -21,7 +21,7 @@ export function getIGLBuffer(data: TypedArray, target?: IGLBufferTarget, usage: export function getIGLUniformBuffer(data: TypedArray, usage?: "DYNAMIC_DRAW") { - const vertexBuffer: IGLUniformBuffer = data[_IGLBuffer] = data[_IGLBuffer] || getIGLBuffer(data, "UNIFORM_BUFFER", usage); + const vertexBuffer: GLUniformBuffer = data[_IGLBuffer] = data[_IGLBuffer] || getIGLBuffer(data, "UNIFORM_BUFFER", usage); vertexBuffer.target = vertexBuffer.target || "UNIFORM_BUFFER"; return vertexBuffer; -- Gitee From 6f4103b6d3f9f0a0db1feb2d1c9774b3fa0c2ebb Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 18:55:47 +0800 Subject: [PATCH 41/57] =?UTF-8?q?refactor(webgl):=20=E9=87=8D=E6=9E=84=20W?= =?UTF-8?q?ebGL=20=E6=B8=B2=E6=9F=93=E7=AE=A1=E7=BA=BF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 更新了多个文件的导入路径和类型定义 - 重命名了一些函数和类型，如 getIGLTextureTarget 改为 getGLTextureTarget - 删除了一些未使用的类型和接口定义 - 统一了部分代码格式和命名规范 --- examples/src/WebGL2Samples/fbo_blit.ts | 4 +- src/RunWebGL.ts | 24 ++-- ...Framebuffer.ts => getGLBlitFramebuffer.ts} | 20 ++-- .../{getIGLDrawMode.ts => getGLDrawMode.ts} | 6 +- src/caches/getGLFramebuffer.ts | 10 +- src/caches/getGLProgram.ts | 24 +++- ...tGLRenderPassDescriptorWithMultisample.ts} | 12 +- src/caches/getGLTexture.ts | 12 +- ...xtureFormats.ts => getGLTextureFormats.ts} | 16 +-- ...TextureTarget.ts => getGLTextureTarget.ts} | 2 +- src/caches/getIGLAttributeType.ts | 18 --- src/data/GLBlitFramebuffer.ts | 4 +- src/gl/WebGLEnums.ts | 103 ------------------ src/index.ts | 2 - src/utils/readPixels.ts | 24 +++- 15 files changed, 97 insertions(+), 184 deletions(-) rename src/caches/{getIGLBlitFramebuffer.ts => getGLBlitFramebuffer.ts} (75%) rename src/caches/{getIGLDrawMode.ts => getGLDrawMode.ts} (84%) rename src/caches/{getIGLRenderPassDescriptorWithMultisample.ts => getGLRenderPassDescriptorWithMultisample.ts} (87%) rename src/caches/{getIGLTextureFormats.ts => getGLTextureFormats.ts} (93%) rename src/caches/{getIGLTextureTarget.ts => getGLTextureTarget.ts} (93%) delete mode 100644 src/caches/getIGLAttributeType.ts diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 3f20bc1..b4edd7f 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -1,5 +1,5 @@ import { RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, TextureView, VertexAttributes } from "@feng3d/render-api"; -import { GLBlitFramebuffer, GLCanvasContext, IGLBlitFramebufferItem, WebGL } from "@feng3d/webgl"; +import { GLBlitFramebuffer, GLCanvasContext, GLBlitFramebufferItem, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; const canvas = document.createElement("canvas"); @@ -120,7 +120,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => descriptor: framebufferResolve, }; - const blitFramebuffers: IGLBlitFramebufferItem[] = []; + const blitFramebuffers: GLBlitFramebufferItem[] = []; const TILE = 4; const BORDER = 2; for (let j = 0; j < TILE; j++) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index bd26d73..eb14a15 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,15 +1,15 @@ import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, CullFace, DepthStencilState, DrawIndexed, DrawVertex, FrontFace, IIndicesDataTypes, IRenderPassObject, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { getGLBlitFramebuffer } from "./caches/getGLBlitFramebuffer"; import { getGLBuffer } from "./caches/getGLBuffer"; +import { getGLDrawMode, GLDrawMode } from "./caches/getGLDrawMode"; import { getGLFramebuffer } from "./caches/getGLFramebuffer"; import { getGLProgram, UniformItemInfo } from "./caches/getGLProgram"; import { getGLRenderOcclusionQuery } from "./caches/getGLRenderOcclusionQuery"; +import { getGLRenderPassDescriptorWithMultisample } from "./caches/getGLRenderPassDescriptorWithMultisample"; import { getGLSampler, getIGLTextureMagFilter, getIGLTextureMinFilter, getIGLTextureWrap, GLTextureMagFilter, GLTextureMinFilter, GLTextureWrap } from "./caches/getGLSampler"; +import { getGLTextureTarget, GLTextureTarget } from "./caches/getGLTextureTarget"; import { getGLTransformFeedback } from "./caches/getGLTransformFeedback"; -import { getIGLBlitFramebuffer } from "./caches/getIGLBlitFramebuffer"; -import { getIGLDrawMode, IGLDrawMode } from "./caches/getIGLDrawMode"; -import { getIGLRenderPassDescriptorWithMultisample } from "./caches/getIGLRenderPassDescriptorWithMultisample"; -import { getIGLTextureTarget, GLTextureTarget } from "./caches/getIGLTextureTarget"; import { _GL_Submit_Times } from "./const/const"; import { IGLUniformBufferType } from "./const/IGLUniformType"; import { GLBlitFramebuffer } from "./data/GLBlitFramebuffer"; @@ -134,7 +134,7 @@ export class RunWebGL if (renderPass.descriptor?.sampleCount && (renderPass.descriptor.colorAttachments[0].view as TextureView).texture) { - const { passDescriptor, blitFramebuffer } = getIGLRenderPassDescriptorWithMultisample(renderPass.descriptor); + const { passDescriptor, blitFramebuffer } = getGLRenderPassDescriptorWithMultisample(renderPass.descriptor); this.runRenderPassDescriptor(gl, passDescriptor); @@ -215,7 +215,7 @@ export class RunWebGL this.runPrimitiveState(gl, primitive); const topology = primitive?.topology || "triangle-list"; - const drawMode = getIGLDrawMode(topology); + const drawMode = getGLDrawMode(topology); if (draw.__type__ === 'DrawVertex') { @@ -231,7 +231,7 @@ export class RunWebGL { const { pipeline: material, vertices, uniforms, transformFeedback, draw } = renderObject; - const drawMode = getIGLDrawMode("point-list"); + const drawMode = getGLDrawMode("point-list"); this.runTransformFeedbackPipeline(gl, material); @@ -261,7 +261,7 @@ export class RunWebGL } } - private runDrawIndexed(gl: WebGLRenderingContext, drawMode: IGLDrawMode, indices: IIndicesDataTypes, drawIndexed: DrawIndexed) + private runDrawIndexed(gl: WebGLRenderingContext, drawMode: GLDrawMode, indices: IIndicesDataTypes, drawIndexed: DrawIndexed) { const type: IGLDrawElementType = indices.BYTES_PER_ELEMENT === 2 ? "UNSIGNED_SHORT" : "UNSIGNED_INT"; // @@ -290,7 +290,7 @@ export class RunWebGL } } - private runDrawVertex(gl: WebGLRenderingContext, drawMode: IGLDrawMode, drawArrays: DrawVertex) + private runDrawVertex(gl: WebGLRenderingContext, drawMode: GLDrawMode, drawArrays: DrawVertex) { // const vertexCount = drawArrays.vertexCount; @@ -386,7 +386,7 @@ export class RunWebGL const { texture, sampler } = samplerTexture; const { location, textureID } = uniformInfo; - const textureTarget = getIGLTextureTarget(texture.dimension); + const textureTarget = getGLTextureTarget(texture.dimension); // 设置纹理所在采样编号 gl.uniform1i(location, textureID); @@ -637,7 +637,7 @@ export class RunWebGL } } - private runTransformFeedback(gl: WebGLRenderingContext, transformFeedback: GLTransformFeedback, topology: IGLDrawMode) + private runTransformFeedback(gl: WebGLRenderingContext, transformFeedback: GLTransformFeedback, topology: GLDrawMode) { if (gl instanceof WebGL2RenderingContext) { @@ -881,7 +881,7 @@ export class RunWebGL private runCopyTextureToTexture(gl: WebGLRenderingContext, copyTextureToTexture: CopyTextureToTexture) { - const blitFramebuffer = getIGLBlitFramebuffer(copyTextureToTexture); + const blitFramebuffer = getGLBlitFramebuffer(copyTextureToTexture); this.runBlitFramebuffer(gl, blitFramebuffer); } diff --git a/src/caches/getIGLBlitFramebuffer.ts b/src/caches/getGLBlitFramebuffer.ts similarity index 75% rename from src/caches/getIGLBlitFramebuffer.ts rename to src/caches/getGLBlitFramebuffer.ts index 576cc34..4bc1f58 100644 --- a/src/caches/getIGLBlitFramebuffer.ts +++ b/src/caches/getGLBlitFramebuffer.ts @@ -1,5 +1,5 @@ import { CopyTextureToTexture, ImageCopyTexture, RenderPassColorAttachment, RenderPassDepthStencilAttachment, TextureView } from "@feng3d/render-api"; -import { GLBlitFramebuffer, IGLBlitFramebufferItem } from "../data/GLBlitFramebuffer"; +import { GLBlitFramebuffer, GLBlitFramebufferItem } from "../data/GLBlitFramebuffer"; /** * 通过 IGLBlitFramebuffer 实现纹理之间拷贝并不靠谱。 @@ -7,7 +7,7 @@ import { GLBlitFramebuffer, IGLBlitFramebufferItem } from "../data/GLBlitFramebu * @param copyTextureToTexture GL纹理之间拷贝。 * @returns */ -export function getIGLBlitFramebuffer(copyTextureToTexture: CopyTextureToTexture) +export function getGLBlitFramebuffer(copyTextureToTexture: CopyTextureToTexture) { const { source, destination, copySize } = copyTextureToTexture; @@ -26,26 +26,26 @@ export function getIGLBlitFramebuffer(copyTextureToTexture: CopyTextureToTexture if (sourceAspect === "all") { mask = "COLOR_BUFFER_BIT"; - sourceColorAttachments.push({ view: getIGLTextureView(source) }); - destinationColorAttachments.push({ view: getIGLTextureView(destination) }); + sourceColorAttachments.push({ view: getGLTextureView(source) }); + destinationColorAttachments.push({ view: getGLTextureView(destination) }); } else if (sourceAspect === "depth-only") { mask = "DEPTH_BUFFER_BIT"; - sourceDepthStencilAttachment = { view: getIGLTextureView(source) }; - destinationDepthStencilAttachment = { view: getIGLTextureView(destination) }; + sourceDepthStencilAttachment = { view: getGLTextureView(source) }; + destinationDepthStencilAttachment = { view: getGLTextureView(destination) }; } else if (sourceAspect === "stencil-only") { mask = "STENCIL_BUFFER_BIT"; - sourceDepthStencilAttachment = { view: getIGLTextureView(source) }; - destinationDepthStencilAttachment = { view: getIGLTextureView(destination) }; + sourceDepthStencilAttachment = { view: getGLTextureView(source) }; + destinationDepthStencilAttachment = { view: getGLTextureView(destination) }; } const sourceOrigin = source.origin || [0, 0]; const destinationOrigin = destination.origin || [0, 0]; // - const blitFramebufferItem: IGLBlitFramebufferItem = [ + const blitFramebufferItem: GLBlitFramebufferItem = [ sourceOrigin[0], sourceOrigin[1], sourceOrigin[0] + copySize[0], sourceOrigin[1] + copySize[1], destinationOrigin[0], destinationOrigin[1], destinationOrigin[0] + copySize[0], destinationOrigin[1] + copySize[1], mask, "NEAREST", @@ -67,7 +67,7 @@ export function getIGLBlitFramebuffer(copyTextureToTexture: CopyTextureToTexture return blitFramebuffer; } -function getIGLTextureView(source: ImageCopyTexture) +function getGLTextureView(source: ImageCopyTexture) { if (!source.texture) return undefined; diff --git a/src/caches/getIGLDrawMode.ts b/src/caches/getGLDrawMode.ts similarity index 84% rename from src/caches/getIGLDrawMode.ts rename to src/caches/getGLDrawMode.ts index de4d552..58e4e63 100644 --- a/src/caches/getIGLDrawMode.ts +++ b/src/caches/getGLDrawMode.ts @@ -1,6 +1,6 @@ import { PrimitiveTopology } from "@feng3d/render-api"; -export function getIGLDrawMode(topology: PrimitiveTopology): IGLDrawMode +export function getGLDrawMode(topology: PrimitiveTopology): GLDrawMode { let drawMode = drawModeMap[topology]; @@ -11,7 +11,7 @@ export function getIGLDrawMode(topology: PrimitiveTopology): IGLDrawMode return drawMode; } -const drawModeMap: { [key: string]: IGLDrawMode } = { +const drawModeMap: { [key: string]: GLDrawMode } = { "point-list": "POINTS", "line-list": "LINES", "line-strip": "LINE_STRIP", @@ -44,4 +44,4 @@ const drawModeMap: { [key: string]: IGLDrawMode } = { * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements */ -export type IGLDrawMode = "POINTS" | "LINE_STRIP" | "LINE_LOOP" | "LINES" | "TRIANGLE_STRIP" | "TRIANGLE_FAN" | "TRIANGLES"; +export type GLDrawMode = "POINTS" | "LINE_STRIP" | "LINE_LOOP" | "LINES" | "TRIANGLE_STRIP" | "TRIANGLE_FAN" | "TRIANGLES"; diff --git a/src/caches/getGLFramebuffer.ts b/src/caches/getGLFramebuffer.ts index e28657a..1996a99 100644 --- a/src/caches/getGLFramebuffer.ts +++ b/src/caches/getGLFramebuffer.ts @@ -1,9 +1,9 @@ import { RenderPassDescriptor, TextureView } from "@feng3d/render-api"; import { GLRenderbuffer } from "../data/GLRenderbuffer"; import { deleteRenderbuffer, getGLRenderbuffer } from "./getGLRenderbuffer"; +import { _IGLRenderPassDescriptorWithMultisample, GLRenderPassDescriptorWithMultisample } from "./getGLRenderPassDescriptorWithMultisample"; import { getGLTexture } from "./getGLTexture"; -import { _IGLRenderPassDescriptorWithMultisample, IGLRenderPassDescriptorWithMultisample } from "./getIGLRenderPassDescriptorWithMultisample"; -import { getIGLTextureTarget } from "./getIGLTextureTarget"; +import { getGLTextureTarget } from "./getGLTextureTarget"; declare global { @@ -44,7 +44,7 @@ export function getGLFramebuffer(gl: WebGLRenderingContext, passDescriptor: Rend const baseArrayLayer = view.baseArrayLayer || 0; const webGLTexture = getGLTexture(gl, texture); - const textureTarget = getIGLTextureTarget(texture.dimension); + const textureTarget = getGLTextureTarget(texture.dimension); if (textureTarget === "TEXTURE_2D") { @@ -88,7 +88,7 @@ export function getGLFramebuffer(gl: WebGLRenderingContext, passDescriptor: Rend const baseArrayLayer = view.baseArrayLayer || 0; const webGLTexture = getGLTexture(gl, texture); - const textureTarget = getIGLTextureTarget(texture.dimension); + const textureTarget = getGLTextureTarget(texture.dimension); if (textureTarget === "TEXTURE_2D") { @@ -132,7 +132,7 @@ export function deleteFramebuffer(gl: WebGLRenderingContext, passDescriptor: Ren gl.deleteFramebuffer(webGLFramebuffer); } -function deleteRenderPassDescriptorWithMultisample(gl: WebGLRenderingContext, renderPassDescriptorWithMultisample: IGLRenderPassDescriptorWithMultisample) +function deleteRenderPassDescriptorWithMultisample(gl: WebGLRenderingContext, renderPassDescriptorWithMultisample: GLRenderPassDescriptorWithMultisample) { deleteFramebuffer(gl, renderPassDescriptorWithMultisample.blitFramebuffer.read, false); deleteFramebuffer(gl, renderPassDescriptorWithMultisample.blitFramebuffer.draw, false); diff --git a/src/caches/getGLProgram.ts b/src/caches/getGLProgram.ts index 0dd6f23..ec95700 100644 --- a/src/caches/getGLProgram.ts +++ b/src/caches/getGLProgram.ts @@ -1,7 +1,6 @@ import { GLVertexAttributeTypes, RenderPipeline } from "@feng3d/render-api"; import { getWebGLUniformType, IGLUniformBufferType, IGLUniformType, isWebGLUniformTextureType } from "../const/IGLUniformType"; import { GLTransformFeedbackPipeline, GLTransformFeedbackVaryings } from "../data/GLTransformFeedbackPass"; -import { getIGLAttributeType } from "./getIGLAttributeType"; declare global { @@ -122,7 +121,7 @@ function getWebGLProgram(gl: WebGLRenderingContext, vshader: string, fshader: st const activeInfo = gl.getActiveAttrib(program, i); const { name, size, type } = activeInfo; const location = gl.getAttribLocation(program, name); - const typeString = getIGLAttributeType(type as any); + const typeString = getGLAttributeType(type as any); attributes.push({ name, size, type: typeString, location }); } // 获取uniform信息 @@ -478,4 +477,23 @@ export interface UniformItemInfo * Uniform数组索引，当Uniform数据为数组数据时生效 */ paths: string[]; -} \ No newline at end of file +} + +/** + * WebGL 属性类型。 + */ +export type GLAttributeType = keyof typeof webglAttributeTypeValue; + +/** + * 获取顶点数据类型名称。 + * + * @param gl + * @param value + */ +export function getGLAttributeType(value: keyof typeof webglAttributeValueType): GLAttributeType +{ + return webglAttributeValueType[value]; +} + +const webglAttributeTypeValue = Object.freeze({ FLOAT: 5126, BYTE: 5120, SHORT: 5122, UNSIGNED_BYTE: 5121, UNSIGNED_SHORT: 5123, HALF_FLOAT: 5131, INT: 5124, UNSIGNED_INT: 5125 }); +const webglAttributeValueType = Object.freeze({ 5120: "BYTE", 5121: "UNSIGNED_BYTE", 5122: "SHORT", 5123: "UNSIGNED_SHORT", 5124: "INT", 5125: "UNSIGNED_INT", 5126: "FLOAT", 5131: "HALF_FLOAT" }); diff --git a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts b/src/caches/getGLRenderPassDescriptorWithMultisample.ts similarity index 87% rename from src/caches/getIGLRenderPassDescriptorWithMultisample.ts rename to src/caches/getGLRenderPassDescriptorWithMultisample.ts index 9402e1b..3e00839 100644 --- a/src/caches/getIGLRenderPassDescriptorWithMultisample.ts +++ b/src/caches/getGLRenderPassDescriptorWithMultisample.ts @@ -1,7 +1,7 @@ import { RenderPassColorAttachment, RenderPassDescriptor, TextureFormat, TextureView } from "@feng3d/render-api"; import { GLBlitFramebuffer } from "../data/GLBlitFramebuffer"; import { GLRenderbufferInternalformat, GLRenderbuffer } from "../data/GLRenderbuffer"; -import { getIGLTextureFormats } from "./getIGLTextureFormats"; +import { getGLTextureFormats } from "./getGLTextureFormats"; /** * @@ -11,7 +11,7 @@ import { getIGLTextureFormats } from "./getIGLTextureFormats"; * * @param sourcePassDescriptor 需要渲染到纹理并且开启多重采样的渲染通道描述。 */ -export function getIGLRenderPassDescriptorWithMultisample(sourcePassDescriptor: RenderPassDescriptor): IGLRenderPassDescriptorWithMultisample +export function getGLRenderPassDescriptorWithMultisample(sourcePassDescriptor: RenderPassDescriptor): GLRenderPassDescriptorWithMultisample { if (sourcePassDescriptor[_IGLRenderPassDescriptorWithMultisample]) return sourcePassDescriptor[_IGLRenderPassDescriptorWithMultisample]; @@ -39,7 +39,7 @@ export function getIGLRenderPassDescriptorWithMultisample(sourcePassDescriptor: view: renderbuffer as any, }; -return colorAttachment; + return colorAttachment; }), depthStencilAttachment: sourcePassDescriptor.depthStencilAttachment, sampleCount: sourcePassDescriptor.sampleCount, @@ -55,14 +55,14 @@ return colorAttachment; "COLOR_BUFFER_BIT", "NEAREST"]], }; - sourcePassDescriptor[_IGLRenderPassDescriptorWithMultisample] = { passDescriptor, blitFramebuffer, renderbuffers } as IGLRenderPassDescriptorWithMultisample; + sourcePassDescriptor[_IGLRenderPassDescriptorWithMultisample] = { passDescriptor, blitFramebuffer, renderbuffers } as GLRenderPassDescriptorWithMultisample; return sourcePassDescriptor[_IGLRenderPassDescriptorWithMultisample]; } function getGLRenderbufferInternalformat(format?: TextureFormat) { - const { internalformat } = getIGLTextureFormats(format); + const { internalformat } = getGLTextureFormats(format); return internalformat as GLRenderbufferInternalformat; } @@ -72,7 +72,7 @@ export const _IGLRenderPassDescriptorWithMultisample = "_IGLRenderPassDescriptor /** * 由`passDescriptor.multisample`值存在的IGLRenderPassDescriptor生成。 */ -export interface IGLRenderPassDescriptorWithMultisample +export interface GLRenderPassDescriptorWithMultisample { /** * 渲染到渲染缓冲区上。 diff --git a/src/caches/getGLTexture.ts b/src/caches/getGLTexture.ts index 28fb147..4e8d065 100644 --- a/src/caches/getGLTexture.ts +++ b/src/caches/getGLTexture.ts @@ -1,8 +1,8 @@ import { Texture, TextureDataSource, TextureImageSource, TextureSize } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; import { getTextureCubeMapTarget } from "../utils/getTextureCubeMapTarget"; -import { getIGLTextureFormats } from "./getIGLTextureFormats"; -import { getIGLTextureTarget } from "./getIGLTextureTarget"; +import { getGLTextureFormats } from "./getGLTextureFormats"; +import { getGLTextureTarget } from "./getGLTextureTarget"; declare global { @@ -44,8 +44,8 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) // 创建纹理 const createTexture = () => { - const target = getIGLTextureTarget(texture.dimension); - const { internalformat, format, type } = getIGLTextureFormats(texture.format); + const target = getGLTextureTarget(texture.dimension); + const { internalformat, format, type } = getGLTextureFormats(texture.format); webGLTexture = gl.createTexture(); // Create a texture object gl._textures.set(texture, webGLTexture); @@ -254,8 +254,8 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) const { writeTextures } = texture; if (!writeTextures || writeTextures.length === 0) return; - const target = getIGLTextureTarget(texture.dimension); - const { format, type } = getIGLTextureFormats(texture.format); + const target = getGLTextureTarget(texture.dimension); + const { format, type } = getGLTextureFormats(texture.format); gl.bindTexture(gl[target], webGLTexture); diff --git a/src/caches/getIGLTextureFormats.ts b/src/caches/getGLTextureFormats.ts similarity index 93% rename from src/caches/getIGLTextureFormats.ts rename to src/caches/getGLTextureFormats.ts index f71d929..d0a9b8c 100644 --- a/src/caches/getIGLTextureFormats.ts +++ b/src/caches/getGLTextureFormats.ts @@ -1,15 +1,15 @@ import { TextureFormat } from "@feng3d/render-api"; -export function getIGLTextureFormats(format: TextureFormat = "rgba8unorm") +export function getGLTextureFormats(format: TextureFormat = "rgba8unorm") { - const glTextureFormat: IGLTextureFormats = formatMap[format]; + const glTextureFormat: GLTextureFormats = formatMap[format]; console.assert(!!glTextureFormat, `未处理格式 ${format}；或者WebGL不支持纹理， 该格式只在WebGPU中支持！`); return glTextureFormat; } -export interface IGLTextureFormats +export interface GLTextureFormats { /** * 内部纹理格式。 @@ -33,7 +33,7 @@ export interface IGLTextureFormats readonly type?: GLTextureDataType; } -const formatMap: { [key: string]: IGLTextureFormats } = { +const formatMap: { [key: string]: GLTextureFormats } = { r8unorm: { internalformat: "R8", format: "RED", type: "UNSIGNED_BYTE" }, r8snorm: undefined, r8uint: { internalformat: "R8", format: "RED", type: "UNSIGNED_BYTE" }, @@ -136,7 +136,7 @@ const formatMap: { [key: string]: IGLTextureFormats } = { * * @see https://registry.khronos.org/webgl/specs/latest/2.0/#TEXTURE_TYPES_FORMATS_FROM_DOM_ELEMENTS_TABLE */ -type IGLTextureTypes = +type GLTextureTypes = | { internalformat: "RGB", format: "RGB", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_5_6_5" } | { internalformat: "RGBA", format: "RGBA", type: "UNSIGNED_BYTE" | "UNSIGNED_SHORT_4_4_4_4" | "UNSIGNED_SHORT_5_5_5_1" } | { internalformat: "LUMINANCE_ALPHA", format: "LUMINANCE_ALPHA", type: "UNSIGNED_BYTE" } @@ -170,6 +170,6 @@ type IGLTextureTypes = | { internalformat: "DEPTH_COMPONENT16", format: "DEPTH_COMPONENT", type: "UNSIGNED_SHORT", } ; -export type GLTextureInternalFormat = IGLTextureTypes["internalformat"]; -export type GLTextureFormat = IGLTextureTypes["format"]; -export type GLTextureDataType = IGLTextureTypes["type"]; +export type GLTextureInternalFormat = GLTextureTypes["internalformat"]; +export type GLTextureFormat = GLTextureTypes["format"]; +export type GLTextureDataType = GLTextureTypes["type"]; diff --git a/src/caches/getIGLTextureTarget.ts b/src/caches/getGLTextureTarget.ts similarity index 93% rename from src/caches/getIGLTextureTarget.ts rename to src/caches/getGLTextureTarget.ts index 42becde..4e27203 100644 --- a/src/caches/getIGLTextureTarget.ts +++ b/src/caches/getGLTextureTarget.ts @@ -16,7 +16,7 @@ import { TextureDimension } from "@feng3d/render-api"; export type GLTextureTarget = "TEXTURE_2D" | "TEXTURE_CUBE_MAP" | "TEXTURE_3D" | "TEXTURE_2D_ARRAY"; -export function getIGLTextureTarget(dimension: TextureDimension = "2d") +export function getGLTextureTarget(dimension: TextureDimension = "2d") { const target: GLTextureTarget = dimensionMap[dimension]; diff --git a/src/caches/getIGLAttributeType.ts b/src/caches/getIGLAttributeType.ts deleted file mode 100644 index d2d18ce..0000000 --- a/src/caches/getIGLAttributeType.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * WebGL 属性类型。 - */ -export type IGLAttributeType = keyof typeof webglAttributeTypeValue; - -/** - * 获取顶点数据类型名称。 - * - * @param gl - * @param value - */ -export function getIGLAttributeType(value: keyof typeof webglAttributeValueType): IGLAttributeType -{ - return webglAttributeValueType[value]; -} - -const webglAttributeTypeValue = Object.freeze({ FLOAT: 5126, BYTE: 5120, SHORT: 5122, UNSIGNED_BYTE: 5121, UNSIGNED_SHORT: 5123, HALF_FLOAT: 5131, INT: 5124, UNSIGNED_INT: 5125 }); -const webglAttributeValueType = Object.freeze({ 5120: "BYTE", 5121: "UNSIGNED_BYTE", 5122: "SHORT", 5123: "UNSIGNED_SHORT", 5124: "INT", 5125: "UNSIGNED_INT", 5126: "FLOAT", 5131: "HALF_FLOAT" }); diff --git a/src/data/GLBlitFramebuffer.ts b/src/data/GLBlitFramebuffer.ts index d0f0171..f74ac07 100644 --- a/src/data/GLBlitFramebuffer.ts +++ b/src/data/GLBlitFramebuffer.ts @@ -12,10 +12,10 @@ export interface GLBlitFramebuffer read: RenderPassDescriptor; draw: RenderPassDescriptor; - blitFramebuffers: IGLBlitFramebufferItem[]; + blitFramebuffers: GLBlitFramebufferItem[]; } -export type IGLBlitFramebufferItem = [ +export type GLBlitFramebufferItem = [ srcX0: number, srcY0: number, srcX1: number, srcY1: number, dstX0: number, dstY0: number, dstX1: number, dstY1: number, mask: "COLOR_BUFFER_BIT" | "DEPTH_BUFFER_BIT" | "STENCIL_BUFFER_BIT", filter: "NEAREST" | "LINEAR"]; \ No newline at end of file diff --git a/src/gl/WebGLEnums.ts b/src/gl/WebGLEnums.ts index 159e736..73d55f2 100644 --- a/src/gl/WebGLEnums.ts +++ b/src/gl/WebGLEnums.ts @@ -1,89 +1,5 @@ import { GLTextureWrap } from "../caches/getGLSampler"; -/** - * A GLenum specifying which WebGL capability to enable. Possible values: - * - * gl.BLEND Activates blending of the computed fragment color values. See WebGLRenderingContext.blendFunc(). - * gl.CULL_FACE Activates culling of polygons. See WebGLRenderingContext.cullFace(). - * gl.DEPTH_TEST Activates depth comparisons and updates to the depth buffer. See WebGLRenderingContext.depthFunc(). - * gl.DITHER Activates dithering of color components before they get written to the color buffer. - * gl.POLYGON_OFFSET_FILL Activates adding an offset to depth values of polygon's fragments. See WebGLRenderingContext.polygonOffset(). - * gl.SAMPLE_ALPHA_TO_COVERAGE Activates the computation of a temporary coverage value determined by the alpha value. - * gl.SAMPLE_COVERAGE Activates ANDing the fragment's coverage with the temporary coverage value. See WebGLRenderingContext.sampleCoverage(). - * gl.SCISSOR_TEST Activates the scissor test that discards fragments that are outside of the scissor rectangle. See WebGLRenderingContext.scissor(). - * gl.STENCIL_TEST Activates stencil testing and updates to the stencil buffer. See WebGLRenderingContext.stencilFunc(). - * - * When using a WebGL 2 context, the following values are available additionally: - * - * gl.RASTERIZER_DISCARD Primitives are discarded immediately before the rasterization stage, but after the optional transform feedback stage. gl.clear() commands are ignored. - */ -export type Capability = - "BLEND" | "CULL_FACE" | "DEPTH_TEST" | "DITHER" - | "POLYGON_OFFSET_FILL" | "SAMPLE_ALPHA_TO_COVERAGE" | "SAMPLE_COVERAGE" - | "SCISSOR_TEST" - | "STENCIL_TEST" - | "RASTERIZER_DISCARD" - ; - -/** - * A GLenum specifying the format of the pixel data. Possible values: - * - * * gl.ALPHA Discards the red, green and blue components and reads the alpha component. - * * gl.RGB Discards the alpha components and reads the red, green and blue components. - * * gl.RGBA Red, green, blue and alpha components are read from the color buffer. - * - * WebGL2 adds - * - * * gl.RED - * * gl.RG - * * gl.RED_INTEGER - * * gl.RG_INTEGER - * * gl.RGB_INTEGER - * * gl.RGBA_INTEGER - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/readPixels - */ -export type ReadPixelsFormat = "ALPHA" | "RGB" | "RGBA" // WebGL1 - | "RED" | "RG" | "RED_INTEGER" | "RG_INTEGER" | "RGB_INTEGER" | "RGBA_INTEGER" // WebGL2 - ; - -/** - * A GLenum specifying the data type of the pixel data. Possible values: - * * gl.UNSIGNED_BYTE - * * gl.UNSIGNED_SHORT_5_6_5 - * * gl.UNSIGNED_SHORT_4_4_4_4 - * * gl.UNSIGNED_SHORT_5_5_5_1 - * * gl.FLOAT - * - * WebGL2 adds - * * gl.BYTE - * * gl.UNSIGNED_INT_2_10_10_10_REV - * * gl.HALF_FLOAT - * * gl.SHORT - * * gl.UNSIGNED_SHORT - * * gl.INT - * * gl.UNSIGNED_INT - * * gl.UNSIGNED_INT_10F_11F_11F_REV - * * gl.UNSIGNED_INT_5_9_9_9_REV - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/readPixels - */ -export type ReadPixelsType = - | "UNSIGNED_BYTE" - | "UNSIGNED_SHORT_5_6_5" - | "UNSIGNED_SHORT_4_4_4_4" - | "UNSIGNED_SHORT_5_5_5_1" - | "FLOAT" - | "BYTE" - | "UNSIGNED_INT_2_10_10_10_REV" - | "HALF_FLOAT" - | "SHORT" - | "UNSIGNED_SHORT" - | "INT" - | "UNSIGNED_INT" - | "UNSIGNED_INT_10F_11F_11F_REV" - | "UNSIGNED_INT_5_9_9_9_REV" - ; /** * The pname parameter is a GLenum specifying the texture parameter to set. @@ -295,22 +211,3 @@ export interface ProgramParameter * A precision type value. Either gl.LOW_FLOAT, gl.MEDIUM_FLOAT, gl.HIGH_FLOAT, gl.LOW_INT, gl.MEDIUM_INT, or gl.HIGH_INT. */ export type PrecisionType = "LOW_FLOAT" | "MEDIUM_FLOAT" | "HIGH_FLOAT" | "LOW_INT" | "MEDIUM_INT" | "HIGH_INT"; - -/** - * A GLenum specifying the attachment point for the texture. Possible values: - * - * gl.COLOR_ATTACHMENT0: Attaches the texture to the framebuffer's color buffer. - * gl.DEPTH_ATTACHMENT: Attaches the texture to the framebuffer's depth buffer. - * gl.STENCIL_ATTACHMENT: Attaches the texture to the framebuffer's stencil buffer. - * - * When using a WebGL 2 context, the following values are available additionally: - * - * gl.DEPTH_STENCIL_ATTACHMENT: depth and stencil buffer. - * gl.COLOR_ATTACHMENT1 gl.COLOR_ATTACHMENT2 gl.COLOR_ATTACHMENT3 gl.COLOR_ATTACHMENT4 gl.COLOR_ATTACHMENT5 gl.COLOR_ATTACHMENT6 gl.COLOR_ATTACHMENT7 gl.COLOR_ATTACHMENT8 gl.COLOR_ATTACHMENT9 gl.COLOR_ATTACHMENT10 gl.COLOR_ATTACHMENT11 gl.COLOR_ATTACHMENT12 gl.COLOR_ATTACHMENT13 gl.COLOR_ATTACHMENT14 gl.COLOR_ATTACHMENT15 - */ -export type GLAttachmentPoint = "COLOR_ATTACHMENT0" | "DEPTH_ATTACHMENT" | "STENCIL_ATTACHMENT" - | "DEPTH_STENCIL_ATTACHMENT" - | "COLOR_ATTACHMENT1" | "COLOR_ATTACHMENT2" | "COLOR_ATTACHMENT3" | "COLOR_ATTACHMENT4" | "COLOR_ATTACHMENT5" - | "COLOR_ATTACHMENT6" | "COLOR_ATTACHMENT7" | "COLOR_ATTACHMENT8" | "COLOR_ATTACHMENT9" | "COLOR_ATTACHMENT10" - | "COLOR_ATTACHMENT11" | "COLOR_ATTACHMENT12" | "COLOR_ATTACHMENT13" | "COLOR_ATTACHMENT14" | "COLOR_ATTACHMENT15" - ; diff --git a/src/index.ts b/src/index.ts index d2c0624..43af358 100644 --- a/src/index.ts +++ b/src/index.ts @@ -19,8 +19,6 @@ export * from "./runs/getIGLBuffer"; export * from "./runs/runColorTargetStates"; export * from "./RunWebGL"; -export * from "./gl/WebGLEnums"; - export * from "./shader/Macro"; export * from "./shader/ShaderLib"; export * from "./shader/ShaderMacroUtils"; diff --git a/src/utils/readPixels.ts b/src/utils/readPixels.ts index 9575a88..6ce477a 100644 --- a/src/utils/readPixels.ts +++ b/src/utils/readPixels.ts @@ -1,7 +1,6 @@ import { ReadPixels, RenderPassDescriptor, Texture } from "@feng3d/render-api"; import { deleteFramebuffer, getGLFramebuffer } from "../caches/getGLFramebuffer"; -import { getIGLTextureFormats } from "../caches/getIGLTextureFormats"; -import { GLAttachmentPoint } from "../gl/WebGLEnums"; +import { getGLTextureFormats } from "../caches/getGLTextureFormats"; export function readPixels(gl: WebGLRenderingContext, readPixels: ReadPixels) { @@ -13,7 +12,7 @@ export function readPixels(gl: WebGLRenderingContext, readPixels: ReadPixels) const attachmentPoint: GLAttachmentPoint = "COLOR_ATTACHMENT0"; const [width, height] = copySize; // - const { format, type } = getIGLTextureFormats(textureView.texture.format); + const { format, type } = getGLTextureFormats(textureView.texture.format); const bytesPerPixel = Texture.getTextureBytesPerPixel(textureView.texture.format); const dataConstructor = Texture.getTextureDataConstructor(textureView.texture.format); // @@ -44,3 +43,22 @@ export function readPixels(gl: WebGLRenderingContext, readPixels: ReadPixels) return bufferData; } + +/** + * A GLenum specifying the attachment point for the texture. Possible values: + * + * gl.COLOR_ATTACHMENT0: Attaches the texture to the framebuffer's color buffer. + * gl.DEPTH_ATTACHMENT: Attaches the texture to the framebuffer's depth buffer. + * gl.STENCIL_ATTACHMENT: Attaches the texture to the framebuffer's stencil buffer. + * + * When using a WebGL 2 context, the following values are available additionally: + * + * gl.DEPTH_STENCIL_ATTACHMENT: depth and stencil buffer. + * gl.COLOR_ATTACHMENT1 gl.COLOR_ATTACHMENT2 gl.COLOR_ATTACHMENT3 gl.COLOR_ATTACHMENT4 gl.COLOR_ATTACHMENT5 gl.COLOR_ATTACHMENT6 gl.COLOR_ATTACHMENT7 gl.COLOR_ATTACHMENT8 gl.COLOR_ATTACHMENT9 gl.COLOR_ATTACHMENT10 gl.COLOR_ATTACHMENT11 gl.COLOR_ATTACHMENT12 gl.COLOR_ATTACHMENT13 gl.COLOR_ATTACHMENT14 gl.COLOR_ATTACHMENT15 + */ +export type GLAttachmentPoint = "COLOR_ATTACHMENT0" | "DEPTH_ATTACHMENT" | "STENCIL_ATTACHMENT" + | "DEPTH_STENCIL_ATTACHMENT" + | "COLOR_ATTACHMENT1" | "COLOR_ATTACHMENT2" | "COLOR_ATTACHMENT3" | "COLOR_ATTACHMENT4" | "COLOR_ATTACHMENT5" + | "COLOR_ATTACHMENT6" | "COLOR_ATTACHMENT7" | "COLOR_ATTACHMENT8" | "COLOR_ATTACHMENT9" | "COLOR_ATTACHMENT10" + | "COLOR_ATTACHMENT11" | "COLOR_ATTACHMENT12" | "COLOR_ATTACHMENT13" | "COLOR_ATTACHMENT14" | "COLOR_ATTACHMENT15" + ; -- Gitee From 95d2a7bf6f710f60e4a60216eba2bb70a183366f Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 19:46:29 +0800 Subject: [PATCH 42/57] =?UTF-8?q?refactor(examples):=20=E6=9B=B4=E6=96=B0?= =?UTF-8?q?=20WebGL2=20=E7=A4=BA=E4=BE=8B=E4=B8=AD=E7=9A=84=E7=B1=BB?= =?UTF-8?q?=E5=9E=8B=E5=BC=95=E7=94=A8=E5=92=8C=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 GLCanvasContext 重命名为 CanvasContext - 调整导入语句，移除不必要的模块 - 更新 renderingContext 对象的属性名称 - 优化部分代码结构以适应新的 API --- examples/src/WebGL2Samples/buffer_copy.ts | 6 +-- examples/src/WebGL2Samples/buffer_uniform.ts | 6 +-- .../src/WebGL2Samples/draw_image_space.ts | 6 +-- examples/src/WebGL2Samples/draw_instanced.ts | 6 +-- .../src/WebGL2Samples/draw_instanced_ubo.ts | 6 +-- .../WebGL2Samples/draw_primitive_restart.ts | 6 +-- .../src/WebGL2Samples/draw_range_arrays.ts | 6 +-- examples/src/WebGL2Samples/fbo_blit.ts | 6 +-- examples/src/WebGL2Samples/fbo_multisample.ts | 6 +-- .../WebGL2Samples/fbo_new_blend_equation.ts | 6 +-- examples/src/WebGL2Samples/fbo_read_pixels.ts | 6 +-- .../WebGL2Samples/fbo_rtt_depth_texture.ts | 10 ++--- .../src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 6 +-- .../WebGL2Samples/fbo_rtt_texture_array.ts | 6 +-- .../src/WebGL2Samples/geo_vertex_format.ts | 8 ++-- examples/src/WebGL2Samples/glsl_centroid.ts | 6 +-- .../glsl_flat_smooth_interpolators.ts | 6 +-- .../WebGL2Samples/glsl_non_square_matrix.ts | 6 +-- examples/src/WebGL2Samples/query_occlusion.ts | 6 +-- examples/src/WebGL2Samples/sampler_filter.ts | 6 +-- examples/src/WebGL2Samples/sampler_object.ts | 6 +-- examples/src/WebGL2Samples/sampler_wrap.ts | 6 +-- .../src/WebGL2Samples/texture_2d_array.ts | 6 +-- examples/src/WebGL2Samples/texture_3d.ts | 6 +-- .../src/WebGL2Samples/texture_derivative.ts | 6 +-- examples/src/WebGL2Samples/texture_fetch.ts | 6 +-- examples/src/WebGL2Samples/texture_format.ts | 6 +-- examples/src/WebGL2Samples/texture_grad.ts | 6 +-- .../src/WebGL2Samples/texture_immutable.ts | 6 +-- examples/src/WebGL2Samples/texture_integer.ts | 6 +-- examples/src/WebGL2Samples/texture_lod.ts | 6 +-- examples/src/WebGL2Samples/texture_offset.ts | 6 +-- .../src/WebGL2Samples/texture_pixel_store.ts | 6 +-- examples/src/WebGL2Samples/texture_srgb.ts | 6 +-- examples/src/WebGL2Samples/texture_vertex.ts | 6 +-- .../transform_feedback_instanced.ts | 6 +-- .../transform_feedback_interleaved.ts | 6 +-- .../transform_feedback_separated.ts | 6 +-- .../transform_feedback_separated_2.ts | 8 ++-- examples/src/regl-examples/bunny.ts | 4 +- examples/src/regl-examples/camera.ts | 4 +- examples/src/test/RenderObjectChanges.ts | 2 +- examples/src/test/fractalCube.ts | 6 +-- examples/src/webgl-examples/sample1.ts | 2 +- examples/src/webgl-examples/sample2.ts | 2 +- examples/src/webgl-examples/sample3.ts | 2 +- examples/src/webgl-examples/sample4.ts | 2 +- examples/src/webgl-examples/sample5.ts | 2 +- examples/src/webgl-examples/sample6.ts | 2 +- examples/src/webgl-examples/sample7.ts | 2 +- examples/src/webgl-examples/sample8.ts | 2 +- src/RunWebGL.ts | 3 +- src/WebGL.ts | 9 ++--- src/caches/getGLCanvasContext.ts | 19 ++++----- src/caches/getGLTransformFeedback.ts | 2 +- src/data/GLCanvasContext.ts | 40 ------------------- src/data/GLCanvasTexture.ts | 9 ----- src/data/GLTransformFeedback.ts | 19 --------- src/data/GLTransformFeedbackPass.ts | 21 +++++++++- src/data/polyfills/CanvasContext.ts | 34 ++++++++++++++++ src/data/polyfills/CanvasTexture.ts | 15 +++++++ src/index.ts | 3 +- 62 files changed, 222 insertions(+), 226 deletions(-) delete mode 100644 src/data/GLCanvasContext.ts delete mode 100644 src/data/GLCanvasTexture.ts delete mode 100644 src/data/GLTransformFeedback.ts create mode 100644 src/data/polyfills/CanvasContext.ts create mode 100644 src/data/polyfills/CanvasTexture.ts diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index fcb0314..f8b9f54 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -1,5 +1,5 @@ -import { CopyBufferToBuffer, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, GLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; +import { CanvasContext, CopyBufferToBuffer, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { GLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -12,7 +12,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // -- Init WebGL Context - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init Program diff --git a/examples/src/WebGL2Samples/buffer_uniform.ts b/examples/src/WebGL2Samples/buffer_uniform.ts index c30dd48..64fcc92 100644 --- a/examples/src/WebGL2Samples/buffer_uniform.ts +++ b/examples/src/WebGL2Samples/buffer_uniform.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPipeline, Submit, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPass, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -12,7 +12,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // --Init WebGL Context - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init Program diff --git a/examples/src/WebGL2Samples/draw_image_space.ts b/examples/src/WebGL2Samples/draw_image_space.ts index adf37a5..ea54075 100644 --- a/examples/src/WebGL2Samples/draw_image_space.ts +++ b/examples/src/WebGL2Samples/draw_image_space.ts @@ -1,5 +1,5 @@ -import { RenderPipeline, Sampler, Texture, RenderObject } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPipeline, Sampler, Texture } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: CanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); loadImage("../../assets/img/Di-3d.png", (img) => diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index 410c17f..2a13ea3 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -1,5 +1,5 @@ -import { RenderObject, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: CanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); const vertexPosBuffer = new Float32Array([-0.3, -0.5, diff --git a/examples/src/WebGL2Samples/draw_instanced_ubo.ts b/examples/src/WebGL2Samples/draw_instanced_ubo.ts index 89a0799..b7a5b83 100644 --- a/examples/src/WebGL2Samples/draw_instanced_ubo.ts +++ b/examples/src/WebGL2Samples/draw_instanced_ubo.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPipeline } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderPass, RenderPipeline } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index 41ec5f7..1ae13c2 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -1,5 +1,5 @@ -import { RenderPipeline, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: CanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); // https://www.khronos.org/registry/webgl/specs/latest/2.0/#5.18 diff --git a/examples/src/WebGL2Samples/draw_range_arrays.ts b/examples/src/WebGL2Samples/draw_range_arrays.ts index 659fd2e..114fdf8 100644 --- a/examples/src/WebGL2Samples/draw_range_arrays.ts +++ b/examples/src/WebGL2Samples/draw_range_arrays.ts @@ -1,5 +1,5 @@ -import { RenderObject, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: CanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); const vertexPosBuffer = new Float32Array([ diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index b4edd7f..9184278 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -1,5 +1,5 @@ -import { RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, TextureView, VertexAttributes } from "@feng3d/render-api"; -import { GLBlitFramebuffer, GLCanvasContext, GLBlitFramebufferItem, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, TextureView, VertexAttributes } from "@feng3d/render-api"; +import { GLBlitFramebuffer, GLBlitFramebufferItem, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: CanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); const program: RenderPipeline = { diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index 444a1f6..6bd65bd 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -9,7 +9,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const renderingContext: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(renderingContext); // -- Init program diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index 5c6a776..42db997 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -1,5 +1,5 @@ -import { IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -9,7 +9,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const renderingContext: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(renderingContext); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index 8ed63b0..739e085 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const renderingContext: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(renderingContext); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index 98637f9..5b08473 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const renderingContext: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; +const renderingContext: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false } }; const webgl = new WebGL(renderingContext); const windowSize = { @@ -94,7 +94,7 @@ const renderPass: RenderPass = { descriptor: frameBuffer, renderObjects: [{ pipeline: depthProgram, - geometry:{ + geometry: { primitive: { topology: "triangle-list" }, vertices: triVertexArray.vertices, draw: { __type__: "DrawVertex", vertexCount: 3 }, @@ -111,7 +111,7 @@ const rp2: RenderPass = { renderObjects: [{ pipeline: drawProgram, uniforms: { depthMap: { texture: depthTexture, sampler: depthSampler } }, - geometry:{ + geometry: { primitive: { topology: "triangle-list" }, vertices: quadVertexArray.vertices, draw: { __type__: "DrawVertex", vertexCount: 6 }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index 137ba1d..d79b987 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: CanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); const windowSize = { diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index f0ee5bf..3124e6f 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPassDescriptor, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const renderingContext: GLCanvasContext = { canvasId: "glcanvas" }; +const renderingContext: CanvasContext = { canvasId: "glcanvas" }; const webgl = new WebGL(renderingContext); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index 8905d3d..f5af330 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -1,5 +1,5 @@ -import { RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { HalfFloat } from "./third-party/HalfFloatUtility"; import { getShaderSource, loadImage } from "./utility"; @@ -12,7 +12,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false } }; const webgl = new WebGL(rc); // -- Init program @@ -208,7 +208,7 @@ import { getShaderSource, loadImage } from "./utility"; u_lightPosition: lightPosition, u_ambient: 0.1, }, - geometry:{ + geometry: { primitive: { topology: "triangle-list", cullFace: "back" }, vertices: vertexArray.vertices, indices: new Uint16Array(cubeVertexIndices), diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index dab0a03..ea9b2c2 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -1,5 +1,5 @@ -import { IPassEncoder, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IPassEncoder, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -9,7 +9,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index 639e275..b864fe4 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -1,5 +1,5 @@ -import { IIndicesDataTypes, RenderPass, IRenderPassObject, RenderPipeline, VertexAttributes, Viewport } from "@feng3d/render-api"; -import { getIVertexFormat, GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, IRenderPassObject, RenderPass, RenderPipeline, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { getIVertexFormat, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; import { getShaderSource } from "./utility"; @@ -10,7 +10,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index 66902e3..b25031a 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index e55aa24..199cdb3 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -1,5 +1,5 @@ -import { IRenderPassObject, OcclusionQuery, RenderObject, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IRenderPassObject, OcclusionQuery, RenderObject, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { watcher } from "@feng3d/watcher"; @@ -13,7 +13,7 @@ canvas.height = window.innerHeight; document.body.appendChild(canvas); // -- Init WebGL Context -const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init Program diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index 5f061cb..da28550 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -1,5 +1,5 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index 80f2d19..961e66e 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -9,7 +9,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; +const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Initialize program diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index 5f93ddc..43cc164 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -1,5 +1,5 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; const canvas = document.createElement("canvas"); @@ -8,7 +8,7 @@ canvas.width = Math.min(window.innerWidth, window.innerHeight); canvas.height = canvas.width; document.body.appendChild(canvas); -const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; +const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false }}; const webgl = new WebGL(rc); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/texture_2d_array.ts b/examples/src/WebGL2Samples/texture_2d_array.ts index 722258a..a0251e9 100644 --- a/examples/src/WebGL2Samples/texture_2d_array.ts +++ b/examples/src/WebGL2Samples/texture_2d_array.ts @@ -1,5 +1,5 @@ -import { RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; (function () @@ -10,7 +10,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.width = canvas.height * 960 / 540; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_3d.ts b/examples/src/WebGL2Samples/texture_3d.ts index f89e587..a2c184b 100644 --- a/examples/src/WebGL2Samples/texture_3d.ts +++ b/examples/src/WebGL2Samples/texture_3d.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; import { getShaderSource } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Divide viewport diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index 7c67a86..f303dc4 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource, loadImage } from "./utility"; @@ -12,7 +12,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_fetch.ts b/examples/src/WebGL2Samples/texture_fetch.ts index 6c6ae30..5a4915e 100644 --- a/examples/src/WebGL2Samples/texture_fetch.ts +++ b/examples/src/WebGL2Samples/texture_fetch.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index 4d3c707..f9deefc 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -1,5 +1,5 @@ -import { IRenderPassObject, TextureFormat, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IRenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, TextureFormat, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Viewport diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index a561f8d..ecb8a68 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -1,5 +1,5 @@ -import { RenderPass, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource, loadImage } from "./utility"; @@ -12,7 +12,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index 30e3642..d1af5ce 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -1,5 +1,5 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; import { getShaderSource, loadImage } from "./utility"; @@ -12,7 +12,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(rc); const Corners = { diff --git a/examples/src/WebGL2Samples/texture_integer.ts b/examples/src/WebGL2Samples/texture_integer.ts index bc99249..050fd98 100644 --- a/examples/src/WebGL2Samples/texture_integer.ts +++ b/examples/src/WebGL2Samples/texture_integer.ts @@ -1,5 +1,5 @@ -import { RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false }}; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index 7594c8e..4d4fb87 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -1,5 +1,5 @@ -import { RenderPass, IRenderPassObject, RenderPipeline, Sampler, Texture, RenderObject, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false }}; const webgl = new WebGL(rc); // -- Mouse Behaviour diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index 1fdc345..6d14551 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -1,5 +1,5 @@ -import { IRenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IRenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; (function () @@ -10,7 +10,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false }}; const webgl = new WebGL(rc); const Corners = { diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index 6f7e8ae..03687c1 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -1,5 +1,5 @@ -import { IIndicesDataTypes, IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { getIGLBuffer, GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { getIGLBuffer, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; (function () @@ -10,7 +10,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false }}; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index 4c9b175..c235ac8 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -1,5 +1,5 @@ -import { IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { getIGLBuffer, GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { getIGLBuffer, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -11,7 +11,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false }}; const webgl = new WebGL(rc); // -- Initialize program diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index d50ac96..a834d41 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -1,5 +1,5 @@ -import { IIndicesDataTypes, PrimitiveTopology, IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; -import { getIVertexFormat, GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, IRenderPassObject, IVertexDataTypes, PrimitiveTopology, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { getIVertexFormat, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; @@ -36,7 +36,7 @@ import { getShaderSource, loadImage } from "./utility"; canvas.height = canvas.width; document.body.appendChild(canvas); - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false }}; const webgl = new WebGL(rc); // -- Init program diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index d203459..09b4bb4 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -1,5 +1,5 @@ -import { IIndicesDataTypes, IVertexDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, GLTransformFeedback, GLTransformFeedbackObject, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, IVertexDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; +import { GLTransformFeedback, GLTransformFeedbackObject, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -12,7 +12,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // -- Init WebGL Context - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false }}; const webgl = new WebGL(rc); canvas.addEventListener("webglcontextlost", function (event) diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index 165c742..ac17730 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -1,5 +1,5 @@ -import { IIndicesDataTypes, IVertexDataTypes, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; -import { getIGLVertexBuffer, GLCanvasContext, GLTransformFeedback, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, IVertexDataTypes, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { getIGLVertexBuffer, GLTransformFeedback, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -12,7 +12,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // -- Init WebGL Context - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false }}; const webgl = new WebGL(rc); // -- Init Program diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index c6a4f74..3dcb6cd 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -1,5 +1,5 @@ -import { IIndicesDataTypes, IVertexDataTypes, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, GLTransformFeedback, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, IVertexDataTypes, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; +import { GLTransformFeedback, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -13,7 +13,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // -- Init WebGL Context - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false }}; const webgl = new WebGL(rc); // -- Init Program diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 4d166fe..4edfa39 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -1,5 +1,5 @@ -import { IIndicesDataTypes, IVertexDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; -import { GLCanvasContext, GLTransformFeedback, GLTransformFeedbackObject, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, IVertexDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; +import { GLTransformFeedback, GLTransformFeedbackObject, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -13,7 +13,7 @@ import { getShaderSource } from "./utility"; document.body.appendChild(canvas); // -- Init WebGL Context - const rc: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2", antialias: false }; + const rc: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2", webGLContextAttributes: { antialias: false } }; const webgl = new WebGL(rc); canvas.addEventListener("webglcontextlost", function (event) @@ -147,7 +147,7 @@ import { getShaderSource } from "./utility"; uniforms: { u_color: [0.0, 1.0, 1.0, 1.0], }, - geometry:{ + geometry: { draw: { __type__: "DrawVertex", vertexCount: NUM_PARTICLES }, primitive: { topology: "point-list" }, } diff --git a/examples/src/regl-examples/bunny.ts b/examples/src/regl-examples/bunny.ts index 6b97135..d3e856b 100644 --- a/examples/src/regl-examples/bunny.ts +++ b/examples/src/regl-examples/bunny.ts @@ -10,7 +10,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const webgl = new WebGL({ canvasId: "glcanvas", antialias: true }); +const webgl = new WebGL({ canvasId: "glcanvas", webGLContextAttributes: { antialias: true } }); const positions = bunny.positions.reduce((pv: number[], cv: number[]) => { @@ -31,7 +31,7 @@ let viewportWidth = canvas.clientWidth; let viewportHeight = canvas.clientHeight; const renderObject: RenderObject = { - geometry:{ + geometry: { vertices: { position: { data: new Float32Array(positions), format: "float32x3" }, }, diff --git a/examples/src/regl-examples/camera.ts b/examples/src/regl-examples/camera.ts index 0527643..27d55e2 100644 --- a/examples/src/regl-examples/camera.ts +++ b/examples/src/regl-examples/camera.ts @@ -11,7 +11,7 @@ canvas.width = window.innerWidth; canvas.height = window.innerHeight; document.body.appendChild(canvas); -const webgl = new WebGL({ canvasId: "glcanvas", antialias: true }); +const webgl = new WebGL({ canvasId: "glcanvas", webGLContextAttributes: { antialias: true } }); const camera = createCamera({ center: [0, 2.5, 0] @@ -22,7 +22,7 @@ const indices = bunny.cells.flat(); const normals = angleNormals(bunny.cells, bunny.positions).flat(); const renderObject: RenderObject = { - geometry:{ + geometry: { vertices: { position: { data: new Float32Array(positions), format: "float32x3" }, normal: { data: new Float32Array(normals), format: "float32x3" }, diff --git a/examples/src/test/RenderObjectChanges.ts b/examples/src/test/RenderObjectChanges.ts index abfa6ad..8621562 100644 --- a/examples/src/test/RenderObjectChanges.ts +++ b/examples/src/test/RenderObjectChanges.ts @@ -7,7 +7,7 @@ const init = async (canvas: HTMLCanvasElement) => canvas.width = canvas.clientWidth * devicePixelRatio; canvas.height = canvas.clientHeight * devicePixelRatio; - const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); // 初始化WebGL + const webgl = new WebGL({ canvasId: "glcanvas", webGLcontextId: "webgl" }); // 初始化WebGL const renderObject: RenderObject = { // 渲染对象 pipeline: { // 渲染管线 diff --git a/examples/src/test/fractalCube.ts b/examples/src/test/fractalCube.ts index b1890c6..0d41524 100644 --- a/examples/src/test/fractalCube.ts +++ b/examples/src/test/fractalCube.ts @@ -1,5 +1,5 @@ -import { Sampler, Submit, Texture, RenderObject } from "@feng3d/render-api"; -import { GLCanvasContext, WebGL } from "@feng3d/webgl"; +import { CanvasContext, RenderObject, Sampler, Submit, Texture } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; let cubeRotation = 0.0; @@ -13,7 +13,7 @@ async function main() { const canvas = document.querySelector("#glcanvas") as HTMLCanvasElement; - const renderingContext: GLCanvasContext = { canvasId: "glcanvas", contextId: "webgl2" }; + const renderingContext: CanvasContext = { canvasId: "glcanvas", webGLcontextId: "webgl2" }; const webgl = new WebGL(renderingContext); diff --git a/examples/src/webgl-examples/sample1.ts b/examples/src/webgl-examples/sample1.ts index 92e4a71..a63ed30 100644 --- a/examples/src/webgl-examples/sample1.ts +++ b/examples/src/webgl-examples/sample1.ts @@ -7,7 +7,7 @@ const init = async (canvas: HTMLCanvasElement) => canvas.width = canvas.clientWidth * devicePixelRatio; canvas.height = canvas.clientHeight * devicePixelRatio; - const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); // 初始化WebGL + const webgl = new WebGL({ canvasId: "glcanvas", webGLcontextId: "webgl" }); // 初始化WebGL const submit: Submit = { // 一次GPU提交 commandEncoders: [ // 命令编码列表 diff --git a/examples/src/webgl-examples/sample2.ts b/examples/src/webgl-examples/sample2.ts index 488fc85..bfc30de 100644 --- a/examples/src/webgl-examples/sample2.ts +++ b/examples/src/webgl-examples/sample2.ts @@ -10,7 +10,7 @@ function main() const { projectionMatrix, modelViewMatrix } = drawScene(canvas); - const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); + const webgl = new WebGL({ canvasId: "glcanvas", webGLcontextId: "webgl" }); const renderPass: RenderPass = { descriptor: { diff --git a/examples/src/webgl-examples/sample3.ts b/examples/src/webgl-examples/sample3.ts index 3af150d..8ab714a 100644 --- a/examples/src/webgl-examples/sample3.ts +++ b/examples/src/webgl-examples/sample3.ts @@ -14,7 +14,7 @@ function main() // Draw the scene const { projectionMatrix, modelViewMatrix } = drawScene(canvas); - const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); + const webgl = new WebGL({ canvasId: "glcanvas", webGLcontextId: "webgl" }); const renderPass: RenderPass = { descriptor: { diff --git a/examples/src/webgl-examples/sample4.ts b/examples/src/webgl-examples/sample4.ts index bb34470..af472f2 100644 --- a/examples/src/webgl-examples/sample4.ts +++ b/examples/src/webgl-examples/sample4.ts @@ -13,7 +13,7 @@ function main() { const canvas = document.querySelector("#glcanvas") as HTMLCanvasElement; - const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); + const webgl = new WebGL({ canvasId: "glcanvas", webGLcontextId: "webgl" }); const renderObject: RenderObject = { pipeline: { diff --git a/examples/src/webgl-examples/sample5.ts b/examples/src/webgl-examples/sample5.ts index 1fde12a..b84de74 100644 --- a/examples/src/webgl-examples/sample5.ts +++ b/examples/src/webgl-examples/sample5.ts @@ -13,7 +13,7 @@ function main() { const canvas = document.querySelector("#glcanvas") as HTMLCanvasElement; - const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); + const webgl = new WebGL({ canvasId: "glcanvas", webGLcontextId: "webgl" }); // Here's where we call the routine that builds all the // objects we'll be drawing. diff --git a/examples/src/webgl-examples/sample6.ts b/examples/src/webgl-examples/sample6.ts index d8b9c89..9f113df 100644 --- a/examples/src/webgl-examples/sample6.ts +++ b/examples/src/webgl-examples/sample6.ts @@ -13,7 +13,7 @@ async function main() { const canvas = document.querySelector("#glcanvas") as HTMLCanvasElement; - const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); + const webgl = new WebGL({ canvasId: "glcanvas", webGLcontextId: "webgl" }); // Here's where we call the routine that builds all the // objects we'll be drawing. diff --git a/examples/src/webgl-examples/sample7.ts b/examples/src/webgl-examples/sample7.ts index d65b6ec..8da8d86 100644 --- a/examples/src/webgl-examples/sample7.ts +++ b/examples/src/webgl-examples/sample7.ts @@ -13,7 +13,7 @@ async function main() { const canvas = document.querySelector("#glcanvas") as HTMLCanvasElement; - const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); + const webgl = new WebGL({ canvasId: "glcanvas", webGLcontextId: "webgl" }); // Here's where we call the routine that builds all the // objects we'll be drawing. diff --git a/examples/src/webgl-examples/sample8.ts b/examples/src/webgl-examples/sample8.ts index 81c9f43..1384034 100644 --- a/examples/src/webgl-examples/sample8.ts +++ b/examples/src/webgl-examples/sample8.ts @@ -15,7 +15,7 @@ function main() { const canvas = document.querySelector("#glcanvas") as HTMLCanvasElement; - const webgl = new WebGL({ canvasId: "glcanvas", contextId: "webgl" }); + const webgl = new WebGL({ canvasId: "glcanvas", webGLcontextId: "webgl" }); // Here's where we call the routine that builds all the // objects we'll be drawing. diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index eb14a15..4cf4133 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -14,8 +14,7 @@ import { _GL_Submit_Times } from "./const/const"; import { IGLUniformBufferType } from "./const/IGLUniformType"; import { GLBlitFramebuffer } from "./data/GLBlitFramebuffer"; import { GLSamplerTexture } from "./data/GLSamplerTexture"; -import { GLTransformFeedback } from "./data/GLTransformFeedback"; -import { GLTransformFeedbackObject, GLTransformFeedbackPass, GLTransformFeedbackPipeline } from "./data/GLTransformFeedbackPass"; +import { GLTransformFeedback, GLTransformFeedbackObject, GLTransformFeedbackPass, GLTransformFeedbackPipeline } from "./data/GLTransformFeedbackPass"; import { GLUniformBuffer } from "./data/GLUniformBuffer"; import { IGLDrawElementType } from "./data/polyfills/Buffer"; import { getGLTexture } from "./internal"; diff --git a/src/WebGL.ts b/src/WebGL.ts index 9edac31..d74b2a3 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -1,4 +1,4 @@ -import { Buffer, ReadPixels, RenderPassDescriptor, RenderPipeline, Sampler, Submit, Texture } from "@feng3d/render-api"; +import { Buffer, CanvasContext, ReadPixels, RenderPassDescriptor, RenderPipeline, Sampler, Submit, Texture } from "@feng3d/render-api"; import { RunWebGL } from "./RunWebGL"; import { deleteBuffer } from "./caches/getGLBuffer"; @@ -9,9 +9,8 @@ import { deleteRenderbuffer } from "./caches/getGLRenderbuffer"; import { deleteSampler } from "./caches/getGLSampler"; import { deleteTexture } from "./caches/getGLTexture"; import { deleteTransformFeedback } from "./caches/getGLTransformFeedback"; -import { GLCanvasContext } from "./data/GLCanvasContext"; import { GLRenderbuffer } from "./data/GLRenderbuffer"; -import { GLTransformFeedback } from "./data/GLTransformFeedback"; +import { GLTransformFeedback } from "./data/GLTransformFeedbackPass"; import { readPixels } from "./utils/readPixels"; /** @@ -22,10 +21,10 @@ import { readPixels } from "./utils/readPixels"; export class WebGL { private _runWebGL: RunWebGL = new RunWebGL(); - private _renderingContext: GLCanvasContext; + private _renderingContext: CanvasContext; private _gl: WebGLRenderingContext; - constructor(renderingContext?: GLCanvasContext) + constructor(renderingContext?: CanvasContext) { this._renderingContext = renderingContext; this._gl = getGLCanvasContext(this._renderingContext); diff --git a/src/caches/getGLCanvasContext.ts b/src/caches/getGLCanvasContext.ts index 3e78228..f2d0b92 100644 --- a/src/caches/getGLCanvasContext.ts +++ b/src/caches/getGLCanvasContext.ts @@ -1,4 +1,5 @@ -import { defaultGLCanvasContext, GLCanvasContext } from "../data/GLCanvasContext"; +import { CanvasContext } from "@feng3d/render-api"; +import { defaultWebGLContextAttributes } from "../data/polyfills/CanvasContext"; import { ChainMap } from "../utils/ChainMap"; import { getCapabilities } from "./getCapabilities"; @@ -8,13 +9,13 @@ import { getCapabilities } from "./getCapabilities"; * @param renderingContext * @returns */ -export function getGLCanvasContext(renderingContext: GLCanvasContext) +export function getGLCanvasContext(renderingContext: CanvasContext) { const key = renderingContext.canvasId; let value = canvasContextMap.get(key); if (!value) { - const canvas = getCanvas(renderingContext); + const canvas = getCanvas(renderingContext.canvasId); value = getWebGLContext(canvas, renderingContext); // @@ -71,23 +72,23 @@ function autoCreateCanvas(canvasId: string) return canvas; } -export function getCanvas(canvasContext: GLCanvasContext) +export function getCanvas(canvasId: string) { - let canvas = document.getElementById(canvasContext.canvasId) as HTMLCanvasElement; + let canvas = document.getElementById(canvasId) as HTMLCanvasElement; if (!canvas || !(canvas instanceof HTMLCanvasElement)) { - canvas = autoCreateCanvas(canvasContext.canvasId); + canvas = autoCreateCanvas(canvasId); } return canvas; } -function getWebGLContext(canvas: HTMLCanvasElement, canvasContext: GLCanvasContext) +function getWebGLContext(canvas: HTMLCanvasElement, canvasContext: CanvasContext) { - const contextAttributes = Object.assign({}, defaultGLCanvasContext, canvasContext); + const contextAttributes = Object.assign({}, defaultWebGLContextAttributes, canvasContext.webGLContextAttributes); // 使用用户提供参数获取WebGL上下文 - let gl = canvas.getContext(contextAttributes.contextId, contextAttributes) as any; + let gl = canvas.getContext(canvasContext.webGLcontextId, contextAttributes) as any; if (gl) return gl; gl = canvas.getContext("webgl", contextAttributes) || canvas.getContext("webgl2", contextAttributes); diff --git a/src/caches/getGLTransformFeedback.ts b/src/caches/getGLTransformFeedback.ts index 8abbd8b..9e5cdbc 100644 --- a/src/caches/getGLTransformFeedback.ts +++ b/src/caches/getGLTransformFeedback.ts @@ -1,4 +1,4 @@ -import { GLTransformFeedback } from "../data/GLTransformFeedback"; +import { GLTransformFeedback } from "../data/GLTransformFeedbackPass"; import { getIGLVertexBuffer } from "../runs/getIGLBuffer"; import { getGLBuffer } from "./getGLBuffer"; diff --git a/src/data/GLCanvasContext.ts b/src/data/GLCanvasContext.ts deleted file mode 100644 index 6e9009a..0000000 --- a/src/data/GLCanvasContext.ts +++ /dev/null @@ -1,40 +0,0 @@ - -/** - * 画布(WebGL)上下文信息。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext - */ -export interface GLCanvasContext extends WebGLContextAttributes -{ - /** - * 画布编号。 - */ - canvasId?: string; - - /** - * WebGL上下文类型 - */ - contextId?: "webgl" | "webgl2"; - - depth?: boolean; - stencil?: boolean; - antialias?: boolean; - premultipliedAlpha?: boolean; - preserveDrawingBuffer?: boolean; - powerPreference?: WebGLPowerPreference; - failIfMajorPerformanceCaveat?: boolean; -} - -/** - * 默认画布(WebGL)上下文信息。 - */ -export const defaultGLCanvasContext: GLCanvasContext = { - contextId: "webgl2", - depth: true, - stencil: true, - antialias: false, - premultipliedAlpha: true, - preserveDrawingBuffer: false, - powerPreference: "default", - failIfMajorPerformanceCaveat: false, -} diff --git a/src/data/GLCanvasTexture.ts b/src/data/GLCanvasTexture.ts deleted file mode 100644 index 5c0bd90..0000000 --- a/src/data/GLCanvasTexture.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { GLCanvasContext } from "./GLCanvasContext"; - -/** - * 画布纹理，从画布的WebGPU上下文获取纹理 - */ -export interface GLCanvasTexture -{ - context: GLCanvasContext; -} \ No newline at end of file diff --git a/src/data/GLTransformFeedback.ts b/src/data/GLTransformFeedback.ts deleted file mode 100644 index 72e70ea..0000000 --- a/src/data/GLTransformFeedback.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { IVertexDataTypes } from "@feng3d/render-api"; - -/** - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/createTransformFeedback - */ -export interface GLTransformFeedback -{ - /** - * 绑定缓冲区列表。 - */ - bindBuffers: GLTransformFeedbacBindBuffer[]; -} - -export interface GLTransformFeedbacBindBuffer -{ - index: number; - - data: IVertexDataTypes; -} \ No newline at end of file diff --git a/src/data/GLTransformFeedbackPass.ts b/src/data/GLTransformFeedbackPass.ts index 20750f5..c22d1f5 100644 --- a/src/data/GLTransformFeedbackPass.ts +++ b/src/data/GLTransformFeedbackPass.ts @@ -1,5 +1,4 @@ -import { DrawVertex, Uniforms, VertexAttributes, VertexState } from "@feng3d/render-api"; -import { GLTransformFeedback } from "./GLTransformFeedback"; +import { DrawVertex, IVertexDataTypes, Uniforms, VertexAttributes, VertexState } from "@feng3d/render-api"; declare module "@feng3d/render-api" { @@ -81,3 +80,21 @@ export interface GLTransformFeedbackVaryings */ bufferMode: "INTERLEAVED_ATTRIBS" | "SEPARATE_ATTRIBS"; } + +/** + * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/createTransformFeedback + */ +export interface GLTransformFeedback +{ + /** + * 绑定缓冲区列表。 + */ + bindBuffers: GLTransformFeedbacBindBuffer[]; +} + +export interface GLTransformFeedbacBindBuffer +{ + index: number; + + data: IVertexDataTypes; +} \ No newline at end of file diff --git a/src/data/polyfills/CanvasContext.ts b/src/data/polyfills/CanvasContext.ts new file mode 100644 index 0000000..4252e64 --- /dev/null +++ b/src/data/polyfills/CanvasContext.ts @@ -0,0 +1,34 @@ +import { CanvasContext } from "@feng3d/render-api"; + +declare module "@feng3d/render-api" +{ + /** + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext + */ + export interface CanvasContext + { + /** + * WebGL上下文类型 + */ + webGLcontextId?: "webgl" | "webgl2"; + + /** + * WebGL上下文属性。 + */ + webGLContextAttributes?: WebGLContextAttributes; + } +} + +/** + * 默认画布(WebGL)上下文信息。 + */ +export const defaultWebGLContextAttributes: WebGLContextAttributes = { + depth: true, + stencil: true, + antialias: false, + premultipliedAlpha: true, + preserveDrawingBuffer: false, + powerPreference: "default", + failIfMajorPerformanceCaveat: false, +} diff --git a/src/data/polyfills/CanvasTexture.ts b/src/data/polyfills/CanvasTexture.ts new file mode 100644 index 0000000..07a7e02 --- /dev/null +++ b/src/data/polyfills/CanvasTexture.ts @@ -0,0 +1,15 @@ +import { CanvasTexture } from "@feng3d/render-api"; + +declare module "@feng3d/render-api" +{ + /** + * 画布纹理，从画布的WebGPU上下文获取纹理 + */ + export interface CanvasTexture + { + /** + * 画布上下文 + */ + context: CanvasContext; + } +} \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index 43af358..45267e6 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,14 +1,13 @@ export * from "./data/GLBlitFramebuffer"; -export * from "./data/GLCanvasContext"; export * from "./data/GLCapabilities"; export * from "./data/GLIndexBuffer"; export * from "./data/GLRenderbuffer"; export * from "./data/GLSamplerTexture"; -export * from "./data/GLTransformFeedback"; export * from "./data/GLTransformFeedbackPass"; export * from "./data/GLUniformBuffer"; export * from "./data/GLVertexBuffer"; +export * from "./data/polyfills/CanvasContext"; export * from "./data/polyfills/Buffer"; export * from "./data/polyfills/CommandEncoder"; export * from "./data/polyfills/PrimitiveState"; -- Gitee From a2ec29de8588c9ad77a2a5eed5d533da76a50846 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 20:25:49 +0800 Subject: [PATCH 43/57] =?UTF-8?q?refactor(data):=20=E5=88=A0=E9=99=A4=20Ca?= =?UTF-8?q?nvasTexture=20=E6=8E=A5=E5=8F=A3=E5=AE=9A=E4=B9=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 删除了 src/data/polyfills/CanvasTexture.ts 文件中的 CanvasTexture 接口定义。这个接口在模块中没有实际用途，可能是一个未完成的特性或不再需要的代码。删除无用的接口定义可以简化代码结构，提高代码的可读性和维护性。 --- src/data/polyfills/CanvasTexture.ts | 15 --------------- 1 file changed, 15 deletions(-) delete mode 100644 src/data/polyfills/CanvasTexture.ts diff --git a/src/data/polyfills/CanvasTexture.ts b/src/data/polyfills/CanvasTexture.ts deleted file mode 100644 index 07a7e02..0000000 --- a/src/data/polyfills/CanvasTexture.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { CanvasTexture } from "@feng3d/render-api"; - -declare module "@feng3d/render-api" -{ - /** - * 画布纹理，从画布的WebGPU上下文获取纹理 - */ - export interface CanvasTexture - { - /** - * 画布上下文 - */ - context: CanvasContext; - } -} \ No newline at end of file -- Gitee From 47eee4a3251bbb35c23ee49fdf0db0dbb912aa85 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 22:42:56 +0800 Subject: [PATCH 44/57] =?UTF-8?q?refactor(webgl):=20=E9=87=8D=E6=9E=84=20W?= =?UTF-8?q?ebGL=20=E7=9B=B8=E5=85=B3=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 重命名部分类和接口，如 GLTransformFeedback 改为 TransformFeedback 等 - 调整部分方法的参数类型和返回类型 - 优化了缓冲区处理相关代码 - 更新了多个示例文件中的类型引用 --- examples/src/WebGL2Samples/buffer_copy.ts | 8 +-- examples/src/WebGL2Samples/fbo_blit.ts | 6 +- .../src/WebGL2Samples/texture_pixel_store.ts | 6 +- examples/src/WebGL2Samples/texture_srgb.ts | 6 +- examples/src/WebGL2Samples/texture_vertex.ts | 4 +- .../transform_feedback_instanced.ts | 14 ++--- .../transform_feedback_interleaved.ts | 14 ++--- .../transform_feedback_separated.ts | 10 +-- .../transform_feedback_separated_2.ts | 14 ++--- examples/src/regl-examples/cloth.ts | 8 +-- examples/src/regl-examples/cube.ts | 4 +- examples/src/webgl-examples/sample7.ts | 4 +- examples/src/webgl-examples/sample8.ts | 4 +- src/RunWebGL.ts | 63 ++++++++++--------- src/WebGL.ts | 8 +-- src/caches/getCapabilities.ts | 4 +- src/caches/getGLBlitFramebuffer.ts | 6 +- src/caches/getGLFramebuffer.ts | 4 +- src/caches/getGLProgram.ts | 20 +++--- ...etGLRenderPassDescriptorWithMultisample.ts | 16 ++--- src/caches/getGLRenderbuffer.ts | 8 +-- src/caches/getGLTransformFeedback.ts | 13 ++-- .../{IGLUniformType.ts => GLUniformType.ts} | 10 +-- ...LBlitFramebuffer.ts => BlitFramebuffer.ts} | 6 +- .../{GLCapabilities.ts => Capabilities.ts} | 4 +- src/data/GLIndexBuffer.ts | 19 ------ src/data/GLUniformBuffer.ts | 9 --- src/data/GLVertexBuffer.ts | 14 ----- .../{GLRenderbuffer.ts => Renderbuffer.ts} | 12 ++-- ...{GLSamplerTexture.ts => SamplerTexture.ts} | 2 +- ...edbackPass.ts => TransformFeedbackPass.ts} | 28 ++++----- src/data/polyfills/Buffer.ts | 21 ++++--- src/data/polyfills/CommandEncoder.ts | 4 +- src/data/polyfills/Uniforms.ts | 4 +- src/index.ts | 13 ++-- src/runs/getIGLBuffer.ts | 33 ++-------- src/utils/getIVertexFormat.ts | 8 +-- 37 files changed, 186 insertions(+), 245 deletions(-) rename src/const/{IGLUniformType.ts => GLUniformType.ts} (87%) rename src/data/{GLBlitFramebuffer.ts => BlitFramebuffer.ts} (80%) rename src/data/{GLCapabilities.ts => Capabilities.ts} (95%) delete mode 100644 src/data/GLIndexBuffer.ts delete mode 100644 src/data/GLUniformBuffer.ts delete mode 100644 src/data/GLVertexBuffer.ts rename src/data/{GLRenderbuffer.ts => Renderbuffer.ts} (88%) rename src/data/{GLSamplerTexture.ts => SamplerTexture.ts} (87%) rename src/data/{GLTransformFeedbackPass.ts => TransformFeedbackPass.ts} (66%) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index f8b9f54..4c8c588 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -1,5 +1,5 @@ -import { CanvasContext, CopyBufferToBuffer, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; -import { GLVertexBuffer, WebGL, getIGLBuffer } from "@feng3d/webgl"; +import { Buffer, CanvasContext, CopyBufferToBuffer, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { WebGL, getIGLBuffer } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -29,7 +29,7 @@ import { getShaderSource } from "./utility"; -1.0, 1.0, -1.0, -1.0 ]); - const vertexPosBufferSrc: GLVertexBuffer = { target: "ARRAY_BUFFER", size: vertices.byteLength, data: vertices, usage: "STATIC_DRAW" }; + const vertexPosBufferSrc: Buffer = { target: "ARRAY_BUFFER", size: vertices.byteLength, data: vertices, usage: "STATIC_DRAW" }; const vertexPosBufferDst = new Float32Array(vertices.length); @@ -52,7 +52,7 @@ import { getShaderSource } from "./utility"; descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ pipeline: program, - geometry:{ + geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, draw: { __type__: "DrawVertex", vertexCount: 6 }, diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index 9184278..e042fab 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -1,5 +1,5 @@ import { CanvasContext, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, TextureView, VertexAttributes } from "@feng3d/render-api"; -import { GLBlitFramebuffer, GLBlitFramebufferItem, WebGL } from "@feng3d/webgl"; +import { BlitFramebuffer, BlitFramebufferItem, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; const canvas = document.createElement("canvas"); @@ -120,7 +120,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => descriptor: framebufferResolve, }; - const blitFramebuffers: GLBlitFramebufferItem[] = []; + const blitFramebuffers: BlitFramebufferItem[] = []; const TILE = 4; const BORDER = 2; for (let j = 0; j < TILE; j++) @@ -143,7 +143,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => } } - const blitFramebuffer: GLBlitFramebuffer = { + const blitFramebuffer: BlitFramebuffer = { __type__: "BlitFramebuffer", read: fboRenderPass.descriptor, draw: renderPassResolve.descriptor, diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index 03687c1..05e96e5 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IIndicesDataTypes, IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, IIndicesDataTypes, IRenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, VertexDataTypes } from "@feng3d/render-api"; import { getIGLBuffer, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -27,7 +27,7 @@ import { getShaderSource, loadImage } from "./utility"; -1.0, 1.0, -1.0, -1.0 ]); - const vertexPosBuffer: IVertexDataTypes = positions; + const vertexPosBuffer: VertexDataTypes = positions; const texCoords = new Float32Array([ 0.0, 1.0, @@ -37,7 +37,7 @@ import { getShaderSource, loadImage } from "./utility"; 0.0, 0.0, 0.0, 1.0 ]); - const vertexTexBuffer: IVertexDataTypes = texCoords; + const vertexTexBuffer: VertexDataTypes = texCoords; // -- Init VertexArray const vertexArray: { vertices?: VertexAttributes, indices?: IIndicesDataTypes } = { diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index c235ac8..3ab690d 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, IVertexDataTypes, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, IRenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, VertexDataTypes } from "@feng3d/render-api"; import { getIGLBuffer, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -30,7 +30,7 @@ import { getShaderSource, loadImage } from "./utility"; -1.0, 1.0, -1.0, -1.0 ]); - const vertexPosBuffer: IVertexDataTypes = positions; + const vertexPosBuffer: VertexDataTypes = positions; const texcoords = new Float32Array([ 0.0, 1.0, @@ -40,7 +40,7 @@ import { getShaderSource, loadImage } from "./utility"; 0.0, 0.0, 0.0, 1.0 ]); - const vertexTexBuffer: IVertexDataTypes = texcoords; + const vertexTexBuffer: VertexDataTypes = texcoords; // -- Initialize vertex array diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index a834d41..aa610bc 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IIndicesDataTypes, IRenderPassObject, IVertexDataTypes, PrimitiveTopology, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, IIndicesDataTypes, IRenderPassObject, PrimitiveTopology, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, VertexDataTypes } from "@feng3d/render-api"; import { getIVertexFormat, WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -50,7 +50,7 @@ import { getShaderSource, loadImage } from "./utility"; // var in loop let mesh; let primitive: Primitive; - let vertexBuffer: IVertexDataTypes; + let vertexBuffer: VertexDataTypes; let indicesBuffer: IIndicesDataTypes; let texture: Texture; diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index 09b4bb4..c0bdeed 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -1,5 +1,5 @@ -import { CanvasContext, IIndicesDataTypes, IVertexDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; -import { GLTransformFeedback, GLTransformFeedbackObject, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes, VertexDataTypes } from "@feng3d/render-api"; +import { TransformFeedback, TransformFeedbackObject, TransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -68,9 +68,9 @@ import { getShaderSource } from "./utility"; const vertexArrays: { vertices?: VertexAttributes, indices?: IIndicesDataTypes }[][] = []; // Transform feedback objects track output buffer state - const transformFeedbacks: GLTransformFeedback[] = []; + const transformFeedbacks: TransformFeedback[] = []; - const vertexBuffers: IVertexDataTypes[][] = new Array(vertexArrays.length); + const vertexBuffers: VertexDataTypes[][] = new Array(vertexArrays.length); for (let i = 0; i < 2; ++i) { @@ -107,7 +107,7 @@ import { getShaderSource } from "./utility"; function initPrograms() { - const programTransform: GLTransformFeedbackPipeline = { + const programTransform: TransformFeedbackPipeline = { vertex: { code: getShaderSource("vs-emit") }, transformFeedbackVaryings: { varyings: ["v_offset", "v_rotation"], bufferMode: "SEPARATE_ATTRIBS" }, }; @@ -125,12 +125,12 @@ import { getShaderSource } from "./utility"; }, }; - const programs: [GLTransformFeedbackPipeline, RenderPipeline] = [programTransform, programDraw]; + const programs: [TransformFeedbackPipeline, RenderPipeline] = [programTransform, programDraw]; return programs; } - const transformRO: GLTransformFeedbackObject = { + const transformRO: TransformFeedbackObject = { pipeline: programs[PROGRAM_TRANSFORM], vertices: null, transformFeedback: null, diff --git a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts index ac17730..5c8d459 100644 --- a/examples/src/WebGL2Samples/transform_feedback_interleaved.ts +++ b/examples/src/WebGL2Samples/transform_feedback_interleaved.ts @@ -1,5 +1,5 @@ -import { CanvasContext, IIndicesDataTypes, IVertexDataTypes, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; -import { getIGLVertexBuffer, GLTransformFeedback, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, RenderPipeline, VertexAttributes, VertexDataTypes } from "@feng3d/render-api"; +import { getIGLBuffer, TransformFeedback, TransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; (function () @@ -21,7 +21,7 @@ import { getShaderSource } from "./utility"; const programTransform = (function (vertexShaderSourceTransform, fragmentShaderSourceTransform) { - const programTransform: GLTransformFeedbackPipeline = { + const programTransform: TransformFeedbackPipeline = { vertex: { code: vertexShaderSourceTransform }, transformFeedbackVaryings: { varyings: ["gl_Position", "v_color"], bufferMode: "INTERLEAVED_ATTRIBS" }, }; @@ -45,7 +45,7 @@ import { getShaderSource } from "./utility"; -1.0, -1.0, 0.0, 1.0 ]); - const buffers: IVertexDataTypes[] = [ + const buffers: VertexDataTypes[] = [ // Transform buffer vertices, // Feedback empty buffer @@ -68,7 +68,7 @@ import { getShaderSource } from "./utility"; ]; // -- Init TransformFeedback - const transformFeedback: GLTransformFeedback = { + const transformFeedback: TransformFeedback = { bindBuffers: [ { index: 0, data: buffers[PROGRAM_FEEDBACK] } ] @@ -118,8 +118,8 @@ import { getShaderSource } from "./utility"; // -- Delete WebGL resources webgl.deleteTransformFeedback(transformFeedback); - webgl.deleteBuffer(getIGLVertexBuffer(buffers[PROGRAM_TRANSFORM])); - webgl.deleteBuffer(getIGLVertexBuffer(buffers[PROGRAM_FEEDBACK])); + webgl.deleteBuffer(getIGLBuffer(buffers[PROGRAM_TRANSFORM])); + webgl.deleteBuffer(getIGLBuffer(buffers[PROGRAM_FEEDBACK])); webgl.deleteProgram(programTransform); webgl.deleteProgram(programFeedback); })(); diff --git a/examples/src/WebGL2Samples/transform_feedback_separated.ts b/examples/src/WebGL2Samples/transform_feedback_separated.ts index 3dcb6cd..ea4ba53 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated.ts @@ -1,5 +1,5 @@ -import { CanvasContext, IIndicesDataTypes, IVertexDataTypes, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; -import { GLTransformFeedback, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, VertexDataTypes, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; +import { TransformFeedback, TransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -19,7 +19,7 @@ import { getShaderSource } from "./utility"; // -- Init Program const programTransform = (function (vertexShaderSourceTransform, fragmentShaderSourceTransform) { - const transformFeedbackPipeline: GLTransformFeedbackPipeline = { + const transformFeedbackPipeline: TransformFeedbackPipeline = { vertex: { code: vertexShaderSourceTransform }, transformFeedbackVaryings: { varyings: ["gl_Position", "v_color"], bufferMode: "SEPARATE_ATTRIBS" }, }; @@ -54,7 +54,7 @@ import { getShaderSource } from "./utility"; MAX: 3 }; - const buffers: IVertexDataTypes[] = [ + const buffers: VertexDataTypes[] = [ // Transform buffer positions, // Feedback empty buffers @@ -78,7 +78,7 @@ import { getShaderSource } from "./utility"; ]; // -- Init TransformFeedback - const transformFeedback: GLTransformFeedback = { + const transformFeedback: TransformFeedback = { bindBuffers: [ { index: 0, data: buffers[BufferType.POSITION] }, { index: 1, data: buffers[BufferType.COLOR] }, diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 4edfa39..5791fd7 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -1,5 +1,5 @@ -import { CanvasContext, IIndicesDataTypes, IVertexDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes } from "@feng3d/render-api"; -import { GLTransformFeedback, GLTransformFeedbackObject, GLTransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, RenderObject, RenderPipeline, Submit, VertexAttributes, VertexDataTypes } from "@feng3d/render-api"; +import { TransformFeedback, TransformFeedbackObject, TransformFeedbackPipeline, WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -61,9 +61,9 @@ import { getShaderSource } from "./utility"; const vertexArrays: { vertices?: VertexAttributes, indices?: IIndicesDataTypes }[][] = []; // Transform feedback objects track output buffer state - const transformFeedbacks: GLTransformFeedback[] = []; + const transformFeedbacks: TransformFeedback[] = []; - const vertexBuffers: IVertexDataTypes[][] = new Array(vertexArrays.length); + const vertexBuffers: VertexDataTypes[][] = new Array(vertexArrays.length); for (let i = 0; i < 2; ++i) { @@ -108,9 +108,9 @@ import { getShaderSource } from "./utility"; }; } - function initProgram(): [GLTransformFeedbackPipeline, RenderPipeline] + function initProgram(): [TransformFeedbackPipeline, RenderPipeline] { - const transformFeedbackPipeline: GLTransformFeedbackPipeline = { + const transformFeedbackPipeline: TransformFeedbackPipeline = { vertex: { code: getShaderSource("vs-emit") }, transformFeedbackVaryings: { varyings: ["v_position", "v_velocity", "v_spawntime", "v_lifetime"], bufferMode: "SEPARATE_ATTRIBS" }, }; @@ -131,7 +131,7 @@ import { getShaderSource } from "./utility"; return [transformFeedbackPipeline, program]; } - const transformRO: GLTransformFeedbackObject = { + const transformRO: TransformFeedbackObject = { pipeline: transformFeedbackPipeline, vertices: null, transformFeedback: null, diff --git a/examples/src/regl-examples/cloth.ts b/examples/src/regl-examples/cloth.ts index 9cfae98..b0b706f 100644 --- a/examples/src/regl-examples/cloth.ts +++ b/examples/src/regl-examples/cloth.ts @@ -1,5 +1,5 @@ import { RenderObject, Submit } from "@feng3d/render-api"; -import { getIGLVertexBuffer, GLSamplerTexture, WebGL } from "@feng3d/webgl"; +import { getIGLBuffer, SamplerTexture, WebGL } from "@feng3d/webgl"; import { fit } from "./hughsk/canvas-fit"; import { attachCamera } from "./hughsk/canvas-orbit-camera"; @@ -361,8 +361,8 @@ import * as vec3 from "./stackgl/gl-vec3"; return pv; }, []); - getIGLVertexBuffer(renderObject.geometry.vertices.position.data).data = new Float32Array(positions); - getIGLVertexBuffer(renderObject.geometry.vertices.normal.data).data = new Float32Array(normals); + getIGLBuffer(renderObject.geometry.vertices.position.data).data = new Float32Array(positions); + getIGLBuffer(renderObject.geometry.vertices.normal.data).data = new Float32Array(normals); tick++; @@ -388,7 +388,7 @@ import * as vec3 from "./stackgl/gl-vec3"; img.src = "../../assets/cloth.png"; await img.decode(); - const diffuse: GLSamplerTexture = { + const diffuse: SamplerTexture = { texture: { size: [img.width, img.height], generateMipmap: true, diff --git a/examples/src/regl-examples/cube.ts b/examples/src/regl-examples/cube.ts index 3e51c65..4e3cab8 100644 --- a/examples/src/regl-examples/cube.ts +++ b/examples/src/regl-examples/cube.ts @@ -1,5 +1,5 @@ import { RenderObject, Submit } from "@feng3d/render-api"; -import { GLSamplerTexture, WebGL } from "@feng3d/webgl"; +import { SamplerTexture, WebGL } from "@feng3d/webgl"; import * as mat4 from "./stackgl/gl-mat4"; (async () => @@ -136,7 +136,7 @@ import * as mat4 from "./stackgl/gl-mat4"; img.src = "../../assets/peppers.png"; await img.decode(); - const diffuse: GLSamplerTexture = { + const diffuse: SamplerTexture = { texture: { size: [img.width, img.height], sources: [{ image: img }] diff --git a/examples/src/webgl-examples/sample7.ts b/examples/src/webgl-examples/sample7.ts index 8da8d86..d5816ff 100644 --- a/examples/src/webgl-examples/sample7.ts +++ b/examples/src/webgl-examples/sample7.ts @@ -1,5 +1,5 @@ import { RenderPass, Sampler, Texture, RenderObject } from "@feng3d/render-api"; -import { GLSamplerTexture, WebGL } from "@feng3d/webgl"; +import { SamplerTexture, WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; let cubeRotation = 0.0; @@ -304,7 +304,7 @@ async function loadTexture(url: string) sampler = { addressModeU: "clamp-to-edge", addressModeV: "clamp-to-edge", minFilter: "linear" }; } - return { texture, sampler } as GLSamplerTexture; + return { texture, sampler } as SamplerTexture; } function isPowerOf2(value: number) diff --git a/examples/src/webgl-examples/sample8.ts b/examples/src/webgl-examples/sample8.ts index 1384034..441e319 100644 --- a/examples/src/webgl-examples/sample8.ts +++ b/examples/src/webgl-examples/sample8.ts @@ -1,5 +1,5 @@ import { RenderObject, RenderPass, Sampler, Texture } from "@feng3d/render-api"; -import { GLSamplerTexture, WebGL } from "@feng3d/webgl"; +import { SamplerTexture, WebGL } from "@feng3d/webgl"; import { mat4 } from "gl-matrix"; let cubeRotation = 0.0; @@ -320,7 +320,7 @@ function initBuffers() // // Initialize a texture. // -function initTexture(): GLSamplerTexture +function initTexture(): SamplerTexture { const texture: Texture = { size: [1, 1], diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 4cf4133..9b670db 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, CullFace, DepthStencilState, DrawIndexed, DrawVertex, FrontFace, IIndicesDataTypes, IRenderPassObject, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { BlendComponent, BlendState, Buffer, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, CullFace, DepthStencilState, DrawIndexed, DrawVertex, FrontFace, IIndicesDataTypes, IRenderPassObject, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; import { getGLBlitFramebuffer } from "./caches/getGLBlitFramebuffer"; import { getGLBuffer } from "./caches/getGLBuffer"; @@ -11,14 +11,13 @@ import { getGLSampler, getIGLTextureMagFilter, getIGLTextureMinFilter, getIGLTex import { getGLTextureTarget, GLTextureTarget } from "./caches/getGLTextureTarget"; import { getGLTransformFeedback } from "./caches/getGLTransformFeedback"; import { _GL_Submit_Times } from "./const/const"; -import { IGLUniformBufferType } from "./const/IGLUniformType"; -import { GLBlitFramebuffer } from "./data/GLBlitFramebuffer"; -import { GLSamplerTexture } from "./data/GLSamplerTexture"; -import { GLTransformFeedback, GLTransformFeedbackObject, GLTransformFeedbackPass, GLTransformFeedbackPipeline } from "./data/GLTransformFeedbackPass"; -import { GLUniformBuffer } from "./data/GLUniformBuffer"; -import { IGLDrawElementType } from "./data/polyfills/Buffer"; +import { GLUniformBufferType } from "./const/GLUniformType"; +import { BlitFramebuffer } from "./data/BlitFramebuffer"; +import { SamplerTexture } from "./data/SamplerTexture"; +import { TransformFeedback, TransformFeedbackObject, TransformFeedbackPass, TransformFeedbackPipeline } from "./data/TransformFeedbackPass"; +import { DrawElementType } from "./data/polyfills/Buffer"; import { getGLTexture } from "./internal"; -import { getIGLIndexBuffer, getIGLUniformBuffer, getIGLVertexBuffer } from "./runs/getIGLBuffer"; +import { getIGLBuffer } from "./runs/getIGLBuffer"; import { getIGLBlendEquation, getIGLBlendFactor, IGLBlendEquation, IGLBlendFactor } from "./runs/runColorTargetStates"; import { getIGLCompareFunction } from "./runs/runDepthState"; import { getIGLStencilFunc, getIGLStencilOp } from "./runs/runStencilState"; @@ -29,7 +28,7 @@ import { getIGLFrontFace, IGLFrontFace } from "./utils/getIGLFrontFace"; import { getIGLVertexFormat } from "./utils/getIVertexFormat"; import { updateBufferBinding } from "./utils/updateBufferBinding"; -import "./data/OcclusionQuery"; +import "./data/polyfills/OcclusionQuery"; declare global { @@ -104,7 +103,7 @@ export class RunWebGL }); } - protected runTransformFeedbackPass(gl: WebGLRenderingContext, transformFeedbackPass: GLTransformFeedbackPass) + protected runTransformFeedbackPass(gl: WebGLRenderingContext, transformFeedbackPass: TransformFeedbackPass) { // 执行变换反馈通道时关闭光栅化功能 if (gl instanceof WebGL2RenderingContext) @@ -226,7 +225,7 @@ export class RunWebGL } } - private runTransformFeedbackObject(gl: WebGLRenderingContext, renderObject: GLTransformFeedbackObject) + private runTransformFeedbackObject(gl: WebGLRenderingContext, renderObject: TransformFeedbackObject) { const { pipeline: material, vertices, uniforms, transformFeedback, draw } = renderObject; @@ -245,7 +244,7 @@ export class RunWebGL this.endTransformFeedback(gl, transformFeedback); } - private endTransformFeedback(gl: WebGLRenderingContext, transformFeedback: GLTransformFeedback) + private endTransformFeedback(gl: WebGLRenderingContext, transformFeedback: TransformFeedback) { // if (transformFeedback) @@ -262,7 +261,7 @@ export class RunWebGL private runDrawIndexed(gl: WebGLRenderingContext, drawMode: GLDrawMode, indices: IIndicesDataTypes, drawIndexed: DrawIndexed) { - const type: IGLDrawElementType = indices.BYTES_PER_ELEMENT === 2 ? "UNSIGNED_SHORT" : "UNSIGNED_INT"; + const type: DrawElementType = indices.BYTES_PER_ELEMENT === 2 ? "UNSIGNED_SHORT" : "UNSIGNED_INT"; // const indexCount = drawIndexed.indexCount; const firstIndex = drawIndexed.firstIndex || 0; @@ -342,11 +341,11 @@ export class RunWebGL if (isTexture) { - this.runSamplerTexture(gl, v, uniformData as GLSamplerTexture); + this.runSamplerTexture(gl, v, uniformData as SamplerTexture); } else { - this.runUniform(gl, type as IGLUniformBufferType, v, uniformData); + this.runUniform(gl, type as GLUniformBufferType, v, uniformData); } }); }); @@ -359,19 +358,18 @@ export class RunWebGL const uniformData = uniforms[name] as TypedArray | BufferBinding; // - let buffer: GLUniformBuffer; - const typedArray = uniformData as TypedArray; - if (typedArray.buffer && typedArray.BYTES_PER_ELEMENT) - { - buffer = getIGLUniformBuffer(typedArray); - } - else + let typedArray = uniformData as TypedArray; + if (!(typedArray.buffer && typedArray.BYTES_PER_ELEMENT)) { const bufferBinding = uniforms[name] as BufferBinding; updateBufferBinding(uniformBlock.bufferBindingInfo, bufferBinding); - buffer = getIGLUniformBuffer(bufferBinding.bufferView); + typedArray = bufferBinding.bufferView; } - (buffer as UnReadonly).label = buffer.label || (`UniformBuffer ${name}`); + const buffer = getIGLBuffer(typedArray, "UNIFORM_BUFFER", "DYNAMIC_DRAW"); + buffer.target ??= "UNIFORM_BUFFER"; + buffer.usage ??= "DYNAMIC_DRAW"; + + (buffer as UnReadonly).label = buffer.label || (`UniformBuffer ${name}`); // const webGLBuffer = getGLBuffer(gl, buffer); @@ -380,7 +378,7 @@ export class RunWebGL } } - private runSamplerTexture(gl: WebGLRenderingContext, uniformInfo: UniformItemInfo, samplerTexture: GLSamplerTexture) + private runSamplerTexture(gl: WebGLRenderingContext, uniformInfo: UniformItemInfo, samplerTexture: SamplerTexture) { const { texture, sampler } = samplerTexture; const { location, textureID } = uniformInfo; @@ -457,7 +455,7 @@ export class RunWebGL /** * 设置环境Uniform数据 */ - private runUniform(gl: WebGLRenderingContext, type: IGLUniformBufferType, uniformInfo: UniformItemInfo, data: any) + private runUniform(gl: WebGLRenderingContext, type: GLUniformBufferType, uniformInfo: UniformItemInfo, data: any) { if (typeof data === "number") { @@ -587,7 +585,9 @@ export class RunWebGL { if (!indices) return; - const indexBuffer = getIGLIndexBuffer(indices); + const indexBuffer = getIGLBuffer(indices, "ELEMENT_ARRAY_BUFFER"); + indexBuffer.target ??= "ELEMENT_ARRAY_BUFFER"; + indexBuffer.usage ??= "STATIC_DRAW"; const buffer = getGLBuffer(gl, indexBuffer); gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, buffer); @@ -621,7 +621,8 @@ export class RunWebGL offset = offset || 0; // - const buffer = getIGLVertexBuffer(attribute.data); + const buffer = getIGLBuffer(attribute.data, "ARRAY_BUFFER", "STATIC_DRAW"); + const webGLBuffer = getGLBuffer(gl, buffer); gl.bindBuffer(gl.ARRAY_BUFFER, webGLBuffer); @@ -636,7 +637,7 @@ export class RunWebGL } } - private runTransformFeedback(gl: WebGLRenderingContext, transformFeedback: GLTransformFeedback, topology: GLDrawMode) + private runTransformFeedback(gl: WebGLRenderingContext, transformFeedback: TransformFeedback, topology: GLDrawMode) { if (gl instanceof WebGL2RenderingContext) { @@ -659,7 +660,7 @@ export class RunWebGL } } - private runTransformFeedbackPipeline(gl: WebGLRenderingContext, renderPipeline: GLTransformFeedbackPipeline) + private runTransformFeedbackPipeline(gl: WebGLRenderingContext, renderPipeline: TransformFeedbackPipeline) { const program = getGLProgram(gl, renderPipeline); gl.useProgram(program); @@ -884,7 +885,7 @@ export class RunWebGL this.runBlitFramebuffer(gl, blitFramebuffer); } - private runBlitFramebuffer(gl: WebGLRenderingContext, blitFramebuffer: GLBlitFramebuffer) + private runBlitFramebuffer(gl: WebGLRenderingContext, blitFramebuffer: BlitFramebuffer) { const { read, draw, blitFramebuffers } = blitFramebuffer; diff --git a/src/WebGL.ts b/src/WebGL.ts index d74b2a3..dee1ce4 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -9,8 +9,8 @@ import { deleteRenderbuffer } from "./caches/getGLRenderbuffer"; import { deleteSampler } from "./caches/getGLSampler"; import { deleteTexture } from "./caches/getGLTexture"; import { deleteTransformFeedback } from "./caches/getGLTransformFeedback"; -import { GLRenderbuffer } from "./data/GLRenderbuffer"; -import { GLTransformFeedback } from "./data/GLTransformFeedbackPass"; +import { Renderbuffer } from "./data/Renderbuffer"; +import { TransformFeedback } from "./data/TransformFeedbackPass"; import { readPixels } from "./utils/readPixels"; /** @@ -53,7 +53,7 @@ export class WebGL deleteFramebuffer(this._gl, passDescriptor); } - deleteRenderbuffer(renderbuffer: GLRenderbuffer) + deleteRenderbuffer(renderbuffer: Renderbuffer) { deleteRenderbuffer(this._gl, renderbuffer); } @@ -78,7 +78,7 @@ export class WebGL deleteProgram(this._gl, material); } - deleteTransformFeedback(transformFeedback: GLTransformFeedback) + deleteTransformFeedback(transformFeedback: TransformFeedback) { deleteTransformFeedback(this._gl, transformFeedback); } diff --git a/src/caches/getCapabilities.ts b/src/caches/getCapabilities.ts index 381d1b2..b923e9f 100644 --- a/src/caches/getCapabilities.ts +++ b/src/caches/getCapabilities.ts @@ -1,8 +1,8 @@ -import { GLCapabilities } from "../data/GLCapabilities"; +import { Capabilities } from "../data/Capabilities"; export function getCapabilities(gl: WebGLRenderingContext, precision: "highp" | "mediump" | "lowp" = "highp") { - const capabilities: GLCapabilities = {} as any; + const capabilities: Capabilities = {} as any; gl._capabilities = capabilities; // capabilities.maxAnisotropy = gl.getExtension("EXT_texture_filter_anisotropic") ? gl.getParameter(gl.getExtension("EXT_texture_filter_anisotropic").MAX_TEXTURE_MAX_ANISOTROPY_EXT) : 0; diff --git a/src/caches/getGLBlitFramebuffer.ts b/src/caches/getGLBlitFramebuffer.ts index 4bc1f58..7f88f83 100644 --- a/src/caches/getGLBlitFramebuffer.ts +++ b/src/caches/getGLBlitFramebuffer.ts @@ -1,5 +1,5 @@ import { CopyTextureToTexture, ImageCopyTexture, RenderPassColorAttachment, RenderPassDepthStencilAttachment, TextureView } from "@feng3d/render-api"; -import { GLBlitFramebuffer, GLBlitFramebufferItem } from "../data/GLBlitFramebuffer"; +import { BlitFramebuffer, BlitFramebufferItem } from "../data/BlitFramebuffer"; /** * 通过 IGLBlitFramebuffer 实现纹理之间拷贝并不靠谱。 @@ -45,13 +45,13 @@ export function getGLBlitFramebuffer(copyTextureToTexture: CopyTextureToTexture) const sourceOrigin = source.origin || [0, 0]; const destinationOrigin = destination.origin || [0, 0]; // - const blitFramebufferItem: GLBlitFramebufferItem = [ + const blitFramebufferItem: BlitFramebufferItem = [ sourceOrigin[0], sourceOrigin[1], sourceOrigin[0] + copySize[0], sourceOrigin[1] + copySize[1], destinationOrigin[0], destinationOrigin[1], destinationOrigin[0] + copySize[0], destinationOrigin[1] + copySize[1], mask, "NEAREST", ]; - const blitFramebuffer: GLBlitFramebuffer = { + const blitFramebuffer: BlitFramebuffer = { __type__: "BlitFramebuffer", read: { colorAttachments: sourceColorAttachments, diff --git a/src/caches/getGLFramebuffer.ts b/src/caches/getGLFramebuffer.ts index 1996a99..ec3fb10 100644 --- a/src/caches/getGLFramebuffer.ts +++ b/src/caches/getGLFramebuffer.ts @@ -1,5 +1,5 @@ import { RenderPassDescriptor, TextureView } from "@feng3d/render-api"; -import { GLRenderbuffer } from "../data/GLRenderbuffer"; +import { Renderbuffer } from "../data/Renderbuffer"; import { deleteRenderbuffer, getGLRenderbuffer } from "./getGLRenderbuffer"; import { _IGLRenderPassDescriptorWithMultisample, GLRenderPassDescriptorWithMultisample } from "./getGLRenderPassDescriptorWithMultisample"; import { getGLTexture } from "./getGLTexture"; @@ -34,7 +34,7 @@ export function getGLFramebuffer(gl: WebGLRenderingContext, passDescriptor: Rend const drawBuffers: number[] = []; passDescriptor.colorAttachments?.forEach((item, i) => { - const view = item.view as (TextureView | GLRenderbuffer); + const view = item.view as (TextureView | Renderbuffer); const attachment = gl[`COLOR_ATTACHMENT${i}`]; drawBuffers.push(attachment); if ("texture" in view) diff --git a/src/caches/getGLProgram.ts b/src/caches/getGLProgram.ts index ec95700..c501037 100644 --- a/src/caches/getGLProgram.ts +++ b/src/caches/getGLProgram.ts @@ -1,6 +1,6 @@ import { GLVertexAttributeTypes, RenderPipeline } from "@feng3d/render-api"; -import { getWebGLUniformType, IGLUniformBufferType, IGLUniformType, isWebGLUniformTextureType } from "../const/IGLUniformType"; -import { GLTransformFeedbackPipeline, GLTransformFeedbackVaryings } from "../data/GLTransformFeedbackPass"; +import { getWebGLUniformType, GLUniformBufferType, GLUniformType, isWebGLUniformTextureType } from "../const/GLUniformType"; +import { TransformFeedbackPipeline, TransformFeedbackVaryings } from "../data/TransformFeedbackPass"; declare global { @@ -59,7 +59,7 @@ export interface IGLAttributeInfo /** * 激活渲染程序 */ -export function getGLProgram(gl: WebGLRenderingContext, material: RenderPipeline | GLTransformFeedbackPipeline) +export function getGLProgram(gl: WebGLRenderingContext, material: RenderPipeline | TransformFeedbackPipeline) { const shaderKey = getKey(material); let result = gl._programs[shaderKey]; @@ -74,7 +74,7 @@ export function getGLProgram(gl: WebGLRenderingContext, material: RenderPipeline { } `; - const transformFeedbackVaryings = (material as GLTransformFeedbackPipeline).transformFeedbackVaryings; + const transformFeedbackVaryings = (material as TransformFeedbackPipeline).transformFeedbackVaryings; result = getWebGLProgram(gl, vertex, fragment, transformFeedbackVaryings); gl._programs[shaderKey] = result; @@ -93,16 +93,16 @@ export function deleteProgram(gl: WebGLRenderingContext, material: RenderPipelin } } -function getKey(material: RenderPipeline | GLTransformFeedbackPipeline) +function getKey(material: RenderPipeline | TransformFeedbackPipeline) { const vertex = material.vertex.code; const fragment = (material as RenderPipeline).fragment?.code; - const transformFeedbackVaryings = (material as GLTransformFeedbackPipeline).transformFeedbackVaryings; + const transformFeedbackVaryings = (material as TransformFeedbackPipeline).transformFeedbackVaryings; return `---vertexShader---\n${vertex}\n---fragment---\n${fragment}\n---feedback---${transformFeedbackVaryings?.varyings.toString()} ${transformFeedbackVaryings?.bufferMode}`; } -function getWebGLProgram(gl: WebGLRenderingContext, vshader: string, fshader: string, transformFeedbackVaryings: GLTransformFeedbackVaryings) +function getWebGLProgram(gl: WebGLRenderingContext, vshader: string, fshader: string, transformFeedbackVaryings: TransformFeedbackVaryings) { // 编译顶点着色器 const vertexShader = getWebGLShader(gl, "VERTEX_SHADER", vshader); @@ -277,7 +277,7 @@ function getWebGLShader(gl: WebGLRenderingContext, type: ShaderType, code: strin return shader; } -function createLinkProgram(gl: WebGLRenderingContext, vertexShader: WebGLShader, fragmentShader: WebGLShader, transformFeedbackVaryings: GLTransformFeedbackVaryings) +function createLinkProgram(gl: WebGLRenderingContext, vertexShader: WebGLShader, fragmentShader: WebGLShader, transformFeedbackVaryings: TransformFeedbackVaryings) { // 创建程序对象 const program = gl.createProgram(); @@ -346,7 +346,7 @@ function getBufferBindingInfo(uniformBlock: UniformBlockInfo): IBufferBindingInf const items: { paths: string[], offset: number, size: number, Cls: Float32ArrayConstructor | Int32ArrayConstructor | Uint32ArrayConstructor }[] = []; uniformBlock.uniforms.forEach((uniformInfo) => { - const uniformBufferType = uniformInfo.type as IGLUniformBufferType; + const uniformBufferType = uniformInfo.type as GLUniformBufferType; const alignSize = uniformBufferTypeAlignSizeMap[uniformBufferType]; console.assert(alignSize, `没有找到 ${uniformBufferType} 统一缓冲类型对应的对齐与尺寸。`); @@ -440,7 +440,7 @@ export interface GLUniformInfo */ name: string; - type: IGLUniformType; + type: GLUniformType; /** * 是否纹理。 diff --git a/src/caches/getGLRenderPassDescriptorWithMultisample.ts b/src/caches/getGLRenderPassDescriptorWithMultisample.ts index 3e00839..d9652f3 100644 --- a/src/caches/getGLRenderPassDescriptorWithMultisample.ts +++ b/src/caches/getGLRenderPassDescriptorWithMultisample.ts @@ -1,6 +1,6 @@ import { RenderPassColorAttachment, RenderPassDescriptor, TextureFormat, TextureView } from "@feng3d/render-api"; -import { GLBlitFramebuffer } from "../data/GLBlitFramebuffer"; -import { GLRenderbufferInternalformat, GLRenderbuffer } from "../data/GLRenderbuffer"; +import { BlitFramebuffer } from "../data/BlitFramebuffer"; +import { RenderbufferInternalformat, Renderbuffer } from "../data/Renderbuffer"; import { getGLTextureFormats } from "./getGLTextureFormats"; /** @@ -19,7 +19,7 @@ export function getGLRenderPassDescriptorWithMultisample(sourcePassDescriptor: R const textureSize = texture.size; - const renderbuffers: GLRenderbuffer[] = []; + const renderbuffers: Renderbuffer[] = []; // 创建支持 多重采样的 渲染通道 const passDescriptor: RenderPassDescriptor = { @@ -27,7 +27,7 @@ export function getGLRenderPassDescriptorWithMultisample(sourcePassDescriptor: R { const texture = v.view.texture; - const renderbuffer: GLRenderbuffer = { + const renderbuffer: Renderbuffer = { internalformat: getGLRenderbufferInternalformat(texture.format), width: textureSize[0], height: textureSize[1], @@ -46,7 +46,7 @@ export function getGLRenderPassDescriptorWithMultisample(sourcePassDescriptor: R }; // 拷贝 渲染缓冲区到 IGLTexture - const blitFramebuffer: GLBlitFramebuffer = { + const blitFramebuffer: BlitFramebuffer = { __type__: "BlitFramebuffer", read: passDescriptor, draw: sourcePassDescriptor, @@ -64,7 +64,7 @@ function getGLRenderbufferInternalformat(format?: TextureFormat) { const { internalformat } = getGLTextureFormats(format); - return internalformat as GLRenderbufferInternalformat; + return internalformat as RenderbufferInternalformat; } export const _IGLRenderPassDescriptorWithMultisample = "_IGLRenderPassDescriptorWithMultisample"; @@ -81,9 +81,9 @@ export interface GLRenderPassDescriptorWithMultisample /** * 拷贝渲染缓冲区到目标纹理中。 */ - blitFramebuffer: GLBlitFramebuffer; + blitFramebuffer: BlitFramebuffer; /** * 需要销毁的临时渲染缓冲区。 */ - renderbuffers: GLRenderbuffer[]; + renderbuffers: Renderbuffer[]; } \ No newline at end of file diff --git a/src/caches/getGLRenderbuffer.ts b/src/caches/getGLRenderbuffer.ts index 83a0914..d0194c2 100644 --- a/src/caches/getGLRenderbuffer.ts +++ b/src/caches/getGLRenderbuffer.ts @@ -1,14 +1,14 @@ -import { GLRenderbuffer } from "../data/GLRenderbuffer"; +import { Renderbuffer } from "../data/Renderbuffer"; declare global { interface WebGLRenderingContext { - _renderbuffers: Map; + _renderbuffers: Map; } } -export function getGLRenderbuffer(gl: WebGLRenderingContext, renderbuffer: GLRenderbuffer, sampleCount?: 4) +export function getGLRenderbuffer(gl: WebGLRenderingContext, renderbuffer: Renderbuffer, sampleCount?: 4) { let webGLRenderbuffer = gl._renderbuffers.get(renderbuffer); if (webGLRenderbuffer) return webGLRenderbuffer; @@ -31,7 +31,7 @@ export function getGLRenderbuffer(gl: WebGLRenderingContext, renderbuffer: GLRen return webGLRenderbuffer; } -export function deleteRenderbuffer(gl: WebGLRenderingContext, renderbuffer: GLRenderbuffer) +export function deleteRenderbuffer(gl: WebGLRenderingContext, renderbuffer: Renderbuffer) { const webGLRenderbuffer = gl._renderbuffers.get(renderbuffer); gl._renderbuffers.delete(renderbuffer); diff --git a/src/caches/getGLTransformFeedback.ts b/src/caches/getGLTransformFeedback.ts index 9e5cdbc..2792fa9 100644 --- a/src/caches/getGLTransformFeedback.ts +++ b/src/caches/getGLTransformFeedback.ts @@ -1,16 +1,16 @@ -import { GLTransformFeedback } from "../data/GLTransformFeedbackPass"; -import { getIGLVertexBuffer } from "../runs/getIGLBuffer"; +import { TransformFeedback } from "../data/TransformFeedbackPass"; +import { getIGLBuffer } from "../runs/getIGLBuffer"; import { getGLBuffer } from "./getGLBuffer"; declare global { interface WebGLRenderingContext { - _transforms: Map; + _transforms: Map; } } -export function getGLTransformFeedback(gl: WebGLRenderingContext, transformFeedback: GLTransformFeedback) +export function getGLTransformFeedback(gl: WebGLRenderingContext, transformFeedback: TransformFeedback) { let webGLTransformFeedback = gl._transforms.get(transformFeedback); if (webGLTransformFeedback) return webGLTransformFeedback; @@ -24,7 +24,8 @@ export function getGLTransformFeedback(gl: WebGLRenderingContext, transformFeedb transformFeedback.bindBuffers.forEach((v) => { const { index, data } = v; - const buffer = getIGLVertexBuffer(data, "STREAM_COPY"); + const buffer = getIGLBuffer(data, "ARRAY_BUFFER", "STREAM_COPY"); + const webGLBuffer = getGLBuffer(gl, buffer); gl.bindBufferBase(gl.TRANSFORM_FEEDBACK_BUFFER, index, webGLBuffer); }); @@ -36,7 +37,7 @@ export function getGLTransformFeedback(gl: WebGLRenderingContext, transformFeedb return webGLTransformFeedback; } -export function deleteTransformFeedback(gl: WebGLRenderingContext, transformFeedback: GLTransformFeedback) +export function deleteTransformFeedback(gl: WebGLRenderingContext, transformFeedback: TransformFeedback) { const webGLTransformFeedback = gl._transforms.get(transformFeedback); if (!webGLTransformFeedback) return; diff --git a/src/const/IGLUniformType.ts b/src/const/GLUniformType.ts similarity index 87% rename from src/const/IGLUniformType.ts rename to src/const/GLUniformType.ts index 488c4a9..90d0b4b 100644 --- a/src/const/IGLUniformType.ts +++ b/src/const/GLUniformType.ts @@ -1,17 +1,17 @@ /** * WebGL中Uniform类型 */ -export type IGLUniformType = keyof typeof webGLUniformTypeValue; +export type GLUniformType = keyof typeof webGLUniformTypeValue; /** * WebGL中Uniform纹理类型 */ -export type IGLUniformTextureType = keyof typeof webGLUniformTextureTypeValue; +export type GLUniformTextureType = keyof typeof webGLUniformTextureTypeValue; /** * WebGL中Uniform缓冲区类型 */ -export type IGLUniformBufferType = keyof typeof webGLUniformBufferTypeValue; +export type GLUniformBufferType = keyof typeof webGLUniformBufferTypeValue; /** * 获取Unifrom类型名称 @@ -19,7 +19,7 @@ export type IGLUniformBufferType = keyof typeof webGLUniformBufferTypeValue; * @param value WebGL中Unifrom类型对应的值。 * @returns Unifrom类型名称 */ -export function getWebGLUniformType(value: number): IGLUniformType +export function getWebGLUniformType(value: number): GLUniformType { const result = webGLUniformValueType[value]; console.assert(!!result); @@ -33,7 +33,7 @@ export function getWebGLUniformType(value: number): IGLUniformType * @param type Unifrom类型名称 * @returns 是否为纹理Unifrom类型。 */ -export function isWebGLUniformTextureType(type: IGLUniformType): boolean +export function isWebGLUniformTextureType(type: GLUniformType): boolean { return webGLUniformTextureTypeValue[type] !== undefined; } diff --git a/src/data/GLBlitFramebuffer.ts b/src/data/BlitFramebuffer.ts similarity index 80% rename from src/data/GLBlitFramebuffer.ts rename to src/data/BlitFramebuffer.ts index f74ac07..47fb979 100644 --- a/src/data/GLBlitFramebuffer.ts +++ b/src/data/BlitFramebuffer.ts @@ -3,7 +3,7 @@ import { RenderPassDescriptor } from "@feng3d/render-api"; /** * 拷贝渲染缓冲与纹理直接拷贝数据。 */ -export interface GLBlitFramebuffer +export interface BlitFramebuffer { /** * 数据类型。 @@ -12,10 +12,10 @@ export interface GLBlitFramebuffer read: RenderPassDescriptor; draw: RenderPassDescriptor; - blitFramebuffers: GLBlitFramebufferItem[]; + blitFramebuffers: BlitFramebufferItem[]; } -export type GLBlitFramebufferItem = [ +export type BlitFramebufferItem = [ srcX0: number, srcY0: number, srcX1: number, srcY1: number, dstX0: number, dstY0: number, dstX1: number, dstY1: number, mask: "COLOR_BUFFER_BIT" | "DEPTH_BUFFER_BIT" | "STENCIL_BUFFER_BIT", filter: "NEAREST" | "LINEAR"]; \ No newline at end of file diff --git a/src/data/GLCapabilities.ts b/src/data/Capabilities.ts similarity index 95% rename from src/data/GLCapabilities.ts rename to src/data/Capabilities.ts index 4896d07..8d9dc25 100644 --- a/src/data/GLCapabilities.ts +++ b/src/data/Capabilities.ts @@ -5,7 +5,7 @@ declare global /** * WEBGL支持功能 */ - _capabilities: GLCapabilities; + _capabilities: Capabilities; } } @@ -15,7 +15,7 @@ declare global * @see https://webglreport.com * @see http://html5test.com */ -export interface GLCapabilities +export interface Capabilities { /** * 纹理各向异性过滤最大值 diff --git a/src/data/GLIndexBuffer.ts b/src/data/GLIndexBuffer.ts deleted file mode 100644 index 3071d17..0000000 --- a/src/data/GLIndexBuffer.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { Buffer, IIndicesDataTypes } from "@feng3d/render-api"; - -/** - * WebGL 顶点索引缓冲。 - * - * 使用 gl.ELEMENT_ARRAY_BUFFER 进行绑定数据。 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bindBuffer - * - */ -export interface GLIndexBuffer extends Buffer -{ - target: "ELEMENT_ARRAY_BUFFER"; - - /** - * 顶点索引数据。 - */ - data?: IIndicesDataTypes; -} \ No newline at end of file diff --git a/src/data/GLUniformBuffer.ts b/src/data/GLUniformBuffer.ts deleted file mode 100644 index 91f1687..0000000 --- a/src/data/GLUniformBuffer.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { Buffer } from "@feng3d/render-api"; - -/** - * WebGL 统一缓冲区。 - */ -export interface GLUniformBuffer extends Buffer -{ - target: "UNIFORM_BUFFER"; -} diff --git a/src/data/GLVertexBuffer.ts b/src/data/GLVertexBuffer.ts deleted file mode 100644 index 8742e52..0000000 --- a/src/data/GLVertexBuffer.ts +++ /dev/null @@ -1,14 +0,0 @@ -import { Buffer, IVertexDataTypes } from "@feng3d/render-api"; - -/** - * WebGL 顶点缓冲区。 - */ -export interface GLVertexBuffer extends Buffer -{ - target: "ARRAY_BUFFER"; - - /** - * 缓冲区数据。 - */ - data?: IVertexDataTypes; -} diff --git a/src/data/GLRenderbuffer.ts b/src/data/Renderbuffer.ts similarity index 88% rename from src/data/GLRenderbuffer.ts rename to src/data/Renderbuffer.ts index 0d4c05c..cccfb64 100644 --- a/src/data/GLRenderbuffer.ts +++ b/src/data/Renderbuffer.ts @@ -1,15 +1,15 @@ /** - * 渲染缓冲区。 + * WebGL渲染缓冲区。 * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/renderbufferStorage * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/renderbufferStorageMultisample */ -export interface GLRenderbuffer +export interface Renderbuffer { /** - * 渲染缓冲区内部格式。 + * WebGL渲染缓冲区内部格式。 */ - readonly internalformat: GLRenderbufferInternalformat, + readonly internalformat: RenderbufferInternalformat, /** * 宽度。 @@ -23,6 +23,8 @@ export interface GLRenderbuffer } /** + * WebGL渲染缓冲区内部格式。 + * * A GLenum specifying the internal format of the renderbuffer. Possible values: * * * gl.RGBA4: 4 red bits, 4 green bits, 4 blue bits 4 alpha bits. @@ -85,7 +87,7 @@ export interface GLRenderbuffer * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/renderbufferStorage */ -export type GLRenderbufferInternalformat = "RGBA4" | "RGB565" | "RGB5_A1" | "DEPTH_COMPONENT16" | "STENCIL_INDEX8" | "DEPTH_STENCIL" // WebGL1 +export type RenderbufferInternalformat = "RGBA4" | "RGB565" | "RGB5_A1" | "DEPTH_COMPONENT16" | "STENCIL_INDEX8" | "DEPTH_STENCIL" // WebGL1 | "R8" | "R8UI" | "R8I" | "R16UI" | "R16I" | "R32UI" | "R32I" | "RG8" | "RG8UI" | "RG8I" // WebGL2 | "RG16UI" | "RG16I" | "RG32UI" | "RG32I" | "RGB8" | "RGBA8" | "SRGB8_ALPHA8" | "RGB10_A2" // WebGL2 | "RGBA8UI" | "RGBA8I" | "RGB10_A2UI" | "RGBA16UI" | "RGBA16I" | "RGBA32I" | "RGBA32UI" // WebGL2 diff --git a/src/data/GLSamplerTexture.ts b/src/data/SamplerTexture.ts similarity index 87% rename from src/data/GLSamplerTexture.ts rename to src/data/SamplerTexture.ts index 079fd94..f5ed822 100644 --- a/src/data/GLSamplerTexture.ts +++ b/src/data/SamplerTexture.ts @@ -5,7 +5,7 @@ import { Sampler, Texture } from "@feng3d/render-api"; * * 采样器与纹理。 */ -export interface GLSamplerTexture +export interface SamplerTexture { /** * 纹理。 diff --git a/src/data/GLTransformFeedbackPass.ts b/src/data/TransformFeedbackPass.ts similarity index 66% rename from src/data/GLTransformFeedbackPass.ts rename to src/data/TransformFeedbackPass.ts index c22d1f5..1ba3602 100644 --- a/src/data/GLTransformFeedbackPass.ts +++ b/src/data/TransformFeedbackPass.ts @@ -1,14 +1,14 @@ -import { DrawVertex, IVertexDataTypes, Uniforms, VertexAttributes, VertexState } from "@feng3d/render-api"; +import { DrawVertex, VertexDataTypes, Uniforms, VertexAttributes, VertexState } from "@feng3d/render-api"; declare module "@feng3d/render-api" { export interface PassEncoderMap { - GLTransformFeedbackPass: GLTransformFeedbackPass, + TransformFeedbackPass: TransformFeedbackPass, } } -export interface GLTransformFeedbackPass +export interface TransformFeedbackPass { /** * 数据类型。 @@ -18,15 +18,15 @@ export interface GLTransformFeedbackPass /** * 变换反馈对象列表。 */ - transformFeedbackObjects: GLTransformFeedbackObject[]; + transformFeedbackObjects: TransformFeedbackObject[]; } -export interface GLTransformFeedbackObject +export interface TransformFeedbackObject { /** * 渲染管线描述。 */ - readonly pipeline: GLTransformFeedbackPipeline; + readonly pipeline: TransformFeedbackPipeline; /** * 顶点属性数据映射。 @@ -50,10 +50,10 @@ export interface GLTransformFeedbackObject * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/bindTransformFeedback */ - transformFeedback: GLTransformFeedback; + transformFeedback: TransformFeedback; } -export interface GLTransformFeedbackPipeline +export interface TransformFeedbackPipeline { /** * 顶点着色器阶段描述。 @@ -65,10 +65,10 @@ export interface GLTransformFeedbackPipeline * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/transformFeedbackVaryings */ - transformFeedbackVaryings: GLTransformFeedbackVaryings; + transformFeedbackVaryings: TransformFeedbackVaryings; } -export interface GLTransformFeedbackVaryings +export interface TransformFeedbackVaryings { /** * 回写变量列表。 @@ -84,17 +84,17 @@ export interface GLTransformFeedbackVaryings /** * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/createTransformFeedback */ -export interface GLTransformFeedback +export interface TransformFeedback { /** * 绑定缓冲区列表。 */ - bindBuffers: GLTransformFeedbacBindBuffer[]; + bindBuffers: TransformFeedbacBindBuffer[]; } -export interface GLTransformFeedbacBindBuffer +export interface TransformFeedbacBindBuffer { index: number; - data: IVertexDataTypes; + data: VertexDataTypes; } \ No newline at end of file diff --git a/src/data/polyfills/Buffer.ts b/src/data/polyfills/Buffer.ts index dade0bc..9b08778 100644 --- a/src/data/polyfills/Buffer.ts +++ b/src/data/polyfills/Buffer.ts @@ -1,4 +1,4 @@ -import { Buffer, IIndicesDataTypes, IVertexDataTypes } from "@feng3d/render-api"; +import { } from "@feng3d/render-api"; declare module "@feng3d/render-api" { @@ -9,19 +9,22 @@ declare module "@feng3d/render-api" */ export interface Buffer { - target: IGLBufferTarget; + /** + * WebGL缓冲区目标。 + */ + target: BufferTarget; /** * 为优化目的指定数据存储的预期使用模式的GLenum。 * * 默认为 "STATIC_DRAW"。 */ - usage?: IGLBufferUsage; + usage?: BufferUsage; } } /** - * 元素缓冲数据类型。 + * WebGL元素缓冲数据类型。 * * A GLenum specifying the type of the values in the element array buffer. Possible values are: * @@ -34,9 +37,11 @@ declare module "@feng3d/render-api" * * @see https://developer.mozilla.org/zh-CN/docs/Web/API/WebGLRenderingContext/drawElements */ -export type IGLDrawElementType = "UNSIGNED_BYTE" | "UNSIGNED_SHORT" | "UNSIGNED_INT"; +export type DrawElementType = "UNSIGNED_BYTE" | "UNSIGNED_SHORT" | "UNSIGNED_INT"; /** + * WebGL缓冲区使用模式。 + * * A GLenum specifying the intended usage pattern of the data store for optimization purposes. Possible values: * * * gl.STATIC_DRAW: The contents are intended to be specified once by the application, and used many times as the source for WebGL drawing and image specification commands. @@ -54,11 +59,13 @@ export type IGLDrawElementType = "UNSIGNED_BYTE" | "UNSIGNED_SHORT" | "UNSIGNED_ * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bufferData */ -export type IGLBufferUsage = "STATIC_DRAW" | "DYNAMIC_DRAW" | "STREAM_DRAW" // WebGL1 +export type BufferUsage = "STATIC_DRAW" | "DYNAMIC_DRAW" | "STREAM_DRAW" // WebGL1 | "STATIC_READ" | "DYNAMIC_READ" | "STREAM_READ" | "STATIC_COPY" | "DYNAMIC_COPY" | "STREAM_COPY" // WebGL2 ; /** + * WebGL缓冲区目标。 + * * A GLenum specifying the binding point (target). Possible values: * * * gl.ARRAY_BUFFER: Buffer containing vertex attributes, such as vertex coordinates, texture coordinate data, or vertex color data. @@ -73,6 +80,6 @@ export type IGLBufferUsage = "STATIC_DRAW" | "DYNAMIC_DRAW" | "STREAM_DRAW" // W * * gl.PIXEL_UNPACK_BUFFER: Buffer used for pixel transfer operations. * */ -export type IGLBufferTarget = "ARRAY_BUFFER" | "ELEMENT_ARRAY_BUFFER" // WebGL1 +export type BufferTarget = "ARRAY_BUFFER" | "ELEMENT_ARRAY_BUFFER" // WebGL1 | "COPY_READ_BUFFER" | "COPY_WRITE_BUFFER" | "TRANSFORM_FEEDBACK_BUFFER"// WebGL2 | "UNIFORM_BUFFER" | "PIXEL_PACK_BUFFER" | "PIXEL_UNPACK_BUFFER"; // WebGL2 diff --git a/src/data/polyfills/CommandEncoder.ts b/src/data/polyfills/CommandEncoder.ts index d5ab8b5..45fd1af 100644 --- a/src/data/polyfills/CommandEncoder.ts +++ b/src/data/polyfills/CommandEncoder.ts @@ -1,11 +1,11 @@ import { TextureLike } from "@feng3d/render-api"; -import { GLBlitFramebuffer } from "../GLBlitFramebuffer"; +import { BlitFramebuffer } from "../BlitFramebuffer"; declare module "@feng3d/render-api" { export interface PassEncoderMap { - GLBlitFramebuffer: GLBlitFramebuffer; + GLBlitFramebuffer: BlitFramebuffer; } /** diff --git a/src/data/polyfills/Uniforms.ts b/src/data/polyfills/Uniforms.ts index cd320f8..dc33254 100644 --- a/src/data/polyfills/Uniforms.ts +++ b/src/data/polyfills/Uniforms.ts @@ -1,11 +1,11 @@ import { UniformDataItem } from "@feng3d/render-api"; -import { GLSamplerTexture } from "../GLSamplerTexture"; +import { SamplerTexture } from "../SamplerTexture"; declare module "@feng3d/render-api" { export interface UniformTypeMap { - GLSamplerTexture: GLSamplerTexture; + GLSamplerTexture: SamplerTexture; UniformDataItem: UniformDataItem; } } diff --git a/src/index.ts b/src/index.ts index 45267e6..3476ff3 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,11 +1,8 @@ -export * from "./data/GLBlitFramebuffer"; -export * from "./data/GLCapabilities"; -export * from "./data/GLIndexBuffer"; -export * from "./data/GLRenderbuffer"; -export * from "./data/GLSamplerTexture"; -export * from "./data/GLTransformFeedbackPass"; -export * from "./data/GLUniformBuffer"; -export * from "./data/GLVertexBuffer"; +export * from "./data/BlitFramebuffer"; +export * from "./data/Capabilities"; +export * from "./data/Renderbuffer"; +export * from "./data/SamplerTexture"; +export * from "./data/TransformFeedbackPass"; export * from "./data/polyfills/CanvasContext"; export * from "./data/polyfills/Buffer"; diff --git a/src/runs/getIGLBuffer.ts b/src/runs/getIGLBuffer.ts index 299fe4c..e1c7f16 100644 --- a/src/runs/getIGLBuffer.ts +++ b/src/runs/getIGLBuffer.ts @@ -1,10 +1,7 @@ -import { Buffer, IIndicesDataTypes, IVertexDataTypes, TypedArray } from "@feng3d/render-api"; -import { GLIndexBuffer } from "../data/GLIndexBuffer"; -import { GLUniformBuffer } from "../data/GLUniformBuffer"; -import { GLVertexBuffer } from "../data/GLVertexBuffer"; -import { IGLBufferTarget, IGLBufferUsage } from "../data/polyfills/Buffer"; +import { Buffer, TypedArray } from "@feng3d/render-api"; +import { BufferTarget, BufferUsage } from "../data/polyfills/Buffer"; -export function getIGLBuffer(data: TypedArray, target?: IGLBufferTarget, usage: IGLBufferUsage = "STATIC_DRAW"): Buffer +export function getIGLBuffer(data: TypedArray, target?: BufferTarget, usage: BufferUsage = "STATIC_DRAW"): Buffer { if (data[_IGLBuffer]) return data[_IGLBuffer]; @@ -19,26 +16,4 @@ export function getIGLBuffer(data: TypedArray, target?: IGLBufferTarget, usage: return buffer; } -export function getIGLUniformBuffer(data: TypedArray, usage?: "DYNAMIC_DRAW") -{ - const vertexBuffer: GLUniformBuffer = data[_IGLBuffer] = data[_IGLBuffer] || getIGLBuffer(data, "UNIFORM_BUFFER", usage); - vertexBuffer.target = vertexBuffer.target || "UNIFORM_BUFFER"; - - return vertexBuffer; -} - -export function getIGLVertexBuffer(data: IVertexDataTypes, usage?: "STREAM_COPY") -{ - const vertexBuffer: GLVertexBuffer = data[_IGLBuffer] = data[_IGLBuffer] || getIGLBuffer(data, "ARRAY_BUFFER", usage); - - return vertexBuffer; -} - -export function getIGLIndexBuffer(indices: IIndicesDataTypes) -{ - const indexBuffer: GLIndexBuffer = indices[_IGLBuffer] = indices[_IGLBuffer] || getIGLBuffer(indices, "ELEMENT_ARRAY_BUFFER"); - - return indexBuffer; -} - -const _IGLBuffer = "IGLBuffer"; \ No newline at end of file +const _IGLBuffer = "_IGLBuffer"; \ No newline at end of file diff --git a/src/utils/getIVertexFormat.ts b/src/utils/getIVertexFormat.ts index 07b3844..07d4171 100644 --- a/src/utils/getIVertexFormat.ts +++ b/src/utils/getIVertexFormat.ts @@ -1,6 +1,6 @@ -import { GLVertexAttributeTypes, IVertexFormat, VertexAttributeFormatInfo, vertexFormatMap } from "@feng3d/render-api"; +import { GLVertexAttributeTypes, VertexFormat, VertexAttributeFormatInfo, vertexFormatMap } from "@feng3d/render-api"; -export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: GLVertexAttributeTypes = "FLOAT", normalized = false): IVertexFormat +export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: GLVertexAttributeTypes = "FLOAT", normalized = false): VertexFormat { for (const key in vertexFormatMap) { @@ -11,7 +11,7 @@ export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: GLVertexAtt && !element.normalized === !normalized ) { - return key as IVertexFormat; + return key as VertexFormat; } } @@ -20,7 +20,7 @@ export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: GLVertexAtt return undefined; } -export function getIGLVertexFormat(format: IVertexFormat): VertexAttributeFormatInfo +export function getIGLVertexFormat(format: VertexFormat): VertexAttributeFormatInfo { const glVertexFormat = vertexFormatMap[format]; -- Gitee From 96e36ea02e522c390041359ba9f7beddd6c52139 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Wed, 12 Mar 2025 23:03:39 +0800 Subject: [PATCH 45/57] =?UTF-8?q?refactor(capabilities):=20=E9=87=8D?= =?UTF-8?q?=E6=9E=84=20WebGL=20=E5=8A=9F=E8=83=BD=E6=A3=80=E6=B5=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 Capabilities 从接口改为类，实现懒加载检测 - 移除 WebGLRenderingContext 上的 _capabilities 属性 - 更新 RunWebGL 和 getGLCanvasContext 中的功能检测逻辑 - 删除 data/Capabilities.ts 文件，改为使用新的 Capabilities 类 --- src/RunWebGL.ts | 5 +- src/caches/getCapabilities.ts | 222 ++++++++++++++++++--- src/caches/getGLCanvasContext.ts | 1 + src/data/Capabilities.ts | 99 --------- src/index.ts | 1 - src/utils/getGLRenderPassAttachmentSize.ts | 4 +- 6 files changed, 203 insertions(+), 129 deletions(-) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 9b670db..75c7b70 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -13,9 +13,9 @@ import { getGLTransformFeedback } from "./caches/getGLTransformFeedback"; import { _GL_Submit_Times } from "./const/const"; import { GLUniformBufferType } from "./const/GLUniformType"; import { BlitFramebuffer } from "./data/BlitFramebuffer"; +import { DrawElementType } from "./data/polyfills/Buffer"; import { SamplerTexture } from "./data/SamplerTexture"; import { TransformFeedback, TransformFeedbackObject, TransformFeedbackPass, TransformFeedbackPipeline } from "./data/TransformFeedbackPass"; -import { DrawElementType } from "./data/polyfills/Buffer"; import { getGLTexture } from "./internal"; import { getIGLBuffer } from "./runs/getIGLBuffer"; import { getIGLBlendEquation, getIGLBlendFactor, IGLBlendEquation, IGLBlendFactor } from "./runs/runColorTargetStates"; @@ -28,6 +28,7 @@ import { getIGLFrontFace, IGLFrontFace } from "./utils/getIGLFrontFace"; import { getIGLVertexFormat } from "./utils/getIVertexFormat"; import { updateBufferBinding } from "./utils/updateBufferBinding"; +import { getCapabilities } from "./caches/getCapabilities"; import "./data/polyfills/OcclusionQuery"; declare global @@ -446,7 +447,7 @@ export class RunWebGL const extension = gl.getExtension("EXT_texture_filter_anisotropic"); if (extension) { - gl.texParameterf(gl[textureTarget], extension.TEXTURE_MAX_ANISOTROPY_EXT, Math.min(maxAnisotropy, gl._capabilities.maxAnisotropy)); + gl.texParameterf(gl[textureTarget], extension.TEXTURE_MAX_ANISOTROPY_EXT, Math.min(maxAnisotropy, getCapabilities(gl).maxAnisotropy)); } webGLTexture.maxAnisotropy = maxAnisotropy; } diff --git a/src/caches/getCapabilities.ts b/src/caches/getCapabilities.ts index b923e9f..cc5fee3 100644 --- a/src/caches/getCapabilities.ts +++ b/src/caches/getCapabilities.ts @@ -1,35 +1,17 @@ -import { Capabilities } from "../data/Capabilities"; export function getCapabilities(gl: WebGLRenderingContext, precision: "highp" | "mediump" | "lowp" = "highp") { - const capabilities: Capabilities = {} as any; - gl._capabilities = capabilities; - // - capabilities.maxAnisotropy = gl.getExtension("EXT_texture_filter_anisotropic") ? gl.getParameter(gl.getExtension("EXT_texture_filter_anisotropic").MAX_TEXTURE_MAX_ANISOTROPY_EXT) : 0; - capabilities.maxPrecision = _getMaxPrecision(gl, precision); + let capabilities = capabilitiesMap.get(gl); + if (capabilities) return capabilities; - capabilities.maxTextures = gl.getParameter(gl.MAX_TEXTURE_IMAGE_UNITS); - capabilities.maxVertexTextures = gl.getParameter(gl.MAX_VERTEX_TEXTURE_IMAGE_UNITS); - capabilities.maxTextureSize = gl.getParameter(gl.MAX_TEXTURE_SIZE); - capabilities.maxCubemapSize = gl.getParameter(gl.MAX_CUBE_MAP_TEXTURE_SIZE); - - capabilities.maxAttributes = gl.getParameter(gl.MAX_VERTEX_ATTRIBS); - capabilities.maxVertexUniforms = gl.getParameter(gl.MAX_VERTEX_UNIFORM_VECTORS); - capabilities.maxVaryings = gl.getParameter(gl.MAX_VARYING_VECTORS); - capabilities.maxFragmentUniforms = gl.getParameter(gl.MAX_FRAGMENT_UNIFORM_VECTORS); - - capabilities.vertexTextures = capabilities.maxVertexTextures > 0; - capabilities.floatFragmentTextures = gl instanceof WebGL2RenderingContext || !!gl.getExtension("OES_texture_float"); - capabilities.floatVertexTextures = capabilities.vertexTextures && capabilities.floatFragmentTextures; - - capabilities.maxSamples = gl instanceof WebGL2RenderingContext ? gl.getParameter(gl.MAX_SAMPLES) : 0; - capabilities.stencilBits = gl.getParameter(gl.STENCIL_BITS); - - capabilities.vaoAvailable = gl instanceof WebGL2RenderingContext || !!gl.getExtension("OES_vertex_array_object"); + capabilities = new Capabilities(gl, precision); + capabilitiesMap.set(gl, capabilities); return capabilities; } +const capabilitiesMap = new WeakMap(); + function _getMaxPrecision(gl: WebGLRenderingContext, precision: "highp" | "mediump" | "lowp" = "highp") { if (precision === "highp") @@ -51,4 +33,194 @@ function _getMaxPrecision(gl: WebGLRenderingContext, precision: "highp" | "mediu } return "lowp"; -} \ No newline at end of file +} + +/** + * WEBGL支持功能 + * + * @see https://webglreport.com + * @see http://html5test.com + */ +export class Capabilities +{ + /** + * 纹理各向异性过滤最大值 + */ + get maxAnisotropy() + { + if (this._maxAnisotropy) return this._maxAnisotropy; + this._maxAnisotropy = this._gl.getExtension("EXT_texture_filter_anisotropic") ? this._gl.getParameter(this._gl.getExtension("EXT_texture_filter_anisotropic").MAX_TEXTURE_MAX_ANISOTROPY_EXT) : 0; + return this._maxAnisotropy; + } + private _maxAnisotropy: number; + + /** + * 支持最大纹理数量 + */ + get maxTextures() + { + if (this._maxTextures) return this._maxTextures; + this._maxTextures = this._gl.getParameter(this._gl.MAX_TEXTURE_IMAGE_UNITS); + return this._maxTextures; + } + private _maxTextures: number; + + /** + * 支持最大顶点纹理数量 + */ + get maxVertexTextures() + { + if (this._maxVertexTextures) return this._maxVertexTextures; + this._maxVertexTextures = this._gl.getParameter(this._gl.MAX_VERTEX_TEXTURE_IMAGE_UNITS); + return this._maxVertexTextures; + } + private _maxVertexTextures: number; + + /** + * 支持最大纹理尺寸 + */ + get maxTextureSize() + { + if (this._maxTextureSize) return this._maxTextureSize; + this._maxTextureSize = this._gl.getParameter(this._gl.MAX_TEXTURE_SIZE); + return this._maxTextureSize; + } + private _maxTextureSize: number; + + /** + * 支持最大立方体贴图尺寸 + */ + get maxCubemapSize() + { + if (this._maxCubemapSize) return this._maxCubemapSize; + this._maxCubemapSize = this._gl.getParameter(this._gl.MAX_CUBE_MAP_TEXTURE_SIZE); + return this._maxCubemapSize; + } + private _maxCubemapSize: number; + + /** + * 支持属性数量 + */ + get maxAttributes() + { + if (this._maxAttributes) return this._maxAttributes; + this._maxAttributes = this._gl.getParameter(this._gl.MAX_VERTEX_ATTRIBS); + return this._maxAttributes; + } + private _maxAttributes: number; + + /** + * 顶点着色器支持最大 Uniform 数量 + */ + get maxVertexUniforms() + { + if (this._maxVertexUniforms) return this._maxVertexUniforms; + this._maxVertexUniforms = this._gl.getParameter(this._gl.MAX_VERTEX_UNIFORM_VECTORS); + return this._maxVertexUniforms; + } + private _maxVertexUniforms: number; + + /** + * 支持最大shader之间传递的变量数 + */ + get maxVaryings() + { + if (this._maxVaryings) return this._maxVaryings; + this._maxVaryings = this._gl.getParameter(this._gl.MAX_VARYING_VECTORS); + return this._maxVaryings; + } + private _maxVaryings: number; + + /** + * 片段着色器支持最大 Uniform 数量 + */ + get maxFragmentUniforms() + { + if (this._maxFragmentUniforms) return this._maxFragmentUniforms; + this._maxFragmentUniforms = this._gl.getParameter(this._gl.MAX_FRAGMENT_UNIFORM_VECTORS); + return this._maxFragmentUniforms; + } + private _maxFragmentUniforms: number; + + /** + * 是否支持顶点纹理 + */ + get vertexTextures() + { + if (this._vertexTextures) return this._vertexTextures; + this._vertexTextures = this.maxVertexTextures > 0; + return this._vertexTextures; + } + private _vertexTextures: boolean; + + /** + * 是否支持浮点类型片段着色器纹理 + */ + get floatFragmentTextures() + { + if (this._floatFragmentTextures) return this._floatFragmentTextures; + this._floatFragmentTextures = this._gl instanceof WebGL2RenderingContext || !!this._gl.getExtension("OES_texture_float"); + return this._floatFragmentTextures; + } + private _floatFragmentTextures: boolean; + + /** + * 是否支持浮点类型顶点着色器纹理 + */ + get floatVertexTextures() + { + if (this._floatVertexTextures) return this._floatVertexTextures; + this._floatVertexTextures = this.vertexTextures && this.floatFragmentTextures; + return this._floatVertexTextures; + } + private _floatVertexTextures: boolean; + + /** + * Shader中支持浮点类型的最高精度 + */ + get maxPrecision() + { + if (this._maxPrecision) return this._maxPrecision; + this._maxPrecision = _getMaxPrecision(this._gl, this._precision); + return this._maxPrecision; + } + private _maxPrecision: "highp" | "mediump" | "lowp"; + + + /** + * + */ + get maxSamples() + { + if (this._maxSamples) return this._maxSamples; + this._maxSamples = this._gl instanceof WebGL2RenderingContext ? this._gl.getParameter(this._gl.MAX_SAMPLES) : 0; + return this._maxSamples; + } + private _maxSamples: number; + + /** + * 支持模板的位数 + */ + get stencilBits() + { + if (this._stencilBits) return this._stencilBits; + this._stencilBits = this._gl.getParameter(this._gl.STENCIL_BITS); + return this._stencilBits; + } + private _stencilBits: number; + + /** + * 是否支持VAO。 + */ + get vaoAvailable() + { + if (this._vaoAvailable) return this._vaoAvailable; + this._vaoAvailable = this._gl instanceof WebGL2RenderingContext || !!this._gl.getExtension("OES_vertex_array_object"); + return this._vaoAvailable; + } + private _vaoAvailable: boolean; + + constructor(private _gl: WebGLRenderingContext, private _precision: "highp" | "mediump" | "lowp") + { + } +} diff --git a/src/caches/getGLCanvasContext.ts b/src/caches/getGLCanvasContext.ts index f2d0b92..6b8acc5 100644 --- a/src/caches/getGLCanvasContext.ts +++ b/src/caches/getGLCanvasContext.ts @@ -18,6 +18,7 @@ export function getGLCanvasContext(renderingContext: CanvasContext) const canvas = getCanvas(renderingContext.canvasId); value = getWebGLContext(canvas, renderingContext); + renderingContext.webGLContextAttributes // getCapabilities(value); initMap(value); diff --git a/src/data/Capabilities.ts b/src/data/Capabilities.ts index 8d9dc25..e69de29 100644 --- a/src/data/Capabilities.ts +++ b/src/data/Capabilities.ts @@ -1,99 +0,0 @@ -declare global -{ - interface WebGLRenderingContext - { - /** - * WEBGL支持功能 - */ - _capabilities: Capabilities; - } -} - -/** - * WEBGL支持功能 - * - * @see https://webglreport.com - * @see http://html5test.com - */ -export interface Capabilities -{ - /** - * 纹理各向异性过滤最大值 - */ - maxAnisotropy: number; - - /** - * 支持最大纹理数量 - */ - maxTextures: number; - - /** - * 支持最大顶点纹理数量 - */ - maxVertexTextures: number; - - /** - * 支持最大纹理尺寸 - */ - maxTextureSize: number; - - /** - * 支持最大立方体贴图尺寸 - */ - maxCubemapSize: number; - - /** - * 支持属性数量 - */ - maxAttributes: number; - - /** - * 顶点着色器支持最大 Uniform 数量 - */ - maxVertexUniforms: number; - - /** - * 支持最大shader之间传递的变量数 - */ - maxVaryings: number; - - /** - * 片段着色器支持最大 Uniform 数量 - */ - maxFragmentUniforms: number; - - /** - * 是否支持顶点纹理 - */ - vertexTextures: boolean; - - /** - * 是否支持浮点类型片段着色器纹理 - */ - floatFragmentTextures: boolean; - - /** - * 是否支持浮点类型顶点着色器纹理 - */ - floatVertexTextures: boolean; - - /** - * Shader中支持浮点类型的最高精度 - */ - maxPrecision: "highp" | "mediump" | "lowp"; - - /** - * - */ - maxSamples: number; - - /** - * 支持模板的位数 - */ - stencilBits: number; - - /** - * 是否支持VAO。 - */ - vaoAvailable: boolean; -} diff --git a/src/index.ts b/src/index.ts index 3476ff3..a0c8816 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,4 @@ export * from "./data/BlitFramebuffer"; -export * from "./data/Capabilities"; export * from "./data/Renderbuffer"; export * from "./data/SamplerTexture"; export * from "./data/TransformFeedbackPass"; diff --git a/src/utils/getGLRenderPassAttachmentSize.ts b/src/utils/getGLRenderPassAttachmentSize.ts index eef69e8..224f42c 100644 --- a/src/utils/getGLRenderPassAttachmentSize.ts +++ b/src/utils/getGLRenderPassAttachmentSize.ts @@ -21,7 +21,7 @@ export function getGLRenderPassAttachmentSize(gl: WebGLRenderingContext, descrip return { width: view.texture.size[0], height: view.texture.size[1] }; } - return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; + return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; } } @@ -34,7 +34,7 @@ export function getGLRenderPassAttachmentSize(gl: WebGLRenderingContext, descrip return { width: view.texture.size[0], height: view.texture.size[1] }; } - return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; + return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; } return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; -- Gitee From 2e953b39b496a04cfdabd1b97056fde60736f585 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 13 Mar 2025 09:19:03 +0800 Subject: [PATCH 46/57] =?UTF-8?q?refactor(webgl):=20=E9=87=8D=E6=9E=84=20W?= =?UTF-8?q?ebGL=20=E6=B8=B2=E6=9F=93=E6=B5=81=E7=A8=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除无用的工具函数，如 getIGLCullFace、getIGLFrontFace 等 - 优化顶点格式处理逻辑，直接使用 vertexFormatMap - 调整纹理立方体贴图目标的处理方式 - 简化渲染通道附件尺寸的获取逻辑 - 更新相关示例代码，使用新的顶点格式处理方式 --- .../glsl_flat_smooth_interpolators.ts | 8 +- examples/src/WebGL2Samples/texture_vertex.ts | 26 +++++- src/RunWebGL.ts | 82 +++++++++++++++---- src/caches/getGLTexture.ts | 41 +++++++++- src/index.ts | 3 - src/utils/getGLRenderPassAttachmentSize.ts | 41 ---------- src/utils/getIGLCullFace.ts | 32 -------- src/utils/getIGLFrontFace.ts | 24 ------ src/utils/getIVertexFormat.ts | 43 ---------- src/utils/getTextureCubeMapTarget.ts | 37 --------- 10 files changed, 131 insertions(+), 206 deletions(-) delete mode 100644 src/utils/getGLRenderPassAttachmentSize.ts delete mode 100644 src/utils/getIGLCullFace.ts delete mode 100644 src/utils/getIGLFrontFace.ts delete mode 100644 src/utils/getIVertexFormat.ts delete mode 100644 src/utils/getTextureCubeMapTarget.ts diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index b864fe4..a236505 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -1,5 +1,5 @@ -import { CanvasContext, IIndicesDataTypes, IRenderPassObject, RenderPass, RenderPipeline, VertexAttributes, Viewport } from "@feng3d/render-api"; -import { getIVertexFormat, WebGL } from "@feng3d/webgl"; +import { CanvasContext, IIndicesDataTypes, IRenderPassObject, RenderPass, RenderPipeline, VertexAttributes, VertexFormat, Viewport } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; import { getShaderSource } from "./utility"; @@ -100,11 +100,11 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) vertexArray = { vertices: { position: { - data: vertices, format: getIVertexFormat(positionInfo.size), + data: vertices, format: (["float32", "float32x2", "float32x3", "float32x4"] as VertexFormat[])[positionInfo.size], arrayStride: positionInfo.stride, offset: positionInfo.offset }, normal: { - data: vertices, format: getIVertexFormat(normalInfo.size), + data: vertices, format: (["float32", "float32x2", "float32x3", "float32x4"] as VertexFormat[])[normalInfo.size], arrayStride: normalInfo.stride, offset: normalInfo.offset }, }, diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index aa610bc..86f816b 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -1,5 +1,5 @@ -import { CanvasContext, IIndicesDataTypes, IRenderPassObject, PrimitiveTopology, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, VertexDataTypes } from "@feng3d/render-api"; -import { getIVertexFormat, WebGL } from "@feng3d/webgl"; +import { CanvasContext, GLVertexAttributeTypes, IIndicesDataTypes, IRenderPassObject, PrimitiveTopology, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, VertexDataTypes, VertexFormat, vertexFormatMap } from "@feng3d/render-api"; +import { WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; @@ -234,4 +234,24 @@ import { getShaderSource, loadImage } from "./utility"; requestAnimationFrame(render); } -})(); \ No newline at end of file +})(); + +function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: GLVertexAttributeTypes = "FLOAT", normalized = false): VertexFormat +{ + for (const key in vertexFormatMap) + { + const element = vertexFormatMap[key]; + if ( + element.numComponents === numComponents + && element.type === type + && !element.normalized === !normalized + ) + { + return key as VertexFormat; + } + } + + console.error(`没有找到与 ${JSON.stringify({ numComponents, type, normalized })} 对应的顶点数据格式！`); + + return undefined; +} \ No newline at end of file diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 75c7b70..060bf38 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, BlendState, Buffer, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, CullFace, DepthStencilState, DrawIndexed, DrawVertex, FrontFace, IIndicesDataTypes, IRenderPassObject, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassColorAttachment, RenderPassDepthStencilAttachment, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { BlendComponent, BlendState, Buffer, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, CullFace, DepthStencilState, DrawIndexed, DrawVertex, FrontFace, IIndicesDataTypes, IRenderPassObject, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, vertexFormatMap, Viewport } from "@feng3d/render-api"; import { getGLBlitFramebuffer } from "./caches/getGLBlitFramebuffer"; import { getGLBuffer } from "./caches/getGLBuffer"; @@ -22,10 +22,6 @@ import { getIGLBlendEquation, getIGLBlendFactor, IGLBlendEquation, IGLBlendFacto import { getIGLCompareFunction } from "./runs/runDepthState"; import { getIGLStencilFunc, getIGLStencilOp } from "./runs/runStencilState"; import { ChainMap } from "./utils/ChainMap"; -import { getGLRenderPassAttachmentSize } from "./utils/getGLRenderPassAttachmentSize"; -import { getIGLCullFace, IGLCullFace } from "./utils/getIGLCullFace"; -import { getIGLFrontFace, IGLFrontFace } from "./utils/getIGLFrontFace"; -import { getIGLVertexFormat } from "./utils/getIVertexFormat"; import { updateBufferBinding } from "./utils/updateBufferBinding"; import { getCapabilities } from "./caches/getCapabilities"; @@ -155,21 +151,26 @@ export class RunWebGL { passDescriptor = passDescriptor || {}; - // - const colorAttachment = Object.assign({}, defaultRenderPassColorAttachment, passDescriptor.colorAttachments?.[0]); // const framebuffer = getGLFramebuffer(gl, passDescriptor); gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer); // - const { clearValue, loadOp } = colorAttachment; + const colorAttachment = passDescriptor.colorAttachments?.[0]; + // + const clearValue = colorAttachment?.clearValue ?? [0, 0, 0, 0]; + const loadOp = colorAttachment?.loadOp ?? "clear"; gl.clearColor(clearValue[0], clearValue[1], clearValue[2], clearValue[3]); // - const depthStencilAttachment = Object.assign({}, defaultDepthStencilAttachment, passDescriptor.depthStencilAttachment); - const { depthClearValue, depthLoadOp, stencilClearValue, stencilLoadOp } = depthStencilAttachment; + const depthStencilAttachment = passDescriptor.depthStencilAttachment; + const depthClearValue = depthStencilAttachment?.depthClearValue ?? 1; + const depthLoadOp = depthStencilAttachment?.depthLoadOp ?? "load"; + const stencilClearValue = depthStencilAttachment?.stencilClearValue ?? 0; + const stencilLoadOp = depthStencilAttachment?.stencilLoadOp ?? "load"; + // gl.clearDepth(depthClearValue); gl.clearStencil(stencilClearValue); @@ -599,7 +600,7 @@ export class RunWebGL const { stepMode, format } = attribute; let { arrayStride, offset } = attribute; - const glVertexFormat = getIGLVertexFormat(format); + const glVertexFormat = vertexFormatMap[format]; const { numComponents, normalized, type } = glVertexFormat; gl.enableVertexAttribArray(location); @@ -753,12 +754,16 @@ export class RunWebGL const cullFace: CullFace = primitive?.cullFace || "none"; const frontFace: FrontFace = primitive?.frontFace || "ccw"; - const enableCullFace = cullFace !== "none"; - const glCullMode: IGLCullFace = getIGLCullFace(cullFace); - const glFrontFace: IGLFrontFace = getIGLFrontFace(frontFace); - if (enableCullFace) + if (cullFace !== "none") { + const glCullMode = cullFaceMap[cullFace]; + console.assert(!!glCullMode, `接收到错误值，请从 ${Object.keys(cullFaceMap).toString()} 中取值！`); + + const glFrontFace = frontFaceMap[frontFace]; + console.assert(!!glFrontFace, `接收到错误 IFrontFace 值，请从 ${Object.keys(frontFaceMap).toString()} 中取值！`); + + // gl.enable(gl.CULL_FACE); gl.cullFace(gl[glCullMode]); gl.frontFace(gl[glFrontFace]); @@ -940,5 +945,48 @@ export class RunWebGL } } -export const defaultRenderPassColorAttachment: RenderPassColorAttachment = { clearValue: [0, 0, 0, 0], loadOp: "clear" }; -export const defaultDepthStencilAttachment: RenderPassDepthStencilAttachment = { depthClearValue: 1, depthLoadOp: "load", stencilClearValue: 0, stencilLoadOp: "load" }; +const cullFaceMap = Object.freeze({ + FRONT_AND_BACK: "FRONT_AND_BACK", + none: "BACK", // 不会开启剔除面功能，什么值无所谓。 + front: "FRONT", + back: "BACK", +}); + +const frontFaceMap = Object.freeze({ ccw: "CCW", cw: "CW", }); + +/** + * 获取渲染通道附件尺寸。 + * + * @param gl + * @param descriptor + */ +function getGLRenderPassAttachmentSize(gl: WebGLRenderingContext, descriptor: RenderPassDescriptor): { readonly width: number; readonly height: number; } +{ + if (!descriptor) return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; + + const colorAttachments = descriptor.colorAttachments; + if (colorAttachments) + { + const view = colorAttachments[0]?.view; + if (view) + { + return { width: view.texture.size[0], height: view.texture.size[1] }; + } + + return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; + } + + const depthStencilAttachment = descriptor.depthStencilAttachment; + if (depthStencilAttachment) + { + const view = depthStencilAttachment.view; + if (view) + { + return { width: view.texture.size[0], height: view.texture.size[1] }; + } + + return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; + } + + return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; +} \ No newline at end of file diff --git a/src/caches/getGLTexture.ts b/src/caches/getGLTexture.ts index 4e8d065..f92cecd 100644 --- a/src/caches/getGLTexture.ts +++ b/src/caches/getGLTexture.ts @@ -1,6 +1,5 @@ import { Texture, TextureDataSource, TextureImageSource, TextureSize } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; -import { getTextureCubeMapTarget } from "../utils/getTextureCubeMapTarget"; import { getGLTextureFormats } from "./getGLTextureFormats"; import { getGLTextureTarget } from "./getGLTextureTarget"; @@ -325,7 +324,7 @@ export function getGLTexture(gl: WebGLRenderingContext, texture: Texture) } } -return; + return; } // 处理数据资源 @@ -621,3 +620,41 @@ interface GLTexturePixelStore */ unpackSkipImages?: number; } + +function getTextureCubeMapTarget(depthOrArrayLayers: number) +{ + const textureCubeMapTarget: GLTextureCubeMapTarget = textureCubeMapTargetMap[depthOrArrayLayers]; + + console.assert(!!textureCubeMapTarget, `CubeMap的depthOrArrayLayers值应在[0-5]之间！`); + + return textureCubeMapTarget; +} + +const textureCubeMapTargetMap: GLTextureCubeMapTarget[] = [ + "TEXTURE_CUBE_MAP_POSITIVE_X", + "TEXTURE_CUBE_MAP_NEGATIVE_X", + "TEXTURE_CUBE_MAP_POSITIVE_Y", + "TEXTURE_CUBE_MAP_NEGATIVE_Y", + "TEXTURE_CUBE_MAP_POSITIVE_Z", + "TEXTURE_CUBE_MAP_NEGATIVE_Z", +]; + +/** + * A GLenum specifying the texture target. + * + * gl.TEXTURE_CUBE_MAP_POSITIVE_X: Positive X face for a cube-mapped texture. + * gl.TEXTURE_CUBE_MAP_NEGATIVE_X: Negative X face for a cube-mapped texture. + * gl.TEXTURE_CUBE_MAP_POSITIVE_Y: Positive Y face for a cube-mapped texture. + * gl.TEXTURE_CUBE_MAP_NEGATIVE_Y: Negative Y face for a cube-mapped texture. + * gl.TEXTURE_CUBE_MAP_POSITIVE_Z: Positive Z face for a cube-mapped texture. + * gl.TEXTURE_CUBE_MAP_NEGATIVE_Z: Negative Z face for a cube-mapped texture. + * + * https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texImage2D + */ +type GLTextureCubeMapTarget = + | "TEXTURE_CUBE_MAP_POSITIVE_X" + | "TEXTURE_CUBE_MAP_NEGATIVE_X" + | "TEXTURE_CUBE_MAP_POSITIVE_Y" + | "TEXTURE_CUBE_MAP_NEGATIVE_Y" + | "TEXTURE_CUBE_MAP_POSITIVE_Z" + | "TEXTURE_CUBE_MAP_NEGATIVE_Z"; \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index a0c8816..d6987d2 100644 --- a/src/index.ts +++ b/src/index.ts @@ -23,6 +23,3 @@ export * from "./WebGL"; export * as internal from "./internal"; export * from "./caches/getGLBuffer"; - -export * from "./utils/getIVertexFormat"; - diff --git a/src/utils/getGLRenderPassAttachmentSize.ts b/src/utils/getGLRenderPassAttachmentSize.ts deleted file mode 100644 index 224f42c..0000000 --- a/src/utils/getGLRenderPassAttachmentSize.ts +++ /dev/null @@ -1,41 +0,0 @@ -import { RenderPassDescriptor } from "@feng3d/render-api"; - -/** - * 获取渲染通道附件尺寸。 - * - * @param gl - * @param descriptor - */ -export function getGLRenderPassAttachmentSize(gl: WebGLRenderingContext, descriptor: RenderPassDescriptor): { readonly width: number; readonly height: number; } -{ - if (!descriptor) return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; - - const colorAttachments = descriptor.colorAttachments; - if (colorAttachments) - { - for (let i = 0; i < colorAttachments.length; i++) - { - const view = colorAttachments[i].view; - if (view) - { - return { width: view.texture.size[0], height: view.texture.size[1] }; - } - - return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; - } - } - - const depthStencilAttachment = descriptor.depthStencilAttachment; - if (depthStencilAttachment) - { - const view = depthStencilAttachment.view; - if (view) - { - return { width: view.texture.size[0], height: view.texture.size[1] }; - } - - return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; - } - - return { width: gl.drawingBufferWidth, height: gl.drawingBufferHeight }; -} \ No newline at end of file diff --git a/src/utils/getIGLCullFace.ts b/src/utils/getIGLCullFace.ts deleted file mode 100644 index b332f7e..0000000 --- a/src/utils/getIGLCullFace.ts +++ /dev/null @@ -1,32 +0,0 @@ -import { CullFace } from "@feng3d/render-api"; - -export function getIGLCullFace(cullFace: CullFace) -{ - const glCullMode: IGLCullFace = cullFaceMap[cullFace]; - - console.assert(!!glCullMode, `接收到错误值，请从 ${Object.keys(cullFaceMap).toString()} 中取值！`); - - return glCullMode; -} - -const cullFaceMap: { [key: string]: IGLCullFace } = { - FRONT_AND_BACK: "FRONT_AND_BACK", - none: "BACK", // 不会开启剔除面功能，什么值无所谓。 - front: "FRONT", - back: "BACK", -}; - -/** - * 剔除面，默认 BACK，剔除背面。 - * - * 默认情况下，逆时针的顶点连接顺序被定义为三角形的正面。 - * 使用gl.frontFace(gl.CW);调整顺时针为正面 - * - * * FRONT 正面 - * * BACK 背面 - * * FRONT_AND_BACK 正面与背面 - * - * @see http://www.jianshu.com/p/ee04165f2a02 - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/cullFace - */ -export type IGLCullFace = "FRONT" | "BACK" | "FRONT_AND_BACK"; \ No newline at end of file diff --git a/src/utils/getIGLFrontFace.ts b/src/utils/getIGLFrontFace.ts deleted file mode 100644 index 3c352b6..0000000 --- a/src/utils/getIGLFrontFace.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { FrontFace } from "@feng3d/render-api"; - -export function getIGLFrontFace(frontFace: FrontFace) -{ - const glFrontFace: IGLFrontFace = frontFaceMap[frontFace]; - - console.assert(!!glFrontFace, `接收到错误 IFrontFace 值，请从 ${Object.keys(frontFaceMap).toString()} 中取值！`); - - return glFrontFace; -} -const frontFaceMap: { [key: string]: IGLFrontFace } = { - ccw: "CCW", - cw: "CW", -}; - -/** - * 正面方向枚举 - * - * * CW 顺时钟方向 - * * CCW 逆时钟方向 - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/frontFace - */ -export type IGLFrontFace = "CW" | "CCW"; diff --git a/src/utils/getIVertexFormat.ts b/src/utils/getIVertexFormat.ts deleted file mode 100644 index 07d4171..0000000 --- a/src/utils/getIVertexFormat.ts +++ /dev/null @@ -1,43 +0,0 @@ -import { GLVertexAttributeTypes, VertexFormat, VertexAttributeFormatInfo, vertexFormatMap } from "@feng3d/render-api"; - -export function getIVertexFormat(numComponents: 1 | 2 | 3 | 4, type: GLVertexAttributeTypes = "FLOAT", normalized = false): VertexFormat -{ - for (const key in vertexFormatMap) - { - const element = vertexFormatMap[key]; - if ( - element.numComponents === numComponents - && element.type === type - && !element.normalized === !normalized - ) - { - return key as VertexFormat; - } - } - - console.error(`没有找到与 ${JSON.stringify({ numComponents, type, normalized })} 对应的顶点数据格式！`); - - return undefined; -} - -export function getIGLVertexFormat(format: VertexFormat): VertexAttributeFormatInfo -{ - const glVertexFormat = vertexFormatMap[format]; - - console.assert(!!glVertexFormat, `接收到错误值，请从 ${Object.keys(vertexFormatMap).toString()} 中取值！`); - - return glVertexFormat; -} - -/** - * A GLenum specifying the data type of each component in the array. Must be one of: - * * gl.BYTE - * * gl.UNSIGNED_BYTE - * * gl.SHORT - * * gl.UNSIGNED_SHORT - * * gl.INT - * * gl.UNSIGNED_INT. - * - * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext/vertexAttribIPointer - */ -export type IGLVertexAttributeIntegerTypes = "BYTE" | "UNSIGNED_BYTE" | "SHORT" | "UNSIGNED_SHORT" | "INT" | "UNSIGNED_INT"; \ No newline at end of file diff --git a/src/utils/getTextureCubeMapTarget.ts b/src/utils/getTextureCubeMapTarget.ts deleted file mode 100644 index fbdd306..0000000 --- a/src/utils/getTextureCubeMapTarget.ts +++ /dev/null @@ -1,37 +0,0 @@ -export function getTextureCubeMapTarget(depthOrArrayLayers: number) -{ - const textureCubeMapTarget: IGLTextureCubeMapTarget = textureCubeMapTargetMap[depthOrArrayLayers]; - - console.assert(!!textureCubeMapTarget, `CubeMap的depthOrArrayLayers值应在[0-5]之间！`); - - return textureCubeMapTarget; -} - -const textureCubeMapTargetMap: IGLTextureCubeMapTarget[] = [ - "TEXTURE_CUBE_MAP_POSITIVE_X", - "TEXTURE_CUBE_MAP_NEGATIVE_X", - "TEXTURE_CUBE_MAP_POSITIVE_Y", - "TEXTURE_CUBE_MAP_NEGATIVE_Y", - "TEXTURE_CUBE_MAP_POSITIVE_Z", - "TEXTURE_CUBE_MAP_NEGATIVE_Z", -]; - -/** - * A GLenum specifying the texture target. - * - * gl.TEXTURE_CUBE_MAP_POSITIVE_X: Positive X face for a cube-mapped texture. - * gl.TEXTURE_CUBE_MAP_NEGATIVE_X: Negative X face for a cube-mapped texture. - * gl.TEXTURE_CUBE_MAP_POSITIVE_Y: Positive Y face for a cube-mapped texture. - * gl.TEXTURE_CUBE_MAP_NEGATIVE_Y: Negative Y face for a cube-mapped texture. - * gl.TEXTURE_CUBE_MAP_POSITIVE_Z: Positive Z face for a cube-mapped texture. - * gl.TEXTURE_CUBE_MAP_NEGATIVE_Z: Negative Z face for a cube-mapped texture. - * - * https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/texImage2D - */ -export type IGLTextureCubeMapTarget = - | "TEXTURE_CUBE_MAP_POSITIVE_X" - | "TEXTURE_CUBE_MAP_NEGATIVE_X" - | "TEXTURE_CUBE_MAP_POSITIVE_Y" - | "TEXTURE_CUBE_MAP_NEGATIVE_Y" - | "TEXTURE_CUBE_MAP_POSITIVE_Z" - | "TEXTURE_CUBE_MAP_NEGATIVE_Z"; -- Gitee From 86bef578084a09b80dcaee16c5e7fc69574ec9cb Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Thu, 13 Mar 2025 13:23:25 +0800 Subject: [PATCH 47/57] =?UTF-8?q?refactor(caches):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E7=BC=93=E5=86=B2=E5=8C=BA=E7=BB=91=E5=AE=9A=E4=BF=A1=E6=81=AF?= =?UTF-8?q?=E6=8E=A5=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 IBufferBindingInfo 接口移至 @feng3d/render-api 模块 - 重命名为 BufferBindingInfo - 更新相关引用和类型定义 - 优化 updateBufferBinding 函数的实现 --- src/caches/getGLProgram.ts | 22 ++++------------------ src/utils/updateBufferBinding.ts | 9 ++++----- 2 files changed, 8 insertions(+), 23 deletions(-) diff --git a/src/caches/getGLProgram.ts b/src/caches/getGLProgram.ts index c501037..50c55fe 100644 --- a/src/caches/getGLProgram.ts +++ b/src/caches/getGLProgram.ts @@ -1,4 +1,4 @@ -import { GLVertexAttributeTypes, RenderPipeline } from "@feng3d/render-api"; +import { BufferBindingInfo, GLVertexAttributeTypes, RenderPipeline } from "@feng3d/render-api"; import { getWebGLUniformType, GLUniformBufferType, GLUniformType, isWebGLUniformTextureType } from "../const/GLUniformType"; import { TransformFeedbackPipeline, TransformFeedbackVaryings } from "../data/TransformFeedbackPass"; @@ -244,7 +244,7 @@ export interface UniformBlockInfo /** * 缓冲区绑定信息。 */ - bufferBindingInfo: IBufferBindingInfo; + bufferBindingInfo: BufferBindingInfo; } /** @@ -322,21 +322,7 @@ function createLinkProgram(gl: WebGLRenderingContext, vertexShader: WebGLShader, */ export type ShaderType = "FRAGMENT_SHADER" | "VERTEX_SHADER"; -/** - * 缓冲区绑定信息。 - */ -export interface IBufferBindingInfo -{ - size: number; - items: { - paths: string[]; - offset: number; - size: number; - Cls: Float32ArrayConstructor | Int32ArrayConstructor | Uint32ArrayConstructor; - }[] -} - -function getBufferBindingInfo(uniformBlock: UniformBlockInfo): IBufferBindingInfo +function getBufferBindingInfo(uniformBlock: UniformBlockInfo): BufferBindingInfo { const size = uniformBlock.dataSize; // @@ -377,7 +363,7 @@ function getBufferBindingInfo(uniformBlock: UniformBlockInfo): IBufferBindingInf console.assert(size === currentSize, `uniformBlock映射尺寸出现错误( ${size} ${currentSize} )！`); - const bufferBindingInfo: IBufferBindingInfo = { + const bufferBindingInfo: BufferBindingInfo = { size: uniformBlock.dataSize, items, }; diff --git a/src/utils/updateBufferBinding.ts b/src/utils/updateBufferBinding.ts index 8297834..992c033 100644 --- a/src/utils/updateBufferBinding.ts +++ b/src/utils/updateBufferBinding.ts @@ -1,6 +1,5 @@ -import { BufferBinding, UnReadonly } from "@feng3d/render-api"; +import { BufferBinding, BufferBindingInfo, UnReadonly } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; -import { IBufferBindingInfo } from "../caches/getGLProgram"; import { getIGLBuffer } from "../runs/getIGLBuffer"; /** @@ -10,11 +9,11 @@ import { getIGLBuffer } from "../runs/getIGLBuffer"; * * @see https://learnopengl-cn.readthedocs.io/zh/latest/04%20Advanced%20OpenGL/08%20Advanced%20GLSL/#uniform_1 */ -export function updateBufferBinding(bufferBindingInfo: IBufferBindingInfo, uniformData: BufferBinding) +export function updateBufferBinding(bufferBindingInfo: BufferBindingInfo, uniformData: BufferBinding) { if (uniformData["_bufferBindingInfo"] !== undefined) { - const preVariableInfo = uniformData["_bufferBindingInfo"] as any as IBufferBindingInfo; + const preVariableInfo = uniformData["_bufferBindingInfo"] as any as BufferBindingInfo; if (preVariableInfo.size !== bufferBindingInfo.size) { console.warn(`updateBufferBinding 出现一份数据对应多个 variableInfo`, { uniformData, bufferBindingInfo, preVariableInfo }); @@ -62,7 +61,7 @@ export function updateBufferBinding(bufferBindingInfo: IBufferBindingInfo, unifo } } - let data: Float32Array | Int32Array | Uint32Array; + let data: Int16Array | Int32Array | Uint32Array | Float32Array; if (typeof value === "number") { data = new Cls([value]); -- Gitee From f2334e5a9cd54a06eaf785a1a0d4e41d44c1c7cb Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 14 Mar 2025 18:18:32 +0800 Subject: [PATCH 48/57] =?UTF-8?q?refactor(feng3d):=20=E9=87=8D=E6=9E=84=20?= =?UTF-8?q?Buffer=20=E7=9B=B8=E5=85=B3=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 Buffer 接口重命名为 GBuffer，以区分原生 WebGL Buffer - 更新了多个文件中的 Buffer 引用，改为 GBuffer - 调整了部分相关函数和类的命名，以适应新的 GBuffer 命名 - 重构了部分代码结构，以提高可读性和可维护性 --- examples/src/WebGL2Samples/buffer_copy.ts | 4 ++-- examples/src/WebGL2Samples/fbo_new_blend_equation.ts | 4 ++-- examples/src/WebGL2Samples/fbo_read_pixels.ts | 4 ++-- examples/src/WebGL2Samples/fbo_rtt_texture_array.ts | 4 ++-- examples/src/WebGL2Samples/glsl_centroid.ts | 4 ++-- .../WebGL2Samples/glsl_flat_smooth_interpolators.ts | 4 ++-- examples/src/WebGL2Samples/query_occlusion.ts | 4 ++-- examples/src/WebGL2Samples/sampler_filter.ts | 4 ++-- examples/src/WebGL2Samples/sampler_wrap.ts | 4 ++-- examples/src/WebGL2Samples/texture_format.ts | 4 ++-- examples/src/WebGL2Samples/texture_immutable.ts | 4 ++-- examples/src/WebGL2Samples/texture_lod.ts | 4 ++-- examples/src/WebGL2Samples/texture_offset.ts | 4 ++-- examples/src/WebGL2Samples/texture_pixel_store.ts | 4 ++-- examples/src/WebGL2Samples/texture_srgb.ts | 4 ++-- examples/src/WebGL2Samples/texture_vertex.ts | 4 ++-- src/RunWebGL.ts | 8 ++++---- src/WebGL.ts | 4 ++-- src/caches/getGLBuffer.ts | 12 ++++++------ src/caches/getGLRenderOcclusionQuery.ts | 4 ++-- src/data/TransformFeedbackPass.ts | 4 ++-- src/data/polyfills/Buffer.ts | 2 +- src/data/polyfills/RenderPass.ts | 2 +- src/data/polyfills/Uniforms.ts | 2 +- src/runs/getIGLBuffer.ts | 6 +++--- src/utils/updateBufferBinding.ts | 4 ++-- 26 files changed, 56 insertions(+), 56 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_copy.ts b/examples/src/WebGL2Samples/buffer_copy.ts index 4c8c588..2929efc 100644 --- a/examples/src/WebGL2Samples/buffer_copy.ts +++ b/examples/src/WebGL2Samples/buffer_copy.ts @@ -1,4 +1,4 @@ -import { Buffer, CanvasContext, CopyBufferToBuffer, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { GBuffer, CanvasContext, CopyBufferToBuffer, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { WebGL, getIGLBuffer } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -29,7 +29,7 @@ import { getShaderSource } from "./utility"; -1.0, 1.0, -1.0, -1.0 ]); - const vertexPosBufferSrc: Buffer = { target: "ARRAY_BUFFER", size: vertices.byteLength, data: vertices, usage: "STATIC_DRAW" }; + const vertexPosBufferSrc: GBuffer = { target: "ARRAY_BUFFER", size: vertices.byteLength, data: vertices, usage: "STATIC_DRAW" }; const vertexPosBufferDst = new Float32Array(vertices.length); diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index 42db997..3d3d193 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { CanvasContext, RenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -128,7 +128,7 @@ function render() } }; - const renderObjects: IRenderPassObject[] = []; + const renderObjects: RenderPassObject[] = []; const renderPass: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.5, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects, diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index 739e085..a9f8086 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, RenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -141,7 +141,7 @@ const rp1: RenderPass = { }], }; -const renderObjects: IRenderPassObject[] = []; +const renderObjects: RenderPassObject[] = []; // Pass 2 const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index 3124e6f..91b9e30 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, RenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { getShaderSource } from "./utility"; @@ -144,7 +144,7 @@ const renderPass1: RenderPass = { }; // Pass 2 -const renderObjects: IRenderPassObject[] = []; +const renderObjects: RenderPassObject[] = []; const renderPass: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }], diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index ea9b2c2..938ddc3 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IPassEncoder, IRenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { CanvasContext, IPassEncoder, RenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -172,7 +172,7 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) passEncoders.push(rp); } -const renderObjects: IRenderPassObject[] = []; +const renderObjects: RenderPassObject[] = []; // Pass 2 const rp2: RenderPass = { renderObjects, diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index a236505..57d36d1 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IIndicesDataTypes, IRenderPassObject, RenderPass, RenderPipeline, VertexAttributes, VertexFormat, Viewport } from "@feng3d/render-api"; +import { CanvasContext, IIndicesDataTypes, RenderPassObject, RenderPass, RenderPipeline, VertexAttributes, VertexFormat, Viewport } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { GlTFLoader, Primitive } from "./third-party/gltf-loader"; @@ -135,7 +135,7 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) // -- Render loop (function render() { - const renderObjects: IRenderPassObject[] = []; + const renderObjects: RenderPassObject[] = []; const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }], diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index 199cdb3..5924175 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, OcclusionQuery, RenderObject, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, RenderPassObject, OcclusionQuery, RenderObject, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { watcher } from "@feng3d/watcher"; @@ -40,7 +40,7 @@ const vertexArray: { vertices?: VertexAttributes } = { } }; -const renderObjects: IRenderPassObject[] = []; +const renderObjects: RenderPassObject[] = []; // -- Render const rp: RenderPass = { descriptor: { diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index da28550..5506b72 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, RenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -141,7 +141,7 @@ function render() 0.0, 0.0, 0.0, 1.0 ]); - const renderObjects: IRenderPassObject[] = []; + const renderObjects: RenderPassObject[] = []; const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index 43cc164..c94b0d6 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, RenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -131,7 +131,7 @@ loadImage(imageUrl, function (image) function render() { - const renderObjects: IRenderPassObject[] = []; + const renderObjects: RenderPassObject[] = []; // Clear color buffer const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index f9deefc..41e9e90 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, TextureFormat, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, RenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, TextureFormat, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -163,7 +163,7 @@ import { getShaderSource, loadImage } from "./utility"; 0.0, 0.0, 0.0, 1.0 ]); - const renderObjects: IRenderPassObject[] = []; + const renderObjects: RenderPassObject[] = []; const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index d1af5ce..6387eee 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, RenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { snoise } from "./third-party/noise3D"; @@ -110,7 +110,7 @@ import { getShaderSource, loadImage } from "./utility"; } }; - const renderObjects: IRenderPassObject[] = []; + const renderObjects: RenderPassObject[] = []; const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index 4d4fb87..ee15356 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, RenderPassObject, RenderObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -183,7 +183,7 @@ import { getShaderSource, loadImage } from "./utility"; function render() { - const renderObjects: IRenderPassObject[] = []; + const renderObjects: RenderPassObject[] = []; // Clear color buffer const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index 6d14551..ffdbc4d 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, RenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -84,7 +84,7 @@ import { getShaderSource, loadImage } from "./utility"; addressModeV: "clamp-to-edge", }; - const renderObjects: IRenderPassObject[] = []; + const renderObjects: RenderPassObject[] = []; // -- Render const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index 05e96e5..99369e9 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IIndicesDataTypes, IRenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, VertexDataTypes } from "@feng3d/render-api"; +import { CanvasContext, IIndicesDataTypes, RenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, VertexDataTypes } from "@feng3d/render-api"; import { getIGLBuffer, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -76,7 +76,7 @@ import { getShaderSource, loadImage } from "./utility"; magFilter: "nearest", }; - const renderObjects: IRenderPassObject[] = []; + const renderObjects: RenderPassObject[] = []; // -- Render const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index 3ab690d..b0b5b2b 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IRenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, VertexDataTypes } from "@feng3d/render-api"; +import { CanvasContext, RenderPassObject, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, VertexDataTypes } from "@feng3d/render-api"; import { getIGLBuffer, WebGL } from "@feng3d/webgl"; import { getShaderSource, loadImage } from "./utility"; @@ -68,7 +68,7 @@ import { getShaderSource, loadImage } from "./utility"; function render() { - const renderObjects: IRenderPassObject[] = []; + const renderObjects: RenderPassObject[] = []; // Clear color buffer const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index 86f816b..c39ece5 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -1,4 +1,4 @@ -import { CanvasContext, GLVertexAttributeTypes, IIndicesDataTypes, IRenderPassObject, PrimitiveTopology, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, VertexDataTypes, VertexFormat, vertexFormatMap } from "@feng3d/render-api"; +import { CanvasContext, GLVertexAttributeTypes, IIndicesDataTypes, RenderPassObject, PrimitiveTopology, RenderPass, RenderPipeline, Sampler, Texture, VertexAttributes, VertexDataTypes, VertexFormat, vertexFormatMap } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; @@ -181,7 +181,7 @@ import { getShaderSource, loadImage } from "./utility"; const localMV = mat4.create(); function render() { - const renderObjects: IRenderPassObject[] = []; + const renderObjects: RenderPassObject[] = []; // -- Render const rp: RenderPass = { descriptor: { diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 060bf38..b09d580 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BlendComponent, BlendState, Buffer, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, CullFace, DepthStencilState, DrawIndexed, DrawVertex, FrontFace, IIndicesDataTypes, IRenderPassObject, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, Uniforms, UnReadonly, VertexAttribute, VertexAttributes, vertexFormatMap, Viewport } from "@feng3d/render-api"; +import { BindingResources, BlendComponent, BlendState, GBuffer, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, CullFace, DepthStencilState, DrawIndexed, DrawVertex, FrontFace, IIndicesDataTypes, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassDescriptor, RenderPassObject, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, UnReadonly, VertexAttribute, VertexAttributes, vertexFormatMap, Viewport } from "@feng3d/render-api"; import { getGLBlitFramebuffer } from "./caches/getGLBlitFramebuffer"; import { getGLBuffer } from "./caches/getGLBuffer"; @@ -181,7 +181,7 @@ export class RunWebGL ); } - private runRenderObjects(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObjects?: readonly IRenderPassObject[]) + private runRenderObjects(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObjects?: readonly RenderPassObject[]) { renderObjects?.forEach((renderObject) => { @@ -318,7 +318,7 @@ export class RunWebGL /** * 激活常量 */ - private runUniforms(gl: WebGLRenderingContext, material: RenderPipeline, uniforms: Uniforms) + private runUniforms(gl: WebGLRenderingContext, material: RenderPipeline, uniforms: BindingResources) { const webGLProgram = getGLProgram(gl, material); @@ -371,7 +371,7 @@ export class RunWebGL buffer.target ??= "UNIFORM_BUFFER"; buffer.usage ??= "DYNAMIC_DRAW"; - (buffer as UnReadonly).label = buffer.label || (`UniformBuffer ${name}`); + (buffer as UnReadonly).label = buffer.label || (`UniformBuffer ${name}`); // const webGLBuffer = getGLBuffer(gl, buffer); diff --git a/src/WebGL.ts b/src/WebGL.ts index dee1ce4..fb03131 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -1,4 +1,4 @@ -import { Buffer, CanvasContext, ReadPixels, RenderPassDescriptor, RenderPipeline, Sampler, Submit, Texture } from "@feng3d/render-api"; +import { GBuffer, CanvasContext, ReadPixels, RenderPassDescriptor, RenderPipeline, Sampler, Submit, Texture } from "@feng3d/render-api"; import { RunWebGL } from "./RunWebGL"; import { deleteBuffer } from "./caches/getGLBuffer"; @@ -58,7 +58,7 @@ export class WebGL deleteRenderbuffer(this._gl, renderbuffer); } - deleteBuffer(buffer: Buffer) + deleteBuffer(buffer: GBuffer) { deleteBuffer(this._gl, buffer); } diff --git a/src/caches/getGLBuffer.ts b/src/caches/getGLBuffer.ts index a38070f..94d5fc6 100644 --- a/src/caches/getGLBuffer.ts +++ b/src/caches/getGLBuffer.ts @@ -1,11 +1,11 @@ -import { Buffer } from "@feng3d/render-api"; +import { GBuffer, UnReadonly } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; declare global { interface WebGLRenderingContext { - _buffers: Map + _buffers: Map } interface WebGLBuffer @@ -17,7 +17,7 @@ declare global } } -export function getGLBuffer(gl: WebGLRenderingContext, buffer: Buffer) +export function getGLBuffer(gl: WebGLRenderingContext, buffer: GBuffer) { let webGLBuffer = gl._buffers.get(buffer); if (webGLBuffer) return webGLBuffer; @@ -66,7 +66,7 @@ export function getGLBuffer(gl: WebGLRenderingContext, buffer: Buffer) } gl.bufferSubData(gl[target], bufferOffset, arrayBufferView); }); - buffer.writeBuffers = null; + (buffer as UnReadonly).writeBuffers = null; }; const dataChange = () => @@ -75,7 +75,7 @@ export function getGLBuffer(gl: WebGLRenderingContext, buffer: Buffer) const writeBuffers = buffer.writeBuffers || []; writeBuffers.unshift({ data: buffer.data }); - buffer.writeBuffers = writeBuffers; + (buffer as UnReadonly).writeBuffers = writeBuffers; }; dataChange(); @@ -95,7 +95,7 @@ export function getGLBuffer(gl: WebGLRenderingContext, buffer: Buffer) return webGLBuffer; } -export function deleteBuffer(gl: WebGLRenderingContext, buffer: Buffer) +export function deleteBuffer(gl: WebGLRenderingContext, buffer: GBuffer) { const webGLBuffer = gl._buffers.get(buffer); if (webGLBuffer) diff --git a/src/caches/getGLRenderOcclusionQuery.ts b/src/caches/getGLRenderOcclusionQuery.ts index 88a9f3a..386343c 100644 --- a/src/caches/getGLRenderOcclusionQuery.ts +++ b/src/caches/getGLRenderOcclusionQuery.ts @@ -1,8 +1,8 @@ -import { IRenderPassObject, OcclusionQuery, RenderPass } from "@feng3d/render-api"; +import { RenderPassObject, OcclusionQuery, RenderPass } from "@feng3d/render-api"; import "../data/polyfills/OcclusionQuery"; -export function getGLRenderOcclusionQuery(gl: WebGLRenderingContext, renderObjects?: readonly IRenderPassObject[]) +export function getGLRenderOcclusionQuery(gl: WebGLRenderingContext, renderObjects?: readonly RenderPassObject[]) { if (!renderObjects) return defautRenderOcclusionQuery; if (!(gl instanceof WebGL2RenderingContext)) return defautRenderOcclusionQuery; diff --git a/src/data/TransformFeedbackPass.ts b/src/data/TransformFeedbackPass.ts index 1ba3602..ca3ad1f 100644 --- a/src/data/TransformFeedbackPass.ts +++ b/src/data/TransformFeedbackPass.ts @@ -1,4 +1,4 @@ -import { DrawVertex, VertexDataTypes, Uniforms, VertexAttributes, VertexState } from "@feng3d/render-api"; +import { BindingResources, DrawVertex, VertexAttributes, VertexDataTypes, VertexState } from "@feng3d/render-api"; declare module "@feng3d/render-api" { @@ -43,7 +43,7 @@ export interface TransformFeedbackObject /** * Uniform渲染数据 */ - uniforms?: Uniforms; + uniforms?: BindingResources; /** * 回写顶点着色器中输出到缓冲区。 diff --git a/src/data/polyfills/Buffer.ts b/src/data/polyfills/Buffer.ts index 9b08778..42ec420 100644 --- a/src/data/polyfills/Buffer.ts +++ b/src/data/polyfills/Buffer.ts @@ -7,7 +7,7 @@ declare module "@feng3d/render-api" * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bufferData */ - export interface Buffer + export interface GBuffer { /** * WebGL缓冲区目标。 diff --git a/src/data/polyfills/RenderPass.ts b/src/data/polyfills/RenderPass.ts index 6f3fd18..62f56fe 100644 --- a/src/data/polyfills/RenderPass.ts +++ b/src/data/polyfills/RenderPass.ts @@ -1,4 +1,4 @@ -import { RenderPass, IRenderPassObject } from "@feng3d/render-api"; +import { RenderPass, RenderPassObject } from "@feng3d/render-api"; declare module "@feng3d/render-api" { diff --git a/src/data/polyfills/Uniforms.ts b/src/data/polyfills/Uniforms.ts index dc33254..b2b0aec 100644 --- a/src/data/polyfills/Uniforms.ts +++ b/src/data/polyfills/Uniforms.ts @@ -3,7 +3,7 @@ import { SamplerTexture } from "../SamplerTexture"; declare module "@feng3d/render-api" { - export interface UniformTypeMap + export interface BindingResourceTypeMap { GLSamplerTexture: SamplerTexture; UniformDataItem: UniformDataItem; diff --git a/src/runs/getIGLBuffer.ts b/src/runs/getIGLBuffer.ts index e1c7f16..ef93403 100644 --- a/src/runs/getIGLBuffer.ts +++ b/src/runs/getIGLBuffer.ts @@ -1,11 +1,11 @@ -import { Buffer, TypedArray } from "@feng3d/render-api"; +import { GBuffer, TypedArray } from "@feng3d/render-api"; import { BufferTarget, BufferUsage } from "../data/polyfills/Buffer"; -export function getIGLBuffer(data: TypedArray, target?: BufferTarget, usage: BufferUsage = "STATIC_DRAW"): Buffer +export function getIGLBuffer(data: TypedArray, target?: BufferTarget, usage: BufferUsage = "STATIC_DRAW"): GBuffer { if (data[_IGLBuffer]) return data[_IGLBuffer]; - const buffer: Buffer = { + const buffer: GBuffer = { size: Math.ceil(data.byteLength / 4) * 4, target, usage, diff --git a/src/utils/updateBufferBinding.ts b/src/utils/updateBufferBinding.ts index 992c033..1469ee5 100644 --- a/src/utils/updateBufferBinding.ts +++ b/src/utils/updateBufferBinding.ts @@ -1,4 +1,4 @@ -import { BufferBinding, BufferBindingInfo, UnReadonly } from "@feng3d/render-api"; +import { BufferBinding, BufferBindingInfo, UnReadonly, GBuffer } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; import { getIGLBuffer } from "../runs/getIGLBuffer"; @@ -77,7 +77,7 @@ export function updateBufferBinding(bufferBindingInfo: BufferBindingInfo, unifor const writeBuffers = buffer.writeBuffers ?? []; writeBuffers.push({ data: data.buffer, bufferOffset: offset + itemInfoOffset, size: Math.min(itemInfoSize, data.byteLength) }); - buffer.writeBuffers = writeBuffers; + (buffer as UnReadonly).writeBuffers = writeBuffers; }; update(); -- Gitee From c5b291fac3418be47b01f493a28f7276fe5b8b24 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 14 Mar 2025 18:23:24 +0800 Subject: [PATCH 49/57] =?UTF-8?q?refactor(examples):=20=E5=B0=86=20uniform?= =?UTF-8?q?=20=E6=94=B9=E4=B8=BA=20bindingResources?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在多个示例文件中，将 RenderObject 的 uniforms 属性更改为 bindingResources - 这一更改是为了适应 WebGL2Samples 和其他示例中的新 API 或编码约定 - 受影响的文件包括但不限于： - buffer_uniform.ts - draw_image_space.ts - draw_instanced.ts - fbo_blit.ts - texture_2d_array.ts - regl-examples 目录下的多个文件 - test 目录下的多个文件 - webgl-examples 目录下的多个文件 --- examples/src/WebGL2Samples/buffer_uniform.ts | 2 +- examples/src/WebGL2Samples/draw_image_space.ts | 2 +- examples/src/WebGL2Samples/draw_instanced.ts | 2 +- examples/src/WebGL2Samples/draw_instanced_ubo.ts | 2 +- examples/src/WebGL2Samples/draw_primitive_restart.ts | 2 +- examples/src/WebGL2Samples/fbo_blit.ts | 4 ++-- examples/src/WebGL2Samples/fbo_multisample.ts | 4 ++-- examples/src/WebGL2Samples/fbo_new_blend_equation.ts | 2 +- examples/src/WebGL2Samples/fbo_read_pixels.ts | 6 +++--- examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts | 2 +- examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts | 2 +- examples/src/WebGL2Samples/fbo_rtt_texture_array.ts | 6 +++--- examples/src/WebGL2Samples/geo_vertex_format.ts | 6 +++--- examples/src/WebGL2Samples/glsl_centroid.ts | 4 ++-- .../WebGL2Samples/glsl_flat_smooth_interpolators.ts | 2 +- examples/src/WebGL2Samples/glsl_non_square_matrix.ts | 2 +- examples/src/WebGL2Samples/sampler_filter.ts | 6 +++--- examples/src/WebGL2Samples/sampler_object.ts | 2 +- examples/src/WebGL2Samples/sampler_wrap.ts | 6 +++--- examples/src/WebGL2Samples/texture_2d_array.ts | 4 ++-- examples/src/WebGL2Samples/texture_3d.ts | 4 ++-- examples/src/WebGL2Samples/texture_derivative.ts | 8 ++++---- examples/src/WebGL2Samples/texture_fetch.ts | 2 +- examples/src/WebGL2Samples/texture_format.ts | 4 ++-- examples/src/WebGL2Samples/texture_grad.ts | 8 ++++---- examples/src/WebGL2Samples/texture_immutable.ts | 10 +++++----- examples/src/WebGL2Samples/texture_integer.ts | 2 +- examples/src/WebGL2Samples/texture_lod.ts | 4 ++-- examples/src/WebGL2Samples/texture_offset.ts | 4 ++-- examples/src/WebGL2Samples/texture_pixel_store.ts | 2 +- examples/src/WebGL2Samples/texture_srgb.ts | 2 +- examples/src/WebGL2Samples/texture_vertex.ts | 2 +- .../src/WebGL2Samples/transform_feedback_instanced.ts | 2 +- .../WebGL2Samples/transform_feedback_separated_2.ts | 2 +- examples/src/regl-examples/basic.ts | 2 +- examples/src/regl-examples/batch.ts | 6 +++--- examples/src/regl-examples/bunny.ts | 6 +++--- examples/src/regl-examples/camera.ts | 2 +- examples/src/regl-examples/cloth.ts | 8 ++++---- examples/src/regl-examples/cube.ts | 8 ++++---- examples/src/regl-examples/util/camera.ts | 4 ++-- examples/src/test/RenderObjectChanges.ts | 2 +- examples/src/test/fractalCube.ts | 6 +++--- examples/src/webgl-examples/sample1.ts | 2 +- examples/src/webgl-examples/sample2.ts | 2 +- examples/src/webgl-examples/sample3.ts | 2 +- examples/src/webgl-examples/sample4.ts | 6 +++--- examples/src/webgl-examples/sample5.ts | 6 +++--- examples/src/webgl-examples/sample6.ts | 6 +++--- examples/src/webgl-examples/sample7.ts | 8 ++++---- examples/src/webgl-examples/sample8.ts | 8 ++++---- src/RunWebGL.ts | 2 +- 52 files changed, 105 insertions(+), 105 deletions(-) diff --git a/examples/src/WebGL2Samples/buffer_uniform.ts b/examples/src/WebGL2Samples/buffer_uniform.ts index 64fcc92..c5e19cd 100644 --- a/examples/src/WebGL2Samples/buffer_uniform.ts +++ b/examples/src/WebGL2Samples/buffer_uniform.ts @@ -83,7 +83,7 @@ import { getShaderSource } from "./utility"; const ro: RenderObject = { pipeline: program, - uniforms: { + bindingResources: { PerDraw: transforms, PerPass: lightPos, PerScene: material, diff --git a/examples/src/WebGL2Samples/draw_image_space.ts b/examples/src/WebGL2Samples/draw_image_space.ts index ea54075..c97064a 100644 --- a/examples/src/WebGL2Samples/draw_image_space.ts +++ b/examples/src/WebGL2Samples/draw_image_space.ts @@ -34,7 +34,7 @@ loadImage("../../assets/img/Di-3d.png", (img) => }; const renderObject: RenderObject = { - uniforms: { + bindingResources: { diffuse: { texture, sampler }, u_imageSize: [canvas.width / 2, canvas.height / 2], }, diff --git a/examples/src/WebGL2Samples/draw_instanced.ts b/examples/src/WebGL2Samples/draw_instanced.ts index 2a13ea3..dc8d4e9 100644 --- a/examples/src/WebGL2Samples/draw_instanced.ts +++ b/examples/src/WebGL2Samples/draw_instanced.ts @@ -31,7 +31,7 @@ const vertexArray: { vertices?: VertexAttributes } = { }; const renderObject: RenderObject = { - uniforms: {}, + bindingResources: {}, geometry:{ primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, diff --git a/examples/src/WebGL2Samples/draw_instanced_ubo.ts b/examples/src/WebGL2Samples/draw_instanced_ubo.ts index b7a5b83..6b37457 100644 --- a/examples/src/WebGL2Samples/draw_instanced_ubo.ts +++ b/examples/src/WebGL2Samples/draw_instanced_ubo.ts @@ -50,7 +50,7 @@ const rp: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0, 0, 0, 1], loadOp: "clear" }] }, renderObjects: [{ pipeline: program, - uniforms: { + bindingResources: { Transform: transforms, Material: materials, }, diff --git a/examples/src/WebGL2Samples/draw_primitive_restart.ts b/examples/src/WebGL2Samples/draw_primitive_restart.ts index 1ae13c2..e321c6e 100644 --- a/examples/src/WebGL2Samples/draw_primitive_restart.ts +++ b/examples/src/WebGL2Samples/draw_primitive_restart.ts @@ -43,7 +43,7 @@ const vertexArray: { vertices?: VertexAttributes } = { }; const renderObject: RenderObject = { - uniforms: {}, + bindingResources: {}, geometry: { primitive: { topology: "triangle-strip" }, vertices: vertexArray.vertices, diff --git a/examples/src/WebGL2Samples/fbo_blit.ts b/examples/src/WebGL2Samples/fbo_blit.ts index e042fab..87b8080 100644 --- a/examples/src/WebGL2Samples/fbo_blit.ts +++ b/examples/src/WebGL2Samples/fbo_blit.ts @@ -81,7 +81,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => const renderObject: RenderObject = { viewport: { x: 0, y: 0, width: FRAMEBUFFER_SIZE.x, height: FRAMEBUFFER_SIZE.y }, pipeline: program, - uniforms: { + bindingResources: { MVP: new Float32Array([ 0.8, 0.0, 0.0, 0.0, 0.0, 0.8, 0.0, 0.0, @@ -152,7 +152,7 @@ loadImage("../../assets/img/Di-3d.png", (image) => const renderObject2: RenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height }, - uniforms: { + bindingResources: { MVP: new Float32Array([ 1.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0, 0.0, diff --git a/examples/src/WebGL2Samples/fbo_multisample.ts b/examples/src/WebGL2Samples/fbo_multisample.ts index 6bd65bd..5f7eb6c 100644 --- a/examples/src/WebGL2Samples/fbo_multisample.ts +++ b/examples/src/WebGL2Samples/fbo_multisample.ts @@ -102,7 +102,7 @@ const renderPass1: RenderPass = { descriptor: framebuffer, renderObjects: [{ pipeline: programs[PROGRAM.TEXTURE], - uniforms: { MVP: IDENTITY }, + bindingResources: { MVP: IDENTITY }, geometry: { primitive: { topology: "LINE_LOOP" }, vertices: vertexArrays[PROGRAM.TEXTURE].vertices, @@ -123,7 +123,7 @@ const renderPass2: RenderPass = { renderObjects: [ { pipeline: programs[PROGRAM.SPLASH], - uniforms: { diffuse: { texture, sampler }, MVP: mvp }, + bindingResources: { diffuse: { texture, sampler }, MVP: mvp }, geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArrays[PROGRAM.SPLASH].vertices, diff --git a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts index 3d3d193..ab0c3c8 100644 --- a/examples/src/WebGL2Samples/fbo_new_blend_equation.ts +++ b/examples/src/WebGL2Samples/fbo_new_blend_equation.ts @@ -121,7 +121,7 @@ function render() const renderObject: RenderObject = { pipeline: program, - uniforms: { mvp: matrix, diffuse: { texture, sampler } }, + bindingResources: { mvp: matrix, diffuse: { texture, sampler } }, geometry:{ vertices: vertexArray.vertices, draw: { __type__: "DrawVertex", vertexCount: 6 }, diff --git a/examples/src/WebGL2Samples/fbo_read_pixels.ts b/examples/src/WebGL2Samples/fbo_read_pixels.ts index a9f8086..2c863be 100644 --- a/examples/src/WebGL2Samples/fbo_read_pixels.ts +++ b/examples/src/WebGL2Samples/fbo_read_pixels.ts @@ -132,7 +132,7 @@ const rp1: RenderPass = { { viewport: { x: 0, y: 0, width: w, height: h }, pipeline: multipleOutputProgram, - uniforms: { mvp: matrix }, + bindingResources: { mvp: matrix }, geometry: { primitive: { topology: "triangle-list" }, vertices: multipleOutputVertexArray.vertices, @@ -150,7 +150,7 @@ const rp: RenderPass = { const ro: RenderObject = { pipeline: layerProgram, - uniforms: { + bindingResources: { mvp: matrix, diffuse: { texture, sampler }, layer: 0, @@ -167,7 +167,7 @@ for (let i = 0; i < Textures.MAX; ++i) { ...ro, viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, - uniforms: { ...ro.uniforms, layer: i }, + bindingResources: { ...ro.bindingResources, layer: i }, }); } diff --git a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts index 5b08473..21b471e 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_depth_texture.ts @@ -110,7 +110,7 @@ const rp2: RenderPass = { }, renderObjects: [{ pipeline: drawProgram, - uniforms: { depthMap: { texture: depthTexture, sampler: depthSampler } }, + bindingResources: { depthMap: { texture: depthTexture, sampler: depthSampler } }, geometry: { primitive: { topology: "triangle-list" }, vertices: quadVertexArray.vertices, diff --git a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts index d79b987..233ad8c 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_draw_buffers.ts @@ -113,7 +113,7 @@ const renderPass2: RenderPass = { descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ pipeline: drawProgram, - uniforms: { + bindingResources: { color1Map: { texture: color1Texture, sampler: color1Sampler }, color2Map: { texture: color2Texture, sampler: color2Sampler }, }, diff --git a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts index 91b9e30..ddf9ca2 100644 --- a/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts +++ b/examples/src/WebGL2Samples/fbo_rtt_texture_array.ts @@ -134,7 +134,7 @@ const renderPass1: RenderPass = { { viewport: { x: 0, y: 0, width: w, height: h }, pipeline: multipleOutputProgram, - uniforms: { mvp: matrix }, + bindingResources: { mvp: matrix }, geometry:{ primitive: { topology: "triangle-list" }, vertices: multipleOutputVertexArray.vertices, @@ -154,7 +154,7 @@ const renderPass: RenderPass = { const renderObject: RenderObject = { pipeline: layerProgram, - uniforms: { mvp: matrix, diffuse: { texture, sampler } }, + bindingResources: { mvp: matrix, diffuse: { texture, sampler } }, geometry: { primitive: { topology: "triangle-list" }, vertices: layerVertexArray.vertices, @@ -169,7 +169,7 @@ for (let i = 0; i < Textures.MAX; ++i) { viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, ...renderObject, - uniforms: { ...renderObject.uniforms, layer: i }, + bindingResources: { ...renderObject.bindingResources, layer: i }, geometry: { ...renderObject.geometry, draw: { __type__: "DrawVertex", vertexCount: 6 }, diff --git a/examples/src/WebGL2Samples/geo_vertex_format.ts b/examples/src/WebGL2Samples/geo_vertex_format.ts index f5af330..8e41990 100644 --- a/examples/src/WebGL2Samples/geo_vertex_format.ts +++ b/examples/src/WebGL2Samples/geo_vertex_format.ts @@ -202,7 +202,7 @@ import { getShaderSource, loadImage } from "./utility"; const ro: RenderObject = { pipeline: program, - uniforms: { + bindingResources: { u_model: modelMatrix, u_modelInvTrans: modelInvTrans, u_lightPosition: lightPosition, @@ -234,8 +234,8 @@ import { getShaderSource, loadImage } from "./utility"; mat4.multiply(viewProj, perspectiveMatrix, viewMatrix); // - ro.uniforms.u_viewProj = viewProj; - ro.uniforms.s_tex2D = { texture, sampler }; + ro.bindingResources.u_viewProj = viewProj; + ro.bindingResources.s_tex2D = { texture, sampler }; webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index 938ddc3..0f8d97e 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -161,7 +161,7 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) descriptor: framebuffers[i], renderObjects: [{ pipeline: programs[i], - uniforms: { MVP: IDENTITY }, + bindingResources: { MVP: IDENTITY }, geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArrays[i].vertices, @@ -198,7 +198,7 @@ for (let i = 0; i < VIEWPORTS.MAX; ++i) { ...ro, viewport: viewport[i], - uniforms: { + bindingResources: { MVP: mvp, diffuse: { texture: textures[i], sampler: samplers[i] }, }, diff --git a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts index 57d36d1..acae1e1 100644 --- a/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts +++ b/examples/src/WebGL2Samples/glsl_flat_smooth_interpolators.ts @@ -169,7 +169,7 @@ glTFLoader.loadGLTF(gltfUrl, function (glTF) { viewport: viewport[i], pipeline: programs[i], - uniforms: { + bindingResources: { mvp: localMVP, mvNormal: localMVNormal, }, diff --git a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts index b25031a..2cdb869 100644 --- a/examples/src/WebGL2Samples/glsl_non_square_matrix.ts +++ b/examples/src/WebGL2Samples/glsl_non_square_matrix.ts @@ -67,7 +67,7 @@ loadImage("../../assets/img/Di-3d.png", function (image) descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ pipeline: program, - uniforms: { MVP: matrix, diffuse: { texture, sampler } }, + bindingResources: { MVP: matrix, diffuse: { texture, sampler } }, geometry:{ primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, diff --git a/examples/src/WebGL2Samples/sampler_filter.ts b/examples/src/WebGL2Samples/sampler_filter.ts index 5506b72..f3db340 100644 --- a/examples/src/WebGL2Samples/sampler_filter.ts +++ b/examples/src/WebGL2Samples/sampler_filter.ts @@ -149,7 +149,7 @@ function render() const ro: RenderObject = { pipeline: program, - uniforms: { mvp: matrix }, + bindingResources: { mvp: matrix }, geometry:{ primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, @@ -164,8 +164,8 @@ function render() { ...ro, viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, - uniforms: { - ...ro.uniforms, + bindingResources: { + ...ro.bindingResources, diffuse: { texture, sampler: samplers[i] } diff --git a/examples/src/WebGL2Samples/sampler_object.ts b/examples/src/WebGL2Samples/sampler_object.ts index 961e66e..7904176 100644 --- a/examples/src/WebGL2Samples/sampler_object.ts +++ b/examples/src/WebGL2Samples/sampler_object.ts @@ -89,7 +89,7 @@ function render() descriptor: { colorAttachments: [{ clearValue: [0.0, 0.0, 0.0, 1.0], loadOp: "clear" }] }, renderObjects: [{ pipeline: program, - uniforms: { + bindingResources: { mvp: matrix, materialDiffuse0: { texture, sampler: samplerA }, materialDiffuse1: { texture, sampler: samplerB }, diff --git a/examples/src/WebGL2Samples/sampler_wrap.ts b/examples/src/WebGL2Samples/sampler_wrap.ts index c94b0d6..e1703b2 100644 --- a/examples/src/WebGL2Samples/sampler_wrap.ts +++ b/examples/src/WebGL2Samples/sampler_wrap.ts @@ -147,7 +147,7 @@ function render() const ro: RenderObject = { pipeline: program, - uniforms: { mvp: matrix }, + bindingResources: { mvp: matrix }, geometry: { primitive: { topology: "triangle-list" }, vertices: vertexArray.vertices, @@ -161,8 +161,8 @@ function render() { ...ro, viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, - uniforms: { - ...ro.uniforms, + bindingResources: { + ...ro.bindingResources, diffuse: { texture, sampler: samplers[i] }, }, geometry: { diff --git a/examples/src/WebGL2Samples/texture_2d_array.ts b/examples/src/WebGL2Samples/texture_2d_array.ts index a0251e9..c4e0cd3 100644 --- a/examples/src/WebGL2Samples/texture_2d_array.ts +++ b/examples/src/WebGL2Samples/texture_2d_array.ts @@ -84,7 +84,7 @@ import { getShaderSource, loadImage } from "./utility"; const ro: RenderObject = { pipeline: program, - uniforms: { + bindingResources: { MVP: matrix, diffuse: { texture, sampler }, }, @@ -103,7 +103,7 @@ import { getShaderSource, loadImage } from "./utility"; (function render() { // -- Render - ro.uniforms.layer = frame; + ro.bindingResources.layer = frame; webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); diff --git a/examples/src/WebGL2Samples/texture_3d.ts b/examples/src/WebGL2Samples/texture_3d.ts index a2c184b..563bbfb 100644 --- a/examples/src/WebGL2Samples/texture_3d.ts +++ b/examples/src/WebGL2Samples/texture_3d.ts @@ -159,7 +159,7 @@ import { getShaderSource } from "./utility"; const ro: RenderObject = { pipeline: program, - uniforms: { + bindingResources: { diffuse: { texture, sampler }, }, geometry:{ @@ -196,7 +196,7 @@ import { getShaderSource } from "./utility"; for (let i = 0; i < Corners.MAX; ++i) { - renderPassObjects[i].uniforms.orientation = matrices[i]; + renderPassObjects[i].bindingResources.orientation = matrices[i]; } webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); diff --git a/examples/src/WebGL2Samples/texture_derivative.ts b/examples/src/WebGL2Samples/texture_derivative.ts index f303dc4..c10953c 100644 --- a/examples/src/WebGL2Samples/texture_derivative.ts +++ b/examples/src/WebGL2Samples/texture_derivative.ts @@ -207,7 +207,7 @@ import { getShaderSource, loadImage } from "./utility"; const ro: RenderObject = { pipeline: program, - uniforms: {}, + bindingResources: {}, geometry:{ primitive: { topology: "triangle-list", cullFace: "back" }, vertices: vertexArray.vertices, @@ -232,9 +232,9 @@ import { getShaderSource, loadImage } from "./utility"; mat4.rotateY(mvMatrix, mvMatrix, orientation[1] * Math.PI); mat4.rotateZ(mvMatrix, mvMatrix, orientation[2] * Math.PI); - ro.uniforms.mvMatrix = mvMatrix; - ro.uniforms.pMatrix = perspectiveMatrix; - ro.uniforms.diffuse = { texture, sampler }; + ro.bindingResources.mvMatrix = mvMatrix; + ro.bindingResources.pMatrix = perspectiveMatrix; + ro.bindingResources.diffuse = { texture, sampler }; webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); diff --git a/examples/src/WebGL2Samples/texture_fetch.ts b/examples/src/WebGL2Samples/texture_fetch.ts index 5a4915e..331ffdb 100644 --- a/examples/src/WebGL2Samples/texture_fetch.ts +++ b/examples/src/WebGL2Samples/texture_fetch.ts @@ -73,7 +73,7 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects: [ { pipeline: program, - uniforms: { + bindingResources: { MVP: matrix, diffuse: { texture, sampler }, }, diff --git a/examples/src/WebGL2Samples/texture_format.ts b/examples/src/WebGL2Samples/texture_format.ts index 41e9e90..945c2be 100644 --- a/examples/src/WebGL2Samples/texture_format.ts +++ b/examples/src/WebGL2Samples/texture_format.ts @@ -175,7 +175,7 @@ import { getShaderSource, loadImage } from "./utility"; { viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, pipeline: programNormalized, - uniforms: { + bindingResources: { MVP: matrix, diffuse: { texture: textures[i], sampler: samplers[i] }, }, @@ -193,7 +193,7 @@ import { getShaderSource, loadImage } from "./utility"; { viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, pipeline: programUint, - uniforms: { + bindingResources: { MVP: matrix, diffuse: { texture: textures[i], sampler: samplers[i] }, }, diff --git a/examples/src/WebGL2Samples/texture_grad.ts b/examples/src/WebGL2Samples/texture_grad.ts index ecb8a68..39b30c3 100644 --- a/examples/src/WebGL2Samples/texture_grad.ts +++ b/examples/src/WebGL2Samples/texture_grad.ts @@ -198,7 +198,7 @@ import { getShaderSource, loadImage } from "./utility"; const ro: RenderObject = { pipeline: program, - uniforms: {}, + bindingResources: {}, geometry:{ primitive: { cullFace: "back" }, vertices: vertexArray.vertices, @@ -222,9 +222,9 @@ import { getShaderSource, loadImage } from "./utility"; mat4.rotateY(mvMatrix, mvMatrix, orientation[1] * Math.PI); mat4.rotateZ(mvMatrix, mvMatrix, orientation[2] * Math.PI); - ro.uniforms.mvMatrix = mvMatrix; - ro.uniforms.pMatrix = perspectiveMatrix; - ro.uniforms.diffuse = { texture, sampler }; + ro.bindingResources.mvMatrix = mvMatrix; + ro.bindingResources.pMatrix = perspectiveMatrix; + ro.bindingResources.diffuse = { texture, sampler }; webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); diff --git a/examples/src/WebGL2Samples/texture_immutable.ts b/examples/src/WebGL2Samples/texture_immutable.ts index 6387eee..d962660 100644 --- a/examples/src/WebGL2Samples/texture_immutable.ts +++ b/examples/src/WebGL2Samples/texture_immutable.ts @@ -101,7 +101,7 @@ import { getShaderSource, loadImage } from "./utility"; // -- Render const ro: RenderObject = { pipeline: program, - uniforms: { + bindingResources: { MVP: matrix, }, geometry:{ @@ -121,8 +121,8 @@ import { getShaderSource, loadImage } from "./utility"; viewport: { x: viewports[Corners.LEFT].x, y: viewports[Corners.LEFT].y, width: viewports[Corners.LEFT].z, height: viewports[Corners.LEFT].w }, ...ro, pipeline: program, - uniforms: { - ...ro.uniforms, + bindingResources: { + ...ro.bindingResources, diffuse: { texture: texture2D, sampler: sampler2D }, }, }); @@ -133,8 +133,8 @@ import { getShaderSource, loadImage } from "./utility"; viewport: { x: viewports[Corners.RIGHT].x, y: viewports[Corners.RIGHT].y, width: viewports[Corners.RIGHT].z, height: viewports[Corners.RIGHT].w }, ...ro, pipeline: program3D, - uniforms: { - ...ro.uniforms, + bindingResources: { + ...ro.bindingResources, diffuse: { texture: texture3D, sampler: sampler3D }, }, }); diff --git a/examples/src/WebGL2Samples/texture_integer.ts b/examples/src/WebGL2Samples/texture_integer.ts index 050fd98..a771824 100644 --- a/examples/src/WebGL2Samples/texture_integer.ts +++ b/examples/src/WebGL2Samples/texture_integer.ts @@ -71,7 +71,7 @@ import { getShaderSource, loadImage } from "./utility"; const ro: RenderObject = { pipeline: program, - uniforms: { + bindingResources: { MVP: matrix, diffuse: { texture, sampler }, }, diff --git a/examples/src/WebGL2Samples/texture_lod.ts b/examples/src/WebGL2Samples/texture_lod.ts index ee15356..7e7d43a 100644 --- a/examples/src/WebGL2Samples/texture_lod.ts +++ b/examples/src/WebGL2Samples/texture_lod.ts @@ -199,7 +199,7 @@ import { getShaderSource, loadImage } from "./utility"; const ro: RenderObject = { pipeline: program, - uniforms: { + bindingResources: { mvp: matrix, }, geometry:{ @@ -217,7 +217,7 @@ import { getShaderSource, loadImage } from "./utility"; { viewport: { x: viewport[i].x, y: viewport[i].y, width: viewport[i].z, height: viewport[i].w }, ...ro, - uniforms: { + bindingResources: { mvp: matrix, lodBias: lodBiasArray[i], diffuse: { texture: textures[i], sampler: samplers[i] }, diff --git a/examples/src/WebGL2Samples/texture_offset.ts b/examples/src/WebGL2Samples/texture_offset.ts index ffdbc4d..17d7086 100644 --- a/examples/src/WebGL2Samples/texture_offset.ts +++ b/examples/src/WebGL2Samples/texture_offset.ts @@ -103,7 +103,7 @@ import { getShaderSource, loadImage } from "./utility"; { viewport: { x: viewports[Corners.RIGHT].x, y: viewports[Corners.RIGHT].y, width: viewports[Corners.RIGHT].z, height: viewports[Corners.RIGHT].w }, pipeline: programBicubic, - uniforms: { + bindingResources: { MVP: matrix, diffuse: { texture, sampler }, }, @@ -120,7 +120,7 @@ import { getShaderSource, loadImage } from "./utility"; { viewport: { x: viewports[Corners.LEFT].x, y: viewports[Corners.LEFT].y, width: viewports[Corners.LEFT].z, height: viewports[Corners.LEFT].w }, pipeline: programOffsetBicubic, - uniforms: { + bindingResources: { MVP: matrix, diffuse: { texture, sampler }, offset, diff --git a/examples/src/WebGL2Samples/texture_pixel_store.ts b/examples/src/WebGL2Samples/texture_pixel_store.ts index 99369e9..957cb1c 100644 --- a/examples/src/WebGL2Samples/texture_pixel_store.ts +++ b/examples/src/WebGL2Samples/texture_pixel_store.ts @@ -92,7 +92,7 @@ import { getShaderSource, loadImage } from "./utility"; renderObjects.push({ pipeline: program, - uniforms: { + bindingResources: { MVP: matrix, diffuse: { texture, sampler }, }, diff --git a/examples/src/WebGL2Samples/texture_srgb.ts b/examples/src/WebGL2Samples/texture_srgb.ts index b0b5b2b..649e08b 100644 --- a/examples/src/WebGL2Samples/texture_srgb.ts +++ b/examples/src/WebGL2Samples/texture_srgb.ts @@ -83,7 +83,7 @@ import { getShaderSource, loadImage } from "./utility"; ]); renderObjects.push({ pipeline: program, - uniforms: { + bindingResources: { mvp: matrix, materialDiffuse: { texture, sampler }, }, diff --git a/examples/src/WebGL2Samples/texture_vertex.ts b/examples/src/WebGL2Samples/texture_vertex.ts index c39ece5..e209fea 100644 --- a/examples/src/WebGL2Samples/texture_vertex.ts +++ b/examples/src/WebGL2Samples/texture_vertex.ts @@ -214,7 +214,7 @@ import { getShaderSource, loadImage } from "./utility"; pipeline: { ...program, }, - uniforms: { + bindingResources: { mvMatrix: localMV, pMatrix: perspectiveMatrix, displacementMap: { texture, sampler }, diff --git a/examples/src/WebGL2Samples/transform_feedback_instanced.ts b/examples/src/WebGL2Samples/transform_feedback_instanced.ts index c0bdeed..fd38729 100644 --- a/examples/src/WebGL2Samples/transform_feedback_instanced.ts +++ b/examples/src/WebGL2Samples/transform_feedback_instanced.ts @@ -141,7 +141,7 @@ import { getShaderSource } from "./utility"; const renderRO: RenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height - 10 }, pipeline: programs[PROGRAM_DRAW], - uniforms: {}, + bindingResources: {}, geometry:{ primitive: { topology: "triangle-list" }, draw: { __type__: "DrawVertex", vertexCount: 3, instanceCount: NUM_INSTANCES }, diff --git a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts index 5791fd7..f48d3fc 100644 --- a/examples/src/WebGL2Samples/transform_feedback_separated_2.ts +++ b/examples/src/WebGL2Samples/transform_feedback_separated_2.ts @@ -144,7 +144,7 @@ import { getShaderSource } from "./utility"; const renderRO: RenderObject = { viewport: { x: 0, y: 0, width: canvas.width, height: canvas.height - 10 }, pipeline: program, - uniforms: { + bindingResources: { u_color: [0.0, 1.0, 1.0, 1.0], }, geometry: { diff --git a/examples/src/regl-examples/basic.ts b/examples/src/regl-examples/basic.ts index 86ff395..bff9936 100644 --- a/examples/src/regl-examples/basic.ts +++ b/examples/src/regl-examples/basic.ts @@ -30,7 +30,7 @@ const renderObject: RenderObject = { }, draw: { __type__: "DrawVertex", vertexCount: 3 }, }, - uniforms: { color: [1, 0, 0, 1] }, + bindingResources: { color: [1, 0, 0, 1] }, pipeline: { vertex: { code: ` diff --git a/examples/src/regl-examples/batch.ts b/examples/src/regl-examples/batch.ts index 7f74182..f46defb 100644 --- a/examples/src/regl-examples/batch.ts +++ b/examples/src/regl-examples/batch.ts @@ -61,7 +61,7 @@ function getRenderObject(batchId: number) vertices: vertexArray.vertices, draw: { __type__: "DrawVertex", vertexCount: 3 } }, - uniforms: { + bindingResources: { offset: offsets[batchId].offset, }, pipeline: pipeline, @@ -99,12 +99,12 @@ function draw() batchId = i; // const ro = renderObjects[i]; - ro.uniforms.color = [ + ro.bindingResources.color = [ Math.sin(0.02 * ((0.1 + Math.sin(batchId)) * tick + 3.0 * batchId)), Math.cos(0.02 * (0.02 * tick + 0.1 * batchId)), Math.sin(0.02 * ((0.3 + Math.cos(2.0 * batchId)) * tick + 0.8 * batchId)), 1]; - ro.uniforms.angle = 0.01 * tick; + ro.bindingResources.angle = 0.01 * tick; } webgl.submit(submit); diff --git a/examples/src/regl-examples/bunny.ts b/examples/src/regl-examples/bunny.ts index d3e856b..04e3a59 100644 --- a/examples/src/regl-examples/bunny.ts +++ b/examples/src/regl-examples/bunny.ts @@ -38,7 +38,7 @@ const renderObject: RenderObject = { indices: new Uint16Array(indices), draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, - uniforms: { + bindingResources: { model: mat4.identity([]), }, pipeline: { @@ -79,12 +79,12 @@ function draw() tick++; const t = 0.01 * tick; - renderObject.uniforms.view = mat4.lookAt([], + renderObject.bindingResources.view = mat4.lookAt([], [30 * Math.cos(t), 2.5, 30 * Math.sin(t)], [0, 2.5, 0], [0, 1, 0]); - renderObject.uniforms.projection + renderObject.bindingResources.projection = mat4.perspective([], Math.PI / 4, viewportWidth / viewportHeight, diff --git a/examples/src/regl-examples/camera.ts b/examples/src/regl-examples/camera.ts index 27d55e2..da3e3b0 100644 --- a/examples/src/regl-examples/camera.ts +++ b/examples/src/regl-examples/camera.ts @@ -30,7 +30,7 @@ const renderObject: RenderObject = { indices: new Uint16Array(indices), draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, - uniforms: {}, + bindingResources: {}, pipeline: { vertex: { code: `precision mediump float; diff --git a/examples/src/regl-examples/cloth.ts b/examples/src/regl-examples/cloth.ts index b0b706f..7682ac0 100644 --- a/examples/src/regl-examples/cloth.ts +++ b/examples/src/regl-examples/cloth.ts @@ -174,7 +174,7 @@ import * as vec3 from "./stackgl/gl-vec3"; indices: new Uint16Array(indices), draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, - uniforms: {}, + bindingResources: {}, pipeline: { vertex: { code: /* wgsl */`precision mediump float; @@ -371,8 +371,8 @@ import * as vec3 from "./stackgl/gl-vec3"; camera.tick(); - renderObject.uniforms.view = camera.view(); - renderObject.uniforms.projection + renderObject.bindingResources.view = camera.view(); + renderObject.bindingResources.projection = mat4.perspective([], Math.PI / 4, viewportWidth / viewportHeight, @@ -395,7 +395,7 @@ import * as vec3 from "./stackgl/gl-vec3"; sources: [{ image: img }] }, sampler: { minFilter: "linear", mipmapFilter: "linear", addressModeU: "repeat", addressModeV: "repeat" } }; - renderObject.uniforms.texture = diffuse; + renderObject.bindingResources.texture = diffuse; draw(); })(); \ No newline at end of file diff --git a/examples/src/regl-examples/cube.ts b/examples/src/regl-examples/cube.ts index 4e3cab8..1b1e80c 100644 --- a/examples/src/regl-examples/cube.ts +++ b/examples/src/regl-examples/cube.ts @@ -73,7 +73,7 @@ import * as mat4 from "./stackgl/gl-mat4"; indices: new Uint16Array(indices), draw: { __type__: "DrawIndexed", indexCount: indices.length }, }, - uniforms: {}, + bindingResources: {}, pipeline: { vertex: { code: `precision mediump float; @@ -116,11 +116,11 @@ import * as mat4 from "./stackgl/gl-mat4"; viewportHeight = canvas.height = canvas.clientHeight; const t = 0.01 * tick; - renderObject.uniforms.view = mat4.lookAt([], + renderObject.bindingResources.view = mat4.lookAt([], [5 * Math.cos(t), 2.5 * Math.sin(t), 5 * Math.sin(t)], [0, 0.0, 0], [0, 1, 0]); - renderObject.uniforms.projection + renderObject.bindingResources.projection = mat4.perspective([], Math.PI / 4, viewportWidth / viewportHeight, @@ -142,7 +142,7 @@ import * as mat4 from "./stackgl/gl-mat4"; sources: [{ image: img }] }, sampler: { minFilter: "linear" } }; - renderObject.uniforms.tex = diffuse; + renderObject.bindingResources.tex = diffuse; draw(); })(); \ No newline at end of file diff --git a/examples/src/regl-examples/util/camera.ts b/examples/src/regl-examples/util/camera.ts index 0cb9df3..9564a6a 100644 --- a/examples/src/regl-examples/util/camera.ts +++ b/examples/src/regl-examples/util/camera.ts @@ -105,10 +105,10 @@ export function createCamera(props) { Object.keys(cameraState).forEach(function (name) { - renderObject.uniforms[name] = setupCamera[name]; + renderObject.bindingResources[name] = setupCamera[name]; }); - renderObject.uniforms["projection"] = perspective(cameraState.projection, + renderObject.bindingResources["projection"] = perspective(cameraState.projection, Math.PI / 4.0, viewportWidth / viewportHeight, 0.01, diff --git a/examples/src/test/RenderObjectChanges.ts b/examples/src/test/RenderObjectChanges.ts index 8621562..e9da5e7 100644 --- a/examples/src/test/RenderObjectChanges.ts +++ b/examples/src/test/RenderObjectChanges.ts @@ -35,7 +35,7 @@ const init = async (canvas: HTMLCanvasElement) => indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 draw: { __type__: "DrawIndexed", indexCount: 3 }, // 绘制命令 }, - uniforms: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 + bindingResources: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 }; const submit: Submit = { // 一次GPU提交 diff --git a/examples/src/test/fractalCube.ts b/examples/src/test/fractalCube.ts index 0d41524..499f776 100644 --- a/examples/src/test/fractalCube.ts +++ b/examples/src/test/fractalCube.ts @@ -76,7 +76,7 @@ async function main() indices: buffers.indices, draw: { __type__: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, - uniforms: { uSampler: texture }, + bindingResources: { uSampler: texture }, }; const submit: Submit = { @@ -113,8 +113,8 @@ async function main() const { projectionMatrix, modelViewMatrix } = drawScene(canvas, deltaTime); - renderObject.uniforms.uProjectionMatrix = projectionMatrix; - renderObject.uniforms.uModelViewMatrix = modelViewMatrix; + renderObject.bindingResources.uProjectionMatrix = projectionMatrix; + renderObject.bindingResources.uModelViewMatrix = modelViewMatrix; webgl.submit(submit); diff --git a/examples/src/webgl-examples/sample1.ts b/examples/src/webgl-examples/sample1.ts index a63ed30..4f95e13 100644 --- a/examples/src/webgl-examples/sample1.ts +++ b/examples/src/webgl-examples/sample1.ts @@ -46,7 +46,7 @@ const init = async (canvas: HTMLCanvasElement) => indices: new Uint16Array([0, 1, 2]), // 顶点索引数据 draw: { __type__: "DrawIndexed", indexCount: 3 }, // 绘制命令 }, - uniforms: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 + bindingResources: { color: [1, 0, 0, 1] }, // Uniform 颜色值。 }] }, ] diff --git a/examples/src/webgl-examples/sample2.ts b/examples/src/webgl-examples/sample2.ts index bfc30de..05e340d 100644 --- a/examples/src/webgl-examples/sample2.ts +++ b/examples/src/webgl-examples/sample2.ts @@ -56,7 +56,7 @@ function main() }, draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }, - uniforms: { + bindingResources: { uProjectionMatrix: projectionMatrix, uModelViewMatrix: modelViewMatrix, }, diff --git a/examples/src/webgl-examples/sample3.ts b/examples/src/webgl-examples/sample3.ts index 8ab714a..3c9443e 100644 --- a/examples/src/webgl-examples/sample3.ts +++ b/examples/src/webgl-examples/sample3.ts @@ -77,7 +77,7 @@ function main() }, draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }, - uniforms: { + bindingResources: { uProjectionMatrix: projectionMatrix, uModelViewMatrix: modelViewMatrix, }, diff --git a/examples/src/webgl-examples/sample4.ts b/examples/src/webgl-examples/sample4.ts index af472f2..63f20cc 100644 --- a/examples/src/webgl-examples/sample4.ts +++ b/examples/src/webgl-examples/sample4.ts @@ -65,7 +65,7 @@ function main() }, draw: { __type__: "DrawVertex", firstVertex: 0, vertexCount: 4 }, }, - uniforms: {}, + bindingResources: {}, }; const renderPass: RenderPass = { @@ -93,8 +93,8 @@ function main() const { projectionMatrix, modelViewMatrix } = drawScene(canvas, deltaTime); - renderObject.uniforms.uProjectionMatrix = projectionMatrix; - renderObject.uniforms.uModelViewMatrix = modelViewMatrix; + renderObject.bindingResources.uProjectionMatrix = projectionMatrix; + renderObject.bindingResources.uModelViewMatrix = modelViewMatrix; webgl.submit({ commandEncoders: [{ passEncoders: [renderPass] }] }); diff --git a/examples/src/webgl-examples/sample5.ts b/examples/src/webgl-examples/sample5.ts index b84de74..c86be97 100644 --- a/examples/src/webgl-examples/sample5.ts +++ b/examples/src/webgl-examples/sample5.ts @@ -60,7 +60,7 @@ function main() indices: buffers.indices, draw: { __type__: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, - uniforms: {}, + bindingResources: {}, }; const renderPass: RenderPass = { @@ -88,8 +88,8 @@ function main() const { projectionMatrix, modelViewMatrix } = drawScene(canvas, deltaTime); - renderObject.uniforms.uProjectionMatrix = projectionMatrix; - renderObject.uniforms.uModelViewMatrix = modelViewMatrix; + renderObject.bindingResources.uProjectionMatrix = projectionMatrix; + renderObject.bindingResources.uModelViewMatrix = modelViewMatrix; webgl.submit({ commandEncoders: [{ passEncoders: [renderPass] }] }); diff --git a/examples/src/webgl-examples/sample6.ts b/examples/src/webgl-examples/sample6.ts index 9f113df..ce5c132 100644 --- a/examples/src/webgl-examples/sample6.ts +++ b/examples/src/webgl-examples/sample6.ts @@ -64,7 +64,7 @@ async function main() indices: buffers.indices, draw: { __type__: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, - uniforms: { uSampler: texture }, + bindingResources: { uSampler: texture }, }; const renderPass: RenderPass = { @@ -92,8 +92,8 @@ async function main() const { projectionMatrix, modelViewMatrix } = drawScene(canvas, deltaTime); - renderObject.uniforms.uProjectionMatrix = projectionMatrix; - renderObject.uniforms.uModelViewMatrix = modelViewMatrix; + renderObject.bindingResources.uProjectionMatrix = projectionMatrix; + renderObject.bindingResources.uModelViewMatrix = modelViewMatrix; webgl.submit({ commandEncoders: [{ passEncoders: [renderPass] }] }); diff --git a/examples/src/webgl-examples/sample7.ts b/examples/src/webgl-examples/sample7.ts index d5816ff..7eedfdd 100644 --- a/examples/src/webgl-examples/sample7.ts +++ b/examples/src/webgl-examples/sample7.ts @@ -66,7 +66,7 @@ async function main() ` }, depthStencil: { depthCompare: "less-equal" } }, - uniforms: { uSampler: texture }, + bindingResources: { uSampler: texture }, geometry: { primitive: { topology: "triangle-list" }, vertices: { @@ -113,9 +113,9 @@ async function main() const { projectionMatrix, modelViewMatrix, normalMatrix } = drawScene(canvas, deltaTime); - renderObject.uniforms.uProjectionMatrix = projectionMatrix; - renderObject.uniforms.uModelViewMatrix = modelViewMatrix; - renderObject.uniforms.uNormalMatrix = normalMatrix; + renderObject.bindingResources.uProjectionMatrix = projectionMatrix; + renderObject.bindingResources.uModelViewMatrix = modelViewMatrix; + renderObject.bindingResources.uNormalMatrix = normalMatrix; webgl.submit({ commandEncoders: [{ passEncoders: [renderPass] }] }); diff --git a/examples/src/webgl-examples/sample8.ts b/examples/src/webgl-examples/sample8.ts index 441e319..8b1cccc 100644 --- a/examples/src/webgl-examples/sample8.ts +++ b/examples/src/webgl-examples/sample8.ts @@ -89,7 +89,7 @@ function main() indices: buffers.indices, draw: { __type__: "DrawIndexed", firstIndex: 0, indexCount: 36 }, }, - uniforms: { uSampler: texture }, + bindingResources: { uSampler: texture }, }; const renderPass: RenderPass = { @@ -122,9 +122,9 @@ function main() const { projectionMatrix, modelViewMatrix, normalMatrix } = drawScene(canvas, deltaTime); - renderObject.uniforms.uProjectionMatrix = projectionMatrix; - renderObject.uniforms.uModelViewMatrix = modelViewMatrix; - renderObject.uniforms.uNormalMatrix = normalMatrix; + renderObject.bindingResources.uProjectionMatrix = projectionMatrix; + renderObject.bindingResources.uModelViewMatrix = modelViewMatrix; + renderObject.bindingResources.uNormalMatrix = normalMatrix; webgl.submit({ commandEncoders: [{ passEncoders: [renderPass] }] }); diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index b09d580..552cbd0 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -198,7 +198,7 @@ export class RunWebGL private runRenderObject(gl: WebGLRenderingContext, attachmentSize: { width: number, height: number }, renderObject: RenderObject) { - const { viewport, scissorRect, pipeline, geometry, uniforms } = renderObject; + const { viewport, scissorRect, pipeline, geometry, bindingResources: uniforms } = renderObject; this.runViewPort(gl, attachmentSize, viewport); -- Gitee From 82f1c1863eff82c8493c0f0d57fdde45399bed79 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sat, 15 Mar 2025 00:42:54 +0800 Subject: [PATCH 50/57] =?UTF-8?q?refactor(webgl):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E9=81=AE=E6=8C=A1=E6=9F=A5=E8=AF=A2=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除不必要的导入和引用 - 优化 occlusionQuery 结果的处理方式 - 调整 getGLRenderOcclusionQuery 和 getGLOcclusionQueryStep 函数的逻辑 - 删除 RenderPass 中的 occlusionQueryResults 属性 - 简化示例代码，使用回调函数处理查询结果 --- examples/src/WebGL2Samples/query_occlusion.ts | 14 ++++------- src/caches/getGLRenderOcclusionQuery.ts | 14 +++++------ src/data/polyfills/RenderPass.ts | 24 ------------------- src/index.ts | 1 - 4 files changed, 12 insertions(+), 41 deletions(-) delete mode 100644 src/data/polyfills/RenderPass.ts diff --git a/examples/src/WebGL2Samples/query_occlusion.ts b/examples/src/WebGL2Samples/query_occlusion.ts index 5924175..48bbc9d 100644 --- a/examples/src/WebGL2Samples/query_occlusion.ts +++ b/examples/src/WebGL2Samples/query_occlusion.ts @@ -1,8 +1,6 @@ -import { CanvasContext, RenderPassObject, OcclusionQuery, RenderObject, RenderPass, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, OcclusionQuery, RenderObject, RenderPass, RenderPassObject, RenderPipeline, VertexAttributes } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; -import { watcher } from "@feng3d/watcher"; - import { getShaderSource } from "./utility"; // -- Init Canvas @@ -68,17 +66,15 @@ const occlusionQuery: OcclusionQuery = { ...ro.geometry, draw: { __type__: "DrawVertex", firstVertex: 3, vertexCount: 3 }, } - }] + }], + onQuery(result: number) { + document.getElementById("samplesPassed").innerHTML = `Any samples passed: ${Number(result)}`; + } }; renderObjects.push(occlusionQuery); webgl.submit({ commandEncoders: [{ passEncoders: [rp] }] }); -watcher.watch(occlusionQuery, "result", () => -{ - document.getElementById("samplesPassed").innerHTML = `Any samples passed: ${Number(occlusionQuery.result.result)}`; -}); - // -- Delete WebGL resources webgl.deleteProgram(program); diff --git a/src/caches/getGLRenderOcclusionQuery.ts b/src/caches/getGLRenderOcclusionQuery.ts index 386343c..e5cc040 100644 --- a/src/caches/getGLRenderOcclusionQuery.ts +++ b/src/caches/getGLRenderOcclusionQuery.ts @@ -37,7 +37,7 @@ export function getGLRenderOcclusionQuery(gl: WebGLRenderingContext, renderObjec Promise.all(results).then((v) => { - renderPass.occlusionQueryResults = v; + renderPass.onOcclusionQuery(occlusionQueryObjects, v); }); }; @@ -78,11 +78,11 @@ export function getGLOcclusionQueryStep(gl: WebGL2RenderingContext, occlusionQue */ const resolve = async () => { - if (query.result !== undefined) return occlusionQuery; + if (query.result !== undefined) return query.result; if (gl instanceof WebGL2RenderingContext) { - const result: OcclusionQuery = await new Promise((resolve, reject) => + const result: number = await new Promise((resolve, reject) => { (function tick() { @@ -95,11 +95,11 @@ export function getGLOcclusionQueryStep(gl: WebGL2RenderingContext, occlusionQue return; } - query.result = gl.getQueryParameter(webGLQuery, gl.QUERY_RESULT); + const result = query.result = gl.getQueryParameter(webGLQuery, gl.QUERY_RESULT) as number; - occlusionQuery.result = query as any; + occlusionQuery.onQuery(result); - resolve(occlusionQuery); + resolve(result); gl.deleteQuery(webGLQuery); })(); @@ -132,5 +132,5 @@ export interface GLOcclusionQueryStep /** * 获取查询结果，将获取被赋值新结果的遮挡查询对象。 */ - resolve: () => Promise + resolve: () => Promise } \ No newline at end of file diff --git a/src/data/polyfills/RenderPass.ts b/src/data/polyfills/RenderPass.ts deleted file mode 100644 index 62f56fe..0000000 --- a/src/data/polyfills/RenderPass.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { RenderPass, RenderPassObject } from "@feng3d/render-api"; - -declare module "@feng3d/render-api" -{ - /** - * WebGL渲染通道 - * - * 包含渲染通道描述以及需要渲染的对象列表。 - */ - export interface RenderPass - { - /** - * 渲染不被遮挡查询结果。具体数据保存在各子项的"result"属性中。 - * - * 当提交WebGL后自动获取结果后填充该属性。 - */ - occlusionQueryResults?: OcclusionQuery[]; - } - - export interface RenderPassObjectMap - { - OcclusionQuery: OcclusionQuery - } -} diff --git a/src/index.ts b/src/index.ts index d6987d2..5f15cbc 100644 --- a/src/index.ts +++ b/src/index.ts @@ -7,7 +7,6 @@ export * from "./data/polyfills/CanvasContext"; export * from "./data/polyfills/Buffer"; export * from "./data/polyfills/CommandEncoder"; export * from "./data/polyfills/PrimitiveState"; -export * from "./data/polyfills/RenderPass"; export * from "./data/polyfills/Uniforms"; export * from "./runs/getIGLBuffer"; -- Gitee From 37d96c7f2477cbefcf7e8896f6f7f371dfb893e0 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 16 Mar 2025 13:52:29 +0800 Subject: [PATCH 51/57] =?UTF-8?q?refactor(webgl):=20=E9=87=8D=E6=9E=84=20W?= =?UTF-8?q?ebGL=20=E6=B8=B2=E6=9F=93=E4=B8=8A=E4=B8=8B=E6=96=87=E8=8E=B7?= =?UTF-8?q?=E5=8F=96=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 重写 getGLCanvasContext 函数，优化 WebGL 上下文获取流程 - 引入 WeakMap 优化上下文缓存，解决潜在的内存泄漏问题 - 移除不必要的 canvas 创建逻辑，简化代码结构 - 优化 WebGL 上下文获取的顺序和错误处理 --- examples/src/WebGL2Samples/glsl_centroid.ts | 4 +- src/RunWebGL.ts | 1 + src/caches/getGLCanvasContext.ts | 60 +++++++-------------- src/caches/getGLRenderOcclusionQuery.ts | 2 +- 4 files changed, 22 insertions(+), 45 deletions(-) diff --git a/examples/src/WebGL2Samples/glsl_centroid.ts b/examples/src/WebGL2Samples/glsl_centroid.ts index 0f8d97e..aec18b7 100644 --- a/examples/src/WebGL2Samples/glsl_centroid.ts +++ b/examples/src/WebGL2Samples/glsl_centroid.ts @@ -1,4 +1,4 @@ -import { CanvasContext, IPassEncoder, RenderPassObject, RenderObject, RenderPass, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; +import { CanvasContext, PassEncoder, RenderObject, RenderPass, RenderPassDescriptor, RenderPassObject, RenderPipeline, Sampler, Texture, VertexAttributes, Viewport } from "@feng3d/render-api"; import { WebGL } from "@feng3d/webgl"; import { mat4, vec3 } from "gl-matrix"; import { getShaderSource } from "./utility"; @@ -150,7 +150,7 @@ const vertexArrays: { vertices?: VertexAttributes }[] = [ ]; // -- Render -const passEncoders: IPassEncoder[] = []; +const passEncoders: PassEncoder[] = []; // Pass 1 const IDENTITY = mat4.create(); diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 552cbd0..115fd4f 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -624,6 +624,7 @@ export class RunWebGL // const buffer = getIGLBuffer(attribute.data, "ARRAY_BUFFER", "STATIC_DRAW"); + buffer.target ??= "ARRAY_BUFFER"; const webGLBuffer = getGLBuffer(gl, buffer); gl.bindBuffer(gl.ARRAY_BUFFER, webGLBuffer); diff --git a/src/caches/getGLCanvasContext.ts b/src/caches/getGLCanvasContext.ts index 6b8acc5..bed0dbb 100644 --- a/src/caches/getGLCanvasContext.ts +++ b/src/caches/getGLCanvasContext.ts @@ -6,19 +6,19 @@ import { getCapabilities } from "./getCapabilities"; /** * 获取WebGL上下文。 * - * @param renderingContext + * @param canvasContext * @returns */ -export function getGLCanvasContext(renderingContext: CanvasContext) +export function getGLCanvasContext(canvasContext: CanvasContext) { - const key = renderingContext.canvasId; - let value = canvasContextMap.get(key); + const key = canvasContext.canvasId; + let value = canvasContextMap.get(canvasContext); if (!value) { - const canvas = getCanvas(renderingContext.canvasId); - value = getWebGLContext(canvas, renderingContext); + const canvas = typeof canvasContext.canvasId === "string" ? document.getElementById(canvasContext.canvasId) as HTMLCanvasElement : canvasContext.canvasId; + value = getWebGLContext(canvas, canvasContext); - renderingContext.webGLContextAttributes + canvasContext.webGLContextAttributes // getCapabilities(value); initMap(value); @@ -28,7 +28,7 @@ export function getGLCanvasContext(renderingContext: CanvasContext) canvas.addEventListener("webglcontextrestored", _onContextRestore, false); canvas.addEventListener("webglcontextcreationerror", _onContextCreationError, false); - canvasContextMap.set(key, value); + canvasContextMap.set(canvasContext, value); } return value; @@ -64,46 +64,22 @@ function _onContextCreationError(event: WebGLContextEvent) console.error("WebGLRenderer: A WebGL context could not be created. Reason: ", event.statusMessage); } -function autoCreateCanvas(canvasId: string) -{ - const canvas = document.createElement("canvas"); - canvas.id = canvasId; - document.body.appendChild(canvas); - - return canvas; -} - -export function getCanvas(canvasId: string) -{ - let canvas = document.getElementById(canvasId) as HTMLCanvasElement; - if (!canvas || !(canvas instanceof HTMLCanvasElement)) - { - canvas = autoCreateCanvas(canvasId); - } - - return canvas; -} - -function getWebGLContext(canvas: HTMLCanvasElement, canvasContext: CanvasContext) +function getWebGLContext(canvas: HTMLCanvasElement | OffscreenCanvas, canvasContext: CanvasContext) { const contextAttributes = Object.assign({}, defaultWebGLContextAttributes, canvasContext.webGLContextAttributes); // 使用用户提供参数获取WebGL上下文 - let gl = canvas.getContext(canvasContext.webGLcontextId, contextAttributes) as any; - if (gl) return gl; - - gl = canvas.getContext("webgl", contextAttributes) || canvas.getContext("webgl2", contextAttributes); - gl && console.warn(`无法使用用户提供参数获取指定WebGL上下文`, contextAttributes); - if (gl) return gl; + let gl = canvas.getContext(canvasContext.webGLcontextId || "webgl2", contextAttributes) as any; + gl || console.warn(`无法使用用户提供参数获取指定WebGL上下文`, contextAttributes); - // 使用默认参数获取WebGL上下文 - gl = canvas.getContext("webgl") || canvas.getContext("webgl2"); - gl && console.warn(`无法使用用户提供参数获取WebGL上下文`, contextAttributes); - if (gl) return gl; + gl = canvas.getContext("webgl2", contextAttributes) + || canvas.getContext("webgl2") + || canvas.getContext("webgl", contextAttributes) + || canvas.getContext("webgl"); - console.error(`无法获取WebGL上下文。`); + gl || console.error(`无法获取WebGL上下文。`); - return null; + return gl; } -const canvasContextMap = new Map(); +const canvasContextMap = new WeakMap(); diff --git a/src/caches/getGLRenderOcclusionQuery.ts b/src/caches/getGLRenderOcclusionQuery.ts index e5cc040..799cdbd 100644 --- a/src/caches/getGLRenderOcclusionQuery.ts +++ b/src/caches/getGLRenderOcclusionQuery.ts @@ -37,7 +37,7 @@ export function getGLRenderOcclusionQuery(gl: WebGLRenderingContext, renderObjec Promise.all(results).then((v) => { - renderPass.onOcclusionQuery(occlusionQueryObjects, v); + renderPass.onOcclusionQuery?.(occlusionQueryObjects, v); }); }; -- Gitee From d522976e74be460de266ae60e9e4e9cacba36b31 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 16 Mar 2025 14:29:27 +0800 Subject: [PATCH 52/57] =?UTF-8?q?refactor(WebGL):=20=E8=B0=83=E6=95=B4=20W?= =?UTF-8?q?ebGLRenderingContext=20=E7=B1=BB=E5=9E=8B=E5=A3=B0=E6=98=8E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除散落在各个文件中的 WebGLRenderingContext 扩展声明 - 将所有扩展声明集中到 getGLCanvasContext.ts 文件中 - 更新相关函数参数类型，支持 WebGLRenderingContext 和 WebGL2RenderingContext --- src/RunWebGL.ts | 8 ----- src/WebGL.ts | 2 +- src/caches/getCapabilities.ts | 8 ++--- src/caches/getGLBuffer.ts | 5 --- src/caches/getGLCanvasContext.ts | 51 +++++++++++++++++----------- src/caches/getGLFramebuffer.ts | 8 ----- src/caches/getGLProgram.ts | 6 ---- src/caches/getGLRenderbuffer.ts | 8 ----- src/caches/getGLSampler.ts | 7 ---- src/caches/getGLTexture.ts | 5 --- src/caches/getGLTransformFeedback.ts | 8 ----- 11 files changed, 37 insertions(+), 79 deletions(-) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index 115fd4f..f6db166 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -27,14 +27,6 @@ import { updateBufferBinding } from "./utils/updateBufferBinding"; import { getCapabilities } from "./caches/getCapabilities"; import "./data/polyfills/OcclusionQuery"; -declare global -{ - interface WebGLRenderingContext - { - _vertexArrays: ChainMap<[RenderPipeline, VertexAttributes, IIndicesDataTypes], WebGLVertexArrayObject>; - } -} - declare global { interface WebGLTexture diff --git a/src/WebGL.ts b/src/WebGL.ts index fb03131..39e47aa 100644 --- a/src/WebGL.ts +++ b/src/WebGL.ts @@ -27,7 +27,7 @@ export class WebGL constructor(renderingContext?: CanvasContext) { this._renderingContext = renderingContext; - this._gl = getGLCanvasContext(this._renderingContext); + this._gl = getGLCanvasContext(this._renderingContext) as any; } /** diff --git a/src/caches/getCapabilities.ts b/src/caches/getCapabilities.ts index cc5fee3..098c9ed 100644 --- a/src/caches/getCapabilities.ts +++ b/src/caches/getCapabilities.ts @@ -1,5 +1,5 @@ -export function getCapabilities(gl: WebGLRenderingContext, precision: "highp" | "mediump" | "lowp" = "highp") +export function getCapabilities(gl: WebGLRenderingContext | WebGL2RenderingContext, precision: "highp" | "mediump" | "lowp" = "highp") { let capabilities = capabilitiesMap.get(gl); if (capabilities) return capabilities; @@ -10,9 +10,9 @@ export function getCapabilities(gl: WebGLRenderingContext, precision: "highp" | return capabilities; } -const capabilitiesMap = new WeakMap(); +const capabilitiesMap = new WeakMap(); -function _getMaxPrecision(gl: WebGLRenderingContext, precision: "highp" | "mediump" | "lowp" = "highp") +function _getMaxPrecision(gl: WebGLRenderingContext | WebGL2RenderingContext, precision: "highp" | "mediump" | "lowp" = "highp") { if (precision === "highp") { @@ -220,7 +220,7 @@ export class Capabilities } private _vaoAvailable: boolean; - constructor(private _gl: WebGLRenderingContext, private _precision: "highp" | "mediump" | "lowp") + constructor(private _gl: WebGLRenderingContext | WebGL2RenderingContext, private _precision: "highp" | "mediump" | "lowp") { } } diff --git a/src/caches/getGLBuffer.ts b/src/caches/getGLBuffer.ts index 94d5fc6..de3588c 100644 --- a/src/caches/getGLBuffer.ts +++ b/src/caches/getGLBuffer.ts @@ -3,11 +3,6 @@ import { watcher } from "@feng3d/watcher"; declare global { - interface WebGLRenderingContext - { - _buffers: Map - } - interface WebGLBuffer { /** diff --git a/src/caches/getGLCanvasContext.ts b/src/caches/getGLCanvasContext.ts index bed0dbb..6092fd9 100644 --- a/src/caches/getGLCanvasContext.ts +++ b/src/caches/getGLCanvasContext.ts @@ -1,8 +1,26 @@ -import { CanvasContext } from "@feng3d/render-api"; +import { CanvasContext, GBuffer, IIndicesDataTypes, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { defaultWebGLContextAttributes } from "../data/polyfills/CanvasContext"; +import { Renderbuffer } from "../data/Renderbuffer"; +import { TransformFeedback } from "../data/TransformFeedbackPass"; import { ChainMap } from "../utils/ChainMap"; import { getCapabilities } from "./getCapabilities"; +declare global +{ + interface WebGLRenderingContext + { + _buffers: Map + _textures: Map + _renderbuffers: Map; + _framebuffers: Map; + _vertexArrays: ChainMap<[RenderPipeline, VertexAttributes, IIndicesDataTypes], WebGLVertexArrayObject>; + _samplers: Map; + _transforms: Map; + _programs: { [key: string]: WebGLProgram } + _shaders: { [key: string]: WebGLShader } + } +} + /** * 获取WebGL上下文。 * @@ -11,7 +29,6 @@ import { getCapabilities } from "./getCapabilities"; */ export function getGLCanvasContext(canvasContext: CanvasContext) { - const key = canvasContext.canvasId; let value = canvasContextMap.get(canvasContext); if (!value) { @@ -21,7 +38,16 @@ export function getGLCanvasContext(canvasContext: CanvasContext) canvasContext.webGLContextAttributes // getCapabilities(value); - initMap(value); + + value._buffers = new Map(); + value._textures = new Map(); + value._renderbuffers = new Map(); + value._framebuffers = new Map(); + value._vertexArrays = new ChainMap(); + value._samplers = new Map(); + value._transforms = new Map(); + value._programs = {}; + value._shaders = {}; // canvas.addEventListener("webglcontextlost", _onContextLost, false); @@ -34,19 +60,6 @@ export function getGLCanvasContext(canvasContext: CanvasContext) return value; } -function initMap(gl: WebGLRenderingContext) -{ - gl._buffers = new Map(); - gl._textures = new Map(); - gl._renderbuffers = new Map(); - gl._framebuffers = new Map(); - gl._vertexArrays = new ChainMap(); - gl._samplers = new Map(); - gl._transforms = new Map(); - gl._programs = {}; - gl._shaders = {}; -} - function _onContextLost(event: Event) { event.preventDefault(); @@ -64,12 +77,12 @@ function _onContextCreationError(event: WebGLContextEvent) console.error("WebGLRenderer: A WebGL context could not be created. Reason: ", event.statusMessage); } -function getWebGLContext(canvas: HTMLCanvasElement | OffscreenCanvas, canvasContext: CanvasContext) +function getWebGLContext(canvas: HTMLCanvasElement | OffscreenCanvas, canvasContext: CanvasContext): WebGLRenderingContext { const contextAttributes = Object.assign({}, defaultWebGLContextAttributes, canvasContext.webGLContextAttributes); // 使用用户提供参数获取WebGL上下文 - let gl = canvas.getContext(canvasContext.webGLcontextId || "webgl2", contextAttributes) as any; + let gl = canvas.getContext(canvasContext.webGLcontextId || "webgl2", contextAttributes); gl || console.warn(`无法使用用户提供参数获取指定WebGL上下文`, contextAttributes); gl = canvas.getContext("webgl2", contextAttributes) @@ -79,7 +92,7 @@ function getWebGLContext(canvas: HTMLCanvasElement | OffscreenCanvas, canvasCont gl || console.error(`无法获取WebGL上下文。`); - return gl; + return gl as any; } const canvasContextMap = new WeakMap(); diff --git a/src/caches/getGLFramebuffer.ts b/src/caches/getGLFramebuffer.ts index ec3fb10..89723b8 100644 --- a/src/caches/getGLFramebuffer.ts +++ b/src/caches/getGLFramebuffer.ts @@ -5,14 +5,6 @@ import { _IGLRenderPassDescriptorWithMultisample, GLRenderPassDescriptorWithMult import { getGLTexture } from "./getGLTexture"; import { getGLTextureTarget } from "./getGLTextureTarget"; -declare global -{ - interface WebGLRenderingContext - { - _framebuffers: Map; - } -} - /** * 获取帧缓冲区 */ diff --git a/src/caches/getGLProgram.ts b/src/caches/getGLProgram.ts index 50c55fe..af7bba0 100644 --- a/src/caches/getGLProgram.ts +++ b/src/caches/getGLProgram.ts @@ -4,12 +4,6 @@ import { TransformFeedbackPipeline, TransformFeedbackVaryings } from "../data/Tr declare global { - interface WebGLRenderingContext - { - _programs: { [key: string]: WebGLProgram } - _shaders: { [key: string]: WebGLShader } - } - export interface WebGLProgram { vertex: string; diff --git a/src/caches/getGLRenderbuffer.ts b/src/caches/getGLRenderbuffer.ts index d0194c2..ceca182 100644 --- a/src/caches/getGLRenderbuffer.ts +++ b/src/caches/getGLRenderbuffer.ts @@ -1,13 +1,5 @@ import { Renderbuffer } from "../data/Renderbuffer"; -declare global -{ - interface WebGLRenderingContext - { - _renderbuffers: Map; - } -} - export function getGLRenderbuffer(gl: WebGLRenderingContext, renderbuffer: Renderbuffer, sampleCount?: 4) { let webGLRenderbuffer = gl._renderbuffers.get(renderbuffer); diff --git a/src/caches/getGLSampler.ts b/src/caches/getGLSampler.ts index 32a9f6b..cd275a8 100644 --- a/src/caches/getGLSampler.ts +++ b/src/caches/getGLSampler.ts @@ -1,13 +1,6 @@ import { IAddressMode, IFilterMode, Sampler } from "@feng3d/render-api"; import { getIGLCompareFunction } from "../runs/runDepthState"; -declare global -{ - interface WebGLRenderingContext - { - _samplers: Map; - } -} export type GLSamplerCompareMode = "NONE" | "COMPARE_REF_TO_TEXTURE"; export function getGLSampler(gl: WebGLRenderingContext, sampler?: Sampler) diff --git a/src/caches/getGLTexture.ts b/src/caches/getGLTexture.ts index f92cecd..174b9b0 100644 --- a/src/caches/getGLTexture.ts +++ b/src/caches/getGLTexture.ts @@ -5,11 +5,6 @@ import { getGLTextureTarget } from "./getGLTextureTarget"; declare global { - interface WebGLRenderingContext - { - _textures: Map - } - interface WebGLTexture { /** diff --git a/src/caches/getGLTransformFeedback.ts b/src/caches/getGLTransformFeedback.ts index 2792fa9..2d322b7 100644 --- a/src/caches/getGLTransformFeedback.ts +++ b/src/caches/getGLTransformFeedback.ts @@ -2,14 +2,6 @@ import { TransformFeedback } from "../data/TransformFeedbackPass"; import { getIGLBuffer } from "../runs/getIGLBuffer"; import { getGLBuffer } from "./getGLBuffer"; -declare global -{ - interface WebGLRenderingContext - { - _transforms: Map; - } -} - export function getGLTransformFeedback(gl: WebGLRenderingContext, transformFeedback: TransformFeedback) { let webGLTransformFeedback = gl._transforms.get(transformFeedback); -- Gitee From 03337806264e0142c7152bddfe45ea8ed8a3fb92 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 16 Mar 2025 14:40:40 +0800 Subject: [PATCH 53/57] =?UTF-8?q?refactor(caches):=20=E4=BC=98=E5=8C=96=20?= =?UTF-8?q?WebGL=20=E8=B5=84=E6=BA=90=E7=BC=93=E5=AD=98=E7=AE=A1=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 将 _buffers 重命名为 _bufferMap，使用 WeakMap 替代 Map - 修改 getGLBuffer 和 deleteBuffer 函数，使用新的 _bufferMap - 更新 getGLCanvasContext 函数，初始化新的 WeakMap - 调整 ChainMap 类，支持 WeakMap 和 Map 的动态选择 --- src/caches/getGLBuffer.ts | 8 ++++---- src/caches/getGLCanvasContext.ts | 24 ++++++++++++------------ src/utils/ChainMap.ts | 11 ++++++++--- 3 files changed, 24 insertions(+), 19 deletions(-) diff --git a/src/caches/getGLBuffer.ts b/src/caches/getGLBuffer.ts index de3588c..28c8992 100644 --- a/src/caches/getGLBuffer.ts +++ b/src/caches/getGLBuffer.ts @@ -14,11 +14,11 @@ declare global export function getGLBuffer(gl: WebGLRenderingContext, buffer: GBuffer) { - let webGLBuffer = gl._buffers.get(buffer); + let webGLBuffer = gl._bufferMap.get(buffer); if (webGLBuffer) return webGLBuffer; webGLBuffer = gl.createBuffer(); - gl._buffers.set(buffer, webGLBuffer); + gl._bufferMap.set(buffer, webGLBuffer); const target = buffer.target; @@ -92,10 +92,10 @@ export function getGLBuffer(gl: WebGLRenderingContext, buffer: GBuffer) export function deleteBuffer(gl: WebGLRenderingContext, buffer: GBuffer) { - const webGLBuffer = gl._buffers.get(buffer); + const webGLBuffer = gl._bufferMap.get(buffer); if (webGLBuffer) { - gl._buffers.delete(buffer); + gl._bufferMap.delete(buffer); webGLBuffer.destroy(); delete webGLBuffer.destroy; // diff --git a/src/caches/getGLCanvasContext.ts b/src/caches/getGLCanvasContext.ts index 6092fd9..007a53b 100644 --- a/src/caches/getGLCanvasContext.ts +++ b/src/caches/getGLCanvasContext.ts @@ -9,13 +9,13 @@ declare global { interface WebGLRenderingContext { - _buffers: Map - _textures: Map - _renderbuffers: Map; - _framebuffers: Map; + _bufferMap: WeakMap + _textures: WeakMap + _renderbuffers: WeakMap; + _framebuffers: WeakMap; _vertexArrays: ChainMap<[RenderPipeline, VertexAttributes, IIndicesDataTypes], WebGLVertexArrayObject>; - _samplers: Map; - _transforms: Map; + _samplers: WeakMap; + _transforms: WeakMap; _programs: { [key: string]: WebGLProgram } _shaders: { [key: string]: WebGLShader } } @@ -39,13 +39,13 @@ export function getGLCanvasContext(canvasContext: CanvasContext) // getCapabilities(value); - value._buffers = new Map(); - value._textures = new Map(); - value._renderbuffers = new Map(); - value._framebuffers = new Map(); + value._bufferMap = new WeakMap(); + value._textures = new WeakMap(); + value._renderbuffers = new WeakMap(); + value._framebuffers = new WeakMap(); value._vertexArrays = new ChainMap(); - value._samplers = new Map(); - value._transforms = new Map(); + value._samplers = new WeakMap(); + value._transforms = new WeakMap(); value._programs = {}; value._shaders = {}; diff --git a/src/utils/ChainMap.ts b/src/utils/ChainMap.ts index 14e069d..067a6f9 100644 --- a/src/utils/ChainMap.ts +++ b/src/utils/ChainMap.ts @@ -7,7 +7,7 @@ */ export class ChainMap, V> { - private _map = new Map(); + private _map: Map | WeakMap; /** * 获取键对应的值。 @@ -17,6 +17,7 @@ export class ChainMap, V> */ get(keys: K): V { + if (!this._map) return undefined; let map = this._map; for (let i = 0, n = keys.length - 1; i < n; i++) @@ -37,13 +38,16 @@ export class ChainMap, V> */ set(keys: K, value: V) { - let map = this._map; + let map = this._map = this._map || ((typeof keys[0] === "string") ? new Map() : new WeakMap()); for (let i = 0; i < keys.length - 1; i++) { const key = keys[i]; - if (map.has(key) === false) map.set(key, new Map()); + if (!map.has(key)) + { + map.set(key, typeof key === "string" ? new Map() : new WeakMap()); + } map = map.get(key); } @@ -59,6 +63,7 @@ export class ChainMap, V> */ delete(keys: K): boolean { + if (!this._map) return false; let map = this._map; for (let i = 0; i < keys.length - 1; i++) -- Gitee From 45177ad00455e34b390558458dc042f049ce18f6 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 16 Mar 2025 14:45:03 +0800 Subject: [PATCH 54/57] =?UTF-8?q?refactor(WebGL):=20=E7=A7=BB=E9=99=A4=20g?= =?UTF-8?q?etCapabilities=20=E5=87=BD=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 将 Capabilities 类直接集成到 WebGLRenderingContext 中，作为 _capabilities 属性。这样可以避免重复计算和缓存，同时简化了代码结构。 - 删除了 getCapabilities.ts 文件 - 在 getGLCanvasContext.ts 中为 WebGLRenderingContext 添加 _capabilities 属性 - 更新 RunWebGL.ts 中的代码，使用 gl._capabilities 代替 getCapabilities(gl) --- src/RunWebGL.ts | 6 +- .../{getCapabilities.ts => Capabilities.ts} | 62 +++++++------------ src/caches/getGLCanvasContext.ts | 36 ++++++----- 3 files changed, 45 insertions(+), 59 deletions(-) rename src/caches/{getCapabilities.ts => Capabilities.ts} (92%) diff --git a/src/RunWebGL.ts b/src/RunWebGL.ts index f6db166..979cd58 100644 --- a/src/RunWebGL.ts +++ b/src/RunWebGL.ts @@ -1,4 +1,4 @@ -import { BindingResources, BlendComponent, BlendState, GBuffer, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, CullFace, DepthStencilState, DrawIndexed, DrawVertex, FrontFace, IIndicesDataTypes, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassDescriptor, RenderPassObject, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, UnReadonly, VertexAttribute, VertexAttributes, vertexFormatMap, Viewport } from "@feng3d/render-api"; +import { BindingResources, BlendComponent, BlendState, BufferBinding, ColorTargetState, CommandEncoder, CopyBufferToBuffer, CopyTextureToTexture, CullFace, DepthStencilState, DrawIndexed, DrawVertex, FrontFace, GBuffer, IIndicesDataTypes, OcclusionQuery, PrimitiveState, RenderObject, RenderPass, RenderPassDescriptor, RenderPassObject, RenderPipeline, Sampler, ScissorRect, Submit, TextureView, TypedArray, UnReadonly, VertexAttribute, VertexAttributes, vertexFormatMap, Viewport } from "@feng3d/render-api"; import { getGLBlitFramebuffer } from "./caches/getGLBlitFramebuffer"; import { getGLBuffer } from "./caches/getGLBuffer"; @@ -21,10 +21,8 @@ import { getIGLBuffer } from "./runs/getIGLBuffer"; import { getIGLBlendEquation, getIGLBlendFactor, IGLBlendEquation, IGLBlendFactor } from "./runs/runColorTargetStates"; import { getIGLCompareFunction } from "./runs/runDepthState"; import { getIGLStencilFunc, getIGLStencilOp } from "./runs/runStencilState"; -import { ChainMap } from "./utils/ChainMap"; import { updateBufferBinding } from "./utils/updateBufferBinding"; -import { getCapabilities } from "./caches/getCapabilities"; import "./data/polyfills/OcclusionQuery"; declare global @@ -440,7 +438,7 @@ export class RunWebGL const extension = gl.getExtension("EXT_texture_filter_anisotropic"); if (extension) { - gl.texParameterf(gl[textureTarget], extension.TEXTURE_MAX_ANISOTROPY_EXT, Math.min(maxAnisotropy, getCapabilities(gl).maxAnisotropy)); + gl.texParameterf(gl[textureTarget], extension.TEXTURE_MAX_ANISOTROPY_EXT, Math.min(maxAnisotropy, gl._capabilities.maxAnisotropy)); } webGLTexture.maxAnisotropy = maxAnisotropy; } diff --git a/src/caches/getCapabilities.ts b/src/caches/Capabilities.ts similarity index 92% rename from src/caches/getCapabilities.ts rename to src/caches/Capabilities.ts index 098c9ed..5ab0c92 100644 --- a/src/caches/getCapabilities.ts +++ b/src/caches/Capabilities.ts @@ -1,40 +1,3 @@ - -export function getCapabilities(gl: WebGLRenderingContext | WebGL2RenderingContext, precision: "highp" | "mediump" | "lowp" = "highp") -{ - let capabilities = capabilitiesMap.get(gl); - if (capabilities) return capabilities; - - capabilities = new Capabilities(gl, precision); - capabilitiesMap.set(gl, capabilities); - - return capabilities; -} - -const capabilitiesMap = new WeakMap(); - -function _getMaxPrecision(gl: WebGLRenderingContext | WebGL2RenderingContext, precision: "highp" | "mediump" | "lowp" = "highp") -{ - if (precision === "highp") - { - if (gl.getShaderPrecisionFormat(gl.VERTEX_SHADER, gl.HIGH_FLOAT).precision > 0 - && gl.getShaderPrecisionFormat(gl.FRAGMENT_SHADER, gl.HIGH_FLOAT).precision > 0) - { - return "highp"; - } - precision = "mediump"; - } - if (precision === "mediump") - { - if (gl.getShaderPrecisionFormat(gl.VERTEX_SHADER, gl.MEDIUM_FLOAT).precision > 0 - && gl.getShaderPrecisionFormat(gl.FRAGMENT_SHADER, gl.MEDIUM_FLOAT).precision > 0) - { - return "mediump"; - } - } - - return "lowp"; -} - /** * WEBGL支持功能 * @@ -220,7 +183,30 @@ export class Capabilities } private _vaoAvailable: boolean; - constructor(private _gl: WebGLRenderingContext | WebGL2RenderingContext, private _precision: "highp" | "mediump" | "lowp") + constructor(private _gl: WebGLRenderingContext | WebGL2RenderingContext, private _precision: "highp" | "mediump" | "lowp" = "highp") { } } + +function _getMaxPrecision(gl: WebGLRenderingContext | WebGL2RenderingContext, precision: "highp" | "mediump" | "lowp" = "highp") +{ + if (precision === "highp") + { + if (gl.getShaderPrecisionFormat(gl.VERTEX_SHADER, gl.HIGH_FLOAT).precision > 0 + && gl.getShaderPrecisionFormat(gl.FRAGMENT_SHADER, gl.HIGH_FLOAT).precision > 0) + { + return "highp"; + } + precision = "mediump"; + } + if (precision === "mediump") + { + if (gl.getShaderPrecisionFormat(gl.VERTEX_SHADER, gl.MEDIUM_FLOAT).precision > 0 + && gl.getShaderPrecisionFormat(gl.FRAGMENT_SHADER, gl.MEDIUM_FLOAT).precision > 0) + { + return "mediump"; + } + } + + return "lowp"; +} \ No newline at end of file diff --git a/src/caches/getGLCanvasContext.ts b/src/caches/getGLCanvasContext.ts index 007a53b..1f370d2 100644 --- a/src/caches/getGLCanvasContext.ts +++ b/src/caches/getGLCanvasContext.ts @@ -3,12 +3,14 @@ import { defaultWebGLContextAttributes } from "../data/polyfills/CanvasContext"; import { Renderbuffer } from "../data/Renderbuffer"; import { TransformFeedback } from "../data/TransformFeedbackPass"; import { ChainMap } from "../utils/ChainMap"; -import { getCapabilities } from "./getCapabilities"; +import { Capabilities } from "./Capabilities"; declare global { interface WebGLRenderingContext { + _capabilities: Capabilities; + // _bufferMap: WeakMap _textures: WeakMap _renderbuffers: WeakMap; @@ -29,35 +31,35 @@ declare global */ export function getGLCanvasContext(canvasContext: CanvasContext) { - let value = canvasContextMap.get(canvasContext); - if (!value) + let gl = canvasContextMap.get(canvasContext); + if (!gl) { const canvas = typeof canvasContext.canvasId === "string" ? document.getElementById(canvasContext.canvasId) as HTMLCanvasElement : canvasContext.canvasId; - value = getWebGLContext(canvas, canvasContext); + gl = getWebGLContext(canvas, canvasContext); canvasContext.webGLContextAttributes // - getCapabilities(value); - - value._bufferMap = new WeakMap(); - value._textures = new WeakMap(); - value._renderbuffers = new WeakMap(); - value._framebuffers = new WeakMap(); - value._vertexArrays = new ChainMap(); - value._samplers = new WeakMap(); - value._transforms = new WeakMap(); - value._programs = {}; - value._shaders = {}; + gl._capabilities = new Capabilities(gl); + + gl._bufferMap = new WeakMap(); + gl._textures = new WeakMap(); + gl._renderbuffers = new WeakMap(); + gl._framebuffers = new WeakMap(); + gl._vertexArrays = new ChainMap(); + gl._samplers = new WeakMap(); + gl._transforms = new WeakMap(); + gl._programs = {}; + gl._shaders = {}; // canvas.addEventListener("webglcontextlost", _onContextLost, false); canvas.addEventListener("webglcontextrestored", _onContextRestore, false); canvas.addEventListener("webglcontextcreationerror", _onContextCreationError, false); - canvasContextMap.set(canvasContext, value); + canvasContextMap.set(canvasContext, gl); } - return value; + return gl; } function _onContextLost(event: Event) -- Gitee From 848c9ca7e20277c386b3dff342290236f9c82582 Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Sun, 16 Mar 2025 17:34:57 +0800 Subject: [PATCH 55/57] =?UTF-8?q?refactor(caches):=20=E9=87=8D=E6=9E=84=20?= =?UTF-8?q?getGLCanvasContext=20=E5=87=BD=E6=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除 canvasContextMap，改为直接在 CanvasContext 对象上存储 WebGLRenderingContext - 优化 getGLCanvasContext 函数逻辑，提高代码可读性和性能 - 删除未使用的 ChainMap 类 --- src/caches/getGLCanvasContext.ts | 56 ++++++++++------------ src/utils/ChainMap.ts | 79 -------------------------------- 2 files changed, 25 insertions(+), 110 deletions(-) delete mode 100644 src/utils/ChainMap.ts diff --git a/src/caches/getGLCanvasContext.ts b/src/caches/getGLCanvasContext.ts index 1f370d2..48f7347 100644 --- a/src/caches/getGLCanvasContext.ts +++ b/src/caches/getGLCanvasContext.ts @@ -1,8 +1,7 @@ -import { CanvasContext, GBuffer, IIndicesDataTypes, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; +import { CanvasContext, ChainMap, GBuffer, IIndicesDataTypes, RenderPassDescriptor, RenderPipeline, Sampler, Texture, VertexAttributes } from "@feng3d/render-api"; import { defaultWebGLContextAttributes } from "../data/polyfills/CanvasContext"; import { Renderbuffer } from "../data/Renderbuffer"; import { TransformFeedback } from "../data/TransformFeedbackPass"; -import { ChainMap } from "../utils/ChainMap"; import { Capabilities } from "./Capabilities"; declare global @@ -31,33 +30,30 @@ declare global */ export function getGLCanvasContext(canvasContext: CanvasContext) { - let gl = canvasContextMap.get(canvasContext); - if (!gl) - { - const canvas = typeof canvasContext.canvasId === "string" ? document.getElementById(canvasContext.canvasId) as HTMLCanvasElement : canvasContext.canvasId; - gl = getWebGLContext(canvas, canvasContext); - - canvasContext.webGLContextAttributes - // - gl._capabilities = new Capabilities(gl); - - gl._bufferMap = new WeakMap(); - gl._textures = new WeakMap(); - gl._renderbuffers = new WeakMap(); - gl._framebuffers = new WeakMap(); - gl._vertexArrays = new ChainMap(); - gl._samplers = new WeakMap(); - gl._transforms = new WeakMap(); - gl._programs = {}; - gl._shaders = {}; - - // - canvas.addEventListener("webglcontextlost", _onContextLost, false); - canvas.addEventListener("webglcontextrestored", _onContextRestore, false); - canvas.addEventListener("webglcontextcreationerror", _onContextCreationError, false); - - canvasContextMap.set(canvasContext, gl); - } + let gl: WebGLRenderingContext = canvasContext["_gl"]; + if (gl) return gl; + + const canvas = typeof canvasContext.canvasId === "string" ? document.getElementById(canvasContext.canvasId) as HTMLCanvasElement : canvasContext.canvasId; + gl = canvasContext["_gl"] = getWebGLContext(canvas, canvasContext); + + canvasContext.webGLContextAttributes + // + gl._capabilities = new Capabilities(gl); + + gl._bufferMap = new WeakMap(); + gl._textures = new WeakMap(); + gl._renderbuffers = new WeakMap(); + gl._framebuffers = new WeakMap(); + gl._vertexArrays = new ChainMap(); + gl._samplers = new WeakMap(); + gl._transforms = new WeakMap(); + gl._programs = {}; + gl._shaders = {}; + + // + canvas.addEventListener("webglcontextlost", _onContextLost, false); + canvas.addEventListener("webglcontextrestored", _onContextRestore, false); + canvas.addEventListener("webglcontextcreationerror", _onContextCreationError, false); return gl; } @@ -96,5 +92,3 @@ function getWebGLContext(canvas: HTMLCanvasElement | OffscreenCanvas, canvasCont return gl as any; } - -const canvasContextMap = new WeakMap(); diff --git a/src/utils/ChainMap.ts b/src/utils/ChainMap.ts deleted file mode 100644 index 067a6f9..0000000 --- a/src/utils/ChainMap.ts +++ /dev/null @@ -1,79 +0,0 @@ -/** - * 链式Map。 - * - * 多个key数组对应一个值。 - * - * 由于键值可能是字面值也可能是对象，因此无法使用 {@link WeakMap} 来构建{@link ChainMap}，只能使用 {@link Map}。 - */ -export class ChainMap, V> -{ - private _map: Map | WeakMap; - - /** - * 获取键对应的值。 - * - * @param keys 键。 - * @returns 值。 - */ - get(keys: K): V - { - if (!this._map) return undefined; - let map = this._map; - - for (let i = 0, n = keys.length - 1; i < n; i++) - { - map = map.get(keys[i]); - - if (map === undefined) return undefined; - } - - return map.get(keys[keys.length - 1]); - } - - /** - * 设置映射。 - * - * @param keys 键。 - * @param value 值。 - */ - set(keys: K, value: V) - { - let map = this._map = this._map || ((typeof keys[0] === "string") ? new Map() : new WeakMap()); - - for (let i = 0; i < keys.length - 1; i++) - { - const key = keys[i]; - - if (!map.has(key)) - { - map.set(key, typeof key === "string" ? new Map() : new WeakMap()); - } - - map = map.get(key); - } - - map.set(keys[keys.length - 1], value); - } - - /** - * 删除映射。 - * - * @param keys 键。 - * @returns 如果找到目标值且被删除返回 `true` ，否则返回 `false` 。 - */ - delete(keys: K): boolean - { - if (!this._map) return false; - let map = this._map; - - for (let i = 0; i < keys.length - 1; i++) - { - map = map.get(keys[i]); - - if (map === undefined) return false; - } - - return map.delete(keys[keys.length - 1]); - } -} - -- Gitee From 108fb31bc02f330122770e6a5fa09ca8b094ca6f Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Fri, 21 Mar 2025 12:51:46 +0800 Subject: [PATCH 56/57] =?UTF-8?q?refactor(buffer):=20=E5=B0=86=20GBuffer?= =?UTF-8?q?=20=E6=8E=A5=E5=8F=A3=E9=87=8D=E5=91=BD=E5=90=8D=E4=B8=BA=20Buf?= =?UTF-8?q?fer?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在多个文件中将 GBuffer 接口重命名为 Buffer - 更新了相关的导入语句和类型引用 - 此更改统一了缓冲区相关的接口名称，提高了代码的一致性和可读性 --- src/caches/getGLBuffer.ts | 10 +++++----- src/data/polyfills/Buffer.ts | 2 +- src/runs/getIGLBuffer.ts | 6 +++--- 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/caches/getGLBuffer.ts b/src/caches/getGLBuffer.ts index 28c8992..d448ac3 100644 --- a/src/caches/getGLBuffer.ts +++ b/src/caches/getGLBuffer.ts @@ -1,4 +1,4 @@ -import { GBuffer, UnReadonly } from "@feng3d/render-api"; +import { Buffer, UnReadonly } from "@feng3d/render-api"; import { watcher } from "@feng3d/watcher"; declare global @@ -12,7 +12,7 @@ declare global } } -export function getGLBuffer(gl: WebGLRenderingContext, buffer: GBuffer) +export function getGLBuffer(gl: WebGLRenderingContext, buffer: Buffer) { let webGLBuffer = gl._bufferMap.get(buffer); if (webGLBuffer) return webGLBuffer; @@ -61,7 +61,7 @@ export function getGLBuffer(gl: WebGLRenderingContext, buffer: GBuffer) } gl.bufferSubData(gl[target], bufferOffset, arrayBufferView); }); - (buffer as UnReadonly).writeBuffers = null; + (buffer as UnReadonly).writeBuffers = null; }; const dataChange = () => @@ -70,7 +70,7 @@ export function getGLBuffer(gl: WebGLRenderingContext, buffer: GBuffer) const writeBuffers = buffer.writeBuffers || []; writeBuffers.unshift({ data: buffer.data }); - (buffer as UnReadonly).writeBuffers = writeBuffers; + (buffer as UnReadonly).writeBuffers = writeBuffers; }; dataChange(); @@ -90,7 +90,7 @@ export function getGLBuffer(gl: WebGLRenderingContext, buffer: GBuffer) return webGLBuffer; } -export function deleteBuffer(gl: WebGLRenderingContext, buffer: GBuffer) +export function deleteBuffer(gl: WebGLRenderingContext, buffer: Buffer) { const webGLBuffer = gl._bufferMap.get(buffer); if (webGLBuffer) diff --git a/src/data/polyfills/Buffer.ts b/src/data/polyfills/Buffer.ts index 42ec420..9b08778 100644 --- a/src/data/polyfills/Buffer.ts +++ b/src/data/polyfills/Buffer.ts @@ -7,7 +7,7 @@ declare module "@feng3d/render-api" * * @see https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/bufferData */ - export interface GBuffer + export interface Buffer { /** * WebGL缓冲区目标。 diff --git a/src/runs/getIGLBuffer.ts b/src/runs/getIGLBuffer.ts index ef93403..e1c7f16 100644 --- a/src/runs/getIGLBuffer.ts +++ b/src/runs/getIGLBuffer.ts @@ -1,11 +1,11 @@ -import { GBuffer, TypedArray } from "@feng3d/render-api"; +import { Buffer, TypedArray } from "@feng3d/render-api"; import { BufferTarget, BufferUsage } from "../data/polyfills/Buffer"; -export function getIGLBuffer(data: TypedArray, target?: BufferTarget, usage: BufferUsage = "STATIC_DRAW"): GBuffer +export function getIGLBuffer(data: TypedArray, target?: BufferTarget, usage: BufferUsage = "STATIC_DRAW"): Buffer { if (data[_IGLBuffer]) return data[_IGLBuffer]; - const buffer: GBuffer = { + const buffer: Buffer = { size: Math.ceil(data.byteLength / 4) * 4, target, usage, -- Gitee From 025b1fc8edf2128f2f093853ab9956f32664447a Mon Sep 17 00:00:00 2001 From: feng <908087098@qq.com> Date: Mon, 24 Mar 2025 14:02:04 +0800 Subject: [PATCH 57/57] =?UTF-8?q?build:=20=E6=9B=B4=E6=96=B0=20@feng3d/wat?= =?UTF-8?q?cher=20=E4=BE=9D=E8=B5=96=E5=88=B0=200.8.12=20=E7=89=88?= =?UTF-8?q?=E6=9C=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index a3a96ed..b244dc5 100644 --- a/package.json +++ b/package.json @@ -64,6 +64,6 @@ }, "dependencies": { "@feng3d/render-api": "0.0.2", - "@feng3d/watcher": "^0.8.11" + "@feng3d/watcher": "^0.8.12" } } \ No newline at end of file -- Gitee