@next2d/webgl 1.14.20

package/dist/TextureManager.d.ts

@@ -0,0 +1,130 @@
+/**
+ * @class
+ */
+export declare class TextureManager {
+    private readonly _$gl;
+    private readonly _$objectPool;
+    private readonly _$boundTextures;
+    private _$objectPoolArea;
+    private _$activeTexture;
+    _$maxWidth: number;
+    _$maxHeight: number;
+    /**
+     * @param {WebGL2RenderingContext} gl
+     * @constructor
+     * @public
+     */
+    constructor(gl: WebGL2RenderingContext);
+    /**
+     * @param  {number} width
+     * @param  {number} height
+     * @return {WebGLTexture}
+     * @method
+     * @private
+     */
+    _$createTexture(width: number, height: number): WebGLTexture;
+    /**
+     * @param  {number} width
+     * @param  {number} height
+     * @return {WebGLTexture}
+     * @method
+     * @private
+     */
+    _$getTexture(width: number, height: number): WebGLTexture;
+    /**
+     * @param  {number}     width
+     * @param  {number}     height
+     * @param  {Uint8Array} [pixels=null]
+     * @param  {boolean}    [premultiplied_alpha=false]
+     * @param  {boolean}    [flip_y=true]
+     * @method
+     * @return {WebGLTexture}
+     */
+    create(width: number, height: number, pixels?: Uint8Array | null, premultiplied_alpha?: boolean, flip_y?: boolean): WebGLTexture;
+    /**
+     * @param  {HTMLImageElement} image
+     * @param  {boolean} [smoothing=false]
+     * @return {WebGLTexture}
+     * @method
+     * @public
+     */
+    createFromImage(image: HTMLImageElement, smoothing?: boolean): WebGLTexture;
+    /**
+     * @param  {HTMLCanvasElement} canvas
+     * @return {WebGLTexture}
+     * @method
+     * @public
+     */
+    createFromCanvas(canvas: HTMLCanvasElement | OffscreenCanvas): WebGLTexture;
+    /**
+     * @param  {HTMLVideoElement} video
+     * @param  {boolean} [smoothing=false]
+     * @return {WebGLTexture}
+     * @method
+     * @public
+     */
+    createFromVideo(video: HTMLVideoElement, smoothing?: boolean): WebGLTexture;
+    /**
+     * @param  {number} width
+     * @param  {number} height
+     * @param  {HTMLImageElement|HTMLCanvasElement|HTMLVideoElement} element
+     * @param  {boolean} [smoothing=false]
+     * @return {WebGLTexture}
+     * @method
+     * @private
+     */
+    _$createFromElement(width: number, height: number, element: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | OffscreenCanvas, smoothing?: boolean): WebGLTexture;
+    /**
+     * @param  {WebGLTexture} texture
+     * @return {void}
+     * @method
+     * @public
+     */
+    release(texture: WebGLTexture): void;
+    /**
+     * @param  {WebGLTexture} texture0
+     * @param  {boolean|null} [smoothing0=null]
+     * @return {void}
+     * @method
+     * @public
+     */
+    bind0(texture0: WebGLTexture, smoothing0?: boolean | null): void;
+    /**
+     * @param  {WebGLTexture} texture0
+     * @param  {WebGLTexture} texture1
+     * @param  {boolean}      [smoothing01=null]
+     * @return {void}
+     * @method
+     * @public
+     */
+    bind01(texture0: WebGLTexture, texture1: WebGLTexture, smoothing01?: boolean | null): void;
+    /**
+     * @param  {WebGLTexture} texture0
+     * @param  {WebGLTexture} texture1
+     * @param  {WebGLTexture} texture2
+     * @param  {boolean}      [smoothing2=null]
+     * @return {void}
+     * @method
+     * @public
+     */
+    bind012(texture0: WebGLTexture, texture1: WebGLTexture, texture2: WebGLTexture, smoothing2?: boolean | null): void;
+    /**
+     * @param  {WebGLTexture} texture0
+     * @param  {WebGLTexture} texture2
+     * @param  {boolean}      [smoothing2=null]
+     * @return {void}
+     * @method
+     * @public
+     */
+    bind02(texture0: WebGLTexture, texture2: WebGLTexture, smoothing2?: boolean | null): void;
+    /**
+     * @param  {number}       index
+     * @param  {number}       target
+     * @param  {WebGLTexture} texture
+     * @param  {boolean}      smoothing
+     * @return {void}
+     * @method
+     * @private
+     */
+    _$bindTexture(index: number, target: number, texture?: WebGLTexture | null, smoothing?: boolean | null): void;
+}

package/dist/TextureManager.js

@@ -0,0 +1,296 @@
+/**
+ * @class
+ */
+export class TextureManager {
+    /**
+     * @param {WebGL2RenderingContext} gl
+     * @constructor
+     * @public
+     */
+    constructor(gl) {
+        /**
+         * @type {WebGL2RenderingContext}
+         * @private
+         */
+        this._$gl = gl;
+        /**
+         * @type {array}
+         * @private
+         */
+        this._$objectPool = [];
+        /**
+         * @type {number}
+         * @default 0
+         * @private
+         */
+        this._$objectPoolArea = 0;
+        /**
+         * @type {number}
+         * @default -1
+         * @private
+         */
+        this._$activeTexture = -1;
+        /**
+         * @type {array}
+         * @private
+         */
+        this._$boundTextures = [null, null, null];
+        /**
+         * @type {number}
+         * @default 0
+         * @private
+         */
+        this._$maxWidth = 0;
+        /**
+         * @type {number}
+         * @default 0
+         * @private
+         */
+        this._$maxHeight = 0;
+        this._$gl.pixelStorei(this._$gl.UNPACK_ALIGNMENT, 1);
+        this._$gl.pixelStorei(this._$gl.UNPACK_FLIP_Y_WEBGL, true);
+    }
+    /**
+     * @param  {number} width
+     * @param  {number} height
+     * @return {WebGLTexture}
+     * @method
+     * @private
+     */
+    _$createTexture(width, height) {
+        const texture = this._$gl.createTexture();
+        texture.width = 0;
+        texture.height = 0;
+        texture.area = 0;
+        texture.dirty = true;
+        texture.smoothing = true;
+        texture._$offsetX = 0;
+        texture._$offsetY = 0;
+        this.bind0(texture, false);
+        this._$gl.texParameteri(this._$gl.TEXTURE_2D, this._$gl.TEXTURE_WRAP_S, this._$gl.CLAMP_TO_EDGE);
+        this._$gl.texParameteri(this._$gl.TEXTURE_2D, this._$gl.TEXTURE_WRAP_T, this._$gl.CLAMP_TO_EDGE);
+        texture.width = width;
+        texture.height = height;
+        texture.area = width * height;
+        texture.dirty = false;
+        this._$gl.texStorage2D(this._$gl.TEXTURE_2D, 1, this._$gl.RGBA8, width, height);
+        return texture;
+    }
+    /**
+     * @param  {number} width
+     * @param  {number} height
+     * @return {WebGLTexture}
+     * @method
+     * @private
+     */
+    _$getTexture(width, height) {
+        // プールに同じサイズのテクスチャがあれば、それを使い回す
+        for (let i = 0; i < this._$objectPool.length; i++) {
+            const texture = this._$objectPool[i];
+            if (texture.width === width && texture.height === height) {
+                this._$objectPool.splice(i, 1);
+                this._$objectPoolArea -= texture.area;
+                this.bind0(texture, false);
+                return texture;
+            }
+        }
+        return this._$createTexture(width, height);
+    }
+    /**
+     * @param  {number}     width
+     * @param  {number}     height
+     * @param  {Uint8Array} [pixels=null]
+     * @param  {boolean}    [premultiplied_alpha=false]
+     * @param  {boolean}    [flip_y=true]
+     * @method
+     * @return {WebGLTexture}
+     */
+    create(width, height, pixels = null, premultiplied_alpha = false, flip_y = true) {
+        const texture = this._$getTexture(width, height);
+        if (premultiplied_alpha) {
+            this._$gl.pixelStorei(this._$gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
+        }
+        if (!flip_y) {
+            this._$gl.pixelStorei(this._$gl.UNPACK_FLIP_Y_WEBGL, false);
+        }
+        if (texture.width !== width || texture.height !== height) {
+            texture.width = width;
+            texture.height = height;
+            texture.area = width * height;
+            texture.dirty = false;
+            this._$gl.texImage2D(this._$gl.TEXTURE_2D, 0, this._$gl.RGBA, width, height, 0, this._$gl.RGBA, this._$gl.UNSIGNED_BYTE, pixels);
+        }
+        else if (pixels) {
+            texture.dirty = false;
+            this._$gl.texSubImage2D(this._$gl.TEXTURE_2D, 0, 0, 0, width, height, this._$gl.RGBA, this._$gl.UNSIGNED_BYTE, pixels);
+        }
+        if (premultiplied_alpha) {
+            this._$gl.pixelStorei(this._$gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, false);
+        }
+        if (!flip_y) {
+            this._$gl.pixelStorei(this._$gl.UNPACK_FLIP_Y_WEBGL, true);
+        }
+        return texture;
+    }
+    /**
+     * @param  {HTMLImageElement} image
+     * @param  {boolean} [smoothing=false]
+     * @return {WebGLTexture}
+     * @method
+     * @public
+     */
+    createFromImage(image, smoothing = false) {
+        return this._$createFromElement(image.width, image.height, image, smoothing);
+    }
+    /**
+     * @param  {HTMLCanvasElement} canvas
+     * @return {WebGLTexture}
+     * @method
+     * @public
+     */
+    createFromCanvas(canvas) {
+        return this._$createFromElement(canvas.width, canvas.height, canvas, false);
+    }
+    /**
+     * @param  {HTMLVideoElement} video
+     * @param  {boolean} [smoothing=false]
+     * @return {WebGLTexture}
+     * @method
+     * @public
+     */
+    createFromVideo(video, smoothing = false) {
+        return this._$createFromElement(video.videoWidth, video.videoHeight, video, smoothing);
+    }
+    /**
+     * @param  {number} width
+     * @param  {number} height
+     * @param  {HTMLImageElement|HTMLCanvasElement|HTMLVideoElement} element
+     * @param  {boolean} [smoothing=false]
+     * @return {WebGLTexture}
+     * @method
+     * @private
+     */
+    _$createFromElement(width, height, element, smoothing = false) {
+        const texture = this._$getTexture(width, height);
+        texture.dirty = false;
+        this.bind0(texture, smoothing);
+        this._$gl.pixelStorei(this._$gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
+        if (texture.width !== width || texture.height !== height) {
+            texture.width = width;
+            texture.height = height;
+            texture.area = width * height;
+            this._$gl.texImage2D(this._$gl.TEXTURE_2D, 0, this._$gl.RGBA, this._$gl.RGBA, this._$gl.UNSIGNED_BYTE, element);
+        }
+        else {
+            this._$gl.texSubImage2D(this._$gl.TEXTURE_2D, 0, 0, 0, this._$gl.RGBA, this._$gl.UNSIGNED_BYTE, element);
+        }
+        this._$gl.pixelStorei(this._$gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, false);
+        return texture;
+    }
+    /**
+     * @param  {WebGLTexture} texture
+     * @return {void}
+     * @method
+     * @public
+     */
+    release(texture) {
+        // テクスチャのサイズが非常に大きい場合はプールしない
+        if (texture.area > this._$maxWidth * this._$maxHeight * 2) {
+            this._$gl.deleteTexture(texture);
+            return;
+        }
+        texture.dirty = true;
+        this._$objectPool.push(texture);
+        this._$objectPoolArea += texture.area;
+        // プール容量が一定を超えたら、古いテクスチャから削除していく
+        if (this._$objectPool.length
+            && this._$objectPoolArea > this._$maxWidth * this._$maxHeight * 10) {
+            const oldTexture = this._$objectPool.shift();
+            this._$objectPoolArea -= oldTexture.area;
+            this._$gl.deleteTexture(oldTexture);
+        }
+    }
+    /**
+     * @param  {WebGLTexture} texture0
+     * @param  {boolean|null} [smoothing0=null]
+     * @return {void}
+     * @method
+     * @public
+     */
+    bind0(texture0, smoothing0 = null) {
+        this._$bindTexture(2, this._$gl.TEXTURE2, null, null);
+        this._$bindTexture(1, this._$gl.TEXTURE1, null, null);
+        this._$bindTexture(0, this._$gl.TEXTURE0, texture0, smoothing0);
+    }
+    /**
+     * @param  {WebGLTexture} texture0
+     * @param  {WebGLTexture} texture1
+     * @param  {boolean}      [smoothing01=null]
+     * @return {void}
+     * @method
+     * @public
+     */
+    bind01(texture0, texture1, smoothing01 = null) {
+        this._$bindTexture(2, this._$gl.TEXTURE2, null, null);
+        this._$bindTexture(1, this._$gl.TEXTURE1, texture1, smoothing01);
+        this._$bindTexture(0, this._$gl.TEXTURE0, texture0, smoothing01);
+    }
+    /**
+     * @param  {WebGLTexture} texture0
+     * @param  {WebGLTexture} texture1
+     * @param  {WebGLTexture} texture2
+     * @param  {boolean}      [smoothing2=null]
+     * @return {void}
+     * @method
+     * @public
+     */
+    bind012(texture0, texture1, texture2, smoothing2 = null) {
+        this._$bindTexture(2, this._$gl.TEXTURE2, texture2, smoothing2);
+        this._$bindTexture(1, this._$gl.TEXTURE1, texture1, null);
+        this._$bindTexture(0, this._$gl.TEXTURE0, texture0, null);
+    }
+    /**
+     * @param  {WebGLTexture} texture0
+     * @param  {WebGLTexture} texture2
+     * @param  {boolean}      [smoothing2=null]
+     * @return {void}
+     * @method
+     * @public
+     */
+    bind02(texture0, texture2, smoothing2 = null) {
+        this._$bindTexture(2, this._$gl.TEXTURE2, texture2, smoothing2);
+        this._$bindTexture(1, this._$gl.TEXTURE1, null, null);
+        this._$bindTexture(0, this._$gl.TEXTURE0, texture0, null);
+    }
+    /**
+     * @param  {number}       index
+     * @param  {number}       target
+     * @param  {WebGLTexture} texture
+     * @param  {boolean}      smoothing
+     * @return {void}
+     * @method
+     * @private
+     */
+    _$bindTexture(index, target, texture = null, smoothing = null) {
+        const shouldBind = texture !== this._$boundTextures[index];
+        const shouldSmooth = smoothing !== null && texture !== null && smoothing !== texture.smoothing;
+        const shouldActive = (shouldBind || shouldSmooth || target === this._$gl.TEXTURE0)
+            && target !== this._$activeTexture;
+        if (shouldActive) {
+            this._$activeTexture = target;
+            this._$gl.activeTexture(target);
+        }
+        if (shouldBind) {
+            this._$boundTextures[index] = texture;
+            this._$gl.bindTexture(this._$gl.TEXTURE_2D, texture);
+        }
+        if (shouldSmooth) {
+            if (texture) {
+                texture.smoothing = !!smoothing;
+            }
+            const filter = smoothing ? this._$gl.LINEAR : this._$gl.NEAREST;
+            this._$gl.texParameteri(this._$gl.TEXTURE_2D, this._$gl.TEXTURE_MIN_FILTER, filter);
+            this._$gl.texParameteri(this._$gl.TEXTURE_2D, this._$gl.TEXTURE_MAG_FILTER, filter);
+        }
+    }
+}

package/dist/VertexArrayObjectManager.d.ts

@@ -0,0 +1,96 @@
+import type { CapsStyleImpl } from "./interface/CapsStyleImpl";
+import type { JointStyleImpl } from "./interface/JointStyleImpl";
+/**
+ * @class
+ */
+export declare class VertexArrayObjectManager {
+    private _$gl;
+    private readonly _$fillVertexArrayPool;
+    private readonly _$strokeVertexArrayPool;
+    private _$boundVertexArray;
+    private readonly _$fillAttrib_vertex;
+    private readonly _$fillAttrib_bezier;
+    private readonly _$strokeAttrib_vertex;
+    private readonly _$strokeAttrib_option1;
+    private readonly _$strokeAttrib_option2;
+    private readonly _$strokeAttrib_type;
+    private readonly _$vertexBufferData;
+    private readonly _$commonVertexArray;
+    /**
+     * @param {WebGL2RenderingContext} gl
+     * @constructor
+     * @public
+     */
+    constructor(gl: WebGL2RenderingContext);
+    /**
+     * @param  {number} begin
+     * @param  {number} end
+     * @return {WebGLVertexArrayObject}
+     * @method
+     * @private
+     */
+    _$getVertexArray(begin: number, end: number): WebGLVertexArrayObject;
+    /**
+     * @return {WebGLVertexArrayObject}
+     * @method
+     * @private
+     */
+    _$getFillVertexArray(): WebGLVertexArrayObject;
+    /**
+     * @return {WebGLVertexArrayObject}
+     * @method
+     * @private
+     */
+    _$getStrokeVertexArray(): WebGLVertexArrayObject;
+    /**
+     * @param  {array} vertices
+     * @return {WebGLVertexArrayObject}
+     * @method
+     * @public
+     */
+    createFill(vertices: any[]): WebGLVertexArrayObject;
+    /**
+     * @param  {array} vertices
+     * @param  {string} lineCap
+     * @param  {string} lineJoin
+     * @return {WebGLVertexArrayObject}
+     * @method
+     * @public
+     */
+    createStroke(vertices: any[], lineCap: CapsStyleImpl, lineJoin: JointStyleImpl): WebGLVertexArrayObject;
+    /**
+     * @param  {WebGLVertexArrayObject} vertex_array
+     * @return {void}
+     * @method
+     * @public
+     */
+    releaseFill(vertex_array: WebGLVertexArrayObject): void;
+    /**
+     * @param  {WebGLVertexArrayObject} vertex_array
+     * @return {void}
+     * @method
+     * @public
+     */
+    releaseStroke(vertex_array: WebGLVertexArrayObject): void;
+    /**
+     * @param  {WebGLVertexArrayObject} [vertex_array = null]
+     * @return {void}
+     * @method
+     * @public
+     */
+    bind(vertex_array?: WebGLVertexArrayObject | null): void;
+    /**
+     * @return {void}
+     * @method
+     * @public
+     */
+    bindCommonVertexArray(): void;
+    /**
+     * @param  {number} begin
+     * @param  {number} end
+     * @return {void}
+     * @method
+     * @public
+     */
+    bindGradientVertexArray(begin: number, end: number): void;
+}