@thi.ng/webgl 6.6.11 → 6.6.13

package/buffer.js

@@ -1,143 +1,161 @@
-import { BIT_SHIFTS, asGLType, typedArrayType, } from "@thi.ng/api/typedarray";
-import { DrawMode, } from "./api/model.js";
+import {
+  BIT_SHIFTS,
+  asGLType,
+  typedArrayType
+} from "@thi.ng/api/typedarray";
+import {
+  DrawMode
+} from "./api/model.js";
 import { isGL2Context } from "./checks.js";
 import { error } from "./error.js";
-export class WebGLArrayBuffer {
-    gl;
-    buffer;
-    target;
-    mode;
-    data;
-    constructor(gl, data, target = gl.ARRAY_BUFFER, mode = gl.STATIC_DRAW, retain = false) {
-        this.gl = gl;
-        this.buffer = gl.createBuffer() || error("error creating WebGL buffer");
-        this.target = target;
-        this.mode = mode;
-        if (data) {
-            this.set(data);
-            if (retain)
-                this.data = data;
-        }
+class WebGLArrayBuffer {
+  gl;
+  buffer;
+  target;
+  mode;
+  data;
+  constructor(gl, data, target = gl.ARRAY_BUFFER, mode = gl.STATIC_DRAW, retain = false) {
+    this.gl = gl;
+    this.buffer = gl.createBuffer() || error("error creating WebGL buffer");
+    this.target = target;
+    this.mode = mode;
+    if (data) {
+      this.set(data);
+      if (retain)
+        this.data = data;
     }
-    bind() {
-        this.gl.bindBuffer(this.target, this.buffer);
-        return true;
+  }
+  bind() {
+    this.gl.bindBuffer(this.target, this.buffer);
+    return true;
+  }
+  unbind() {
+    this.gl.bindBuffer(this.target, null);
+    return true;
+  }
+  release() {
+    if (this.buffer) {
+      this.gl.deleteBuffer(this.buffer);
+      delete this.buffer;
     }
-    unbind() {
-        this.gl.bindBuffer(this.target, null);
-        return true;
-    }
-    release() {
-        if (this.buffer) {
-            this.gl.deleteBuffer(this.buffer);
-            delete this.buffer;
-        }
-        return true;
-    }
-    /**
-     * Re-applies retained data (from ctor arg) using
-     * {@link WebGLArrayBuffer.set}. Presumably the underlying data has been
-     * updated elsewhere, but needs to be reflected to WebGL.
-     *
-     * @remarks
-     * If no data is retained, this method is a no-op.
-     */
-    update() {
-        if (this.data)
-            this.set(this.data);
-    }
-    set(data, mode = this.mode) {
-        this.bind();
-        this.gl.bufferData(this.target, data, mode);
-        if (this.data)
-            this.data = data;
-    }
-    setChunk(data, byteOffset = 0) {
-        this.bind();
-        this.gl.bufferSubData(this.target, byteOffset, data);
-        if (this.data) {
-            this.data.set(data, byteOffset >>> BIT_SHIFTS[typedArrayType(data)]);
-        }
+    return true;
+  }
+  /**
+   * Re-applies retained data (from ctor arg) using
+   * {@link WebGLArrayBuffer.set}. Presumably the underlying data has been
+   * updated elsewhere, but needs to be reflected to WebGL.
+   *
+   * @remarks
+   * If no data is retained, this method is a no-op.
+   */
+  update() {
+    if (this.data)
+      this.set(this.data);
+  }
+  set(data, mode = this.mode) {
+    this.bind();
+    this.gl.bufferData(this.target, data, mode);
+    if (this.data)
+      this.data = data;
+  }
+  setChunk(data, byteOffset = 0) {
+    this.bind();
+    this.gl.bufferSubData(this.target, byteOffset, data);
+    if (this.data) {
+      this.data.set(
+        data,
+        byteOffset >>> BIT_SHIFTS[typedArrayType(data)]
+      );
     }
+  }
 }
-export const defBuffer = (gl, data, target = gl.ARRAY_BUFFER, mode = gl.STATIC_DRAW, retain = false) => new WebGLArrayBuffer(gl, data, target, mode, retain);
-export const compileModel = (gl, spec, mode = gl.STATIC_DRAW) => {
-    if (spec.attribPool) {
-        spec.attribs = compileAttribPool(gl, spec.attribPool, undefined, gl.ARRAY_BUFFER, mode);
-    }
-    else {
-        compileAttribs(gl, spec.attribs, mode);
-    }
-    spec.instances && compileAttribs(gl, spec.instances.attribs, mode);
-    compileIndices(gl, spec.indices, mode);
-    spec.mode == null && (spec.mode = DrawMode.TRIANGLES);
-    // TODO auto-create VAO & inject into model spec?
-    return spec;
+const defBuffer = (gl, data, target = gl.ARRAY_BUFFER, mode = gl.STATIC_DRAW, retain = false) => new WebGLArrayBuffer(gl, data, target, mode, retain);
+const compileModel = (gl, spec, mode = gl.STATIC_DRAW) => {
+  if (spec.attribPool) {
+    spec.attribs = compileAttribPool(
+      gl,
+      spec.attribPool,
+      void 0,
+      gl.ARRAY_BUFFER,
+      mode
+    );
+  } else {
+    compileAttribs(gl, spec.attribs, mode);
+  }
+  spec.instances && compileAttribs(gl, spec.instances.attribs, mode);
+  compileIndices(gl, spec.indices, mode);
+  spec.mode == null && (spec.mode = DrawMode.TRIANGLES);
+  return spec;
 };
 const initBuffer = (gl, src, type, mode) => {
-    if (src.buffer) {
-        src.data && src.buffer.set(src.data);
-    }
-    else {
-        src.buffer = new WebGLArrayBuffer(gl, src.data, type, mode, src.retain);
-    }
+  if (src.buffer) {
+    src.data && src.buffer.set(src.data);
+  } else {
+    src.buffer = new WebGLArrayBuffer(gl, src.data, type, mode, src.retain);
+  }
 };
 const compileAttribs = (gl, attribs, mode) => {
-    if (attribs) {
-        for (let id in attribs) {
-            initBuffer(gl, attribs[id], gl.ARRAY_BUFFER, mode);
-        }
+  if (attribs) {
+    for (let id in attribs) {
+      initBuffer(gl, attribs[id], gl.ARRAY_BUFFER, mode);
     }
-    return attribs;
+  }
+  return attribs;
 };
-export const compileIndices = (gl, index, mode = gl.STATIC_DRAW) => {
-    if (index) {
-        initBuffer(gl, index, gl.ELEMENT_ARRAY_BUFFER, mode);
-    }
-    return index;
+const compileIndices = (gl, index, mode = gl.STATIC_DRAW) => {
+  if (index) {
+    initBuffer(gl, index, gl.ELEMENT_ARRAY_BUFFER, mode);
+  }
+  return index;
 };
-export const compileVAO = (gl, spec) => {
-    if (spec.shader) {
-        const isGL2 = isGL2Context(gl);
-        const ext = !isGL2 ? gl.getExtension("OES_vertex_array_object") : null;
-        if (isGL2 || ext) {
-            let vao;
-            if (isGL2) {
-                vao = gl.createVertexArray();
-                gl.bindVertexArray(vao);
-            }
-            else {
-                vao = ext.createVertexArrayOES();
-                ext.bindVertexArrayOES(vao);
-            }
-            !!vao && error("error creating VAO");
-            spec.shader.bindAttribs(spec.attribs);
-            if (spec.indices) {
-                spec.indices.buffer.bind();
-            }
-            spec.shader.unbind(null);
-            if (isGL2) {
-                gl.bindVertexArray(null);
-            }
-            else {
-                ext.bindVertexArrayOES(null);
-            }
-            return vao;
-        }
+const compileVAO = (gl, spec) => {
+  if (spec.shader) {
+    const isGL2 = isGL2Context(gl);
+    const ext = !isGL2 ? gl.getExtension("OES_vertex_array_object") : null;
+    if (isGL2 || ext) {
+      let vao;
+      if (isGL2) {
+        vao = gl.createVertexArray();
+        gl.bindVertexArray(vao);
+      } else {
+        vao = ext.createVertexArrayOES();
+        ext.bindVertexArrayOES(vao);
+      }
+      !!vao && error("error creating VAO");
+      spec.shader.bindAttribs(spec.attribs);
+      if (spec.indices) {
+        spec.indices.buffer.bind();
+      }
+      spec.shader.unbind(null);
+      if (isGL2) {
+        gl.bindVertexArray(null);
+      } else {
+        ext.bindVertexArrayOES(null);
+      }
+      return vao;
     }
+  }
 };
-export const compileAttribPool = (gl, pool, ids, target = gl.ARRAY_BUFFER, mode = gl.STATIC_DRAW) => {
-    const buf = defBuffer(gl, pool.bytes(), target, mode);
-    const spec = {};
-    for (let id of ids || Object.keys(pool.specs)) {
-        const attr = pool.specs[id];
-        spec[id] = {
-            buffer: buf,
-            size: attr.size,
-            type: asGLType(attr.type),
-            stride: pool.byteStride,
-            offset: attr.byteOffset,
-        };
-    }
-    return spec;
+const compileAttribPool = (gl, pool, ids, target = gl.ARRAY_BUFFER, mode = gl.STATIC_DRAW) => {
+  const buf = defBuffer(gl, pool.bytes(), target, mode);
+  const spec = {};
+  for (let id of ids || Object.keys(pool.specs)) {
+    const attr = pool.specs[id];
+    spec[id] = {
+      buffer: buf,
+      size: attr.size,
+      type: asGLType(attr.type),
+      stride: pool.byteStride,
+      offset: attr.byteOffset
+    };
+  }
+  return spec;
+};
+export {
+  WebGLArrayBuffer,
+  compileAttribPool,
+  compileIndices,
+  compileModel,
+  compileVAO,
+  defBuffer
 };

package/canvas.js

@@ -2,71 +2,63 @@ import { adaptDPI } from "@thi.ng/adapt-dpi";
 import { isString } from "@thi.ng/checks/is-string";
 import { error } from "./error.js";
 const defaultOpts = {
-    alpha: true,
-    antialias: true,
-    depth: true,
-    premultipliedAlpha: true,
-    preserveDrawingBuffer: false,
-    stencil: false,
+  alpha: true,
+  antialias: true,
+  depth: true,
+  premultipliedAlpha: true,
+  preserveDrawingBuffer: false,
+  stencil: false
 };
-export const glCanvas = (opts = {}) => {
-    const canvas = opts.canvas
-        ? isString(opts.canvas)
-            ? document.getElementById(opts.canvas)
-            : opts.canvas
-        : document.createElement("canvas");
-    opts.width && (canvas.width = opts.width);
-    opts.height && (canvas.height = opts.height);
-    opts.autoScale !== false && adaptDPI(canvas, canvas.width, canvas.height);
-    opts.parent && opts.parent.appendChild(canvas);
-    const gl = canvas.getContext(opts.version === 2 ? "webgl2" : "webgl", {
-        ...defaultOpts,
-        ...opts.opts,
-    });
-    if (!gl) {
-        error("WebGL unavailable");
+const glCanvas = (opts = {}) => {
+  const canvas = opts.canvas ? isString(opts.canvas) ? document.getElementById(opts.canvas) : opts.canvas : document.createElement("canvas");
+  opts.width && (canvas.width = opts.width);
+  opts.height && (canvas.height = opts.height);
+  opts.autoScale !== false && adaptDPI(canvas, canvas.width, canvas.height);
+  opts.parent && opts.parent.appendChild(canvas);
+  const gl = canvas.getContext(
+    opts.version === 2 ? "webgl2" : "webgl",
+    {
+      ...defaultOpts,
+      ...opts.opts
     }
-    opts.onContextLost &&
-        canvas.addEventListener("webglcontextlost", opts.onContextLost);
-    return {
+  );
+  if (!gl) {
+    error("WebGL unavailable");
+  }
+  opts.onContextLost && canvas.addEventListener("webglcontextlost", opts.onContextLost);
+  return {
+    canvas,
+    gl,
+    ext: getExtensions(gl, opts.ext),
+    resize: (width, height) => {
+      adaptDPI(
         canvas,
-        gl,
-        ext: getExtensions(gl, opts.ext),
-        resize: (width, height) => {
-            adaptDPI(canvas, width, height, opts.autoScale !== false ? window.devicePixelRatio : 1);
-            gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);
-        },
-    };
+        width,
+        height,
+        opts.autoScale !== false ? window.devicePixelRatio : 1
+      );
+      gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);
+    }
+  };
 };
-export const getExtensions = (gl, ids, required = true) => {
-    const ext = {};
-    if (ids) {
-        for (let id of ids) {
-            ext[id] = gl.getExtension(id);
-            required && !ext[id] && error(`extension ${id} not available`);
-        }
+const getExtensions = (gl, ids, required = true) => {
+  const ext = {};
+  if (ids) {
+    for (let id of ids) {
+      ext[id] = gl.getExtension(id);
+      required && !ext[id] && error(`extension ${id} not available`);
     }
-    return ext;
+  }
+  return ext;
+};
+const clearCanvas = (gl, [r, g, b, a], depth = true) => {
+  gl.clearColor(r, g, b, a != null ? a : 1);
+  gl.clear(gl.COLOR_BUFFER_BIT | (depth ? gl.DEPTH_BUFFER_BIT : 0));
 };
-/**
- * Sets clear color to given RGB(A) `color` and clears viewport's
- * `COLOR_BUFFER_BIT` and (by default) also `DEPTH_BUFFER_BIT`.
- *
- * @remarks
- * If the given color vector only contains RGB values, alpha will default to
- * 1.0.
- *
- * @param gl
- * @param color
- * @param depth
- */
-export const clearCanvas = (gl, [r, g, b, a], depth = true) => {
-    gl.clearColor(r, g, b, a != null ? a : 1);
-    gl.clear(gl.COLOR_BUFFER_BIT | (depth ? gl.DEPTH_BUFFER_BIT : 0));
+const defaultViewport = (gl) => gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);
+export {
+  clearCanvas,
+  defaultViewport,
+  getExtensions,
+  glCanvas
 };
-/**
- * Resets viewport to full drawing buffer size.
- *
- * @param gl
- */
-export const defaultViewport = (gl) => gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);

package/checks.js

@@ -1,7 +1,7 @@
 import { TextureType } from "./api/texture.js";
-export const isGL2Context = (gl) => typeof WebGL2RenderingContext !== "undefined" &&
-    gl instanceof WebGL2RenderingContext;
-export const isFloatTexture = (tex) => tex.type === TextureType.FLOAT ||
-    tex.type === TextureType.HALF_FLOAT ||
-    tex.type === TextureType.HALF_FLOAT_OES ||
-    tex.type === TextureType.FLOAT_32_UNSIGNED_INT_24_8_REV;
+const isGL2Context = (gl) => typeof WebGL2RenderingContext !== "undefined" && gl instanceof WebGL2RenderingContext;
+const isFloatTexture = (tex) => tex.type === TextureType.FLOAT || tex.type === TextureType.HALF_FLOAT || tex.type === TextureType.HALF_FLOAT_OES || tex.type === TextureType.FLOAT_32_UNSIGNED_INT_24_8_REV;
+export {
+  isFloatTexture,
+  isGL2Context
+};

package/draw.js

@@ -2,77 +2,92 @@ import { isArray } from "@thi.ng/checks/is-array";
 import { isGL2Context } from "./checks.js";
 import { error } from "./error.js";
 import { bindTextures, unbindTextures } from "./texture.js";
-export const draw = (specs, opts = {}) => {
-    const _specs = isArray(specs) ? specs : [specs];
-    for (let i = 0, n = _specs.length; i < n; i++) {
-        const spec = _specs[i];
-        const indices = spec.indices;
-        const gl = spec.shader.gl;
-        opts.bindTex !== false && bindTextures(spec.textures);
-        opts.shaderState !== false && spec.shader.prepareState();
-        opts.bindShader !== false && spec.shader.bind(spec);
-        if (indices && indices.buffer) {
-            indices.buffer.bind();
-            if (spec.instances) {
-                drawInstanced(gl, spec);
-            }
-            else {
-                gl.drawElements(spec.mode, spec.num, indices.data instanceof Uint32Array
-                    ? gl.UNSIGNED_INT
-                    : gl.UNSIGNED_SHORT, 0);
-            }
-        }
-        else {
-            if (spec.instances) {
-                drawInstanced(gl, spec);
-            }
-            else {
-                gl.drawArrays(spec.mode, 0, spec.num);
-            }
-        }
-        opts.unbindShader !== false && spec.shader.unbind(null);
-        opts.unbindTex && unbindTextures(spec.textures);
+const draw = (specs, opts = {}) => {
+  const _specs = isArray(specs) ? specs : [specs];
+  for (let i = 0, n = _specs.length; i < n; i++) {
+    const spec = _specs[i];
+    const indices = spec.indices;
+    const gl = spec.shader.gl;
+    opts.bindTex !== false && bindTextures(spec.textures);
+    opts.shaderState !== false && spec.shader.prepareState();
+    opts.bindShader !== false && spec.shader.bind(spec);
+    if (indices && indices.buffer) {
+      indices.buffer.bind();
+      if (spec.instances) {
+        drawInstanced(gl, spec);
+      } else {
+        gl.drawElements(
+          spec.mode,
+          spec.num,
+          indices.data instanceof Uint32Array ? gl.UNSIGNED_INT : gl.UNSIGNED_SHORT,
+          0
+        );
+      }
+    } else {
+      if (spec.instances) {
+        drawInstanced(gl, spec);
+      } else {
+        gl.drawArrays(spec.mode, 0, spec.num);
+      }
     }
+    opts.unbindShader !== false && spec.shader.unbind(null);
+    opts.unbindTex && unbindTextures(spec.textures);
+  }
 };
 const drawInstanced = (gl, spec) => {
-    const isGL2 = isGL2Context(gl);
-    const ext = !isGL2 ? gl.getExtension("ANGLE_instanced_arrays") : undefined;
-    if (!(isGL2 || ext)) {
-        error("instancing not supported");
+  const isGL2 = isGL2Context(gl);
+  const ext = !isGL2 ? gl.getExtension("ANGLE_instanced_arrays") : void 0;
+  if (!(isGL2 || ext)) {
+    error("instancing not supported");
+  }
+  const sattribs = spec.shader.attribs;
+  const iattribs = spec.instances.attribs;
+  spec.shader.bindAttribs(iattribs);
+  for (let id in iattribs) {
+    const attr = sattribs[id];
+    if (attr) {
+      let div = iattribs[id].divisor;
+      div = div !== void 0 ? div : 1;
+      isGL2 ? gl.vertexAttribDivisor(
+        attr.loc,
+        div
+      ) : ext.vertexAttribDivisorANGLE(attr.loc, div);
     }
-    const sattribs = spec.shader.attribs;
-    const iattribs = spec.instances.attribs;
-    spec.shader.bindAttribs(iattribs);
-    for (let id in iattribs) {
-        const attr = sattribs[id];
-        if (attr) {
-            let div = iattribs[id].divisor;
-            div = div !== undefined ? div : 1;
-            isGL2
-                ? gl.vertexAttribDivisor(attr.loc, div)
-                : ext.vertexAttribDivisorANGLE(attr.loc, div);
-        }
-    }
-    if (spec.indices) {
-        const type = spec.indices.data instanceof Uint32Array
-            ? gl.UNSIGNED_INT
-            : gl.UNSIGNED_SHORT;
-        isGL2
-            ? gl.drawElementsInstanced(spec.mode, spec.num, type, 0, spec.instances.num)
-            : ext.drawElementsInstancedANGLE(spec.mode, spec.num, type, 0, spec.instances.num);
-    }
-    else {
-        isGL2
-            ? gl.drawArraysInstanced(spec.mode, 0, spec.num, spec.instances.num)
-            : ext.drawArraysInstancedANGLE(spec.mode, 0, spec.num, spec.instances.num);
-    }
-    // reset attrib divisors to allow non-instanced draws later on
-    for (let id in iattribs) {
-        const attr = sattribs[id];
-        attr &&
-            (isGL2
-                ? gl.vertexAttribDivisor(attr.loc, 0)
-                : ext.vertexAttribDivisorANGLE(attr.loc, 0));
-    }
-    spec.shader.unbind(null);
+  }
+  if (spec.indices) {
+    const type = spec.indices.data instanceof Uint32Array ? gl.UNSIGNED_INT : gl.UNSIGNED_SHORT;
+    isGL2 ? gl.drawElementsInstanced(
+      spec.mode,
+      spec.num,
+      type,
+      0,
+      spec.instances.num
+    ) : ext.drawElementsInstancedANGLE(
+      spec.mode,
+      spec.num,
+      type,
+      0,
+      spec.instances.num
+    );
+  } else {
+    isGL2 ? gl.drawArraysInstanced(
+      spec.mode,
+      0,
+      spec.num,
+      spec.instances.num
+    ) : ext.drawArraysInstancedANGLE(
+      spec.mode,
+      0,
+      spec.num,
+      spec.instances.num
+    );
+  }
+  for (let id in iattribs) {
+    const attr = sattribs[id];
+    attr && (isGL2 ? gl.vertexAttribDivisor(attr.loc, 0) : ext.vertexAttribDivisorANGLE(attr.loc, 0));
+  }
+  spec.shader.unbind(null);
+};
+export {
+  draw
 };

package/error.js

@@ -1,5 +1,9 @@
 import { defError } from "@thi.ng/errors/deferror";
-export const WebGLError = defError(() => "WebGL");
-export const error = (msg) => {
-    throw new WebGLError(msg);
+const WebGLError = defError(() => "WebGL");
+const error = (msg) => {
+  throw new WebGLError(msg);
+};
+export {
+  WebGLError,
+  error
 };