@swf2es/context3d 0.1.19 → 0.1.20

package/dist/webgl/context.js

@@ -1,4 +1,5 @@
-import { MOST_BACK_BUFFER, SAMPLER_FILTERS, SAMPLER_MIPS, SAMPLER_WRAPS, ScissorBoundsError, screenPixels, TextureBindingError, VERTEX_FORMATS, VertexOffsetError, } from "../backend.js";
+import { INDIRECT_BANK } from "../agal.js";
+import { compressedFormat, FRAGMENT_CONSTANTS, MOST_BACK_BUFFER, MOST_CUBE, profileLimits, SAMPLER_FILTERS, SAMPLER_MIPS, SAMPLER_SLOTS, SAMPLER_WRAPS, ScissorBoundsError, screenPixels, TEXEL_BYTES, TextureBindingError, VERTEX_CONSTANTS, VERTEX_FORMATS, VERTEX_SLOTS, VertexOffsetError, } from "../backend.js";
 import { GlState } from "../device/state.js";
 import { blockBytes } from "../dxt.js";
 import { Context3DError } from "../errors.js";
@@ -7,14 +8,29 @@ import { resourceLimits } from "./limits.js";
 import { createCopyProgram, uploadProgram, } from "./programs.js";
 import { BLEND_FUNCTIONS, DEPTH_FUNCTIONS, range, STENCIL_FUNCTIONS, StencilState, } from "./state.js";
 import { allocateMultisample, deleteMultisample, resolveTarget, selectSamples, targetFramebuffer, } from "./targets.js";
-import { uploadCompressedLevel, uploadTexture, uploadTextureBytes, } from "./textures.js";
+import { storageFormat, uploadCompressedLevel, uploadTexture, uploadTextureBytes, } from "./textures.js";
 import { validateIndices, validateVertices } from "./validation.js";
 /** What AGAL's sampler must name to read each texture format: RGBA, DXT1 or DXT5. */
 const SAMPLER_FORMATS = {
     bgra: 0,
     compressed: 1,
     compressedAlpha: 2,
+    bgrPacked565: 0,
+    bgraPacked4444: 0,
+    rgbaHalfFloat: 0,
 };
+/**
+ * A clear colour's channel as Direct3D's 8-bit clear colour holds it, which AIR fills by
+ * truncation (0.5 clears to 127): within 0 to 1 and cut to its byte, NaN kept.
+ */
+function clearChannel(value) {
+    if (!(value > 0)) {
+        return value < 0 ? 0 : value;
+    }
+    return value >= 1 ? 1 : Math.floor(value * 255 + 1e-3) / 255;
+}
+/** AGAL's wraps (clamp, repeat, clamp_u_repeat_v, repeat_u_clamp_v) as SAMPLER_WRAPS indices. */
+const WRAPS = [0, 3, 2, 1];
 function constants(registers) {
     const data = new Float32Array(registers * 4);
     return {
@@ -40,6 +56,7 @@ export class WebGLContext3D {
     gpuMost = null;
     disposed = false;
     samplerFormats = true;
+    profile = "baseline";
     buffers = new Map();
     vertexBuffers = 0;
     bufferBytes = 0;
@@ -58,7 +75,14 @@ export class WebGLContext3D {
     renderTexture = null;
     renderDepth = false;
     renderFace = 0;
-    textureSlots = new Array(8).fill(null);
+    /** Colour outputs 1 to 3, drawn into with renderTexture, and their cube faces. */
+    outputs = [null, null, null];
+    outputFaces = new Uint8Array(3);
+    outputsChanged = false;
+    /** Whether any of outputs is bound, so that a draw alone into its target looks at none. */
+    outputsBound = false;
+    floatTargets;
+    textureSlots = new Array(SAMPLER_SLOTS).fill(null);
     textureMask = 0;
     samplers = new Array(96).fill(null);
     // Two wrap bits, three filter bits and two mip bits fit each slot in one byte.
@@ -66,10 +90,10 @@ export class WebGLContext3D {
     anisotropy;
     s3tc;
     maxAnisotropy = 1;
-    vertices = new Array(8).fill(null);
+    vertices = new Array(VERTEX_SLOTS).fill(null);
     enabledAttributes = 0;
     indexBuffer = null;
-    texturesApplied = new Uint8Array(8);
+    texturesApplied = new Uint8Array(SAMPLER_SLOTS);
     selected = null;
     framebuffer = null;
     texture = null;
@@ -99,8 +123,8 @@ export class WebGLContext3D {
     scissorRight = 0;
     scissorBottom = 0;
     scissorOutside = false;
-    vertexConstants = constants(128);
-    fragmentConstants = constants(28);
+    vertexConstants = constants(VERTEX_CONSTANTS);
+    fragmentConstants = constants(FRAGMENT_CONSTANTS);
     pixels = new Uint8Array(0);
     topDown = new Uint8Array(0);
     vao;
@@ -159,6 +183,9 @@ export class WebGLContext3D {
             }
         }
         this.drawState.bindFramebuffer(state ? targetFramebuffer(state) : this.framebuffer);
+        if (this.outputsChanged || state?.outputs) {
+            this.attachOutputs(state);
+        }
         this.drawState.viewport(0, 0, texture?.width ?? this.drawnWidth, texture?.height ?? this.drawnHeight);
     }
     /** Temporary attachments and separate READ/DRAW bindings bypass the hot target cache. */
@@ -326,7 +353,8 @@ export class WebGLContext3D {
         const gl = this.gl;
         let bits = 0;
         if (mask & 1) {
-            gl.clearColor(red, green, blue, alpha);
+            // A float target too: AIR clears through Direct3D's 8-bit colour.
+            gl.clearColor(clearChannel(red), clearChannel(green), clearChannel(blue), clearChannel(alpha));
             bits |= gl.COLOR_BUFFER_BIT;
             this.changedTarget();
         }
@@ -670,6 +698,7 @@ export class WebGLContext3D {
             attributeMask: 0,
             vertex: [],
             vertexBank: null,
+            outputs: 1,
             fragment: [],
             samplers: [],
             samplerMask: 0,
@@ -681,11 +710,17 @@ export class WebGLContext3D {
             vertexVersion: -1,
         };
         const program = {
+            get outputs() {
+                return state.outputs;
+            },
+            get attributes() {
+                return state.attributeMask;
+            },
             upload: (vertex, fragment) => {
                 this.alive();
                 this.program(program);
                 this.drawState.forget();
-                uploadProgram(this.gl, state, vertex, fragment);
+                uploadProgram(this.gl, state, vertex, fragment, this.profile);
                 if (this.selected === program) {
                     this.setProgram(program);
                 }
@@ -731,15 +766,15 @@ export class WebGLContext3D {
     createTexture(width, height, cube = false, format = "bgra", streaming = 0) {
         return this.allocateTexture(width, height, cube, false, format, streaming);
     }
-    createRectangleTexture(width, height) {
-        return this.allocateTexture(width, height, false, true, "bgra");
+    createRectangleTexture(width, height, format = "bgra") {
+        return this.allocateTexture(width, height, false, true, format);
     }
     /** GL's internal format for a compressed texture's S3TC, or 0 where the context takes none. */
     s3tcFormat(format) {
         if (this.s3tc === undefined) {
             this.s3tc = this.gl.getExtension("WEBGL_compressed_texture_s3tc");
         }
-        if (!this.s3tc || format === "bgra") {
+        if (!this.s3tc || !compressedFormat(format)) {
             return 0;
         }
         // AIR's DXT1 has DXT1's one bit of alpha: a block of three colours has transparent black.
@@ -757,18 +792,22 @@ export class WebGLContext3D {
         for (let level = 0; level < levels; level++) {
             const w = Math.max(1, width >> level);
             const h = Math.max(1, height >> level);
-            size += format === "bgra" ? w * h * 4 : blockBytes(w, h, format === "compressedAlpha");
+            size += compressedFormat(format)
+                ? blockBytes(w, h, format === "compressedAlpha")
+                : w * h * (TEXEL_BYTES[format] ?? 4);
         }
         return size * faces;
     }
     allocateTexture(width, height, cube, rectangle, format, streaming = 0) {
         this.alive();
-        range(1, width - 1, 2048);
-        range(1, height - 1, 2048);
+        const limits = profileLimits(this.profile);
+        const most = rectangle ? limits.rectangleSize : limits.textureSize;
+        range(1, width - 1, most);
+        range(1, height - 1, most);
         if (cube && width !== height) {
             throw new Context3DError("textureShape", "Context3D cube faces must be square");
         }
-        if (cube && width > 1024) {
+        if (cube && width > MOST_CUBE) {
             throw new Context3DError("textureSize", "Context3D cube faces must be at most 1024");
         }
         const faces = cube ? 6 : 1;
@@ -777,14 +816,14 @@ export class WebGLContext3D {
         if (!rectangle && ((width & (width - 1)) !== 0 || (height & (height - 1)) !== 0)) {
             throw new Context3DError("texturePowerOfTwo", "Context3D texture size must be a power of two");
         }
-        if (format !== "bgra" && rectangle) {
+        if (compressedFormat(format) && rectangle) {
             throw new Context3DError("unsupported", "Context3D rectangle textures are not compressed");
         }
-        if (format !== "bgra" && (width < 4 || height < 4)) {
+        if (compressedFormat(format) && (width < 4 || height < 4)) {
             throw new Context3DError("compressedSize", "Context3D compressed textures are at least 4x4");
         }
         const gl = this.gl;
-        const storage = this.s3tcFormat(format) || gl.RGBA8;
+        const storage = this.s3tcFormat(format) || storageFormat(gl, format);
         const size = this.chainBytes(width, height, levels, faces, format);
         const kind = cube ? 2 : rectangle ? 1 : 0;
         const countLimit = cube
@@ -799,7 +838,8 @@ export class WebGLContext3D {
                 : this.limits.max2DTextureBytes;
         // AIR reserves half the base size for mips, independently of the exact
         // chain storage, and charges DXT1 an eighth of BGRA and DXT5 a quarter.
-        const quotaBytes = (width * height * faces * (rectangle ? 4 : 6)) /
+        const quotaBytes = (width * height * faces * (rectangle ? 4 : 6) * (TEXEL_BYTES[format] ?? 4)) /
+            4 /
             (format === "compressed" ? 8 : format === "compressedAlpha" ? 4 : 1);
         if (this.textures.size >= this.limits.maxTextures ||
             this.textureCounts[kind] >= countLimit ||
@@ -830,6 +870,7 @@ export class WebGLContext3D {
             multisample: null,
             samples: 0,
             antiAlias: 0,
+            outputs: 0,
             base: 0,
         };
         const texture = {
@@ -864,8 +905,8 @@ export class WebGLContext3D {
             uploadCompressed: (blocks, level = 0, face = 0) => {
                 this.alive();
                 this.textureState(texture);
-                if (format === "bgra") {
-                    throw new Context3DError("textureUpload", "Context3D experiment: BGRA texture given blocks");
+                if (!compressedFormat(format)) {
+                    throw new Context3DError("textureUpload", "Context3D experiment: uncompressed texture given blocks");
                 }
                 try {
                     uploadCompressedLevel(gl, texture, state, blocks, level, face);
@@ -901,6 +942,13 @@ export class WebGLContext3D {
                 state.framebuffer = null;
                 state.mipFramebuffer = null;
                 state.depthBuffer = null;
+                for (let i = 0; i < this.outputs.length; i++) {
+                    if (this.outputs[i] === texture) {
+                        this.outputs[i] = null;
+                        this.outputsChanged = true;
+                        this.outputsBound = this.outputMask() !== 0;
+                    }
+                }
                 for (let i = 0; i < this.textureSlots.length; i++) {
                     if (this.textureSlots[i] === texture) {
                         this.texturesApplied[i] = 0;
@@ -1023,7 +1071,7 @@ export class WebGLContext3D {
         this.sampler(0);
         this.drawState.forget();
         this.texturesApplied[0] = 0;
-        const target = allocateMultisample(this.gl, texture, old, samples, depth, this.depthWrite, this.stencilWrite);
+        const target = allocateMultisample(this.gl, texture, old, samples, depth, this.depthWrite, this.stencilWrite, state.storage);
         if (same) {
             if (newDepth) {
                 this.targetDepthBytes += bytes;
@@ -1055,9 +1103,10 @@ export class WebGLContext3D {
         const gl = this.gl;
         if (texture) {
             this.textureState(texture);
-            if (texture.format !== "bgra") {
+            if (compressedFormat(texture.format)) {
                 throw new Context3DError("operation", "Context3D experiment: compressed textures are no render targets");
             }
+            this.renderFormat(texture.format);
         }
         const samples = texture ? this.multisamples(antiAlias, depth) : 0;
         this.finishTarget();
@@ -1155,6 +1204,12 @@ export class WebGLContext3D {
         this.applyScissor();
     }
     changedTarget() {
+        for (let i = 0; this.outputsBound && i < this.outputs.length; i++) {
+            const output = this.outputs[i];
+            if (output) {
+                this.textureState(output).dirty = true;
+            }
+        }
         if (this.renderTexture) {
             const state = this.textureState(this.renderTexture);
             state.dirty = true;
@@ -1172,22 +1227,33 @@ export class WebGLContext3D {
         }
     }
     finishTarget() {
-        if (!this.renderTexture) {
-            return;
+        if (this.renderTexture) {
+            this.finishTexture(this.renderTexture, this.renderFace);
         }
-        const texture = this.renderTexture;
+        for (let i = 0; i < this.outputs.length; i++) {
+            const output = this.outputs[i];
+            if (output) {
+                this.finishTexture(output, this.outputFaces[i]);
+            }
+        }
+    }
+    /** A texture drawn into made whole again: resolved, and its mips regenerated. */
+    finishTexture(texture, renderFace) {
         const state = this.textureState(texture);
         if (state.dirty) {
             const gl = this.gl;
             this.drawState.forget();
             this.texturesApplied[0] = 0;
-            resolveTarget(this.gl, texture, state, this.renderFace, this.scissor);
+            resolveTarget(this.gl, texture, state, renderFace, this.scissor);
             gl.activeTexture(gl.TEXTURE0);
             if (texture.cube) {
+                // An extra colour output may never have been a target of its own.
+                state.framebuffer ??= gl.createFramebuffer();
+                state.mipFramebuffer ??= gl.createFramebuffer();
                 // generateMipmap(CUBE_MAP) would overwrite manually uploaded mips on
                 // untouched faces. AIR regenerates only the face just rendered.
                 gl.disable(gl.SCISSOR_TEST);
-                const face = gl.TEXTURE_CUBE_MAP_POSITIVE_X + this.renderFace;
+                const face = gl.TEXTURE_CUBE_MAP_POSITIVE_X + renderFace;
                 // The base-size depth attachment cannot accompany smaller mip images.
                 this.bindFramebuffer(gl.FRAMEBUFFER, state.framebuffer);
                 if (state.depthAttached) {
@@ -1211,13 +1277,81 @@ export class WebGLContext3D {
                 gl.bindTexture(gl.TEXTURE_2D, state.handle);
                 gl.generateMipmap(gl.TEXTURE_2D);
             }
-            state.uploaded[this.renderFace] = (1 << texture.levels) - 1;
+            state.uploaded[renderFace] = (1 << texture.levels) - 1;
             state.dirty = false;
         }
     }
+    /** Half floats are drawn into where the GPU's WebGL renders float colour, as every desktop one does. */
+    renderFormat(format) {
+        if (format !== "rgbaHalfFloat") {
+            return;
+        }
+        this.floatTargets ??= this.gl.getExtension("EXT_color_buffer_float") !== null;
+        if (!this.floatTargets) {
+            throw new Context3DError("unsupported", "Context3D: this GPU draws into no half floats");
+        }
+    }
+    setColorOutput(index, texture, face = 0) {
+        this.alive();
+        range(index - 1, 1, this.outputs.length);
+        if (texture) {
+            this.textureState(texture);
+            range(face, 1, texture.cube ? 6 : 1);
+            if (compressedFormat(texture.format)) {
+                throw new Context3DError("operation", "Context3D experiment: compressed textures are no render targets");
+            }
+            this.renderFormat(texture.format);
+        }
+        if (this.outputs[index - 1] === texture && this.outputFaces[index - 1] === face) {
+            return;
+        }
+        const previous = this.outputs[index - 1];
+        if (previous) {
+            this.finishTexture(previous, this.outputFaces[index - 1]);
+        }
+        this.outputs[index - 1] = texture;
+        this.outputFaces[index - 1] = texture ? face : 0;
+        this.outputsChanged = true;
+        this.outputsBound = this.outputMask() !== 0;
+    }
+    /**
+     * The current target's framebuffer with the extra colour outputs attached, or without
+     * them: its draws write every output bound, and a program's unwritten ones are refused
+     * before they draw.
+     */
+    attachOutputs(state) {
+        const want = state ? this.outputMask() : 0;
+        if (!state || (!this.outputsChanged && state.outputs === want)) {
+            return;
+        }
+        if (want && state.samples) {
+            throw new Context3DError("unsupported", "Context3D: antialiased colour outputs");
+        }
+        const gl = this.gl;
+        const buffers = [gl.COLOR_ATTACHMENT0];
+        for (let i = 0; i < this.outputs.length; i++) {
+            const output = this.outputs[i];
+            const handle = output ? this.textureState(output).handle : null;
+            gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT1 + i, output?.cube ? gl.TEXTURE_CUBE_MAP_POSITIVE_X + this.outputFaces[i] : gl.TEXTURE_2D, handle, 0);
+            buffers.push(output ? gl.COLOR_ATTACHMENT1 + i : gl.NONE);
+        }
+        gl.drawBuffers(buffers);
+        state.outputs = want;
+        this.outputsChanged = false;
+    }
+    /** The extra colour outputs bound, a bit each from output 1. */
+    outputMask() {
+        let mask = 0;
+        for (let i = 0; i < this.outputs.length; i++) {
+            if (this.outputs[i]) {
+                mask |= 1 << i;
+            }
+        }
+        return mask;
+    }
     setTexture(index, texture) {
         this.alive();
-        range(index, 1, 8);
+        range(index, 1, SAMPLER_SLOTS);
         if (texture && !this.textureOwners.has(texture)) {
             throw new Context3DError("disposed", "Context3D experiment: texture from another context");
         }
@@ -1302,13 +1436,13 @@ export class WebGLContext3D {
         for (let i = 0; i < state.samplers.length; i++) {
             const source = state.samplers[i].source;
             if (!source.ignore) {
-                this.setSamplerState(source.index, (source.repeat ? 3 : 0) | (source.filter << 2) | (source.mip << 5));
+                this.setSamplerState(source.index, WRAPS[source.wrap] | (source.filter << 2) | (source.mip << 5));
             }
         }
     }
     setVertex(index, buffer, offset, format) {
         this.alive();
-        range(index, 1, 8);
+        range(index, 1, VERTEX_SLOTS);
         if (buffer === null) {
             this.vertices[index] = null;
             return;
@@ -1414,13 +1548,14 @@ export class WebGLContext3D {
         const maximum = validateIndices(index, first, count);
         const gl = this.gl;
         this.drawState.bindVertexArray(this.vao);
-        for (let i = 0; i < 8; i++) {
-            const bit = 1 << i;
-            if (this.enabledAttributes & bit & ~state.attributeMask) {
-                gl.disableVertexAttribArray(i);
-                this.enabledAttributes &= ~bit;
-            }
-        }
+        // The streams enabled that the program does not read, highest first.
+        let stale = this.enabledAttributes & ~state.attributeMask;
+        while (stale) {
+            const i = 31 - Math.clz32(stale);
+            gl.disableVertexAttribArray(i);
+            stale &= ~(1 << i);
+        }
+        this.enabledAttributes &= state.attributeMask;
         for (let i = 0; i < state.attributes.length; i++) {
             const slot = state.attributes[i];
             const binding = this.vertices[slot];
@@ -1453,7 +1588,12 @@ export class WebGLContext3D {
             const binding = state.samplers[i];
             const slot = binding.source.index;
             const texture = this.textureSlots[slot];
-            if (texture && texture === this.renderTexture) {
+            if (texture &&
+                (texture === this.renderTexture ||
+                    (this.outputsBound &&
+                        (texture === this.outputs[0] ||
+                            texture === this.outputs[1] ||
+                            texture === this.outputs[2])))) {
                 throw new TextureBindingError("feedback");
             }
             const resource = texture && this.textures.get(texture);
@@ -1515,11 +1655,12 @@ export class WebGLContext3D {
         state.samplersSet = true;
         if (state.vertexBank) {
             if (this.vertexConstants.writing || state.vertexVersion !== this.vertexConstants.version) {
-                gl.uniform4fv(state.vertexBank, this.vertexConstants.data);
+                gl.uniform4fv(state.vertexBank, this.vertexConstants.data, 0, INDIRECT_BANK * 4);
                 state.vertexVersion = this.vertexConstants.version;
             }
         }
-        else {
+        // An indirect program's own uniforms are only the registers past its bank.
+        if (state.vertex.length) {
             this.uniforms(state.vertex, this.vertexConstants, state.vertexVersions, state.vertexValues);
         }
         this.uniforms(state.fragment, this.fragmentConstants, state.fragmentVersions, state.fragmentValues);