@next2d/webgl 1.14.20

package/dist/shader/fragment/filter/FragmentShaderSourceConvolutionFilter.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @class
+ */
+export declare class FragmentShaderSourceConvolutionFilter {
+    /**
+     * @param  {number}  mediump_length
+     * @param  {number}  x
+     * @param  {number}  y
+     * @param  {boolean} preserve_alpha
+     * @param  {boolean} clamp
+     * @return {string}
+     * @method
+     * @static
+     */
+    static TEMPLATE(mediump_length: number, x: number, y: number, preserve_alpha: boolean, clamp: boolean): string;
+}

package/dist/shader/fragment/filter/FragmentShaderSourceConvolutionFilter.js

@@ -0,0 +1,80 @@
+import { FragmentShaderLibrary } from "../FragmentShaderLibrary";
+import { $Math } from "@next2d/share";
+/**
+ * @class
+ */
+export class FragmentShaderSourceConvolutionFilter {
+    /**
+     * @param  {number}  mediump_length
+     * @param  {number}  x
+     * @param  {number}  y
+     * @param  {boolean} preserve_alpha
+     * @param  {boolean} clamp
+     * @return {string}
+     * @method
+     * @static
+     */
+    static TEMPLATE(mediump_length, x, y, preserve_alpha, clamp) {
+        const halfX = $Math.floor(x * 0.5);
+        const halfY = $Math.floor(y * 0.5);
+        const size = x * y;
+        let matrixStatement = "";
+        const matrixIndex = clamp ? 1 : 2;
+        for (let idx = 0; idx < size; ++idx) {
+            const index = matrixIndex + $Math.floor(idx / 4);
+            const component = idx % 4;
+            matrixStatement += `
+    result += getWeightedColor(${idx}, u_mediump[${index}][${component}]);
+`;
+        }
+        const preserve_alphaStatement = preserve_alpha
+            ? "result.a = texture(u_texture, v_coord).a;"
+            : "";
+        const clampStatement = clamp
+            ? ""
+            : `
+    vec4 substitute_color = u_mediump[1];
+    color = mix(substitute_color, color, isInside(uv));
+`;
+        return `#version 300 es
+precision mediump float;
+
+uniform sampler2D u_texture;
+uniform vec4 u_mediump[${mediump_length}];
+
+in vec2 v_coord;
+out vec4 o_color;
+
+${FragmentShaderLibrary.FUNCTION_IS_INSIDE()}
+
+vec4 getWeightedColor (in int i, in float weight) {
+    vec2 rcp_size = u_mediump[0].xy;
+
+    int i_div_x = i / ${x};
+    int i_mod_x = i - ${x} * i_div_x;
+    vec2 offset = vec2(i_mod_x - ${halfX}, ${halfY} - i_div_x);
+    vec2 uv = v_coord + offset * rcp_size;
+
+    vec4 color = texture(u_texture, uv);
+    color.rgb /= max(0.0001, color.a);
+    ${clampStatement}
+
+    return color * weight;
+}
+
+void main() {
+    float rcp_divisor = u_mediump[0].z;
+    float bias        = u_mediump[0].w;
+
+    vec4 result = vec4(0.0);
+    ${matrixStatement}
+    result = clamp(result * rcp_divisor + bias, 0.0, 1.0);
+    ${preserve_alphaStatement}
+
+    result.rgb *= result.a;
+    o_color = result;
+}
+
+`;
+    }
+}

package/dist/shader/fragment/filter/FragmentShaderSourceDisplacementMapFilter.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @class
+ */
+export declare class FragmentShaderSourceDisplacementMapFilter {
+    /**
+     * @param  {number} mediump_length
+     * @param  {number} component_x
+     * @param  {number} component_y
+     * @param  {string} mode
+     * @return {string}
+     * @method
+     * @static
+     */
+    static TEMPLATE(mediump_length: number, component_x: number, component_y: number, mode: string): string;
+}

package/dist/shader/fragment/filter/FragmentShaderSourceDisplacementMapFilter.js

@@ -0,0 +1,106 @@
+import { FragmentShaderLibrary } from "../FragmentShaderLibrary";
+/**
+ * @class
+ */
+export class FragmentShaderSourceDisplacementMapFilter {
+    /**
+     * @param  {number} mediump_length
+     * @param  {number} component_x
+     * @param  {number} component_y
+     * @param  {string} mode
+     * @return {string}
+     * @method
+     * @static
+     */
+    static TEMPLATE(mediump_length, component_x, component_y, mode) {
+        let cx;
+        let cy;
+        let modeStatement;
+        switch (component_x) {
+            case 1: // BitmapDataChannel.RED
+                cx = "map_color.r";
+                break;
+            case 2: // BitmapDataChannel.GREEN
+                cx = "map_color.g";
+                break;
+            case 4: // BitmapDataChannel.BLUE
+                cx = "map_color.b";
+                break;
+            case 8: // BitmapDataChannel.ALPHA
+                cx = "map_color.a";
+                break;
+            default:
+                cx = "0.5";
+                break;
+        }
+        switch (component_y) {
+            case 1: // BitmapDataChannel.RED
+                cy = "map_color.r";
+                break;
+            case 2: // BitmapDataChannel.GREEN
+                cy = "map_color.g";
+                break;
+            case 4: // BitmapDataChannel.BLUE
+                cy = "map_color.b";
+                break;
+            case 8: // BitmapDataChannel.ALPHA
+                cy = "map_color.a";
+                break;
+            default:
+                cy = "0.5";
+                break;
+        }
+        switch (mode) {
+            case "clamp":
+                modeStatement = `
+    vec4 source_color = texture(u_textures[0], uv);
+`;
+                break;
+            case "ignore":
+                // 置き換え後の座標が範囲外なら、置き換え前の座標をとる（x軸とy軸を別々に判定する）
+                modeStatement = `
+    vec4 source_color =texture(u_textures[0], mix(v_coord, uv, step(abs(uv - vec2(0.5)), vec2(0.5))));
+`;
+                break;
+            case "color":
+                modeStatement = `
+    vec4 substitute_color = u_mediump[2];
+    vec4 source_color = mix(substitute_color, texture(u_textures[0], uv), isInside(uv));
+`;
+                break;
+            case "wrap":
+            default:
+                modeStatement = `
+    vec4 source_color = texture(u_textures[0], fract(uv));
+`;
+                break;
+        }
+        return `#version 300 es
+precision mediump float;
+
+uniform sampler2D u_textures[2];
+uniform vec4 u_mediump[${mediump_length}];
+
+in vec2 v_coord;
+out vec4 o_color;
+
+${FragmentShaderLibrary.FUNCTION_IS_INSIDE()}
+
+void main() {
+    vec2 uv_to_st_scale  = u_mediump[0].xy;
+    vec2 uv_to_st_offset = u_mediump[0].zw;
+    vec2 scale           = u_mediump[1].xy;
+
+    vec2 st = v_coord * uv_to_st_scale - uv_to_st_offset;
+    vec4 map_color = texture(u_textures[1], st);
+
+    vec2 offset = vec2(${cx}, ${cy}) - 0.5;
+    vec2 uv = v_coord + offset * scale;
+    ${modeStatement}
+
+    o_color = mix(texture(u_textures[0], v_coord), source_color, isInside(st));
+}
+
+`;
+    }
+}

package/dist/shader/fragment/filter/FragmentShaderSourceFilter.d.ts

@@ -0,0 +1,112 @@
+/**
+ * @class
+ */
+export declare class FragmentShaderSourceFilter {
+    /**
+     * @param  {number}  textures_length
+     * @param  {number}  mediump_length
+     * @param  {boolean} transforms_base
+     * @param  {boolean} transforms_blur
+     * @param  {boolean} isGlow
+     * @param  {string}  type
+     * @param  {boolean} knockout
+     * @param  {boolean} applies_strength
+     * @param  {boolean} is_gradient
+     * @return {string}
+     * @method
+     * @static
+     */
+    static TEMPLATE(textures_length: number, mediump_length: number, transforms_base: boolean, transforms_blur: boolean, isGlow: boolean, type: string, knockout: boolean, applies_strength: boolean, is_gradient: boolean): string;
+    /**
+     * @param  {number} index
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BASE_TEXTURE_TRANSFORM(index: number): string;
+    /**
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BLUR_TEXTURE(): string;
+    /**
+     * @param  {number} index
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BLUR_TEXTURE_TRANSFORM(index: number): string;
+    /**
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_GLOW(is_inner: boolean, transforms_base: boolean, applies_strength: boolean, is_gradient: boolean, color_index: number, strength_offset: number): string;
+    /**
+     * @param  {number} offset
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_GLOW_STRENGTH(offset: number): string;
+    /**
+     * @param  {number} index
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_GLOW_SOLID_COLOR(index: number): string;
+    /**
+     * @param  {boolean} transforms_base
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_GLOW_GRADIENT_COLOR(transforms_base: boolean): string;
+    /**
+     * @param  {string}  transforms_base
+     * @param  {boolean} transforms_blur
+     * @param  {boolean} applies_strength
+     * @param  {boolean} is_gradient
+     * @param  {number}  color_index
+     * @param  {number}  strength_offset
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BEVEL(transforms_base: boolean, transforms_blur: boolean, applies_strength: boolean, is_gradient: boolean, color_index: number, strength_offset: number): string;
+    /**
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BLUR_TEXTURE_2(): string;
+    /**
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BLUR_TEXTURE_TRANSFORM_2(): string;
+    /**
+     * @param  {boolean} offset
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BEVEL_STRENGTH(offset: number): string;
+    /**
+     * @param  {number} index
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BEVEL_SOLID_COLOR(index: number): string;
+    /**
+     * @param  {boolean} transforms_base
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BEVEL_GRADIENT_COLOR(transforms_base: boolean): string;
+}

package/dist/shader/fragment/filter/FragmentShaderSourceFilter.js

@@ -0,0 +1,275 @@
+import { $Math } from "@next2d/share";
+import { FragmentShaderLibrary } from "../FragmentShaderLibrary";
+/**
+ * @class
+ */
+export class FragmentShaderSourceFilter {
+    /**
+     * @param  {number}  textures_length
+     * @param  {number}  mediump_length
+     * @param  {boolean} transforms_base
+     * @param  {boolean} transforms_blur
+     * @param  {boolean} isGlow
+     * @param  {string}  type
+     * @param  {boolean} knockout
+     * @param  {boolean} applies_strength
+     * @param  {boolean} is_gradient
+     * @return {string}
+     * @method
+     * @static
+     */
+    static TEMPLATE(textures_length, mediump_length, transforms_base, transforms_blur, isGlow, type, knockout, applies_strength, is_gradient) {
+        let index = 0;
+        const baseStatement = transforms_base
+            ? this.STATEMENT_BASE_TEXTURE_TRANSFORM(index++)
+            : "";
+        const blurStatement = transforms_blur
+            ? this.STATEMENT_BLUR_TEXTURE_TRANSFORM(index++)
+            : this.STATEMENT_BLUR_TEXTURE();
+        const isInner = type === "inner";
+        const colorIndex = index;
+        let strengthOffset = index * 4;
+        let colorStatement;
+        if (is_gradient) {
+            colorStatement = isGlow
+                ? this.STATEMENT_GLOW(false, transforms_base, applies_strength, is_gradient, colorIndex, strengthOffset)
+                : this.STATEMENT_BEVEL(transforms_base, transforms_blur, applies_strength, is_gradient, colorIndex, strengthOffset);
+        }
+        else if (isGlow) {
+            strengthOffset += 4;
+            colorStatement = this.STATEMENT_GLOW(isInner, transforms_base, applies_strength, is_gradient, colorIndex, strengthOffset);
+        }
+        else {
+            strengthOffset += 8;
+            colorStatement = this.STATEMENT_BEVEL(transforms_base, transforms_blur, applies_strength, is_gradient, colorIndex, strengthOffset);
+        }
+        let modeExpression;
+        switch (type) {
+            case "outer":
+                modeExpression = knockout
+                    ? "blur - blur * base.a"
+                    : "base + blur - blur * base.a";
+                break;
+            case "full":
+                modeExpression = knockout
+                    ? "blur"
+                    : "base - base * blur.a + blur";
+                break;
+            case "inner":
+            default:
+                modeExpression = "blur";
+                break;
+        }
+        return `#version 300 es
+precision mediump float;
+
+uniform sampler2D u_textures[${textures_length}];
+uniform vec4 u_mediump[${mediump_length}];
+
+in vec2 v_coord;
+out vec4 o_color;
+
+${FragmentShaderLibrary.FUNCTION_IS_INSIDE()}
+
+void main() {
+    ${baseStatement}
+    ${blurStatement}
+    ${colorStatement}
+    o_color = ${modeExpression};
+}
+
+`;
+    }
+    /**
+     * @param  {number} index
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BASE_TEXTURE_TRANSFORM(index) {
+        return `
+    vec2 base_scale  = u_mediump[${index}].xy;
+    vec2 base_offset = u_mediump[${index}].zw;
+
+    vec2 uv = v_coord * base_scale - base_offset;
+    vec4 base = mix(vec4(0.0), texture(u_textures[1], uv), isInside(uv));
+`;
+    }
+    /**
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BLUR_TEXTURE() {
+        return `
+    vec4 blur = texture(u_textures[0], v_coord);
+`;
+    }
+    /**
+     * @param  {number} index
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BLUR_TEXTURE_TRANSFORM(index) {
+        return `
+    vec2 blur_scale  = u_mediump[${index}].xy;
+    vec2 blur_offset = u_mediump[${index}].zw;
+
+    vec2 st = v_coord * blur_scale - blur_offset;
+    vec4 blur = mix(vec4(0.0), texture(u_textures[0], st), isInside(st));
+`;
+    }
+    /**
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_GLOW(is_inner, transforms_base, applies_strength, is_gradient, color_index, strength_offset) {
+        const innerStatement = is_inner
+            ? "blur.a = 1.0 - blur.a;"
+            : "";
+        const strengthStatement = applies_strength
+            ? this.STATEMENT_GLOW_STRENGTH(strength_offset)
+            : "";
+        const colorStatement = is_gradient
+            ? this.STATEMENT_GLOW_GRADIENT_COLOR(transforms_base)
+            : this.STATEMENT_GLOW_SOLID_COLOR(color_index);
+        return `
+    ${innerStatement}
+    ${strengthStatement}
+    ${colorStatement}
+`;
+    }
+    /**
+     * @param  {number} offset
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_GLOW_STRENGTH(offset) {
+        const index = $Math.floor(offset / 4);
+        const component = offset % 4;
+        return `
+    float strength = u_mediump[${index}][${component}];
+    blur.a = clamp(blur.a * strength, 0.0, 1.0);
+`;
+    }
+    /**
+     * @param  {number} index
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_GLOW_SOLID_COLOR(index) {
+        return `
+    vec4 color = u_mediump[${index}];
+    blur = color * blur.a;
+`;
+    }
+    /**
+     * @param  {boolean} transforms_base
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_GLOW_GRADIENT_COLOR(transforms_base) {
+        return `
+    blur = texture(u_textures[${transforms_base ? 2 : 1}], vec2(blur.a, 0.5));
+`;
+    }
+    /**
+     * @param  {string}  transforms_base
+     * @param  {boolean} transforms_blur
+     * @param  {boolean} applies_strength
+     * @param  {boolean} is_gradient
+     * @param  {number}  color_index
+     * @param  {number}  strength_offset
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BEVEL(transforms_base, transforms_blur, applies_strength, is_gradient, color_index, strength_offset) {
+        const blur2Statement = transforms_blur
+            ? this.STATEMENT_BLUR_TEXTURE_TRANSFORM_2()
+            : this.STATEMENT_BLUR_TEXTURE_2();
+        const strengthStatement = applies_strength
+            ? this.STATEMENT_BEVEL_STRENGTH(strength_offset)
+            : "";
+        const colorStatement = is_gradient
+            ? this.STATEMENT_BEVEL_GRADIENT_COLOR(transforms_base)
+            : this.STATEMENT_BEVEL_SOLID_COLOR(color_index);
+        return `
+    ${blur2Statement}
+    float highlight_alpha = blur.a - blur2.a;
+    float shadow_alpha    = blur2.a - blur.a;
+    ${strengthStatement}
+    highlight_alpha = clamp(highlight_alpha, 0.0, 1.0);
+    shadow_alpha    = clamp(shadow_alpha, 0.0, 1.0);
+    ${colorStatement}
+`;
+    }
+    /**
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BLUR_TEXTURE_2() {
+        return `
+    vec4 blur2 = texture(u_textures[0], 1.0 - v_coord);
+`;
+    }
+    /**
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BLUR_TEXTURE_TRANSFORM_2() {
+        return `
+    vec2 pq = (1.0 - v_coord) * blur_scale - blur_offset;
+    vec4 blur2 = mix(vec4(0.0), texture(u_textures[0], pq), isInside(pq));
+`;
+    }
+    /**
+     * @param  {boolean} offset
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BEVEL_STRENGTH(offset) {
+        const index = $Math.floor(offset / 4);
+        const component = offset % 4;
+        return `
+    float strength = u_mediump[${index}][${component}];
+    highlight_alpha *= strength;
+    shadow_alpha    *= strength;
+`;
+    }
+    /**
+     * @param  {number} index
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BEVEL_SOLID_COLOR(index) {
+        return `
+    vec4 highlight_color = u_mediump[${index}];
+    vec4 shadow_color    = u_mediump[${index + 1}];
+    blur = highlight_color * highlight_alpha + shadow_color * shadow_alpha;
+`;
+    }
+    /**
+     * @param  {boolean} transforms_base
+     * @return {string}
+     * @method
+     * @static
+     */
+    static STATEMENT_BEVEL_GRADIENT_COLOR(transforms_base) {
+        return `
+    blur = texture(u_textures[${transforms_base ? 2 : 1}], vec2(
+        0.5019607843137255 - 0.5019607843137255 * shadow_alpha + 0.4980392156862745 * highlight_alpha,
+        0.5
+    ));
+`;
+    }
+}

package/dist/shader/variants/BlendShaderVariantCollection.d.ts

@@ -0,0 +1,99 @@
+import { CanvasToWebGLShader } from "../CanvasToWebGLShader";
+import type { CanvasToWebGLContext } from "../../CanvasToWebGLContext";
+import type { WebGLShaderUniform } from "../WebGLShaderUniform";
+/**
+ * @class
+ */
+export declare class BlendShaderVariantCollection {
+    private readonly _$context;
+    private readonly _$gl;
+    private readonly _$collection;
+    /**
+     * @param {CanvasToWebGLContext}  context
+     * @param {WebGL2RenderingContext} gl
+     * @constructor
+     * @public
+     */
+    constructor(context: CanvasToWebGLContext, gl: WebGL2RenderingContext);
+    /**
+     * @param  {boolean} with_color_transform
+     * @return {CanvasToWebGLShader}
+     * @method
+     * @public
+     */
+    getNormalBlendShader(with_color_transform: boolean): CanvasToWebGLShader;
+    /**
+     * @return {CanvasToWebGLShader}
+     * @method
+     * @public
+     */
+    getClipShader(): CanvasToWebGLShader;
+    /**
+     * @param  {string}  operation
+     * @param  {boolean} with_color_transform
+     * @return {CanvasToWebGLShader}
+     * @method
+     * @public
+     */
+    getBlendShader(operation: string, with_color_transform: boolean): CanvasToWebGLShader;
+    /**
+     * @param  {WebGLShaderUniform} uniform
+     * @param  {number}  x
+     * @param  {number}  y
+     * @param  {number}  w
+     * @param  {number}  h
+     * @param  {Float32Array} matrix
+     * @param  {number}  render_width
+     * @param  {number}  render_height
+     * @param  {boolean} with_color_transform
+     * @param  {number}  ct0
+     * @param  {number}  ct1
+     * @param  {number}  ct2
+     * @param  {number}  ct3
+     * @param  {number}  ct4
+     * @param  {number}  ct5
+     * @param  {number}  ct6
+     * @param  {number}  ct7
+     * @return {void}
+     * @method
+     * @public
+     */
+    setNormalBlendUniform(uniform: WebGLShaderUniform, x: number, y: number, w: number, h: number, matrix: Float32Array, render_width: number, render_height: number, with_color_transform: boolean, ct0: number, ct1: number, ct2: number, ct3: number, ct4: number, ct5: number, ct6: number, ct7: number): void;
+    /**
+     * @param  {WebGLShaderUniform} uniform
+     * @param  {number} x
+     * @param  {number} y
+     * @param  {number} w
+     * @param  {number} h
+     * @param  {Float32Array} inverse_matrix
+     * @param  {number} render_width
+     * @param  {number} render_height
+     * @return {void}
+     * @method
+     * @public
+     */
+    setClipUniform(uniform: WebGLShaderUniform, x: number, y: number, w: number, h: number, inverse_matrix: Float32Array, render_width: number, render_height: number): void;
+    /**
+     * @param  {WebGLShaderUniform} uniform
+     * @param  {number}  x
+     * @param  {number}  y
+     * @param  {number}  w
+     * @param  {number}  h
+     * @param  {Float32Array} matrix
+     * @param  {number}  render_width
+     * @param  {number}  render_height
+     * @param  {boolean} with_color_transform
+     * @param  {number}  ct0
+     * @param  {number}  ct1
+     * @param  {number}  ct2
+     * @param  {number}  ct3
+     * @param  {number}  ct4
+     * @param  {number}  ct5
+     * @param  {number}  ct6
+     * @param  {number}  ct7
+     * @return {void}
+     * @method
+     * @public
+     */
+    setBlendUniform(uniform: WebGLShaderUniform, x: number, y: number, w: number, h: number, matrix: Float32Array, render_width: number, render_height: number, with_color_transform: boolean, ct0: number, ct1: number, ct2: number, ct3: number, ct4: number, ct5: number, ct6: number, ct7: number): void;
+}