csyjk 1.1.1 → 1.2.2

package/src/lib/gltf/assets/yjkkit-sdk/src/viewer/scene/webgl/ArrayBuf.js

@@ -0,0 +1,121 @@
+/**
+ * @desc Represents a WebGL ArrayBuffer.
+ *
+ * @private
+ */
+class ArrayBuf {
+
+    constructor(gl, type, data, numItems, itemSize, usage, normalized, stride, offset) {
+
+        this._gl = gl;
+        this.type = type;
+        this.allocated = false;
+
+        switch (data.constructor) {
+
+            case Uint8Array:
+                this.itemType = gl.UNSIGNED_BYTE;
+                this.itemByteSize = 1;
+                break;
+
+            case Int8Array:
+                this.itemType = gl.BYTE;
+                this.itemByteSize = 1;
+                break;
+
+            case  Uint16Array:
+                this.itemType = gl.UNSIGNED_SHORT;
+                this.itemByteSize = 2;
+                break;
+
+            case  Int16Array:
+                this.itemType = gl.SHORT;
+                this.itemByteSize = 2;
+                break;
+
+            case Uint32Array:
+                this.itemType = gl.UNSIGNED_INT;
+                this.itemByteSize = 4;
+                break;
+
+            case Int32Array:
+                this.itemType = gl.INT;
+                this.itemByteSize = 4;
+                break;
+
+            default:
+                this.itemType = gl.FLOAT;
+                this.itemByteSize = 4;
+        }
+
+        this.usage = usage;
+        this.length = 0;
+        this.dataLength = numItems;
+        this.numItems = 0;
+        this.itemSize = itemSize;
+        this.normalized = !!normalized;
+        this.stride = stride || 0;
+        this.offset = offset || 0;
+
+        this._allocate(data);
+    }
+
+    _allocate(data) {
+        this.allocated = false;
+        this._handle = this._gl.createBuffer();
+        if (!this._handle) {
+            throw "Failed to allocate WebGL ArrayBuffer";
+        }
+        if (this._handle) {
+            this._gl.bindBuffer(this.type, this._handle);
+            this._gl.bufferData(this.type, data.length > this.dataLength ? data.slice(0, this.dataLength) : data, this.usage);
+            this._gl.bindBuffer(this.type, null);
+            this.length = data.length;
+            this.numItems = this.length / this.itemSize;
+            this.allocated = true;
+        }
+    }
+
+    setData(data, offset) {
+        if (!this.allocated) {
+            return;
+        }
+        if (data.length + (offset || 0) > this.length) {            // Needs reallocation
+            this.destroy();
+            this._allocate(data);
+        } else {            // No reallocation needed
+            this._gl.bindBuffer(this.type, this._handle);
+            if (offset || offset === 0) {
+                this._gl.bufferSubData(this.type, offset * this.itemByteSize, data);
+            } else {
+                this._gl.bufferData(this.type, data, this.usage);
+            }
+            this._gl.bindBuffer(this.type, null);
+        }
+    }
+
+    bind() {
+        if (!this.allocated) {
+            return;
+        }
+        this._gl.bindBuffer(this.type, this._handle);
+    }
+
+    unbind() {
+        if (!this.allocated) {
+            return;
+        }
+        this._gl.bindBuffer(this.type, null);
+    }
+
+    destroy() {
+        if (!this.allocated) {
+            return;
+        }
+        this._gl.deleteBuffer(this._handle);
+        this._handle = null;
+        this.allocated = false;
+    }
+}
+
+export {ArrayBuf};

package/src/lib/gltf/assets/yjkkit-sdk/src/viewer/scene/webgl/Attribute.js

@@ -0,0 +1,23 @@
+/**
+ * @desc Represents a WebGL vertex attribute buffer (VBO).
+ * @private
+ * @param gl {WebGLRenderingContext} The WebGL rendering context.
+ */
+class Attribute {
+
+    constructor(gl, location) {
+        this._gl = gl;
+        this.location = location;
+    }
+
+    bindArrayBuffer(arrayBuf) {
+        if (!arrayBuf) {
+            return;
+        }
+        arrayBuf.bind();
+        this._gl.enableVertexAttribArray(this.location);
+        this._gl.vertexAttribPointer(this.location, arrayBuf.itemSize, arrayBuf.itemType, arrayBuf.normalized, arrayBuf.stride, arrayBuf.offset);
+    }
+}
+
+export {Attribute};

package/src/lib/gltf/assets/yjkkit-sdk/src/viewer/scene/webgl/Drawable.js

@@ -0,0 +1,270 @@
+/**
+ * @desc A drawable {@link Scene} element.
+ *
+ * @interface
+ * @abstract
+ * @private
+ */
+class Drawable {
+
+    /**
+     * Returns true to indicate that this is a Drawable.
+     * @type {Boolean}
+     * @abstract
+     */
+    get isDrawable() {
+    }
+
+    //------------------------------------------------------------------------------------------------------------------
+    // Emphasis materials
+    //------------------------------------------------------------------------------------------------------------------
+
+    /**
+     * Configures the appearance of this Drawable when x-rayed.
+     *
+     * Set to {@link Scene#xrayMaterial} by default.
+     *
+     * @type {EmphasisMaterial}
+     * @abstract
+     */
+    get xrayMaterial() {
+    }
+
+    /**
+     * Configures the appearance of this Drawable when highlighted.
+     *
+     * Set to {@link Scene#highlightMaterial} by default.
+     *
+     * @type {EmphasisMaterial}
+     * @abstract
+     */
+    get highlightMaterial() {
+    }
+
+    /**
+     * Configures the appearance of this Drawable when selected.
+     *
+     * Set to {@link Scene#selectedMaterial} by default.
+     *
+     * @type {EmphasisMaterial}
+     * @abstract
+     */
+    get selectedMaterial() {
+    }
+
+    /**
+     * Configures the appearance of this Drawable when edges are enhanced.
+     *
+     * @type {EdgeMaterial}
+     * @abstract
+     */
+    get edgeMaterial() {
+    }
+
+    //------------------------------------------------------------------------------------------------------------------
+    // Rendering
+    //------------------------------------------------------------------------------------------------------------------
+
+    /**
+     * Property with final value ````true```` to indicate that yjkkit should render this Drawable in sorted order, relative to other Drawable of the same class.
+     *
+     * The sort order is determined by {@link Drawable#stateSortCompare}.
+     *
+     * Sorting is essential for rendering performance, so that yjkkit is able to avoid applying runs of the same state changes to the GPU, ie. can collapse them.
+     *
+     * @type {boolean}
+     * @abstract
+     */
+    get isStateSortable() {
+    }
+
+    /**
+     * Comparison function used by the renderer to determine the order in which yjkkit should render the Drawable, relative to to other Drawablees.
+     *
+     * Sorting is essential for rendering performance, so that yjkkit is able to avoid needlessly applying runs of the same rendering state changes to the GPU, ie. can collapse them.
+     *
+     * @param {Drawable} drawable1
+     * @param {Drawable} drawable2
+     * @returns {number}
+     * @abstract
+     */
+    stateSortCompare(drawable1, drawable2) {
+    }
+
+    /**
+     * Called by yjkkit when about to render this Drawable, to generate {@link Drawable#renderFlags}.
+     *
+     * @abstract
+     */
+    rebuildRenderFlags(renderFlags) {
+    }
+
+    /**
+     * Called by yjkkit when about to render this Drawable, to get flags indicating what rendering effects to apply for it.
+     * @type {RenderFlags}
+     * @abstract
+     */
+    get renderFlags() {
+
+    }
+
+    // ---------------------- NORMAL RENDERING -----------------------------------
+
+    /**
+     * Renders opaque edges using {@link Drawable#edgeMaterial}.
+     *
+     * See {@link RenderFlags#colorOpaque}.
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawColorOpaque(renderFlags, frameCtx) {
+    }
+
+    /**
+     * Renders transparent filled surfaces using normal appearance attributes.
+     *
+     * See {@link RenderFlags#colorTransparent}.
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawColorTransparent(renderFlags, frameCtx) {
+    }
+
+    // ---------------------- RENDERING SAO POST EFFECT TARGETS --------------
+
+    /**
+     * Renders pixel depths to an internally-managed depth target, for use in post-effects (eg. SAO).
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawDepth(renderFlags, frameCtx) {
+    }
+
+    /**
+     * Renders pixel normals to an internally-managed target, for use in post-effects (eg. SAO).
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawNormals(renderFlags, frameCtx) {
+    }
+
+    // ---------------------- EMPHASIS RENDERING -----------------------------------
+
+    /**
+     * Renders x-ray fill using {@link Drawable#xrayMaterial}.
+     *
+     * See {@link RenderFlags#xrayedSilhouetteOpaque} and {@link RenderFlags#xrayedSilhouetteTransparent}.
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawSilhouetteXRayed(renderFlags, frameCtx) {
+    }
+
+    /**
+     * Renders highlighted transparent fill using {@link Drawable#highlightMaterial}.
+     *
+     * See {@link RenderFlags#highlightedSilhouetteOpaque} and {@link RenderFlags#highlightedSilhouetteTransparent}.
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawSilhouetteHighlighted(renderFlags, frameCtx) {
+    }
+
+    /**
+     * Renders selected fill using {@link Drawable#selectedMaterial}.
+     *
+     * See {@link RenderFlags#selectedSilhouetteOpaque} and {@link RenderFlags#selectedSilhouetteTransparent}.
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawSilhouetteSelected(renderFlags, frameCtx) {
+    }
+
+    // ---------------------- EDGES RENDERING -----------------------------------
+
+    /**
+     * Renders opaque normal edges using {@link Drawable#edgeMaterial}.
+     *
+     * See {@link RenderFlags#edgesOpaque}.
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawEdgesColorOpaque(renderFlags, frameCtx) {
+    }
+
+    /**
+     * Renders transparent normal edges using {@link Drawable#edgeMaterial}.
+     *
+     * See {@link RenderFlags#edgesTransparent}.
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawEdgesColorTransparent(renderFlags, frameCtx) {
+    }
+
+    /**
+     * Renders x-rayed edges using {@link Drawable#xrayMaterial}.
+     *
+     * See {@link RenderFlags#xrayedEdgesOpaque}.
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawEdgesXRayed(renderFlags, frameCtx) {
+    }
+
+    /**
+     * Renders highlighted edges using {@link Drawable#highlightMaterial}.
+     *
+     * See {@link RenderFlags#highlightedEdgesOpaque}.
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawEdgesHighlighted(renderFlags, frameCtx) {
+    }
+
+    /**
+     * Renders selected edges using {@link Drawable#selectedMaterial}.
+     *
+     * See {@link RenderFlags#selectedEdgesOpaque}.
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawEdgesSelected(renderFlags, frameCtx) {
+    }
+
+    // ---------------------- OCCLUSION CULL RENDERING -----------------------------------
+
+    /**
+     * Renders occludable elements to a frame buffer where they will be tested to see if they occlude any occlusion probe markers.
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawOcclusion(renderFlags, frameCtx) {
+    }
+
+    // ---------------------- SHADOW BUFFER RENDERING -----------------------------------
+
+    /**
+     * Renders depths to a shadow map buffer..
+     *
+     * @param {FrameContext} frameCtx Renderer frame context.
+     * @abstract
+     */
+    drawShadow(renderFlags, frameCtx) {
+    }
+}
+
+export {Drawable};

package/src/lib/gltf/assets/yjkkit-sdk/src/viewer/scene/webgl/FrameContext.js

@@ -0,0 +1,259 @@
+import {math} from "../math/math.js";
+import {createRTCViewMat} from "../math/rtcCoords.js";
+
+/**
+ * @desc Provides rendering context to {@link Drawable"}s as yjkkit renders them for a frame.
+ *
+ * Also creates RTC viewing and picking matrices, caching and reusing matrices within each frame.
+ *
+ * @private
+ */
+class FrameContext {
+
+    constructor(scene) {
+
+        this._scene = scene;
+
+        this._matPool = [];
+        this._matPoolNextFreeIndex = 0;
+
+        this._rtcViewMats = {};
+        this._rtcPickViewMats = {};
+
+        this.reset();
+    }
+
+    /**
+     * Called by the renderer before each frame.
+     * @private
+     */
+    reset() {
+
+        this._matPoolNextFreeIndex = 0;
+        this._rtcViewMats = {};
+        this._rtcPickViewMats = {};
+
+        /**
+         * The WebGL rendering context.
+         * @type {WebGLRenderingContext}
+         */
+        this.gl = this._scene.canvas.gl;
+
+        /**
+         * ID of the last {@link WebGLProgram} that was bound during the current frame.
+         * @property lastProgramId
+         * @type {Number}
+         */
+        this.lastProgramId = null;
+
+        /**
+         * Whether to render a quality representation for triangle surfaces.
+         *
+         * When ````false````, we'll render them with a fast vertex-shaded Gouraud-shaded representation, which
+         * is great for zillions of objects.
+         *
+         * When ````true````, we'll render them at a better visual quality, using smooth, per-fragment shading
+         * and a more realistic lighting model.
+         *
+         * @property quality
+         * @default false
+         * @type {Boolean}
+         */
+        this.pbrEnabled = false;
+
+        /**
+         * Whether SAO is currently enabled during the current frame.
+         * @property withSAO
+         * @default false
+         * @type {Boolean}
+         */
+        this.withSAO = false;
+
+        /**
+         * Whether backfaces are currently enabled during the current frame.
+         * @property backfaces
+         * @default false
+         * @type {Boolean}
+         */
+        this.backfaces = false;
+
+        /**
+         * The vertex winding order for what we currently consider to be a backface during current
+         * frame: true == "cw", false == "ccw".
+         * @property frontFace
+         * @default true
+         * @type {Boolean}
+         */
+        this.frontface = true;
+
+        /**
+         * The next available texture unit to bind a {@link Texture} to.
+         * @defauilt 0
+         * @property textureUnit
+         * @type {number}
+         */
+        this.textureUnit = 0;
+
+        /**
+         * Performance statistic that counts how many times the renderer has called ````gl.drawElements()```` has been
+         * called so far within the current frame.
+         * @default 0
+         * @property drawElements
+         * @type {number}
+         */
+        this.drawElements = 0;
+
+        /**
+         * Performance statistic that counts how many times ````gl.drawArrays()```` has been called so far within
+         * the current frame.
+         * @default 0
+         * @property drawArrays
+         * @type {number}
+         */
+        this.drawArrays = 0;
+
+        /**
+         * Performance statistic that counts how many times ````gl.useProgram()```` has been called so far within
+         * the current frame.
+         * @default 0
+         * @property useProgram
+         * @type {number}
+         */
+        this.useProgram = 0;
+
+        /**
+         * Statistic that counts how many times ````gl.bindTexture()```` has been called so far within the current frame.
+         * @default 0
+         * @property bindTexture
+         * @type {number}
+         */
+        this.bindTexture = 0;
+
+        /**
+         * Counts how many times the renderer has called ````gl.bindArray()```` so far within the current frame.
+         * @defaulr 0
+         * @property bindArray
+         * @type {number}
+         */
+        this.bindArray = 0;
+
+        /**
+         * Indicates which pass the renderer is currently rendering.
+         *
+         * See {@link Scene/passes:property"}}Scene#passes{{/crossLink}}, which configures how many passes we render
+         * per frame, which typically set to ````2```` when rendering a stereo view.
+         *
+         * @property pass
+         * @type {number}
+         */
+        this.pass = 0;
+
+        /**
+         * The 4x4 viewing transform matrix the renderer is currently using when rendering castsShadows.
+         *
+         * This sets the viewpoint to look from the point of view of each {@link DirLight}
+         * or {@link PointLight} that casts a shadow.
+         *
+         * @property shadowViewMatrix
+         * @type {Number[]}
+         */
+        this.shadowViewMatrix = null;
+
+        /**
+         * The 4x4 viewing projection matrix the renderer is currently using when rendering shadows.
+         *
+         * @property shadowProjMatrix
+         * @type {Number[]}
+         */
+        this.shadowProjMatrix = null;
+
+        /**
+         * The 4x4 viewing transform matrix the renderer is currently using when rendering a ray-pick.
+         *
+         * This sets the viewpoint to look along the ray given to {@link Scene/pick:method"}}Scene#pick(){{/crossLink}}
+         * when picking with a ray.
+         *
+         * @property pickViewMatrix
+         * @type {Number[]}
+         */
+        this.pickViewMatrix = null;
+
+        /**
+         * The 4x4 orthographic projection transform matrix the renderer is currently using when rendering a ray-pick.
+         *
+         * @property pickProjMatrix
+         * @type {Number[]}
+         */
+        this.pickProjMatrix = null;
+
+        /**
+         * Distance to the near clipping plane when rendering depth fragments for GPU-accelerated 3D picking.
+         *
+         * @property pickZNear
+         * @type {Number|*}
+         */
+        this.pickZNear = 0.01;
+
+        /**
+         * Distance to the far clipping plane when rendering depth fragments for GPU-accelerated 3D picking.
+         *
+         * @property pickZFar
+         * @type {Number|*}
+         */
+        this.pickZFar = 5000;
+
+        /**
+         * Whether or not the renderer is currently picking invisible objects.
+         *
+         * @property pickInvisible
+         * @type {Number}
+         */
+        this.pickInvisible = false;
+
+        /** The current line width.
+         *
+         * @property lineWidth
+         * @type Number
+         */
+        this.lineWidth = 1;
+    }
+
+    /**
+     * Get View matrix for the given RTC center.
+     */
+    getRTCViewMatrix(rtcCenterHash, rtcCenter) {
+        let rtcViewMat = this._rtcViewMats[rtcCenterHash];
+        if (!rtcViewMat) {
+            rtcViewMat = this._getNewMat();
+            createRTCViewMat(this._scene.camera.viewMatrix, rtcCenter, rtcViewMat);
+            this._rtcViewMats[rtcCenterHash] = rtcViewMat;
+        }
+        return rtcViewMat;
+    }
+
+    /**
+     * Get picking View RTC matrix for the given RTC center.
+     */
+    getRTCPickViewMatrix(rtcCenterHash, rtcCenter) {
+        let rtcPickViewMat = this._rtcPickViewMats[rtcCenterHash];
+        if (!rtcPickViewMat) {
+            rtcPickViewMat = this._getNewMat();
+            const pickViewMat = this.pickViewMatrix || this._scene.camera.viewMatrix;
+            createRTCViewMat(pickViewMat, rtcCenter, rtcPickViewMat);
+            this._rtcPickViewMats[rtcCenterHash] = rtcPickViewMat;
+        }
+        return rtcPickViewMat;
+    }
+
+    _getNewMat() {
+        let mat = this._matPool[this._matPoolNextFreeIndex];
+        if (!mat) {
+            mat = math.mat4();
+            this._matPool[this._matPoolNextFreeIndex] = mat;
+        }
+        this._matPoolNextFreeIndex++;
+        return mat;
+    }
+}
+
+export {FrameContext};