csyjk 1.1.1 → 1.2.2

package/src/lib/gltf/assets/yjkkit-sdk/src/viewer/scene/mesh/shadow/ShadowRenderer.js

@@ -0,0 +1,214 @@
+import {ShadowShaderSource} from "./ShadowShaderSource.js";
+import {Program} from "../../webgl/Program.js";
+import {stats} from "../../stats.js";
+
+/**
+ * @private
+ */
+const ShadowRenderer = function (hash, mesh) {
+    this._hash = hash;
+    this._shaderSource = new ShadowShaderSource(mesh);
+    this._scene = mesh.scene;
+    this._useCount = 0;
+    this._allocate(mesh);
+};
+
+const renderers = {};
+
+ShadowRenderer.get = function (mesh) {
+    const scene = mesh.scene;
+    const hash = [scene.canvas.canvas.id, scene._sectionPlanesState.getHash(), mesh._geometry._state.hash, mesh._state.hash].join(";");
+    let renderer = renderers[hash];
+    if (!renderer) {
+        renderer = new ShadowRenderer(hash, mesh);
+        if (renderer.errors) {
+            console.log(renderer.errors.join("\n"));
+            return null;
+        }
+        renderers[hash] = renderer;
+        stats.memory.programs++;
+    }
+    renderer._useCount++;
+    return renderer;
+};
+
+ShadowRenderer.prototype.put = function () {
+    if (--this._useCount === 0) {
+        if (this._program) {
+            this._program.destroy();
+        }
+        delete renderers[this._hash];
+        stats.memory.programs--;
+    }
+};
+
+ShadowRenderer.prototype.webglContextRestored = function () {
+    this._program = null;
+};
+
+ShadowRenderer.prototype.drawMesh = function (frame, mesh) {
+    if (!this._program) {
+        this._allocate(mesh);
+    }
+    const scene = this._scene;
+    const gl = scene.canvas.gl;
+    const materialState = mesh._material._state;
+    const geometryState = mesh._geometry._state;
+    if (frame.lastProgramId !== this._program.id) {
+        frame.lastProgramId = this._program.id;
+        this._bindProgram(frame);
+    }
+    if (materialState.id !== this._lastMaterialId) {
+        const backfaces = materialState.backfaces;
+        if (frame.backfaces !== backfaces) {
+            if (backfaces) {
+                gl.disable(gl.CULL_FACE);
+            } else {
+                gl.enable(gl.CULL_FACE);
+            }
+            frame.backfaces = backfaces;
+        }
+        const frontface = materialState.frontface;
+        if (frame.frontface !== frontface) {
+            if (frontface) {
+                gl.frontFace(gl.CCW);
+            } else {
+                gl.frontFace(gl.CW);
+            }
+            frame.frontface = frontface;
+        }
+        if (frame.lineWidth !== materialState.lineWidth) {
+            gl.lineWidth(materialState.lineWidth);
+            frame.lineWidth = materialState.lineWidth;
+        }
+        if (this._uPointSize) {
+            gl.uniform1i(this._uPointSize, materialState.pointSize);
+        }
+        this._lastMaterialId = materialState.id;
+    }
+    gl.uniformMatrix4fv(this._uModelMatrix, gl.FALSE, mesh.worldMatrix);
+    if (geometryState.combineGeometry) {
+        const vertexBufs = mesh.vertexBufs;
+        if (vertexBufs.id !== this._lastVertexBufsId) {
+            if (vertexBufs.positionsBuf && this._aPosition) {
+                this._aPosition.bindArrayBuffer(vertexBufs.positionsBuf, vertexBufs.compressGeometry ? gl.UNSIGNED_SHORT : gl.FLOAT);
+                frame.bindArray++;
+            }
+            this._lastVertexBufsId = vertexBufs.id;
+        }
+    }
+    if (this._uClippable) {
+        gl.uniform1i(this._uClippable, mesh._state.clippable);
+    }
+    gl.uniform3fv(this._uOffset, mesh._state.offset);
+    if (geometryState.id !== this._lastGeometryId) {
+        if (this._uPositionsDecodeMatrix) {
+            gl.uniformMatrix4fv(this._uPositionsDecodeMatrix, false, geometryState.positionsDecodeMatrix);
+        }
+        if (geometryState.combineGeometry) { // VBOs were bound by the preceding VertexBufs chunk
+            if (geometryState.indicesBufCombined) {
+                geometryState.indicesBufCombined.bind();
+                frame.bindArray++;
+            }
+        } else {
+            if (this._aPosition) {
+                this._aPosition.bindArrayBuffer(geometryState.positionsBuf, geometryState.compressGeometry ? gl.UNSIGNED_SHORT : gl.FLOAT);
+                frame.bindArray++;
+            }
+            if (geometryState.indicesBuf) {
+                geometryState.indicesBuf.bind();
+                frame.bindArray++;
+            }
+        }
+        this._lastGeometryId = geometryState.id;
+    }
+    if (geometryState.combineGeometry) {
+        if (geometryState.indicesBufCombined) {
+            gl.drawElements(geometryState.primitive, geometryState.indicesBufCombined.numItems, geometryState.indicesBufCombined.itemType, 0);
+            frame.drawElements++;
+        } else {
+            // TODO: drawArrays() with VertexBufs positions
+        }
+    } else {
+        if (geometryState.indicesBuf) {
+            gl.drawElements(geometryState.primitive, geometryState.indicesBuf.numItems, geometryState.indicesBuf.itemType, 0);
+            frame.drawElements++;
+        } else if (geometryState.positions) {
+            gl.drawArrays(gl.TRIANGLES, 0, geometryState.positions.numItems);
+            frame.drawArrays++;
+        }
+    }
+};
+
+ShadowRenderer.prototype._allocate = function (mesh) {
+    const scene = mesh.scene;
+    const gl = scene.canvas.gl;
+    this._program = new Program(gl, this._shaderSource);
+    this._scene = scene;
+    this._useCount = 0;
+    if (this._program.errors) {
+        this.errors = this._program.errors;
+        return;
+    }
+    const program = this._program;
+    this._uPositionsDecodeMatrix = program.getLocation("positionsDecodeMatrix");
+    this._uModelMatrix = program.getLocation("modelMatrix");
+    this._uShadowViewMatrix = program.getLocation("shadowViewMatrix");
+    this._uShadowProjMatrix = program.getLocation("shadowProjMatrix");
+    this._uSectionPlanes = {};
+    const clips = scene._sectionPlanesState.sectionPlanes;
+    for (let i = 0, len = clips.length; i < len; i++) {
+        this._uSectionPlanes.push({
+            active: program.getLocation("sectionPlaneActive" + i),
+            pos: program.getLocation("sectionPlanePos" + i),
+            dir: program.getLocation("sectionPlaneDir" + i)
+        });
+    }
+    this._aPosition = program.getAttribute("position");
+    this._uClippable = program.getLocation("clippable");
+    this._uOffset = program.getLocation("offset");
+    this._lastMaterialId = null;
+    this._lastVertexBufsId = null;
+    this._lastGeometryId = null;
+};
+
+ShadowRenderer.prototype._bindProgram = function (frame) {
+    if (!this._program) {
+        this._allocate(mesh);
+    }
+    const scene = this._scene;
+    const gl = scene.canvas.gl;
+    const sectionPlanesState = scene._sectionPlanesState;
+    this._program.bind();
+    frame.useProgram++;
+    gl.uniformMatrix4fv(this._uShadowViewMatrix, false, frame.shadowViewMatrix);
+    gl.uniformMatrix4fv(this._uShadowProjMatrix, false, frame.shadowProjMatrix);
+    this._lastMaterialId = null;
+    this._lastVertexBufsId = null;
+    this._lastGeometryId = null;
+    if (sectionPlanesState.sectionPlanes.length > 0) {
+        let sectionPlaneUniforms;
+        let uSectionPlaneActive;
+        let sectionPlane;
+        let uSectionPlanePos;
+        let uSectionPlaneDir;
+        for (let i = 0, len = this._uSectionPlanes.length; i < len; i++) {
+            sectionPlaneUniforms = this._uSectionPlanes[i];
+            uSectionPlaneActive = sectionPlaneUniforms.active;
+            sectionPlane = sectionPlanesState.sectionPlanes[i];
+            if (uSectionPlaneActive) {
+                gl.uniform1i(uSectionPlaneActive, sectionPlane.active);
+            }
+            uSectionPlanePos = sectionPlaneUniforms.pos;
+            if (uSectionPlanePos) {
+                gl.uniform3fv(sectionPlaneUniforms.pos, sectionPlane.pos);
+            }
+            uSectionPlaneDir = sectionPlaneUniforms.dir;
+            if (uSectionPlaneDir) {
+                gl.uniform3fv(sectionPlaneUniforms.dir, sectionPlane.dir);
+            }
+        }
+    }
+};
+
+export {ShadowRenderer};

package/src/lib/gltf/assets/yjkkit-sdk/src/viewer/scene/mesh/shadow/ShadowShaderSource.js

@@ -0,0 +1,96 @@
+/**
+ * @private
+ */
+class ShadowShaderSource {
+    constructor(mesh) {
+        this.vertex = buildVertex(mesh);
+        this.fragment = buildFragment(mesh);
+    }
+}
+
+function buildVertex(mesh) {
+    const scene = mesh.scene;
+    const clipping = scene._sectionPlanesState.sectionPlanes.length > 0;
+    const quantizedGeometry = !!mesh._geometry._state.compressGeometry;
+    const src = [];
+    src.push("// Mesh shadow vertex shader");
+    src.push("attribute vec3 position;");
+    src.push("uniform mat4 modelMatrix;");
+    src.push("uniform mat4 shadowViewMatrix;");
+    src.push("uniform mat4 shadowProjMatrix;");
+    src.push("uniform vec3 offset;");
+    if (quantizedGeometry) {
+        src.push("uniform mat4 positionsDecodeMatrix;");
+    }
+    if (clipping) {
+        src.push("varying vec4 vWorldPosition;");
+    }
+    src.push("void main(void) {");
+    src.push("vec4 localPosition = vec4(position, 1.0); ");
+    src.push("vec4 worldPosition;");
+    if (quantizedGeometry) {
+        src.push("localPosition = positionsDecodeMatrix * localPosition;");
+    }
+    src.push("worldPosition = modelMatrix * localPosition;");
+    src.push("worldPosition.xyz = worldPosition.xyz + offset;");
+    src.push("vec4 viewPosition  = shadowViewMatrix * worldPosition; ");
+    if (clipping) {
+        src.push("vWorldPosition = worldPosition;");
+    }
+    src.push("   gl_Position = shadowProjMatrix * viewPosition;");
+    src.push("}");
+    return src;
+}
+
+function buildFragment(mesh) {
+    const scene = mesh.scene;
+    const gl = scene.canvas.gl;
+    const sectionPlanesState = scene._sectionPlanesState;
+    const clipping = sectionPlanesState.sectionPlanes.length > 0;
+    const src = [];
+    src.push("// Mesh shadow fragment shader");
+
+    src.push("#ifdef GL_FRAGMENT_PRECISION_HIGH");
+    src.push("precision highp float;");
+    src.push("precision highp int;");
+    src.push("#else");
+    src.push("precision mediump float;");
+    src.push("precision mediump int;");
+    src.push("#endif");
+
+    if (clipping) {
+        src.push("uniform bool clippable;");
+        src.push("varying vec4 vWorldPosition;");
+        for (var i = 0; i < sectionPlanesState.sectionPlanes.length; i++) {
+            src.push("uniform bool sectionPlaneActive" + i + ";");
+            src.push("uniform vec3 sectionPlanePos" + i + ";");
+            src.push("uniform vec3 sectionPlaneDir" + i + ";");
+        }
+    }
+
+    src.push("vec4 encodeFloat( const in float depth ) {");
+    src.push("  const vec4 bitShift = vec4(256 * 256 * 256, 256 * 256, 256, 1.0);");
+    src.push("  const vec4 bitMask = vec4(0, 1.0 / 256.0, 1.0 / 256.0, 1.0 / 256.0);");
+    src.push("  vec4 comp = fract(depth * bitShift);");
+    src.push("  comp -= comp.xxyz * bitMask;");
+    src.push("  return comp;");
+    src.push("}");
+
+    src.push("void main(void) {");
+    if (clipping) {
+        src.push("if (clippable) {");
+        src.push("  float dist = 0.0;");
+        for (var i = 0; i < sectionPlanesState.sectionPlanes.length; i++) {
+            src.push("if (sectionPlaneActive" + i + ") {");
+            src.push("   dist += clamp(dot(-sectionPlaneDir" + i + ".xyz, vWorldPosition.xyz - sectionPlanePos" + i + ".xyz), 0.0, 1000.0);");
+            src.push("}");
+        }
+        src.push("  if (dist > 0.0) { discard; }");
+        src.push("}");
+    }
+    src.push("gl_FragColor = encodeFloat(gl_FragCoord.z);");
+    src.push("}");
+    return src;
+}
+
+export {ShadowShaderSource};

package/src/lib/gltf/assets/yjkkit-sdk/src/viewer/scene/metriqs/Metriqs.js

@@ -0,0 +1,259 @@
+//----------------------------------------------------------------------------------------------------------------------
+// This file is named "Metriqs.js" because "Metrics.js" is blocked by uBlock Origin (https://en.wikipedia.org/wiki/UBlock_Origin)
+//----------------------------------------------------------------------------------------------------------------------
+
+import {Component} from "../Component.js";
+import {math} from "../math/math.js";
+
+const unitsInfo = {
+    meters: {
+        abbrev: "m"
+    },
+    metres: {
+        abbrev: "m"
+    },
+    centimeters: {
+        abbrev: "cm"
+    },
+    centimetres: {
+        abbrev: "cm"
+    },
+    millimeters: {
+        abbrev: "mm"
+    },
+    millimetres: {
+        abbrev: "mm"
+    },
+    yards: {
+        abbrev: "yd"
+    },
+    feet: {
+        abbrev: "ft"
+    },
+    inches: {
+        abbrev: "in"
+    }
+};
+
+/**
+ * @desc Configures its {@link Scene}'s measurement unit and mapping between the Real-space and World-space 3D Cartesian coordinate systems.
+ *
+ *
+ * ## Overview
+ *
+ * * Located at {@link Scene#metrics}.
+ * * {@link Metrics#units} configures the Real-space unit type, which is ````"meters"```` by default.
+ * * {@link Metrics#scale} configures the number of Real-space units represented by each unit within the World-space 3D coordinate system. This is ````1.0```` by default.
+ * * {@link Metrics#origin} configures the 3D Real-space origin, in current Real-space units, at which this {@link Scene}'s World-space coordinate origin sits, This is ````[0,0,0]```` by default.
+ *
+ * ## Usage
+ *
+ * Let's load a model using an {@link XKTLoaderPlugin}, then configure the Real-space unit type and the coordinate
+ * mapping between the Real-space and World-space 3D coordinate systems.
+ *
+ * ````JavaScript
+ * import {Viewer, XKTLoaderPlugin} from "yjkkit-sdk.es.js";
+ *
+ * const viewer = new Viewer({
+ *     canvasId: "myCanvas"
+ * });
+ *
+ * viewer.scene.camera.eye = [-2.37, 18.97, -26.12];
+ * viewer.scene.camera.look = [10.97, 5.82, -11.22];
+ * viewer.scene.camera.up = [0.36, 0.83, 0.40];
+ *
+ * const xktLoader = new XKTLoaderPlugin(viewer);
+ *
+ * const model = xktLoader.load({
+ *     src: "./models/xkt/duplex/duplex.xkt"
+ * });
+ *
+ * const metrics = viewer.scene.metrics;
+ *
+ * metrics.units = "meters";
+ * metrics.scale = 10.0;
+ * metrics.origin = [100.0, 0.0, 200.0];
+ * ````
+ */
+class Metrics extends Component {
+
+    /**
+     * @constructor
+     * @private
+     */
+    constructor(owner, cfg = {}) {
+
+        super(owner, cfg);
+
+        this._units = "meters";
+        this._scale = 1.0;
+        this._origin = math.vec3([0, 0, 0]);
+
+        this.units = cfg.units;
+        this.scale = cfg.scale;
+        this.origin = cfg.origin;
+    }
+
+    /**
+     * Gets info about the supported Real-space unit types.
+     *
+     * This will be:
+     *
+     * ````javascript
+     * {
+     *      {
+     *          meters: {
+     *              abbrev: "m"
+     *          },
+     *          metres: {
+     *              abbrev: "m"
+     *          },
+     *          centimeters: {
+     *              abbrev: "cm"
+     *          },
+     *          centimetres: {
+     *              abbrev: "cm"
+     *          },
+     *          millimeters: {
+     *              abbrev: "mm"
+     *          },
+     *          millimetres: {
+     *              abbrev: "mm"
+     *          },
+     *          yards: {
+     *              abbrev: "yd"
+     *          },
+     *          feet: {
+     *              abbrev: "ft"
+     *          },
+     *          inches: {
+     *              abbrev: "in"
+     *          }
+     *      }
+     * }
+     * ````
+     *
+     * @type {*}
+     */
+    get unitsInfo() {
+        return unitsInfo;
+    }
+
+    /**
+     * Sets the {@link Scene}'s Real-space unit type.
+     *
+     * Accepted values are ````"meters"````, ````"centimeters"````, ````"millimeters"````, ````"metres"````, ````"centimetres"````, ````"millimetres"````, ````"yards"````, ````"feet"```` and ````"inches"````.
+     *
+     * @emits ````"units"```` event on change, with the value of this property.
+     * @type {String}
+     */
+    set units(value) {
+        if (!value) {
+            value = "meters";
+        }
+        const info = unitsInfo[value];
+        if (!info) {
+            this.error("Unsupported value for 'units': " + value + " defaulting to 'meters'");
+            value = "meters";
+        }
+        this._units = value;
+        this.fire("units", this._units);
+    }
+
+    /**
+     * Gets the {@link Scene}'s Real-space unit type.
+     *
+     * @type {String}
+     */
+    get units() {
+        return this._units;
+    }
+
+    /**
+     * Sets the number of Real-space units represented by each unit of the {@link Scene}'s World-space coordinate system.
+     *
+     * For example, if {@link Metrics#units} is ````"meters"````, and there are ten meters per World-space coordinate system unit, then ````scale```` would have a value of ````10.0````.
+     *
+     * @emits ````"scale"```` event on change, with the value of this property.
+     * @type {Number}
+     */
+    set scale(value) {
+        value = value || 1;
+        if (value <= 0) {
+            this.error("scale value should be larger than zero");
+            return;
+        }
+        this._scale = value;
+        this.fire("scale", this._scale);
+    }
+
+    /**
+     * Gets the number of Real-space units represented by each unit of the {@link Scene}'s World-space coordinate system.
+     *
+     * @type {Number}
+     */
+    get scale() {
+        return this._scale;
+    }
+
+    /**
+     * Sets the Real-space 3D origin, in Real-space units, at which this {@link Scene}'s World-space coordinate origin ````[0,0,0]```` sits.
+     *
+     * @emits "origin" event on change, with the value of this property.
+     * @type {Number[]}
+     */
+    set origin(value) {
+        if (!value) {
+            this._origin[0] = 0;
+            this._origin[1] = 0;
+            this._origin[2] = 0;
+            return;
+        }
+        this._origin[0] = value[0];
+        this._origin[1] = value[1];
+        this._origin[2] = value[2];
+        this.fire("origin", this._origin);
+    }
+
+    /**
+     * Gets the 3D Real-space origin, in Real-space units, at which this {@link Scene}'s World-space coordinate origin ````[0,0,0]```` sits.
+     *
+     * @type {Number[]}
+     */
+    get origin() {
+        return this._origin;
+    }
+
+    /**
+     * Converts a 3D position from World-space to Real-space.
+     *
+     * This is equivalent to ````realPos = #origin + (worldPos * #scale)````.
+     *
+     * @param {Number[]} worldPos World-space 3D position, in World coordinate system units.
+     * @param {Number[]} [realPos] Destination for Real-space 3D position.
+     * @returns {Number[]} Real-space 3D position, in units indicated by {@link Metrics#units}.
+     */
+    worldToRealPos(worldPos, realPos = math.vec3(3)) {
+        realPos[0] = this._origin[0] + (this._scale * worldPos[0]);
+        realPos[1] = this._origin[1] + (this._scale * worldPos[1]);
+        realPos[2] = this._origin[2] + (this._scale * worldPos[2]);
+    }
+
+    /**
+     * Converts a 3D position from Real-space to World-space.
+     *
+     * This is equivalent to ````worldPos = (worldPos - #origin) / #scale````.
+     *
+     * @param {Number[]} realPos Real-space 3D position.
+     * @param {Number[]} [worldPos] Destination for World-space 3D position.
+     * @returns {Number[]} World-space 3D position.
+     */
+    realToWorldPos(realPos, worldPos = math.vec3(3)) {
+        worldPos[0] = (realPos[0] - this._origin[0]) / this._scale;
+        worldPos[1] = (realPos[1] - this._origin[1]) / this._scale;
+        worldPos[2] = (realPos[2] - this._origin[2]) / this._scale;
+        return worldPos;
+    }
+}
+
+export {Metrics};