@gjsify/webgl 0.3.12 → 0.3.14

package/lib/esm/linkable.js

@@ -1,50 +1,50 @@
-class Linkable {
-  constructor(_) {
-    this._ = 0;
-    this._references = [];
-    this._refCount = 0;
-    this._pendingDelete = false;
-    this._binding = 0;
-    this._ = _;
-    this._references = [];
-    this._refCount = 0;
-    this._pendingDelete = false;
-    this._binding = 0;
-  }
-  _link(b) {
-    this._references.push(b);
-    b._refCount += 1;
-    return true;
-  }
-  _unlink(b) {
-    let idx = this._references.indexOf(b);
-    if (idx < 0) {
-      return false;
-    }
-    while (idx >= 0) {
-      this._references[idx] = this._references[this._references.length - 1];
-      this._references.pop();
-      b._refCount -= 1;
-      b._checkDelete();
-      idx = this._references.indexOf(b);
-    }
-    return true;
-  }
-  _linked(b) {
-    return this._references.indexOf(b) >= 0;
-  }
-  _checkDelete() {
-    if (this._refCount <= 0 && this._pendingDelete && this._ !== 0) {
-      while (this._references.length > 0) {
-        this._unlink(this._references[0]);
-      }
-      this._performDelete();
-      this._ = 0;
-    }
-  }
-  _performDelete() {
-  }
-}
-export {
-  Linkable
+//#region src/ts/linkable.ts
+var Linkable = class {
+	constructor(_) {
+		this._ = 0;
+		this._references = [];
+		this._refCount = 0;
+		this._pendingDelete = false;
+		this._binding = 0;
+		this._ = _;
+		this._references = [];
+		this._refCount = 0;
+		this._pendingDelete = false;
+		this._binding = 0;
+	}
+	_link(b) {
+		this._references.push(b);
+		b._refCount += 1;
+		return true;
+	}
+	_unlink(b) {
+		let idx = this._references.indexOf(b);
+		if (idx < 0) {
+			return false;
+		}
+		while (idx >= 0) {
+			this._references[idx] = this._references[this._references.length - 1];
+			this._references.pop();
+			b._refCount -= 1;
+			b._checkDelete();
+			idx = this._references.indexOf(b);
+		}
+		return true;
+	}
+	_linked(b) {
+		return this._references.indexOf(b) >= 0;
+	}
+	_checkDelete() {
+		if (this._refCount <= 0 && this._pendingDelete && this._ !== 0) {
+			while (this._references.length > 0) {
+				this._unlink(this._references[0]);
+			}
+			this._performDelete();
+			this._ = 0;
+		}
+	}
+	_performDelete() {}
 };
+
+//#endregion
+export { Linkable };

package/lib/esm/test-utils.js

@@ -1,116 +1,179 @@
+//#region src/ts/test-utils.ts
+/** Compile a WebGL shader from source. Does not check compile status. */
 function makeShader(gl, type, src) {
-  const shader = gl.createShader(type);
-  gl.shaderSource(shader, src);
-  gl.compileShader(shader);
-  return shader;
+	const shader = gl.createShader(type);
+	gl.shaderSource(shader, src);
+	gl.compileShader(shader);
+	return shader;
 }
+/**
+* Link a WebGL program from vertex + fragment source strings.
+* Binds attribute "position" to location 0 before linking so that drawTriangle() works
+* without an explicit getAttribLocation() call.
+* Does not check link status — call getProgramParameter(prog, LINK_STATUS) if needed.
+*/
 function makeProgram(gl, vsSrc, fsSrc) {
-  const frag = makeShader(gl, gl.FRAGMENT_SHADER, fsSrc);
-  const vert = makeShader(gl, gl.VERTEX_SHADER, vsSrc);
-  const program = gl.createProgram();
-  gl.attachShader(program, frag);
-  gl.attachShader(program, vert);
-  gl.bindAttribLocation(program, 0, "position");
-  gl.linkProgram(program);
-  return program;
+	const frag = makeShader(gl, gl.FRAGMENT_SHADER, fsSrc);
+	const vert = makeShader(gl, gl.VERTEX_SHADER, vsSrc);
+	const program = gl.createProgram();
+	gl.attachShader(program, frag);
+	gl.attachShader(program, vert);
+	gl.bindAttribLocation(program, 0, "position");
+	gl.linkProgram(program);
+	return program;
 }
+/**
+* Draw a fullscreen triangle using attribute location 0.
+* Covers the entire clip space: vertices at (-2,-2), (-2,4), (4,-2).
+* The active program must expose a vec2 attribute named "position" at location 0
+* (ensured by makeProgram's bindAttribLocation call).
+*/
 function drawTriangle(gl) {
-  const buffer = gl.createBuffer();
-  gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
-  gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-2, -2, -2, 4, 4, -2]), gl.STREAM_DRAW);
-  gl.enableVertexAttribArray(0);
-  gl.vertexAttribPointer(0, 2, gl.FLOAT, false, 0, 0);
-  gl.drawArrays(gl.TRIANGLES, 0, 3);
-  gl.bindBuffer(gl.ARRAY_BUFFER, null);
-  gl.disableVertexAttribArray(0);
-  gl.deleteBuffer(buffer);
+	const buffer = gl.createBuffer();
+	gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
+	gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([
+		-2,
+		-2,
+		-2,
+		4,
+		4,
+		-2
+	]), gl.STREAM_DRAW);
+	gl.enableVertexAttribArray(0);
+	gl.vertexAttribPointer(0, 2, gl.FLOAT, false, 0, 0);
+	gl.drawArrays(gl.TRIANGLES, 0, 3);
+	gl.bindBuffer(gl.ARRAY_BUFFER, null);
+	gl.disableVertexAttribArray(0);
+	gl.deleteBuffer(buffer);
 }
+/** Read a single RGBA pixel at (x, y). Defaults to (0, 0). */
 function readPixel(gl, x = 0, y = 0) {
-  const pixel = new Uint8Array(4);
-  gl.readPixels(x, y, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, pixel);
-  return pixel;
+	const pixel = new Uint8Array(4);
+	gl.readPixels(x, y, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, pixel);
+	return pixel;
 }
+/** Return true if |a[i] - b[i]| <= tolerance for every RGBA component. */
 function pixelClose(a, b, tolerance = 3) {
-  for (let i = 0; i < 4; i++) {
-    if (Math.abs(a[i] - b[i]) > tolerance) return false;
-  }
-  return true;
+	for (let i = 0; i < 4; i++) {
+		if (Math.abs(a[i] - b[i]) > tolerance) return false;
+	}
+	return true;
 }
+/**
+* Create a w×h RGBA8 FBO and bind it as the current framebuffer.
+* Also sets the viewport to (0, 0, w, h).
+* Call destroyTestFBO() when done.
+*/
 function makeTestFBO(gl, width = 4, height = 4) {
-  const fb = gl.createFramebuffer();
-  const colorTex = gl.createTexture();
-  gl.bindTexture(gl.TEXTURE_2D, colorTex);
-  gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
-  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
-  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
-  gl.bindTexture(gl.TEXTURE_2D, null);
-  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
-  gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, colorTex, 0);
-  gl.viewport(0, 0, width, height);
-  return { fb, colorTex, width, height };
+	const fb = gl.createFramebuffer();
+	const colorTex = gl.createTexture();
+	gl.bindTexture(gl.TEXTURE_2D, colorTex);
+	gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
+	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
+	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
+	gl.bindTexture(gl.TEXTURE_2D, null);
+	gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
+	gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, colorTex, 0);
+	gl.viewport(0, 0, width, height);
+	return {
+		fb,
+		colorTex,
+		width,
+		height
+	};
 }
+/**
+* Create a w×h RGBA8 FBO with a DEPTH_COMPONENT16 renderbuffer and bind it.
+* Also sets the viewport to (0, 0, w, h).
+* Call destroyTestFBOWithDepth() when done.
+*/
 function makeTestFBOWithDepth(gl, width = 4, height = 4) {
-  const base = makeTestFBO(gl, width, height);
-  const depthRb = gl.createRenderbuffer();
-  gl.bindRenderbuffer(gl.RENDERBUFFER, depthRb);
-  gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT16, width, height);
-  gl.bindRenderbuffer(gl.RENDERBUFFER, null);
-  gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, depthRb);
-  return { ...base, depthRb };
+	const base = makeTestFBO(gl, width, height);
+	const depthRb = gl.createRenderbuffer();
+	gl.bindRenderbuffer(gl.RENDERBUFFER, depthRb);
+	gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT16, width, height);
+	gl.bindRenderbuffer(gl.RENDERBUFFER, null);
+	gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, depthRb);
+	return {
+		...base,
+		depthRb
+	};
 }
+/** Unbind the FBO and delete the color texture. */
 function destroyTestFBO(gl, fbo) {
-  gl.bindFramebuffer(gl.FRAMEBUFFER, fbo.fb);
-  gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, null, 0);
-  gl.bindFramebuffer(gl.FRAMEBUFFER, null);
-  gl.deleteTexture(fbo.colorTex);
-  gl.deleteFramebuffer(fbo.fb);
+	gl.bindFramebuffer(gl.FRAMEBUFFER, fbo.fb);
+	gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, null, 0);
+	gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+	gl.deleteTexture(fbo.colorTex);
+	gl.deleteFramebuffer(fbo.fb);
 }
+/** Unbind the FBO and delete both the color texture and depth renderbuffer. */
 function destroyTestFBOWithDepth(gl, fbo) {
-  gl.bindFramebuffer(gl.FRAMEBUFFER, fbo.fb);
-  gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, null, 0);
-  gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, null);
-  gl.bindFramebuffer(gl.FRAMEBUFFER, null);
-  gl.deleteTexture(fbo.colorTex);
-  gl.deleteRenderbuffer(fbo.depthRb);
-  gl.deleteFramebuffer(fbo.fb);
+	gl.bindFramebuffer(gl.FRAMEBUFFER, fbo.fb);
+	gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, null, 0);
+	gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, null);
+	gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+	gl.deleteTexture(fbo.colorTex);
+	gl.deleteRenderbuffer(fbo.depthRb);
+	gl.deleteFramebuffer(fbo.fb);
 }
+/**
+* Create a w×h RGBA16F FBO (half-float color texture) and bind it.
+* Used for testing Three.js post-processing render target patterns.
+*/
 function makeTestFBOFloat(gl, width = 4, height = 4) {
-  const RGBA16F = 34842;
-  const HALF_FLOAT = 5131;
-  const fb = gl.createFramebuffer();
-  const colorTex = gl.createTexture();
-  gl.bindTexture(gl.TEXTURE_2D, colorTex);
-  gl.texImage2D(gl.TEXTURE_2D, 0, RGBA16F, width, height, 0, gl.RGBA, HALF_FLOAT, null);
-  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
-  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
-  gl.bindTexture(gl.TEXTURE_2D, null);
-  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
-  gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, colorTex, 0);
-  gl.viewport(0, 0, width, height);
-  return { fb, colorTex, width, height };
+	const RGBA16F = 34842;
+	const HALF_FLOAT = 5131;
+	const fb = gl.createFramebuffer();
+	const colorTex = gl.createTexture();
+	gl.bindTexture(gl.TEXTURE_2D, colorTex);
+	gl.texImage2D(gl.TEXTURE_2D, 0, RGBA16F, width, height, 0, gl.RGBA, HALF_FLOAT, null);
+	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
+	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
+	gl.bindTexture(gl.TEXTURE_2D, null);
+	gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
+	gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, colorTex, 0);
+	gl.viewport(0, 0, width, height);
+	return {
+		fb,
+		colorTex,
+		width,
+		height
+	};
 }
+/**
+* Create a w×h RGBA8 FBO with a DEPTH_COMPONENT24 texture attachment.
+* Three.js uses depth textures (not renderbuffers) for RenderPixelatedPass.
+*/
 function makeTestFBOWithDepthTexture(gl, width = 4, height = 4) {
-  const DEPTH_COMPONENT24 = 33190;
-  const DEPTH_COMPONENT = 6402;
-  const UNSIGNED_INT = 5125;
-  const fb = gl.createFramebuffer();
-  const colorTex = gl.createTexture();
-  gl.bindTexture(gl.TEXTURE_2D, colorTex);
-  gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
-  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
-  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
-  const depthTex = gl.createTexture();
-  gl.bindTexture(gl.TEXTURE_2D, depthTex);
-  gl.texImage2D(gl.TEXTURE_2D, 0, DEPTH_COMPONENT24, width, height, 0, DEPTH_COMPONENT, UNSIGNED_INT, null);
-  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
-  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
-  gl.bindTexture(gl.TEXTURE_2D, null);
-  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
-  gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, colorTex, 0);
-  gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.TEXTURE_2D, depthTex, 0);
-  gl.viewport(0, 0, width, height);
-  return { fb, colorTex, depthTex, width, height };
+	const DEPTH_COMPONENT24 = 33190;
+	const DEPTH_COMPONENT = 6402;
+	const UNSIGNED_INT = 5125;
+	const fb = gl.createFramebuffer();
+	const colorTex = gl.createTexture();
+	gl.bindTexture(gl.TEXTURE_2D, colorTex);
+	gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
+	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
+	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
+	const depthTex = gl.createTexture();
+	gl.bindTexture(gl.TEXTURE_2D, depthTex);
+	gl.texImage2D(gl.TEXTURE_2D, 0, DEPTH_COMPONENT24, width, height, 0, DEPTH_COMPONENT, UNSIGNED_INT, null);
+	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
+	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
+	gl.bindTexture(gl.TEXTURE_2D, null);
+	gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
+	gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, colorTex, 0);
+	gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.TEXTURE_2D, depthTex, 0);
+	gl.viewport(0, 0, width, height);
+	return {
+		fb,
+		colorTex,
+		depthTex,
+		width,
+		height
+	};
 }
+/** WebGL2 passthrough texture shader (samples texture at UV and outputs it). */
 const TEXTURE_VS_300 = `#version 300 es
 in vec2 position;
 out vec2 vUv;
@@ -126,6 +189,7 @@ out vec4 fragColor;
 void main() {
     fragColor = texture(uTexture, vUv);
 }`;
+/** WebGL2 cubemap sampling shader. */
 const CUBEMAP_FS_300 = `#version 300 es
 precision mediump float;
 uniform samplerCube uCubemap;
@@ -134,19 +198,6 @@ out vec4 fragColor;
 void main() {
     fragColor = texture(uCubemap, uDirection);
 }`;
-export {
-  CUBEMAP_FS_300,
-  TEXTURE_FS_300,
-  TEXTURE_VS_300,
-  destroyTestFBO,
-  destroyTestFBOWithDepth,
-  drawTriangle,
-  makeProgram,
-  makeShader,
-  makeTestFBO,
-  makeTestFBOFloat,
-  makeTestFBOWithDepth,
-  makeTestFBOWithDepthTexture,
-  pixelClose,
-  readPixel
-};
+
+//#endregion
+export { CUBEMAP_FS_300, TEXTURE_FS_300, TEXTURE_VS_300, destroyTestFBO, destroyTestFBOWithDepth, drawTriangle, makeProgram, makeShader, makeTestFBO, makeTestFBOFloat, makeTestFBOWithDepth, makeTestFBOWithDepthTexture, pixelClose, readPixel };

package/lib/esm/test.js

@@ -1,7 +1,11 @@
+import webgl1_spec_default from "./webgl1.spec.js";
+import webgl2_spec_default from "./webgl2.spec.js";
 import { run } from "@gjsify/unit";
-import webgl1TestSuite from "./webgl1.spec.js";
-import webgl2TestSuite from "./webgl2.spec.js";
+
+//#region src/ts/test.ts
 run({ testSuite: async () => {
-  await webgl1TestSuite();
-  await webgl2TestSuite();
+	await webgl1_spec_default();
+	await webgl2_spec_default();
 } });
+
+//#endregion

package/lib/esm/types/index.js

@@ -1,5 +1,5 @@
-export * from "./constructor.js";
-export * from "./extension.js";
-export * from "./typed-array.js";
-export * from "./webgl-constants.js";
-export * from "./webgl-context-attribute-options.js";
+import "./constructor.js";
+import "./extension.js";
+import "./typed-array.js";
+import "./webgl-constants.js";
+import "./webgl-context-attribute-options.js";