@xeokit/xeokit-sdk 2.5.2-beta-11 → 2.5.2-beta-16

package/src/src/viewer/scene/materials/Texture.js

@@ -1,513 +0,0 @@
-import {Component} from '../Component.js';
-import {RenderState} from '../webgl/RenderState.js';
-import {Texture2D} from '../webgl/Texture2D.js';
-import {math} from '../math/math.js';
-import {stats} from '../stats.js';
-import {
-    ClampToEdgeWrapping, LinearEncoding,
-    LinearFilter,
-    LinearMipMapLinearFilter,
-    LinearMipMapNearestFilter, MirroredRepeatWrapping, NearestFilter,
-    NearestMipMapLinearFilter, NearestMipMapNearestFilter, RepeatWrapping, sRGBEncoding
-} from "../constants/constants.js";
-
-function ensureImageSizePowerOfTwo(image) {
-    if (!isPowerOfTwo(image.width) || !isPowerOfTwo(image.height)) {
-        const canvas = document.createElement("canvas");
-        canvas.width = nextHighestPowerOfTwo(image.width);
-        canvas.height = nextHighestPowerOfTwo(image.height);
-        const ctx = canvas.getContext("2d");
-        ctx.drawImage(image,
-            0, 0, image.width, image.height,
-            0, 0, canvas.width, canvas.height);
-        image = canvas;
-    }
-    return image;
-}
-
-function isPowerOfTwo(x) {
-    return (x & (x - 1)) === 0;
-}
-
-function nextHighestPowerOfTwo(x) {
-    --x;
-    for (let i = 1; i < 32; i <<= 1) {
-        x = x | x >> i;
-    }
-    return x + 1;
-}
-
-/**
- * @desc A 2D texture map.
- *
- * * Textures are attached to {@link Material}s, which are attached to {@link Mesh}es.
- * * To create a Texture from an image file, set {@link Texture#src} to the image file path.
- * * To create a Texture from an HTMLImageElement, set the Texture's {@link Texture#image} to the HTMLImageElement.
- *
- * ## Usage
- *
- * In this example we have a Mesh with a {@link PhongMaterial} which applies diffuse {@link Texture}, and a {@link buildTorusGeometry} which builds a {@link ReadableGeometry}.
- *
- * Note that xeokit will ignore {@link PhongMaterial#diffuse} and {@link PhongMaterial#specular}, since we override those
- * with {@link PhongMaterial#diffuseMap} and {@link PhongMaterial#specularMap}. The {@link Texture} pixel colors directly
- * provide the diffuse and specular components for each fragment across the {@link ReadableGeometry} surface.
- *
- * [[Run this example](/examples/#materials_Texture)]
- *
- * ```` javascript
- * import {Viewer, Mesh, buildTorusGeometry,
- *      ReadableGeometry, PhongMaterial, Texture} from "xeokit-sdk.es.js";
- *
- * const viewer = new Viewer({
- *      canvasId: "myCanvas"
- * });
- *
- * viewer.camera.eye = [0, 0, 5];
- * viewer.camera.look = [0, 0, 0];
- * viewer.camera.up = [0, 1, 0];
- *
- * new Mesh(viewer.scene, {
- *      geometry: new ReadableGeometry(viewer.scene, buildTorusGeometry({
- *          center: [0, 0, 0],
- *          radius: 1.5,
- *          tube: 0.5,
- *          radialSegments: 32,
- *          tubeSegments: 24,
- *          arc: Math.PI * 2.0
- *      }),
- *      material: new PhongMaterial(viewer.scene, {
- *          ambient: [0.9, 0.3, 0.9],
- *          shininess: 30,
- *          diffuseMap: new Texture(viewer.scene, {
- *              src: "textures/diffuse/uvGrid2.jpg"
- *          })
- *      })
- * });
- *````
- */
-class Texture extends Component {
-
-    /**
-     @private
-     */
-    get type() {
-        return "Texture";
-    }
-
-    /**
-     * @constructor
-     * @param {Component} owner Owner component. When destroyed, the owner will destroy this Texture as well.
-     * @param {*} [cfg] Configs
-     * @param {String} [cfg.id] Optional ID for this Texture, unique among all components in the parent scene, generated automatically when omitted.
-     * @param {String} [cfg.src=null] Path to image file to load into this Texture. See the {@link Texture#src} property for more info.
-     * @param {HTMLImageElement} [cfg.image=null] HTML Image object to load into this Texture. See the {@link Texture#image} property for more info.
-     * @param {Number} [cfg.minFilter=LinearMipmapLinearFilter] How the texture is sampled when a texel covers less than one pixel.
-     * Supported values are {@link LinearMipmapLinearFilter}, {@link LinearMipMapNearestFilter}, {@link NearestMipMapNearestFilter}, {@link NearestMipMapLinearFilter} and {@link LinearMipMapLinearFilter}.
-     * @param {Number} [cfg.magFilter=LinearFilter] How the texture is sampled when a texel covers more than one pixel. Supported values are {@link LinearFilter} and {@link NearestFilter}.
-     * @param {Number} [cfg.wrapS=RepeatWrapping] Wrap parameter for texture coordinate *S*. Supported values are {@link ClampToEdgeWrapping}, {@link MirroredRepeatWrapping} and {@link RepeatWrapping}.
-     * @param {Number} [cfg.wrapT=RepeatWrapping] Wrap parameter for texture coordinate *T*. Supported values are {@link ClampToEdgeWrapping}, {@link MirroredRepeatWrapping} and {@link RepeatWrapping}..
-     * @param {Boolean} [cfg.flipY=false] Flips this Texture's source data along its vertical axis when ````true````.
-     * @param  {Number} [cfg.encoding=LinearEncoding] Encoding format. Supported values are {@link LinearEncoding} and {@link sRGBEncoding}.
-     * @param {Number[]} [cfg.translate=[0,0]] 2D translation vector that will be added to texture's *S* and *T* coordinates.
-     * @param {Number[]} [cfg.scale=[1,1]] 2D scaling vector that will be applied to texture's *S* and *T* coordinates.
-     * @param {Number} [cfg.rotate=0] Rotation, in degrees, that will be applied to texture's *S* and *T* coordinates.
-     */
-    constructor(owner, cfg = {}) {
-
-        super(owner, cfg);
-
-        this._state = new RenderState({
-            texture: new Texture2D({gl: this.scene.canvas.gl}),
-            matrix: math.identityMat4(),
-            hasMatrix: (cfg.translate && (cfg.translate[0] !== 0 || cfg.translate[1] !== 0)) || (!!cfg.rotate) || (cfg.scale && (cfg.scale[0] !== 0 || cfg.scale[1] !== 0)),
-            minFilter: this._checkMinFilter(cfg.minFilter),
-            magFilter: this._checkMagFilter(cfg.magFilter),
-            wrapS: this._checkWrapS(cfg.wrapS),
-            wrapT: this._checkWrapT(cfg.wrapT),
-            flipY: this._checkFlipY(cfg.flipY),
-            encoding: this._checkEncoding(cfg.encoding)
-        });
-
-        // Data source
-
-        this._src = null;
-        this._image = null;
-
-        // Transformation
-
-        this._translate = math.vec2([0, 0]);
-        this._scale = math.vec2([1, 1]);
-        this._rotate = math.vec2([0, 0]);
-
-        this._matrixDirty = false;
-
-        // Transform
-
-        this.translate = cfg.translate;
-        this.scale = cfg.scale;
-        this.rotate = cfg.rotate;
-
-        // Data source
-
-        if (cfg.src) {
-            this.src = cfg.src; // Image file
-        } else if (cfg.image) {
-            this.image = cfg.image; // Image object
-        }
-
-        stats.memory.textures++;
-    }
-
-    _checkMinFilter(value) {
-        value = value || LinearMipMapLinearFilter;
-        if (value !== LinearFilter &&
-            value !== LinearMipMapNearestFilter &&
-            value !== LinearMipMapLinearFilter &&
-            value !== NearestMipMapLinearFilter &&
-            value !== NearestMipMapNearestFilter) {
-            this.error("Unsupported value for 'minFilter' - supported values are LinearFilter, LinearMipMapNearestFilter, NearestMipMapNearestFilter, " +
-                "NearestMipMapLinearFilter and LinearMipMapLinearFilter. Defaulting to LinearMipMapLinearFilter.");
-            value = LinearMipMapLinearFilter;
-        }
-        return value;
-    }
-
-    _checkMagFilter(value) {
-        value = value || LinearFilter;
-        if (value !== LinearFilter && value !== NearestFilter) {
-            this.error("Unsupported value for 'magFilter' - supported values are LinearFilter and NearestFilter. Defaulting to LinearFilter.");
-            value = LinearFilter;
-        }
-        return value;
-    }
-
-    _checkWrapS(value) {
-        value = value || RepeatWrapping;
-        if (value !== ClampToEdgeWrapping && value !== MirroredRepeatWrapping && value !== RepeatWrapping) {
-            this.error("Unsupported value for 'wrapS' - supported values are ClampToEdgeWrapping, MirroredRepeatWrapping and RepeatWrapping. Defaulting to RepeatWrapping.");
-            value = RepeatWrapping;
-        }
-        return value;
-    }
-
-    _checkWrapT(value) {
-        value = value || RepeatWrapping;
-        if (value !== ClampToEdgeWrapping && value !== MirroredRepeatWrapping && value !== RepeatWrapping) {
-            this.error("Unsupported value for 'wrapT' - supported values are ClampToEdgeWrapping, MirroredRepeatWrapping and RepeatWrapping. Defaulting to RepeatWrapping.");
-            value = RepeatWrapping;
-        }
-        return value;
-    }
-
-    _checkFlipY(value) {
-        return !!value;
-    }
-
-    _checkEncoding(value) {
-        value = value || LinearEncoding;
-        if (value !== LinearEncoding && value !== sRGBEncoding) {
-            this.error("Unsupported value for 'encoding' - supported values are LinearEncoding and sRGBEncoding. Defaulting to LinearEncoding.");
-            value = LinearEncoding;
-        }
-        return value;
-    }
-
-    _webglContextRestored() {
-        this._state.texture = new Texture2D({gl: this.scene.canvas.gl});
-        if (this._image) {
-            this.image = this._image;
-        } else if (this._src) {
-            this.src = this._src;
-        }
-    }
-
-    _update() {
-        const state = this._state;
-        if (this._matrixDirty) {
-            let matrix;
-            let t;
-            if (this._translate[0] !== 0 || this._translate[1] !== 0) {
-                matrix = math.translationMat4v([this._translate[0], this._translate[1], 0], this._state.matrix);
-            }
-            if (this._scale[0] !== 1 || this._scale[1] !== 1) {
-                t = math.scalingMat4v([this._scale[0], this._scale[1], 1]);
-                matrix = matrix ? math.mulMat4(matrix, t) : t;
-            }
-            if (this._rotate !== 0) {
-                t = math.rotationMat4v(this._rotate * 0.0174532925, [0, 0, 1]);
-                matrix = matrix ? math.mulMat4(matrix, t) : t;
-            }
-            if (matrix) {
-                state.matrix = matrix;
-            }
-            this._matrixDirty = false;
-        }
-        this.glRedraw();
-    }
-
-
-    /**
-     * Sets an HTML DOM Image object to source this Texture from.
-     *
-     * Sets {@link Texture#src} null.
-     *
-     * @type {HTMLImageElement}
-     */
-    set image(value) {
-        this._image = ensureImageSizePowerOfTwo(value);
-        this._image.crossOrigin = "Anonymous";
-        this._state.texture.setImage(this._image, this._state);
-        this._src = null;
-        this.glRedraw();
-    }
-
-    /**
-     * Gets HTML DOM Image object this Texture is sourced from, if any.
-     *
-     * Returns null if not set.
-     *
-     * @type {HTMLImageElement}
-     */
-    get image() {
-        return this._image;
-    }
-
-    /**
-     * Sets path to an image file to source this Texture from.
-     *
-     * Sets {@link Texture#image} null.
-     *
-     * @type {String}
-     */
-    set src(src) {
-        this.scene.loading++;
-        this.scene.canvas.spinner.processes++;
-        const self = this;
-        let image = new Image();
-        image.onload = function () {
-            image = ensureImageSizePowerOfTwo(image);
-            self._state.texture.setImage(image, self._state);
-            self.scene.loading--;
-            self.glRedraw();
-            self.scene.canvas.spinner.processes--;
-        };
-        image.src = src;
-        this._src = src;
-        this._image = null;
-    }
-
-    /**
-     * Gets path to the image file this Texture from, if any.
-     *
-     * Returns null if not set.
-     *
-     * @type {String}
-     */
-    get src() {
-        return this._src;
-    }
-
-    /**
-     * Sets the 2D translation vector added to this Texture's *S* and *T* UV coordinates.
-     *
-     * Default value is ````[0, 0]````.
-     *
-     * @type {Number[]}
-     */
-    set translate(value) {
-        this._translate.set(value || [0, 0]);
-        this._matrixDirty = true;
-        this._needUpdate();
-    }
-
-    /**
-     * Gets the 2D translation vector added to this Texture's *S* and *T* UV coordinates.
-     *
-     * Default value is ````[0, 0]````.
-     *
-     * @type {Number[]}
-     */
-    get translate() {
-        return this._translate;
-    }
-
-    /**
-     * Sets the 2D scaling vector that will be applied to this Texture's *S* and *T* UV coordinates.
-     *
-     * Default value is ````[1, 1]````.
-     *
-     * @type {Number[]}
-     */
-    set scale(value) {
-        this._scale.set(value || [1, 1]);
-        this._matrixDirty = true;
-        this._needUpdate();
-    }
-
-    /**
-     * Gets the 2D scaling vector that will be applied to this Texture's *S* and *T* UV coordinates.
-     *
-     * Default value is ````[1, 1]````.
-     *
-     * @type {Number[]}
-     */
-    get scale() {
-        return this._scale;
-    }
-
-    /**
-     * Sets the rotation angles, in degrees, that will be applied to this Texture's *S* and *T* UV coordinates.
-     *
-     * Default value is ````0````.
-     *
-     * @type {Number}
-     */
-    set rotate(value) {
-        value = value || 0;
-        if (this._rotate === value) {
-            return;
-        }
-        this._rotate = value;
-        this._matrixDirty = true;
-        this._needUpdate();
-    }
-
-    /**
-     * Gets the rotation angles, in degrees, that will be applied to this Texture's *S* and *T* UV coordinates.
-     *
-     * Default value is ````0````.
-     *
-     * @type {Number}
-     */
-    get rotate() {
-        return this._rotate;
-    }
-
-    /**
-     * Gets how this Texture is sampled when a texel covers less than one pixel.
-     *
-     * Options are:
-     *
-     * * NearestFilter - Uses the value of the texture element that is nearest
-     * (in Manhattan distance) to the center of the pixel being textured.
-     *
-     * * LinearFilter - Uses the weighted average of the four texture elements that are
-     * closest to the center of the pixel being textured.
-     *
-     * * NearestMipMapNearestFilter - Chooses the mipmap that most closely matches the
-     * size of the pixel being textured and uses the "nearest" criterion (the texture
-     * element nearest to the center of the pixel) to produce a texture value.
-     *
-     * * LinearMipMapNearestFilter - Chooses the mipmap that most closely matches the size of
-     * the pixel being textured and uses the "linear" criterion (a weighted average of the
-     * four texture elements that are closest to the center of the pixel) to produce a
-     * texture value.
-     *
-     * * NearestMipMapLinearFilter - Chooses the two mipmaps that most closely
-     * match the size of the pixel being textured and uses the "nearest" criterion
-     * (the texture element nearest to the center of the pixel) to produce a texture
-     * value from each mipmap. The final texture value is a weighted average of those two
-     * values.
-     *
-     * * LinearMipMapLinearFilter - (default) - Chooses the two mipmaps that most closely match the size
-     * of the pixel being textured and uses the "linear" criterion (a weighted average
-     * of the four texture elements that are closest to the center of the pixel) to
-     * produce a texture value from each mipmap. The final texture value is a weighted
-     * average of those two values.
-     *
-     * Default value is LinearMipMapLinearFilter.
-     *
-     *  @type {Number}
-     */
-    get minFilter() {
-        return this._state.minFilter;
-    }
-
-    /**
-     * Gets how this Texture is sampled when a texel covers more than one pixel.
-     *
-     * * NearestFilter - Uses the value of the texture element that is nearest
-     * (in Manhattan distance) to the center of the pixel being textured.
-     * * LinearFilter - (default) - Uses the weighted average of the four texture elements that are
-     * closest to the center of the pixel being textured.
-     *
-     * Default value is LinearMipMapLinearFilter.
-     *
-     * @type {Number}
-     */
-    get magFilter() {
-        return this._state.magFilter;
-    }
-
-    /**
-     * Gets the wrap parameter for this Texture's *S* coordinate.
-     *
-     * Values can be:
-     *
-     * * ClampToEdgeWrapping -  causes *S* coordinates to be clamped to the size of the texture.
-     * * MirroredRepeatWrapping - causes the *S* coordinate to be set to the fractional part of the texture coordinate
-     * if the integer part of *S* is even; if the integer part of *S* is odd, then the *S* texture coordinate is
-     * set to *1 - frac ⁡ S* , where *frac ⁡ S* represents the fractional part of *S*.
-     * * RepeatWrapping - (default) - causes the integer part of the *S* coordinate to be ignored; xeokit uses only the
-     * fractional part, thereby creating a repeating pattern.
-     *
-     * Default value is RepeatWrapping.
-     *
-     * @type {Number}
-     */
-    get wrapS() {
-        return this._state.wrapS;
-    }
-
-    /**
-     * Gets the wrap parameter for this Texture's *T* coordinate.
-     *
-     * Values can be:
-     *
-     * * ClampToEdgeWrapping -  causes *S* coordinates to be clamped to the size of the texture.
-     *  * MirroredRepeatWrapping - causes the *S* coordinate to be set to the fractional part of the texture coordinate
-     * if the integer part of *S* is even; if the integer part of *S* is odd, then the *S* texture coordinate is
-     * set to *1 - frac ⁡ S* , where *frac ⁡ S* represents the fractional part of *S*.
-     * * RepeatWrapping - (default) - causes the integer part of the *S* coordinate to be ignored; xeokit uses only the
-     * fractional part, thereby creating a repeating pattern.
-     *
-     * Default value is RepeatWrapping.
-     *
-     * @type {Number}
-     */
-    get wrapT() {
-        return this._state.wrapT;
-    }
-
-    /**
-     * Gets if this Texture's source data is flipped along its vertical axis.
-     *
-     * @type {Number}
-     */
-    get flipY() {
-        return this._state.flipY;
-    }
-
-    /**
-     * Gets the Texture's encoding format.
-     *
-     * @type {Number}
-     */
-    get encoding() {
-        return this._state.encoding;
-    }
-
-    /**
-     * Destroys this Texture
-     */
-    destroy() {
-        super.destroy();
-        if (this._state.texture) {
-            this._state.texture.destroy();
-        }
-        this._state.destroy();
-        stats.memory.textures--;
-    }
-}
-
-export {Texture};

package/src/src/viewer/scene/materials/index.js

@@ -1,8 +0,0 @@
-export * from "./LambertMaterial.js";
-export * from "./MetallicMaterial.js";
-export * from "./SpecularMaterial.js";
-export * from "./PhongMaterial.js";
-export * from "./EmphasisMaterial.js";
-export * from "./EdgeMaterial.js";
-export * from "./Texture.js";
-export * from "./Fresnel.js";

package/src/src/viewer/scene/math/Frustum.js

@@ -1,118 +0,0 @@
-import {math} from "./math.js";
-
-const tempVec3a = math.vec3();
-const tempVec3b = math.vec3();
-const tempMat4a = math.mat4();
-
-/**
- * @private
- */
-class FrustumPlane {
-
-    constructor() {
-        this.normal = math.vec3();
-        this.offset = 0;
-        this.testVertex = math.vec3();
-    }
-
-    set(nx, ny, nz, offset) {
-        const s = 1.0 / Math.sqrt(nx * nx + ny * ny + nz * nz);
-        this.normal[0] = nx * s;
-        this.normal[1] = ny * s;
-        this.normal[2] = nz * s;
-        this.offset = offset * s;
-        this.testVertex[0] = (this.normal[0] >= 0.0) ? 1 : 0;
-        this.testVertex[1] = (this.normal[1] >= 0.0) ? 1 : 0;
-        this.testVertex[2] = (this.normal[2] >= 0.0) ? 1 : 0;
-    }
-}
-
-/**
- * @private
- */
-class Frustum {
-    constructor() {
-        this.planes = [
-            new FrustumPlane(), new FrustumPlane(), new FrustumPlane(),
-            new FrustumPlane(), new FrustumPlane(), new FrustumPlane()
-        ];
-    }
-}
-
-Frustum.INSIDE = 0;
-Frustum.INTERSECT = 1;
-Frustum.OUTSIDE = 2;
-
-/** @private */
-function setFrustum(frustum, viewMat, projMat) {
-
-    const m = math.mulMat4(projMat, viewMat, tempMat4a);
-
-    const m0 = m[0];
-    const m1 = m[1];
-    const m2 = m[2];
-    const m3 = m[3];
-    const m4 = m[4];
-    const m5 = m[5];
-    const m6 = m[6];
-    const m7 = m[7];
-    const m8 = m[8];
-    const m9 = m[9];
-    const m10 = m[10];
-    const m11 = m[11];
-    const m12 = m[12];
-    const m13 = m[13];
-    const m14 = m[14];
-    const m15 = m[15];
-
-    frustum.planes[0].set(m3 - m0, m7 - m4, m11 - m8, m15 - m12);
-    frustum.planes[1].set(m3 + m0, m7 + m4, m11 + m8, m15 + m12);
-    frustum.planes[2].set(m3 - m1, m7 - m5, m11 - m9, m15 - m13);
-    frustum.planes[3].set(m3 + m1, m7 + m5, m11 + m9, m15 + m13);
-    frustum.planes[4].set(m3 - m2, m7 - m6, m11 - m10, m15 - m14);
-    frustum.planes[5].set(m3 + m2, m7 + m6, m11 + m10, m15 + m14);
-}
-
-/** @private */
-function frustumIntersectsAABB3(frustum, aabb) {
-
-    let ret = Frustum.INSIDE;
-
-    const min = tempVec3a;
-    const max = tempVec3b;
-
-    min[0] = aabb[0];
-    min[1] = aabb[1];
-    min[2] = aabb[2];
-    max[0] = aabb[3];
-    max[1] = aabb[4];
-    max[2] = aabb[5];
-
-    const bminmax = [min, max];
-
-    for (let i = 0; i < 6; ++i) {
-        const plane = frustum.planes[i];
-        if (((plane.normal[0] * bminmax[plane.testVertex[0]][0]) +
-            (plane.normal[1] * bminmax[plane.testVertex[1]][1]) +
-            (plane.normal[2] * bminmax[plane.testVertex[2]][2]) +
-            (plane.offset)) < 0.0) {
-            return Frustum.OUTSIDE;
-        }
-
-        if (((plane.normal[0] * bminmax[1 - plane.testVertex[0]][0]) +
-            (plane.normal[1] * bminmax[1 - plane.testVertex[1]][1]) +
-            (plane.normal[2] * bminmax[1 - plane.testVertex[2]][2]) +
-            (plane.offset)) < 0.0) {
-            ret = Frustum.INTERSECT;
-        }
-    }
-
-    return ret;
-}
-
-export {
-    Frustum,
-    FrustumPlane,
-    frustumIntersectsAABB3,
-    setFrustum
-};