bg2e-js 2.0.0 → 2.0.2

package/render/SkyCube.js

@@ -1,77 +0,0 @@
-import Material from "../base/Material";
-import { createCube } from "../primitives";
-import RenderState from "./RenderState";
-import SkyCubeShader from "../shaders/SkyCubeShader";
-import Mat4 from "../math/Mat4";
-import { PolyListCullFace } from "../base/PolyList";
-
-export default class SkyCube {
-    constructor(renderer) {
-        this._renderer = renderer;
-    }
-
-    get renderer() { return this._renderer; }
-
-    set texture(texture) {
-        if (!this._texture) {
-            throw new Error("SkyCube: setting texture to an uninitialized sky cube. The texture setter is used to change the skyCube texture once created. Use the load() method instead.");
-        }
-        this._texture = texture;
-        this._material.diffuse = this._texture;
-    }
-
-    async load(cubemapTexture, Shader = null, shaderParams = []) {
-        this._texture = cubemapTexture;
-
-        this._material = new Material();
-        this._material.diffuse = this._texture;
-
-        this._shader = Shader ? new Shader(this.renderer) : new SkyCubeShader(this.renderer);
-        await this._shader.load.apply(this._shader,shaderParams);
-    }
-
-    updateRenderState({ viewMatrix, projectionMatrix = null }) {
-        const rotationMatrix = Mat4.GetRotation(viewMatrix);
-        if (!this._renderState) {
-            this._renderState = new RenderState({
-                shader: this._shader,
-                polyListRenderer: this.polyListRenderer,
-                materialRenderer: this.renderer.factory.material(this._material),
-                viewMatrix: rotationMatrix,
-                projectionMatrix
-            });
-        }
-        else {
-            this._renderState.viewMatrix = rotationMatrix;
-            if (projectionMatrix) {
-                this._renderState.projectionMatrix = projectionMatrix;
-            }
-        }
-        return this._renderState;
-    }
-
-    draw() {
-        throw new Error("SkyCube.draw(): Calling base implementation of SkyCube");
-    }
-
-    get polyListRenderer() {
-        if (!this._plistRenderer) {
-            const cube = createCube(1,1,1);
-            cube.cullFace = PolyListCullFace.FRONT;  // Draw back face
-            this._plistRenderer = this.renderer.factory.polyList(cube);
-        }
-        return this._plistRenderer;
-    }
-
-    destroy() {
-        this._shader.destroy();
-        this._texture.destroy();
-        this._plistRenderer.destroy();
-        this._material.destroy();
-        this._shader = null;
-        this._texture = null;
-        this._material = null;
-        this._plistRenderer = null;
-        this._renderState = null;
-    }
-}

package/render/SkySphere.js

@@ -1,94 +0,0 @@
-import { createSphere } from "../primitives";
-import SkySphereShader from "../shaders/SkySphereShader";
-import RenderState from "./RenderState";
-import Material from "../base/Material";
-import Texture, { ProceduralTextureFunction, TextureFilter, TextureWrap } from "../base/Texture";
-import Mat4 from "../math/Mat4";
-import { PolyListCullFace, PolyListFrontFace } from "../base/PolyList";
-import Color from "../base/Color";
-
-export default class SkySphere {
-    constructor(renderer) {
-        this._renderer = renderer;
-    }
-
-    get renderer() { return this._renderer; }
-
-    async load(equirectangularTextureUrl, Shader = null) {
-        this._texture = new Texture();
-        if (equirectangularTextureUrl) {
-            this._texture.fileName = equirectangularTextureUrl;
-        }
-        else {
-            // Load black texture
-            this._texture.magFilter = TextureFilter.NEAREST;
-            this._texture.minFilter = TextureFilter.NEAREST;
-            this._texture.wrapModeXY = TextureWrap.REPEAT;
-            this._texture.proceduralFunction = ProceduralTextureFunction.PLAIN_COLOR;
-            this._texture.proceduralParameters = Color.Black();
-            this._texture.size = [2, 2];
-        }
-        await this._texture.loadImageData();
-
-        this._material = new Material();
-        this._material.diffuse = this._texture;
-
-        this._shader = Shader ? new Shader(this.renderer) : new SkySphereShader(this.renderer);
-        await this._shader.load();
-    }
-
-    async setTexture(equirectangularTextureUrl) {
-        if (this._texture) {
-            this._texture.destroy();
-        }
-        this._texture.fileName = equirectangularTextureUrl;
-        await this._texture.loadImageData();
-
-        this._material.diffuse = this._texture;
-    }
-
-    updateRenderState({ viewMatrix, projectionMatrix = null }) {
-        const rotationMatrix = Mat4.GetRotation(viewMatrix);
-        if (!this._renderState) {
-            this._renderState = new RenderState({
-                shader: this._shader,
-                polyListRenderer: this.polyListRenderer,
-                materialRenderer: this.renderer.factory.material(this._material),
-                viewMatrix: rotationMatrix,
-                projectionMatrix
-            });
-        }
-        else {
-            this._renderState.viewMatrix = rotationMatrix;
-            if (projectionMatrix) {
-                this._renderState.projectionMatrix = projectionMatrix;
-            }
-        }
-        return this._renderState;
-    }
-
-    draw() {
-        throw new Error("SkySphere.draw(): Calling base implementation of SkySphere");
-    }
-
-    get polyListRenderer() {
-        if (!this._plistRenderer) {
-            const sphere = createSphere(3.5);
-            sphere.cullFace = PolyListCullFace.FRONT;  // Draw back face
-            this._plistRenderer = this.renderer.factory.polyList(sphere);
-        }
-        return this._plistRenderer;
-    }
-
-    destroy() {
-        this._shader.destroy();
-        this._texture.destroy();
-        this._plistRenderer.destroy();
-        this._shader = null;
-        this._texture = null;
-        this._material.destroy();
-        this._material = null;
-        this._plistRenderer = null;
-        this._renderState = null;
-    }
-}

package/render/TextureMergerRenderer.js

@@ -1,58 +0,0 @@
-
-import Texture, { TextureChannel, TextureComponentFormat, TextureRenderTargetAttachment, TextureWrap } from "../base/Texture";
-import TextureMergerShader from "../shaders/TextureMergerShader";
-export default class TextureMergerRenderer {
-    constructor(renderer) {
-        this._renderer = renderer;
-
-        this._shader = TextureMergerShader.GetUnique(this.renderer);
-
-        this._dirty = true;
-
-        this._mergedTexture = new Texture();
-        this._mergedTexture.renderTargetAttachment = TextureRenderTargetAttachment.COLOR_ATTACHMENT_0;
-        this._mergedTexture.componentFormat = TextureComponentFormat.UNSIGNED_BYTE;
-        this._mergedTexture.wrapModeXY = TextureWrap.REPEAT;
-
-        this._renderBuffer = this.renderer.factory.renderBuffer();
-        this._renderBuffer.attachTexture(this._mergedTexture);
-
-        this._shader.load();
-    }
-
-    get renderer() {
-        return this._renderer;
-    }
-
-    get dirty() {
-        return this._dirty;
-    }
-
-    set dirty(d) {
-        this._dirty = d;
-    }
-
-    setTexture(tex,channel,dstChannel = TextureChannel.R) {
-        this._shader.setTexture(tex,channel,dstChannel);
-        this._dirty = true;
-    }
-
-    get mergedTexture() {
-        return this._mergedTexture;
-    }
-
-    get isComplete() {
-        return this._shader.isComplete;
-    }
-
-    update() {
-        if (this._dirty) {
-            this._renderBuffer.update(() => {
-                // DEBUG: check why it's neccesary to present texture twice
-                this.renderer.presentTexture(null, { clear: true, shader: this._shader });
-                this.renderer.presentTexture(null, { shader: this._shader });
-            });
-            this._dirty = false;
-        }
-    }
-}

package/render/TextureRenderer.js

@@ -1,29 +0,0 @@
-import { TextureTarget } from "../base/Texture";
-export default class TextureRenderer {
-    constructor(renderer, texture) {
-        if (texture.renderer) {
-            throw new Error("Invalid initialization of texture renderer: The texture object is already controlled by another texture renderer.");
-        }
-
-        this._renderer = renderer;
-        this._texture = texture;
-        this._texture._renderer = this;
-    }
-
-    get renderer() {
-        return this._renderer;
-    }
-
-    get texture() {
-        return this._texture;
-    }
-
-    getApiObject(texture) {
-        // Return the specific texture identifier for renderer type
-        throw new Error("TextureRenderer: getApiObject() invalid usage of generic implementation of TextureRenderer");
-    }
-
-    destroy() {
-        throw new Error("TextureRenderer: destroy() invalid usage of generic implementation of TextureRenderer");
-    }
-}

package/render/webgl/FrameBuffer.js

@@ -1,9 +0,0 @@
-
-import FrameBuffer from "../FrameBuffer";
-
-export default class WebGLFrameBuffer extends FrameBuffer {
-    clear({ color = true, depth = true, stencil = false } = {}) {
-        const { state } = this.renderer;
-        state.clear({ color, depth, stencil });
-    }
-}

package/render/webgl/MaterialRenderer.js

@@ -1,99 +0,0 @@
-import Texture, { TextureChannel, TextureTargetName } from "../../base/Texture";
-import MaterialRenderer from "../MaterialRenderer";
-import { whiteTexture, createWhiteTexture, blackTexture, createBlackTexture } from "../../tools/TextureResourceDatabase";
-
-export default class WebGLMaterialRenderer extends MaterialRenderer {
-    static async InitResources(renderer) {
-        await createWhiteTexture(renderer);
-        await createBlackTexture(renderer);
-    }
-
-    constructor(renderer, material) {
-        super(renderer, material);
-        if (material.renderer) {
-            throw new Error("Duplicate material renderer set to material. Please, use the Renderer factory to get material renderer instance.");
-        }
-        material._renderer = this;
-
-        this._whiteTexture = renderer.factory.texture(whiteTexture(renderer));
-        this._blackTexture = renderer.factory.texture(blackTexture(renderer));
-        this._textureMerger = renderer.factory.textureMerger();
-    }
-
-    mergeTextures() {
-        if (this.material.dirty) {
-            const getTexture = (att, fallbackTexture = this._whiteTexture) => {
-                if (this.material[att] instanceof Texture) {
-                    return this.material[att];
-                }
-                else {
-                    return fallbackTexture.texture;
-                }
-            }
-
-            this._textureMerger.setTexture(getTexture('metallic'), TextureChannel.R, TextureChannel.R + this.material.metallicChannel);
-            this._textureMerger.setTexture(getTexture('roughness'), TextureChannel.G, TextureChannel.R + this.material.roughnessChannel);
-            this._textureMerger.setTexture(getTexture('lightEmission', this._blackTexture), TextureChannel.B, TextureChannel.R + this.material.lightEmissionChannel);
-            this._textureMerger.setTexture(getTexture('ambientOcclussion'), TextureChannel.A, TextureChannel.R + this.material.ambientOcclussionChannel);
-            this._textureMerger.update();
-            this.material.dirty = false;
-        }
-    }
-
-    get metallicRoughnessHeightAOTexture() {
-        return this._textureMerger.mergedTexture;
-    }
-
-    destroy() {
-        console.log("Destroy material renderer");
-        if (this.material) {
-            this.material._renderer = null;
-        }
-    }
-
-    // Bind the metallic, roughness, height and ambient occlussion combined texture
-    bindMetallicRoughnessHeightAOTexture(shaderProgram, uniformName, textureUnit) {
-        shaderProgram.bindTexture(uniformName, this.renderer.factory.texture(this.metallicRoughnessHeightAOTexture), textureUnit);
-        return true;
-    }
-
-    // Binds the property to the uniformName  uniform of the shader program, if the
-    // material property ies a texture. If not, it binds the fallbackTexture. If the fallbackTexture
-    // value is null, it binds a 2x2 px white texture
-    bindTexture(shaderProgram, property, uniformName, textureUnit, fallbackTexture = null) {
-        if (this.material[property] instanceof Texture) {
-            shaderProgram.bindTexture(uniformName, this.getTextureRenderer(property), textureUnit);
-            return true;
-        }
-        else if (fallbackTexture instanceof Texture) {
-            shaderProgram.bindTexture(uniformName, this.renderer.factory.texture(fallbackTexture), textureUnit);
-            return false;
-        }
-        else {
-            shaderProgram.bindTexture(uniformName, this._whiteTexture, textureUnit);
-            return false;
-        }
-    }
-
-    // Bind the property to the uniformName uniform of the shader program, if the
-    // material property is a color. If not, it binds the fallbackColor vector
-    bindColor(shaderProgram, property, uniformName, fallbackColor = [1, 1, 1, 1]) {
-        if (this.material[property].length>=4) {
-            shaderProgram.uniform4fv(uniformName, this.material[property]);
-        }
-        else {
-            shaderProgram.uniform4fv(uniformName, fallbackColor);
-        }
-    }
-
-    // Bind the property to the uniformName uniform of the shader program, if the
-    // material property is a number. If not, it binds the fallbackValue value
-    bindValue(shaderProgram, property, uniformName, fallbackValue = 1) {
-        if (typeof(this.material[property]) === "number") {
-            shaderProgram.uniform1f(uniformName, this.material[property]);
-        }
-        else {
-            shaderProgram.uniform1f(uniformName, fallbackValue);
-        }
-    }
-}

package/render/webgl/Pipeline.js

@@ -1,82 +0,0 @@
-
-import Pipeline, { BlendEquation, BlendFunction } from "../Pipeline";
-
-const getBlendEquation = (gl, blendEquation) => {
-    switch (blendEquation) {
-    case BlendEquation.ADD:
-        return gl.FUNC_ADD; 
-    case BlendEquation.FUNC_SUBTRACT:
-        return gl.SUBTRACT; 
-    case BlendEquation.REVERSE_SUBTRACT:
-        return gl.FUNC_REVERSE_SUBTRACT; 
-    }
-    throw new Error(`Invalid blend equation specified in WebGLPipeline: ${ blendEquation }`);
-}
-
-const getBlendFunc = (gl, blendFunc) => {
-    switch (blendFunc) {
-    case BlendFunction.NULL:
-        return null;
-    case BlendFunction.ZERO:
-        return gl.ZERO;
-    case BlendFunction.ONE:
-        return gl.ONE;
-    case BlendFunction.SRC_COLOR:
-        return gl.SRC_COLOR;
-    case BlendFunction.ONE_MINUS_SRC_COLOR:
-        return gl.ONE_MINUS_SRC_COLOR;
-    case BlendFunction.DST_COLOR:
-        return gl.DST_COLOR;
-    case BlendFunction.ONE_MINUS_DST_COLOR:
-        return gl.ONE_MINUS_DST_COLOR;
-    case BlendFunction.SRC_ALPHA:
-        return gl.SRC_ALPHA;
-    case BlendFunction.ONE_MINUS_SRC_ALPHA:
-        return gl.ONE_MINUS_SRC_ALPHA;
-    case BlendFunction.DST_ALPHA:
-        return gl.DST_ALPHA;
-    case BlendFunction.ONE_MINUS_DST_ALPHA:
-        return gl.ONE_MINUS_DST_ALPHA;
-    }
-    throw new Error(`Invalid blend function specified in WebGLPipeline: ${ blendFunc }`);
-}
-
-export default class WebGLPipeline extends Pipeline {
-    create() {
-        const { gl } = this.renderer;
-
-        // Set the webgl equivalent values
-        this._blendEquation = getBlendEquation(gl, this.blendState.blendEquation);
-        this._blendFuncSrcColor = getBlendFunc(gl, this.blendState.blendFuncSrc);
-        this._blendFuncSrcAlpha = getBlendFunc(gl, this.blendState.blendFuncSrcAlpha);
-        this._blendFuncDstColor = getBlendFunc(gl, this.blendState.blendFuncDst);
-        this._blendFuncDstAlpha = getBlendFunc(gl, this.blendState.blendFuncDstAlpha);
-        if ((this._blendFuncDstAlpha === null && this._blendFuncSrcAlpha !== null) ||
-            (this._blendFuncDstAlpha !== null && this._blendFuncSrcAlpha === null))
-        {
-            throw new Error("WebGLPipeline.create(): Invalid values of blendFuncDstAlpha and blendFuncSrcAlpha");
-        }
-        this._blendFunc = this._blendFuncDstAlpha !== null ? (a,b) => gl.blendFunc(a,b) : (a,b,c,d) => gl.blendFuncSeparate(a,b,c,d);
-    }
-
-    activate() {
-        const { gl, state } = this.renderer;
-        this.blendState.enabled ? gl.enable(gl.BLEND) : gl.disable(gl.BLEND);
-        gl.blendEquation(this._blendEquation);
-        this._blendFunc(
-            this._blendFuncSrcColor,
-            this._blendFuncDstColor,
-            this._blendFuncSrcAlpha,
-            this._blendFuncDstAlpha
-        );
-
-        state.depthTestEnabled = this.depthTest;
-
-        if (this.cullFace) {
-            gl.enable(gl.CULL_FACE);
-        }
-        else {
-            gl.disable(gl.CULL_FACE);
-        }
-    }
-}

package/render/webgl/PolyListRenderer.js

@@ -1,224 +0,0 @@
-
-import { DrawMode, PolyListCullFace, PolyListFrontFace } from "../../base/PolyList";
-import PolyListRenderer from "../PolyListRenderer";
-import VertexBuffer, { BufferTarget } from "./VertexBuffer";
-
-export default class WebGLPolyListRenderer extends PolyListRenderer {
-    constructor(renderer,polyList) {
-        super(renderer,polyList);
-    }
-
-    init() {
-        this._vertexBuffer = null;
-        this._indexBuffer = null;
-        this._indexArrayFormat = null;
-    }
-
-    get valid() {
-        return this._vertexBuffer !== null && this._indexArrayFormat !== null && this._indexBuffer !== null;
-    }
-
-    refresh() {
-        const getVector = (items, current, stride) => items.length && (stride === 3 ?
-            [items[current * stride], items[current * stride + 1], items[current * stride + 2]] :
-            stride === 2 ? [items[current * stride], items[current * stride + 1]] || null :
-            [items[current * stride], items[current * stride + 1], items[current * stride + 2], items[current * stride + 3]])
-
-        const numElements = this.polyList.vertex.length / 3;
-        const result = [];
-        for (let i = 0; i < numElements; ++i) {
-            const v = getVector(this.polyList.vertex, i, 3);
-            const n = getVector(this.polyList.normal, i, 3);
-            const t0 = getVector(this.polyList.texCoord0, i, 2);
-            const t1 = getVector(this.polyList.texCoord1, i, 2);
-            const t2 = getVector(this.polyList.texCoord2, i, 2);
-            const c = getVector(this.polyList.color, i, 4);
-            const t = getVector(this.polyList.tangent, i, 3);
-
-            result.push(...v);
-            if (n) {
-                result.push(...n);
-            }
-            if (t0) {
-                result.push(...t0);
-            }
-            if (t1) {
-                result.push(...t1);
-            }
-            if (t2) {
-                result.push(...t2);
-            }
-            if (c) {
-                result.push(...c);
-            }
-            if (t) {
-                result.push(...t);
-            }
-        }
-
-        this._stride = 3;
-        const vertex = 0;
-        const normal = 3;
-        let texCoord0 = 3;
-        let texCoord1 = 3;
-        let texCoord2 = 3;
-        let color = 3;
-        let tangent = 3;
-        if (this.hasNormal) {
-            this._stride += 3;
-            texCoord0 += 3;
-            texCoord1 += 3;
-            texCoord2 += 3;
-            color += 3;
-            tangent += 3;
-        }
-        if (this.hasTexCoord0) {
-            this._stride += 2;
-            texCoord1 += 2;
-            texCoord2 += 2;
-            color += 2;
-            tangent += 2;
-        }
-        if (this.hasTexCoord1) {
-            this._stride += 2;
-            texCoord2 += 2;
-            color += 2;
-            tangent += 2;
-        }
-        if (this.hasTexCoord2) {
-            this._stride += 2;
-            color += 2;
-            tangent += 2;
-        }
-        if (this.hasColor) {
-            this._stride += 4;
-            tangent += 4;
-        }
-        if (this.hasTangent) {
-            this._stride += 3;
-        }
-
-        this._offsets = { vertex, normal, texCoord0, texCoord1, texCoord2, color, tangent };
-        this._vertexBuffer = VertexBuffer.CreateArrayBuffer(this.renderer.gl, new Float32Array(result));
-        const indexArray = this.polyList.index.length < 65535 ? new Uint16Array(this.polyList.index) : new Uint32Array(this.polyList.index);
-        this._indexBuffer = VertexBuffer.CreateElementArrayBuffer(this.renderer.gl, indexArray);
-        this._indexArrayFormat = indexArray instanceof Uint16Array ? this.renderer.gl.UNSIGNED_SHORT : this.renderer.gl.UNSIGNED_INT;
-    }
-
-    get hasNormal() {
-        return this._polyList.normal.length > 0;
-    }
-
-    get hasTexCoord0() {
-        return this._polyList.texCoord0.length > 0;
-    }
-
-    get hasTexCoord1() {
-        return this._polyList.texCoord1.length > 0;
-    }
-
-    get hasTexCoord2() {
-        return this._polyList.texCoord2.length > 0;
-    }
-
-    get hasColor() {
-        return this._polyList.color.length > 0;
-    }
-
-    get hasTangent() {
-        return this._polyList.tangent.length > 0;
-    }
-
-    positionAttribParams(name) {
-        return { name, stride: this._stride, size: 3, offset: 0, enable: true }
-    }
-
-    normalAttribParams(name) {
-        return { name, stride: this._stride, size: 3, offset: this._offsets.normal, enable: true }
-    }
-
-    texCoord0AttribParams(name) {
-        return { name, stride: this._stride, size: 2, offset: this._offsets.texCoord0, enable: true }
-    }
-
-    texCoord1AttribParams(name) {
-        return { name, stride: this._stride, size: 2, offset: this._offsets.texCoord1, enable: true }
-    }
-
-    texCoord2AttribParams(name) {
-        return { name, stride: this._stride, size: 2, offset: this._offsets.texCoord2, enable: true }
-    }
-    
-    colorAttribParams(name) {
-        return { name, stride: this._stride, size: 4, offset: this._offsets.color, enable: true }
-    }
-
-    tangentAttribParams(name) {
-        return { name, stride: this._stride, size: 3, offset: this._offsets.tangent, enable: true }
-    }
-
-    bindBuffers() {
-        this._vertexBuffer.bind(BufferTarget.ARRAY_BUFFER);
-        this._indexBuffer.bind(BufferTarget.ELEMENT_ARRAY_BUFFER);        
-    }
-    
-    draw() {
-        const { gl, state } = this.renderer;
-
-        state.cullFaceEnabled = this.polyList.enableCullFace;
-        
-        switch (this.polyList.frontFace) {
-        case PolyListFrontFace.CCW:
-            state.frontFace = state.CCW;
-            break;
-        case PolyListFrontFace.CW:
-            state.frontFace = state.CW;
-            break;
-        }
-
-        switch (this.polyList.cullFace) {
-        case PolyListCullFace.BACK:
-            state.cullFace = state.BACK;
-            break;
-        case PolyListCullFace.FRONT:
-            state.cullFace = state.FRONT;
-            break;
-        case PolyListCullFace.FRONT_AND_BACK:
-            state.cullFace = state.FRONT_AND_BACK;
-            break;
-        }
-
-
-        
-        let mode = 0;
-        switch (this._polyList.drawMode) {
-        case DrawMode.POINTS:
-            mode = gl.POINTS;
-            break;
-        case DrawMode.TRIANGLES:
-            mode = gl.TRIANGLES;
-            break;
-        case DrawMode.TRIANGLE_FAN:
-            mode = gl.TRIANGLE_FAN
-            break;
-        case DrawMode.TRIANGLE_STRIP:
-            mode = gl.TRIANGLE_STRIP;
-            break;
-        case DrawMode.LINES:
-            mode = gl.LINES;
-            break;
-        case DrawMode.LINE_STRIP:
-            mode = gl.LINE_STRIP;
-            break;
-        }
-
-        gl.lineWidth(this.polyList.lineWidth);
-
-        gl.drawElements(mode, this.polyList.index.length, this._indexArrayFormat, 0);
-    }
-
-    destroy() {
-        VertexBuffer.Delete(this._vertexBuffer);
-        VertexBuffer.Delete(this._indexBuffer);
-    }
-}