bg2e-js 2.1.1 → 2.2.0

package/src/shaders/SkySphereShader.ts

@@ -0,0 +1,102 @@
+import Shader from "../render/Shader";
+import ShaderProgram from "../render/webgl/ShaderProgram";
+import { TextureTargetName } from "../base/Texture";
+import PolyListRenderer from '../render/PolyListRenderer';
+import MaterialRenderer from '../render/MaterialRenderer';
+import Mat4 from "../math/Mat4";
+import Renderer from "../render/Renderer";
+import WebGLRenderer from "../render/webgl/Renderer";
+import WebGLTextureRenderer from "../render/webgl/TextureRenderer";
+import WebGLPolyListRenderer from "../render/webgl/PolyListRenderer";
+
+const g_code = {
+    webgl: {
+        vertex: `precision mediump float;
+        
+        attribute vec3 vertPosition;
+        attribute vec2 t0Position;
+        
+        varying vec2 fragT0Pos;
+        
+        uniform mat4 mView;
+        uniform mat4 mProj;
+        
+        void main() {
+            fragT0Pos = t0Position;
+            gl_Position = mProj * mView * vec4(vertPosition, 1.0);
+        }`,
+
+        fragment: `precision mediump float;
+        
+        varying vec2 fragT0Pos;
+        
+        uniform sampler2D uTexture;
+        
+        void main() {
+            vec4 texColor = texture2D(uTexture, fragT0Pos);
+            gl_FragColor = vec4(texColor.rgb, 1.0);
+        }`
+    }
+};
+
+export default class SkySphereShader extends Shader {
+    protected _program: ShaderProgram | null = null;
+
+    constructor(renderer: Renderer) {
+        super(renderer);
+
+        if (renderer.typeId !== "WebGL") {
+            throw Error("SkySphereShader is only compatible with WebGL renderer");
+        }
+    }
+
+    async load() {
+        const { gl } = (this.renderer as WebGLRenderer);
+        this._program = new ShaderProgram(gl, "SkySphereShader");
+        this._program.attachVertexSource(g_code.webgl.vertex);
+        this._program.attachFragmentSource(g_code.webgl.fragment);
+        this._program.link();
+    }
+
+    setup(
+        plistRenderer: PolyListRenderer,
+        materialRenderer: MaterialRenderer,
+        modelMatrix: Mat4,
+        viewMatrix: Mat4,
+        projectionMatrix: Mat4
+    ) {
+        if (!this._program) {
+            throw new Error("SkySphereShader: shader program is not loaded");
+        }
+
+
+        const { material } = materialRenderer;
+        if (!material.albedoTexture) {
+            throw new Error("SkySphereShader: material does not have an albedo texture");
+        }
+
+        const rend = this.renderer as WebGLRenderer;
+        const { gl } = rend;
+        rend.state.shaderProgram = this._program;
+
+        this._program.uniformMatrix4fv('mView', false, viewMatrix);
+        this._program.uniformMatrix4fv('mProj', false, projectionMatrix);
+
+        gl.activeTexture(gl.TEXTURE0);
+        this._program.uniform1i('uTexture', 0);
+
+        const webglTexture = (materialRenderer.getTextureRenderer('albedoTexture') as WebGLTextureRenderer)?.getApiObject();
+        const target = TextureTargetName[material.albedoTexture.target];
+        gl.bindTexture((gl as any)[target], webglTexture);
+        
+        this._program.positionAttribPointer((plistRenderer as WebGLPolyListRenderer).positionAttribParams("vertPosition"));
+        this._program.texCoordAttribPointer((plistRenderer as WebGLPolyListRenderer).texCoord0AttribParams("t0Position"));
+    }
+
+    destroy() {
+        if (this._program) {
+            ShaderProgram.Delete(this._program);
+            this._program = null;
+        }
+    }
+}

package/src/shaders/SpecularMapCubeShader.ts

@@ -0,0 +1,165 @@
+import Shader from "../render/Shader";
+import ShaderProgram from "../render/webgl/ShaderProgram";
+import PolyListRenderer from '../render/PolyListRenderer';
+import MaterialRenderer from '../render/MaterialRenderer';
+import Mat4 from "../math/Mat4";
+import Vec from "../math/Vec";
+import WebGLRenderer from "../render/webgl/Renderer";
+import Renderer from "../render/Renderer";
+import WebGLTextureRenderer from "../render/webgl/TextureRenderer";
+import WebGLPolyListRenderer from "../render/webgl/PolyListRenderer";
+
+const g_code = {
+    webgl: {
+        vertex: `precision mediump float;
+        
+        attribute vec3 vertPosition;
+        
+        uniform mat4 uMVP;
+        
+        varying vec3 fragNormal;
+        
+        void main() {
+            gl_Position = uMVP * vec4(vertPosition, 1.0);
+            fragNormal = normalize(vertPosition);
+        }`,
+
+        fragment: (sampleCount: number, roughness: number) => `precision mediump float;
+        
+        varying vec3 fragNormal;
+        
+        uniform samplerCube uCubemap;
+        
+        float vanDerCorpus(int n, int base) {
+            float invBase = 1.0 / float(base);
+            float denom   = 1.0;
+            float result  = 0.0;
+
+            for(int i = 0; i < 16; ++i)
+            {
+                if(n > 0)
+                {
+                    denom   = mod(float(n), 2.0);
+                    result += denom * invBase;
+                    invBase = invBase / 2.0;
+                    n       = int(float(n) / 2.0);
+                }
+            }
+
+            return result;
+        }
+
+        vec2 hammersleyNoBitOps(int i, int N) {
+            return vec2(float(i)/float(N), vanDerCorpus(i, 2));
+        }
+
+        vec3 importanceSampleGGX(vec2 Xi, vec3 N) {
+            // compute roughness^4 outside the gpu
+            float a = ${ roughness*roughness*roughness*roughness };
+            
+            float phi = ${ 2.0 * Math.PI } * Xi.x;
+            float cosTheta = sqrt((1.0 - Xi.y) / (1.0 + (a - 1.0) * Xi.y));
+            float sinTheta = sqrt(1.0 - cosTheta*cosTheta);
+            
+            // from spherical coordinates to cartesian coordinates
+            vec3 H;
+            H.x = sin(phi) * sinTheta;
+            H.y = cos(phi) * sinTheta;
+            H.z = cosTheta;
+            
+            // from tangent-space vector to world-space sample vector
+            vec3 up        = abs(N.z) < 0.999 ? vec3(0.0, 0.0, 1.0) : vec3(1.0, 0.0, 0.0);
+            vec3 tangent   = normalize(cross(up, N));
+            vec3 bitangent = cross(N, tangent);
+            
+            vec3 sampleVec = tangent * H.x + bitangent * H.y + N * H.z;
+            return normalize(sampleVec);
+        } 
+
+        void main() {
+            vec3 N = normalize(fragNormal);
+            vec3 R = N;
+            vec3 V = R;
+
+            float totalWeight = 0.0;
+            vec3 prefilteredColor = vec3(0.0);
+            for (int i = 0; i < ${ sampleCount }; ++i)
+            {
+                vec2 Xi = hammersleyNoBitOps(i, ${ sampleCount });
+                vec3 H = importanceSampleGGX(Xi, N);
+                vec3 L = normalize(2.0 * dot(V, H) * H - V);
+
+                float NdotL = max(dot(N,L), 0.0);
+                if (NdotL > 0.0)
+                {
+                    prefilteredColor += textureCube(uCubemap, L).rgb * NdotL;
+                    totalWeight += NdotL;
+                }
+            }
+            prefilteredColor = prefilteredColor / totalWeight;
+
+            gl_FragColor = vec4(prefilteredColor, 1.0);
+        }`
+    }
+};
+
+export default class SpecularMapCubeShader extends Shader {
+    protected _roughness: number = 0.4;
+    protected _program: ShaderProgram | null = null;
+
+    constructor(renderer: Renderer) {
+        super(renderer);
+
+        if (renderer.typeId !== "WebGL") {
+            throw Error("SpecularMapCubeShader is only compatible with WebGL renderer");
+        }
+    }
+
+    get roughness() { return this._roughness; }
+
+    async load() {
+        const { gl } = (this.renderer as WebGLRenderer);
+
+        // This matches with the getPrefilteredColor function in pbr.glsl
+        this._roughness = 0.4;
+
+        this._program = new ShaderProgram(gl, "SpecularMapCubeShader");
+        this._program.attachVertexSource(g_code.webgl.vertex);
+        this._program.attachFragmentSource(g_code.webgl.fragment(128, this._roughness));
+        this._program.link();
+    }
+
+    setup(
+        plistRenderer: PolyListRenderer,
+        materialRenderer: MaterialRenderer,
+        modelMatrix: Mat4,
+        viewMatrix: Mat4,
+        projectionMatrix: Mat4
+    ) {
+        if (!this._program) {
+            throw new Error("SpecularMapCubeShader: Shader program is not loaded.");
+        }
+
+        const { material } = materialRenderer;
+        const rend = this.renderer as WebGLRenderer;
+        const { gl } = rend;
+        rend.state.shaderProgram = this._program;
+
+        const mvp = Mat4.Mult(projectionMatrix, viewMatrix);
+        this._program.uniformMatrix4fv('uMVP', false, mvp);
+
+        gl.activeTexture(gl.TEXTURE0);
+        this._program.uniform1i('uCubemap', 0);
+        const webglTexture = (materialRenderer.getTextureRenderer('albedoTexture') as WebGLTextureRenderer)?.getApiObject();
+        gl.bindTexture(gl.TEXTURE_CUBE_MAP, webglTexture);
+
+        this._program.positionAttribPointer((plistRenderer as WebGLPolyListRenderer).positionAttribParams('vertPosition'));
+    }
+
+    destroy() {
+        if (this._program) {
+            ShaderProgram.Delete(this._program);
+            this._program = null;
+        }
+    }
+}

package/src/shaders/TextureMergerShader.ts

@@ -0,0 +1,171 @@
+
+import Texture, { TextureChannel } from '../base/Texture';
+import PolyListRenderer from '../render/PolyListRenderer';
+import MaterialRenderer from '../render/MaterialRenderer';
+import Renderer from '../render/Renderer';
+import WebGLRenderer from '../render/webgl/Renderer';
+import Shader from '../render/Shader';
+import ShaderProgram from '../render/webgl/ShaderProgram';
+import Mat4 from '../math/Mat4';
+import WebGLTextureRenderer from '../render/webgl/TextureRenderer';
+import WebGLPolyListRenderer from '../render/webgl/PolyListRenderer';
+
+const g_code = {
+    webgl: {
+        vertex: `precision mediump float;
+
+        attribute vec3 position;
+        attribute vec2 texCoord;
+        
+        varying vec2 fragTexCoord;
+
+        void main() {
+            fragTexCoord = texCoord;
+            gl_Position = vec4(position, 1.0);
+        }`,
+
+        fragment: `precision mediump float;
+        
+        varying vec2 fragTexCoord;
+        
+        uniform sampler2D uTextureR;
+        uniform sampler2D uTextureG;
+        uniform sampler2D uTextureB;
+        uniform sampler2D uTextureA;
+
+        uniform int uRChannel;
+        uniform int uGChannel;
+        uniform int uBChannel;
+        uniform int uAChannel;
+        
+        float getChannel(vec4 color, int channel) {
+            if (channel == 1) {
+                return color.r;
+            }
+            else if (channel == 2) {
+                return color.g;
+            }
+            else if (channel == 3) {
+                return color.b;
+            }
+            else {
+                return color.a;
+            }
+        }
+
+        void main() {
+            vec4 result = vec4(
+                getChannel(texture2D(uTextureR, fragTexCoord), uRChannel),
+                getChannel(texture2D(uTextureG, fragTexCoord), uGChannel),
+                getChannel(texture2D(uTextureB, fragTexCoord), uBChannel),
+                getChannel(texture2D(uTextureA, fragTexCoord), uAChannel)
+            );
+            
+            gl_FragColor = result;
+        }`
+    }
+}
+
+const g_renderers: { [key: string]: TextureMergerShader } = {};
+export default class TextureMergerShader extends Shader {
+    protected _textures: { [key in TextureChannel]?: Texture | null };
+    protected _textureChannels: { [key in TextureChannel]?: TextureChannel };
+    protected _program!: ShaderProgram;
+
+    static GetUnique(renderer: Renderer) {
+        if (!g_renderers[renderer.uniqueId]) {
+            g_renderers[renderer.uniqueId] = new TextureMergerShader(renderer);
+            g_renderers[renderer.uniqueId].load();
+        }
+        return g_renderers[renderer.uniqueId];
+    }
+
+    constructor(renderer: Renderer) {
+        super(renderer);
+
+        if (renderer.typeId !== "WebGL") {
+            throw Error("TextureMergerShader is only compatible with WebGL renderer");
+        }
+
+        this._textures = {};
+        this._textureChannels = {};
+    }
+
+    async load() {
+        const { gl } = (this.renderer as WebGLRenderer);
+
+        this._program = new ShaderProgram(gl, "DefaultTextureMergerShader");
+        this._program.attachVertexSource(g_code.webgl.vertex);
+        this._program.attachFragmentSource(g_code.webgl.fragment);
+        this._program.link();
+    }
+
+    setTexture(
+        tex: Texture,
+        channel: TextureChannel,
+        dstChannel = TextureChannel.R
+    ) {
+        if (channel<TextureChannel.R || channel>TextureChannel.A) {
+            throw new Error(`TextureMergerShader: invalid texture channel set ${ channel }`);
+        }
+        this._textures[channel] = tex;
+        this._textureChannels[channel] = dstChannel;
+    }
+
+    get isComplete() {
+        return  this._textures[TextureChannel.R] &&
+                this._textures[TextureChannel.G] &&
+                this._textures[TextureChannel.B] &&
+                this._textures[TextureChannel.A] && true;
+    }
+
+    setup(
+        plistRenderer: PolyListRenderer,
+        materialRenderer: MaterialRenderer,
+        modelMatrix: Mat4,
+        viewMatrix: Mat4,
+        projectionMatrix: Mat4
+    ) {
+        if (!this.isComplete) {
+            throw new Error("TextureMergerShader: the texture shader is not complete. Check that the textures are set for all channels");
+        }
+
+        if (!this._program) {
+            throw new Error("TextureMergerShader: shader program is not loaded");
+        }
+        
+        const rend = this.renderer as WebGLRenderer;
+
+        rend.state.shaderProgram = this._program;
+
+        if (!this._textures[TextureChannel.R]) {
+            throw new Error("TextureMergerShader: R texture is not set");
+        }
+        if (!this._textures[TextureChannel.G]) {
+            throw new Error("TextureMergerShader: G texture is not set");
+        }
+        if (!this._textures[TextureChannel.B]) {
+            throw new Error("TextureMergerShader: B texture is not set");
+        }
+        if (!this._textures[TextureChannel.A]) {
+            throw new Error("TextureMergerShader: A texture is not set");
+        }
+        const r = this.renderer.factory.texture(this._textures[TextureChannel.R]) as WebGLTextureRenderer;
+        const g = this.renderer.factory.texture(this._textures[TextureChannel.G]) as WebGLTextureRenderer;
+        const b = this.renderer.factory.texture(this._textures[TextureChannel.B]) as WebGLTextureRenderer;
+        const a = this.renderer.factory.texture(this._textures[TextureChannel.A]) as WebGLTextureRenderer;
+
+        this._program.bindTexture("uTextureR", r, 0);
+        this._program.bindTexture("uTextureG", g, 1);
+        this._program.bindTexture("uTextureB", b, 2);
+        this._program.bindTexture("uTextureA", a, 3);
+
+        this._program.uniform1i("uRChannel", this._textureChannels[TextureChannel.R] || 0);
+        this._program.uniform1i("uGChannel", this._textureChannels[TextureChannel.G] || 1);
+        this._program.uniform1i("uBChannel", this._textureChannels[TextureChannel.B] || 2);
+        this._program.uniform1i("uAChannel", this._textureChannels[TextureChannel.A] || 3);
+
+        this._program.positionAttribPointer((plistRenderer as WebGLPolyListRenderer).positionAttribParams("position"));
+        this._program.texCoordAttribPointer((plistRenderer as WebGLPolyListRenderer).texCoord0AttribParams("texCoord"));
+    }
+}

package/src/shaders/index.ts

@@ -0,0 +1,37 @@
+import BasicDiffuseColorShader from "./BasicDiffuseColorShader";
+import BasicPBRLightShader from "./BasicPBRLightShader";
+import DebugRenderShader from "./DebugRenderShader";
+import DepthRenderShader from "./DepthRenderShader";
+import IrradianceMapCubeShader from "./IrradianceMapCubeShader";
+import PBRLightIBLShader from "./PBRLightIBLShader";
+import PickSelectionShader from "./PickSelectionShader";
+import PresentDebugFramebufferShader from "./PresentDebugFramebufferShader";
+import PresentTextureShader from "./PresentTextureShader";
+import SelectionHighlightShader from "./SelectionHighlightShader";
+import ShaderFunction from "./ShaderFunction";
+import SkyCubeShader from "./SkyCubeShader";
+import SkySphereShader from "./SkySphereShader";
+import SpecularMapCubeShader from "./SpecularMapCubeShader";
+import TextureMergerShader from "./TextureMergerShader";
+import * as webgl_shader_lib from "./webgl_shader_lib";
+
+export default {
+    BasicDiffuseColorShader,
+    BasicPBRLightShader,
+    DebugRenderShader,
+    DepthRenderShader,
+    IrradianceMapCubeShader,
+    PBRLightIBLShader,
+    PickSelectionShader,
+    PresentDebugFramebufferShader,
+    PresentTextureShader,
+    SelectionHighlightShader,
+    ShaderFunction,
+    SkyCubeShader,
+    SkySphereShader,
+    SpecularMapCubeShader,
+    TextureMergerShader,
+    shaderLib: {
+        webgl: webgl_shader_lib
+    }
+}

package/src/shaders/webgl/color_correction.glsl

@@ -0,0 +1,47 @@
+#ifndef COLOR_CORRECTION_GLSL
+#define COLOR_CORRECTION_GLSL
+
+// Convert lineal color to SRGB for shader output
+vec4 lineal2SRGB(vec4 color, float gamma)
+{
+    color = color / (color + vec4(1.0));
+    return vec4(pow(color.rgb, vec3(1.0 / gamma)), color.a);
+}
+
+vec3 lineal2SRGB(vec3 color, float gamma)
+{
+    color = color / (color + vec3(1.0));
+    return pow(color.rgb, vec3(1.0 / gamma));
+}
+
+// Convert SRGB textures to lineal color
+vec4 SRGB2Lineal(vec4 color, float gamma)
+{
+    return vec4(pow(color.rgb, vec3(gamma)), color.a);
+}
+
+vec3 SRGB2lLineal(vec3 color, float gamma)
+{
+    return pow(color, vec3(gamma));
+}
+
+vec4 brightnessContrast(vec4 color, float brightness, float contrast)
+{
+    mat4 brightnessMat = mat4(
+        1.0, 0.0, 0.0, 0.0,
+        0.0, 1.0, 0.0, 0.0,
+        0.0, 0.0, 1.0, 0.0,
+        brightness, brightness, brightness, 1.0
+    );
+    float t = (1.0 - contrast) / 2.0;
+    mat4 contrastMat = mat4(
+        contrast, 0.0, 0.0, 0.0,
+        0.0, contrast, 0.0, 0.0,
+        0.0, 0.0, contrast, 0.0,
+        t, t, t, 1.0
+    );
+    return contrastMat * brightnessMat * color;
+}
+
+#endif // COLOR_CORRECTION_GLSL
+

package/src/shaders/webgl/constants.glsl

@@ -0,0 +1,6 @@
+
+#define PI 3.14159265359
+#define LIGHT_TYPE_POINT 5
+#define LIGHT_TYPE_DIRECTIONAL 4
+#define LIGHT_TYPE_SPOT 1
+#define LIGHT_TYPE_DISABLED 10

package/src/shaders/webgl/index.ts

@@ -0,0 +1,70 @@
+import colorCorrection from "./color_correction.glsl?raw";
+import constants from "./constants.glsl?raw";
+import normalMap from "./normal_map.glsl?raw";
+import pbr from "./pbr.glsl?raw";
+import uniforms from "./uniforms.glsl?raw";
+
+import ShaderFunction, {
+    generateShaderLibrary,
+    extractConstants,
+    processConstants,
+    ConstantDefinition,
+    DependencyItem
+} from "../ShaderFunction";
+
+let g_constants: ConstantDefinition[] | null = null;
+
+export function getConstants() {
+    if (!g_constants) {
+        // Extract constants all the GLSL files
+        g_constants = [
+            ...extractConstants(constants),
+            ...extractConstants(colorCorrection),
+            ...extractConstants(normalMap),
+            ...extractConstants(pbr),
+            ...extractConstants(uniforms)
+        ];
+    }
+    return g_constants;
+}
+
+let g_colorCorrectionFunctions: DependencyItem[] | null = null;
+export function getColorCorrectionFunctions() {
+    if (!g_colorCorrectionFunctions) {
+        g_colorCorrectionFunctions = generateShaderLibrary(colorCorrection);
+    }
+
+    return g_colorCorrectionFunctions;
+}
+
+let g_normalMapFunctions: DependencyItem[] | null = null;
+export function getNormalMapFunctions() {
+    if (!g_normalMapFunctions) {
+        g_normalMapFunctions = generateShaderLibrary(normalMap);
+    }
+
+    return g_normalMapFunctions;
+}
+
+let g_pbrFunctions: DependencyItem[] | null = null;
+export function getPBRFunctions() {
+    if (!g_pbrFunctions) {
+        g_pbrFunctions = generateShaderLibrary(pbr);
+    }
+
+    return g_pbrFunctions;
+}
+
+let g_uniformsFunctions: DependencyItem[] | null = null;
+export function getUniformsFunctions() {
+    if (!g_uniformsFunctions) {
+        g_uniformsFunctions = generateShaderLibrary(uniforms);
+    }
+
+    return g_uniformsFunctions;
+}
+
+export function replaceConstants(shaderCode: string): string {
+    const constants = getConstants();
+    return processConstants(shaderCode, constants);
+}

package/src/shaders/webgl/normal_map.glsl

@@ -0,0 +1,9 @@
+
+mat3 TBNMatrix(mat4 model, vec3 normal, vec3 tangent)
+{
+    vec3 T = normalize(vec3(model * vec4(tangent, 0.0)));
+    vec3 B = normalize(vec3(model * vec4(cross(tangent, normal), 0.0)));
+    vec3 N = normalize(vec3(model * vec4(normal, 0.0)));
+    return mat3(T, B, N);
+}
+