@lightningjs/renderer 3.0.0-beta14 → 3.0.0-beta15

package/dist/src/core/renderers/webgl/WebGlCoreRenderOp.js

@@ -0,0 +1,114 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { CoreRenderOp } from '../CoreRenderOp.js';
+import { WebGlCoreShader } from './WebGlCoreShader.js';
+/**
+ * Can render multiple quads with multiple textures (up to vertex shader texture limit)
+ *
+ */
+export class WebGlCoreRenderOp extends CoreRenderOp {
+    glw;
+    options;
+    buffers;
+    shader;
+    shaderProps;
+    alpha;
+    clippingRect;
+    dimensions;
+    bufferIdx;
+    zIndex;
+    renderToTexture;
+    parentHasRenderTexture;
+    framebufferDimensions;
+    length = 0;
+    numQuads = 0;
+    textures = [];
+    maxTextures;
+    constructor(glw, options, buffers, shader, shaderProps, alpha, clippingRect, dimensions, bufferIdx, zIndex, renderToTexture, parentHasRenderTexture, framebufferDimensions) {
+        super();
+        this.glw = glw;
+        this.options = options;
+        this.buffers = buffers;
+        this.shader = shader;
+        this.shaderProps = shaderProps;
+        this.alpha = alpha;
+        this.clippingRect = clippingRect;
+        this.dimensions = dimensions;
+        this.bufferIdx = bufferIdx;
+        this.zIndex = zIndex;
+        this.renderToTexture = renderToTexture;
+        this.parentHasRenderTexture = parentHasRenderTexture;
+        this.framebufferDimensions = framebufferDimensions;
+        this.maxTextures = shader.supportsIndexedTextures
+            ? glw.getParameter(glw.MAX_VERTEX_TEXTURE_IMAGE_UNITS)
+            : 1;
+    }
+    addTexture(texture) {
+        const { textures, maxTextures } = this;
+        let existingIdx = -1;
+        const texturesLength = textures.length;
+        for (let i = 0; i < texturesLength; i++) {
+            const t = textures[i];
+            if (t === texture) {
+                existingIdx = i;
+                break;
+            }
+        }
+        if (existingIdx !== -1) {
+            return existingIdx;
+        }
+        if (texturesLength >= maxTextures) {
+            return 0xffffffff;
+        }
+        this.textures.push(texture);
+        return texturesLength;
+    }
+    draw() {
+        const { glw, shader, shaderProps, options } = this;
+        const { shManager } = options;
+        shManager.useShader(shader);
+        shader.bindRenderOp(this, shaderProps);
+        // TODO: Reduce calculations required
+        const quadIdx = (this.bufferIdx / 24) * 6 * 2;
+        // Clipping
+        if (this.clippingRect.valid) {
+            const { x, y, width, height } = this.clippingRect;
+            const pixelRatio = this.parentHasRenderTexture ? 1 : options.pixelRatio;
+            const canvasHeight = options.canvas.height;
+            const clipX = Math.round(x * pixelRatio);
+            const clipWidth = Math.round(width * pixelRatio);
+            const clipHeight = Math.round(height * pixelRatio);
+            let clipY = Math.round(canvasHeight - clipHeight - y * pixelRatio);
+            // if parent has render texture, we need to adjust the scissor rect
+            // to be relative to the parent's framebuffer
+            if (this.parentHasRenderTexture) {
+                clipY = this.framebufferDimensions
+                    ? this.framebufferDimensions.height - this.dimensions.height
+                    : 0;
+            }
+            glw.setScissorTest(true);
+            glw.scissor(clipX, clipY, clipWidth, clipHeight);
+        }
+        else {
+            glw.setScissorTest(false);
+        }
+        glw.drawElements(glw.TRIANGLES, 6 * this.numQuads, glw.UNSIGNED_SHORT, quadIdx);
+    }
+}
+//# sourceMappingURL=WebGlCoreRenderOp.js.map

package/dist/src/core/renderers/webgl/WebGlCoreRenderOp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WebGlCoreRenderOp.js","sourceRoot":"","sources":["../../../../../src/core/renderers/webgl/WebGlCoreRenderOp.ts"],"names":[],"mappings":"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"}

package/dist/src/core/renderers/webgl/WebGlCoreRenderer.d.ts

@@ -0,0 +1,133 @@
+import { CoreRenderer, type BufferInfo, type CoreRendererOptions, type QuadOptions } from '../CoreRenderer.js';
+import { WebGlCoreRenderOp } from './WebGlCoreRenderOp.js';
+import type { CoreContextTexture } from '../CoreContextTexture.js';
+import { type CoreWebGlParameters, type CoreWebGlExtensions, type WebGlColor } from './internal/RendererUtils.js';
+import { Texture } from '../../textures/Texture.js';
+import { CoreShaderManager } from '../../CoreShaderManager.js';
+import { BufferCollection } from './internal/BufferCollection.js';
+import { WebGlCoreShader } from './WebGlCoreShader.js';
+import { WebGlContextWrapper } from '../../lib/WebGlContextWrapper.js';
+import { type CoreNode } from '../../CoreNode.js';
+import type { BaseShaderController } from '../../../main-api/ShaderController.js';
+export type WebGlCoreRendererOptions = CoreRendererOptions;
+interface CoreWebGlSystem {
+    parameters: CoreWebGlParameters;
+    extensions: CoreWebGlExtensions;
+}
+export declare class WebGlCoreRenderer extends CoreRenderer {
+    glw: WebGlContextWrapper;
+    system: CoreWebGlSystem;
+    quadBuffer: ArrayBuffer;
+    fQuadBuffer: Float32Array;
+    uiQuadBuffer: Uint32Array;
+    renderOps: WebGlCoreRenderOp[];
+    curBufferIdx: number;
+    curRenderOp: WebGlCoreRenderOp | null;
+    rttNodes: CoreNode[];
+    activeRttNode: CoreNode | null;
+    defShaderCtrl: BaseShaderController;
+    defaultShader: WebGlCoreShader;
+    quadBufferCollection: BufferCollection;
+    clearColor: WebGlColor;
+    /**
+     * White pixel texture used by default when no texture is specified.
+     */
+    quadBufferUsage: number;
+    numQuadsRendered: number;
+    /**
+     * Whether the renderer is currently rendering to a texture.
+     */
+    renderToTextureActive: boolean;
+    constructor(options: WebGlCoreRendererOptions);
+    reset(): void;
+    getShaderManager(): CoreShaderManager;
+    createCtxTexture(textureSource: Texture): CoreContextTexture;
+    /**
+     * This function adds a quad (a rectangle composed of two triangles) to the WebGL rendering pipeline.
+     *
+     * It takes a set of options that define the quad's properties, such as its dimensions, colors, texture, shader, and transformation matrix.
+     * The function first updates the shader properties with the current dimensions if necessary, then sets the default texture if none is provided.
+     * It then checks if a new render operation is needed, based on the current shader and clipping rectangle.
+     * If a new render operation is needed, it creates one and updates the current render operation.
+     * The function then adjusts the texture coordinates based on the texture options and adds the texture to the texture manager.
+     *
+     * Finally, it calculates the vertices for the quad, taking into account any transformations, and adds them to the quad buffer.
+     * The function updates the length and number of quads in the current render operation, and updates the current buffer index.
+     */
+    addQuad(params: QuadOptions): void;
+    /**
+     * Replace the existing RenderOp with a new one that uses the specified Shader
+     * and starts at the specified buffer index.
+     *
+     * @param shader
+     * @param bufferIdx
+     */
+    private newRenderOp;
+    /**
+     * Add a texture to the current RenderOp. If the texture cannot be added to the
+     * current RenderOp, a new RenderOp will be created and the texture will be added
+     * to that one.
+     *
+     * If the texture cannot be added to the new RenderOp, an error will be thrown.
+     *
+     * @param texture
+     * @param bufferIdx
+     * @param recursive
+     * @returns Assigned Texture Index of the texture in the render op
+     */
+    private addTexture;
+    /**
+     * Test if the current Render operation can be reused for the specified parameters.
+     * @param params
+     * @returns
+     */
+    reuseRenderOp(params: QuadOptions): boolean;
+    /**
+     * add RenderOp to the render pipeline
+     */
+    addRenderOp(renderable: WebGlCoreRenderOp): void;
+    /**
+     * Render the current set of RenderOps to render to the specified surface.
+     *
+     * TODO: 'screen' is the only supported surface at the moment.
+     *
+     * @param surface
+     */
+    render(surface?: 'screen' | CoreContextTexture): void;
+    getQuadCount(): number;
+    renderToTexture(node: CoreNode): void;
+    /**
+     * Inserts an RTT node into `this.rttNodes` while maintaining the correct rendering order based on hierarchy.
+     *
+     * Rendering order for RTT nodes is critical when nested RTT nodes exist in a parent-child relationship.
+     * Specifically:
+     *  - Child RTT nodes must be rendered before their RTT-enabled parents to ensure proper texture composition.
+     *  - If an RTT node is added and it has existing RTT children, it should be rendered after those children.
+     *
+     * This function addresses both cases by:
+     * 1. **Checking Upwards**: It traverses the node's hierarchy upwards to identify any RTT parent
+     *    already in `rttNodes`. If an RTT parent is found, the new node is placed before this parent.
+     * 2. **Checking Downwards**: It traverses the node’s children recursively to find any RTT-enabled
+     *    children that are already in `rttNodes`. If such children are found, the new node is inserted
+     *    after the last (highest index) RTT child node.
+     *
+     * The final calculated insertion index ensures the new node is positioned in `rttNodes` to respect
+     * both parent-before-child and child-before-parent rendering rules, preserving the correct order
+     * for the WebGL renderer.
+     *
+     * @param node - The RTT-enabled CoreNode to be added to `rttNodes` in the appropriate hierarchical position.
+     */
+    private insertRTTNodeInOrder;
+    private findMaxChildRTTIndex;
+    renderRTTNodes(): void;
+    removeRTTNode(node: CoreNode): void;
+    getBufferInfo(): BufferInfo | null;
+    getDefShaderCtr(): BaseShaderController;
+    /**
+     * Updates the WebGL context's clear color and clears the color buffer.
+     *
+     * @param color - The color to set as the clear color, represented as a 32-bit integer.
+     */
+    updateClearColor(color: number): void;
+}
+export {};