@woosh/meep-engine 2.33.3 → 2.33.8

package/engine/graphics/GraphicsEngine.js

@@ -4,16 +4,11 @@
 
 
 import {
-    CubeTextureLoader,
     Group,
     LinearEncoding,
     NoToneMapping,
-    PMREMGenerator,
     Raycaster as ThreeRaycaster,
     Scene as ThreeScene,
-    sRGBEncoding,
-    TextureLoader,
-    UnsignedByteType,
     Vector3 as ThreeVector3,
     VSMShadowMap,
     WebGLRenderer,
@@ -38,29 +33,13 @@ import { renderTextureToScreenQuad } from "./render/utils/renderTextureToScreenQ
 import { globalMetrics } from "../metrics/GlobalMetrics.js";
 import { MetricsCategory } from "../metrics/MetricsCategory.js";
 import Vector1 from "../../core/geom/Vector1.js";
-import { noop } from "../../core/function/Functions.js";
 import { NormalFrameBuffer } from "./render/buffer/buffers/NormalFrameBuffer.js";
 import { MaterialManager } from "./material/manager/MaterialManager.js";
 import { CoalesceTextures } from "./material/manager/compilers/CoalesceTextures.js";
 import { ShadowMapRenderer } from "./shadows/ShadowMapRenderer.js";
 import { CameraViewManager } from "./render/view/CameraViewManager.js";
 import { StandardFrameBuffers } from "./StandardFrameBuffers.js";
-import { computeFileExtension } from "../../core/FilePath.js";
-import { EXRLoader } from "three/examples/jsm/loaders/EXRLoader.js";
-
-/**
- *
- * @param {String} path
- * @param {String} format
- * @returns {String[]}
- */
-export function buildCubeURLs(path, format) {
-    return [
-        path + "posx" + format, path + "negx" + format,
-        path + "posy" + format, path + "negy" + format,
-        path + "posz" + format, path + "negz" + format
-    ];
-}
+import { load_environment_map } from "./texture/cubemap/load_environment_map.js";
 
 /**
  *
@@ -261,56 +240,6 @@ GraphicsEngine.prototype.getRenderer = function () {
     return this.renderer;
 };
 
-/**
- *
- * @param {string[]|string} paths
- * @return {Promise<THREE.CubeTexture>}
- */
-function load_cube_texture(paths) {
-    // piece-wise cubemap, a collection of images for each face
-    const cubeTextureLoader = new CubeTextureLoader();
-    return new Promise((resolve, reject) => {
-        cubeTextureLoader.load(
-            paths,
-            texture => {
-                resolve(texture);
-            },
-            noop,
-            reject
-        );
-    });
-}
-
-/**
- *
- * @param {string} path
- * @return {Promise<THREE.Texture>}
- */
-function load_exr_texture(path) {
-    return new Promise((resolve, reject) => {
-        new EXRLoader()
-            .setDataType(UnsignedByteType)
-            .load(path, texture => {
-                resolve(texture);
-            }, noop, reject);
-    })
-}
-
-/**
- *
- * @param {string} path
- * @return {Promise<THREE.Texture>}
- */
-function load_standard_texture(path) {
-    return new Promise((resolve, reject) => {
-        new TextureLoader()
-            .load(path, texture => {
-                texture.encoding = sRGBEncoding;
-                resolve(texture);
-            }, noop, reject);
-    })
-}
-
 /**
  *
  * @param {string[]|string} paths URLs to faces of the cubemap
@@ -318,52 +247,16 @@ function load_standard_texture(path) {
  */
 GraphicsEngine.prototype.loadEnvironmentMap = async function (paths) {
 
-    const pmremGenerator = new PMREMGenerator(this.renderer);
-    let cube_rt;
-
-    if (Array.isArray(paths)) {
-        /**
-         *
-         * @type {THREE.CubeTexture}
-         */
-        const cube_texture = await load_cube_texture(paths);
-
-        cube_texture.encoding = sRGBEncoding;
-
-        // generate pre-filtered cubemap
-        pmremGenerator.compileCubemapShader();
-
-        cube_rt = pmremGenerator.fromCubemap(cube_texture);
-
-        // cleanup
-        cube_texture.dispose();
-    } else if (typeof paths === 'string') {
-        // single cubemap
-        const extension = computeFileExtension(paths).toLowerCase();
-        let texture;
-        if (extension === 'exr') {
-            texture = await load_exr_texture(paths);
-        } else if (extension === 'jpg') {
-            texture = await load_standard_texture(paths);
-        } else {
-            // unsupported extension
-            throw new Error(`Unsupported cube map texture extension '${extension}'`);
-        }
-        cube_rt = pmremGenerator.fromEquirectangular(texture);
-
-        texture.dispose();
-    } else {
-        throw new Error(`Unsupported parameter format: '${paths}'`);
-    }
-
-    pmremGenerator.dispose();
-
-    // assign environment
-    const t = cube_rt.texture;
-    this.scene.environment = t;
+    const { filtered } = await load_environment_map({
+        path: paths,
+        renderer: this.renderer,
+        original: false,
+        filtered: true
+    });
 
+    this.scene.environment = filtered;
 
-    return t;
+    return filtered;
 }
 
 GraphicsEngine.prototype.updateSize = function () {

package/engine/graphics/ecs/mesh/updateNodeByTransformAndBBB.js

@@ -1,7 +1,5 @@
-import { max2 } from "../../../../core/math/max2.js";
-import { min2 } from "../../../../core/math/min2.js";
-import { composeMatrix4 } from "../../util/composeMatrix4.js";
 import { Matrix4 as ThreeMatrix4 } from "three";
+import { aabb3_matrix4_project_by_corners } from "../../../../core/geom/3d/aabb/aabb3_matrix4_project_by_corners.js";
 
 
 const matrix4 = new ThreeMatrix4();
@@ -13,6 +11,12 @@ const matrix4 = new ThreeMatrix4();
  */
 const corners = new Float64Array(24);
 
+/**
+ *
+ * @type {Float32Array}
+ */
+const scratch_aabb = new Float32Array(6);
+
 /**
  *
  * @param {LeafNode} bvh
@@ -20,20 +24,7 @@ const corners = new Float64Array(24);
  * @param {Transform} transform
  */
 export function updateNodeByTransformAndBBB(bvh, boundingBox, transform) {
-    const position = transform.position;
-    const scale = transform.scale;
-    const rotation = transform.rotation;
-
-    composeMatrix4(matrix4, position, rotation, scale);
-
-    let x0 = Infinity,
-        y0 = Infinity,
-        z0 = Infinity,
-        x1 = -Infinity,
-        y1 = -Infinity,
-        z1 = -Infinity;
-
-    boundingBox.getCorners(corners);
+    transform.toThreeMatrix(matrix4);
 
     /**
      * Shortcut elements for faster access
@@ -41,29 +32,23 @@ export function updateNodeByTransformAndBBB(bvh, boundingBox, transform) {
      */
     const e = matrix4.elements;
 
-    for (let j = 0; j < 24; j += 3) {
-        const x = corners[j];
-        const y = corners[j + 1];
-        const z = corners[j + 2];
-
-        // perform matrix transform on corners
-
-        const w = 1 / (e[3] * x + e[7] * y + e[11] * z + e[15]);
+    updateNodeByMatrix4AndBBB(bvh, boundingBox, e);
+}
 
-        const _x = (e[0] * x + e[4] * y + e[8] * z + e[12]) * w;
-        const _y = (e[1] * x + e[5] * y + e[9] * z + e[13]) * w;
-        const _z = (e[2] * x + e[6] * y + e[10] * z + e[14]) * w;
+/**
+ *
+ * @param {LeafNode} bvh
+ * @param {AABB3} boundingBox
+ * @param {number[]} matrix4
+ */
+export function updateNodeByMatrix4AndBBB(bvh, boundingBox, matrix4) {
+    boundingBox.getCorners(corners);
 
-        // update AABB bounds
 
-        x0 = min2(x0, _x);
-        y0 = min2(y0, _y);
-        z0 = min2(z0, _z);
+    aabb3_matrix4_project_by_corners(scratch_aabb, corners, matrix4);
 
-        x1 = max2(x1, _x);
-        y1 = max2(y1, _y);
-        z1 = max2(z1, _z);
-    }
+    bvh.readFromArray(scratch_aabb, 0);
 
-    bvh.resize(x0, y0, z0, x1, y1, z1);
+    bvh.bubbleRefit();
 }
+

package/engine/graphics/ecs/mesh-v2/ShadedGeometry.js

@@ -0,0 +1,155 @@
+import { Mesh, Quaternion } from "three";
+import { updateNodeByMatrix4AndBBB } from "../mesh/updateNodeByTransformAndBBB.js";
+import { LeafNode } from "../../../../core/bvh2/LeafNode.js";
+import { AABB3 } from "../../../../core/bvh2/aabb3/AABB3.js";
+
+const _q = new Quaternion();
+const _aabb3 = new AABB3();
+
+export class ShadedGeometry {
+    constructor() {
+        /**
+         *
+         * @type {THREE.BufferGeometry|null}
+         */
+        this.geometry = null;
+        /**
+         *
+         * @type {THREE.Material|null}
+         */
+        this.material = null;
+
+        /**
+         *
+         * @type {THREE.Object3D|null}
+         * @private
+         */
+        this.__cached_object = null;
+
+        /**
+         *
+         * @type {LeafNode<ShadedGeometry>}
+         * @private
+         */
+        this.__bvh_leaf = new LeafNode(this, 0, 0, 0, 0, 0, 0);
+    }
+
+    get bvh() {
+        return this.__bvh_leaf;
+    }
+
+    /**
+     *
+     * @param {THREE.BufferGeometry} geometry
+     * @param {THREE.Material} material
+     */
+    from(geometry, material) {
+        this.geometry = geometry;
+        this.material = material;
+
+        // ensure that geometry has a bounding box
+        if (geometry.boundingBox === null) {
+            geometry.computeBoundingBox();
+        }
+
+        if (this.__cached_object === null) {
+            this.__cached_object = new Mesh(geometry, material);
+        } else {
+            this.__cached_object.material = material;
+            this.__cached_object.geometry = geometry;
+        }
+    }
+
+    /**
+     *
+     * @param geometry
+     * @param material
+     * @return {ShadedGeometry}
+     */
+    static from(geometry, material) {
+        const r = new ShadedGeometry();
+
+        r.from(geometry, material);
+
+        return r;
+    }
+
+    updateTransform() {
+        // update matrix
+        this.__cached_object.updateMatrix();
+
+        // update bounds
+
+        const gbb = this.geometry.boundingBox;
+
+        _aabb3.setBounds(
+            gbb.min.x,
+            gbb.min.y,
+            gbb.min.z,
+            gbb.max.x,
+            gbb.max.y,
+            gbb.max.z
+        );
+
+        updateNodeByMatrix4AndBBB(this.__bvh_leaf, _aabb3, this.__cached_object.matrix.elements);
+    }
+
+    /**
+     *
+     * @param {number} x
+     * @param {number} y
+     * @param {number} z
+     */
+    setPositionByComponents(x, y, z) {
+
+        this.__cached_object.position.set(x, y, z);
+
+        this.updateTransform();
+    }
+
+    /**
+     *
+     * @param {number} x
+     * @param {number} y
+     * @param {number} z
+     * @param {number} w
+     */
+    setRotationByComponents(x, y, z, w) {
+
+        _q.set(x, y, z, w);
+
+        this.__cached_object.rotation.setFromQuaternion(_q);
+
+        this.updateTransform();
+    }
+
+    /**
+     *
+     * @param {number} x
+     * @param {number} y
+     * @param {number} z
+     */
+    setScaleByComponents(x, y, z) {
+        this.__cached_object.scale.set(x, y, z);
+
+        this.updateTransform();
+    }
+
+    /**
+     *
+     * @param {Transform} t
+     */
+    applyTransform(t) {
+        // TODO this can be optimized quite a lot
+        const position = t.position;
+        this.setPositionByComponents(position.x, position.y, position.z);
+
+        const rotation = t.rotation;
+        this.setRotationByComponents(rotation.x, rotation.y, rotation.z, rotation.w);
+
+        const scale = t.scale;
+        this.setScaleByComponents(scale.x, scale.y, scale.z);
+
+        this.updateTransform();
+    }
+}

package/engine/graphics/ecs/mesh-v2/ShadedGeometrySystem.js

@@ -0,0 +1,68 @@
+import { ShadedGeometry } from "./ShadedGeometry.js";
+import { Transform } from "../../../ecs/transform/Transform.js";
+import { System } from "../../../ecs/System.js";
+
+export class ShadedGeometrySystem extends System {
+    /**
+     *
+     * @param {Engine} engine
+     */
+    constructor(engine) {
+        super();
+        this.dependencies = [ShadedGeometry, Transform];
+
+        /**
+         *s
+         * @type {Engine}
+         * @private
+         */
+        this.__engine = engine;
+
+        /**
+         *
+         * @type {RenderLayer|null}
+         * @private
+         */
+        this.__render_layer = null;
+    }
+
+    async startup(entityManager, readyCallback, errorCallback) {
+
+        const engine = this.__engine;
+
+        this.__render_layer = engine.graphics.layers.create('shaded-geometry');
+        this.__render_layer.extractRenderable = (sg) => sg.__cached_object;
+
+        readyCallback();
+    }
+
+    /**
+     *
+     * @param {ShadedGeometry} sg
+     * @param {Transform} t
+     * @param {number} entity
+     */
+    link(sg, t, entity) {
+        t.position.onChanged.add(sg.setPositionByComponents, sg);
+        t.rotation.onChanged.add(sg.setRotationByComponents, sg);
+        t.scale.onChanged.add(sg.setScaleByComponents, sg);
+
+        sg.applyTransform(t);
+
+        this.__render_layer.bvh.insertNode(sg.bvh);
+    }
+
+    /**
+     *
+     * @param {ShadedGeometry} sg
+     * @param {Transform} t
+     * @param {number} entity
+     */
+    unlink(sg, t, entity) {
+        t.position.onChanged.remove(sg.setPositionByComponents, sg);
+        t.rotation.onChanged.remove(sg.setRotationByComponents, sg);
+        t.scale.onChanged.remove(sg.setScaleByComponents, sg);
+
+        sg.bvh.disconnect();
+    }
+}

package/engine/graphics/ecs/mesh-v2/prototypeShadedGeometry.js

@@ -0,0 +1,31 @@
+import { EngineHarness } from "../../../EngineHarness.js";
+import { ShadedGeometrySystem } from "./ShadedGeometrySystem.js";
+import EntityBuilder from "../../../ecs/EntityBuilder.js";
+import { Transform } from "../../../ecs/transform/Transform.js";
+import { ShadedGeometry } from "./ShadedGeometry.js";
+import { BoxBufferGeometry, MeshBasicMaterial } from "three";
+
+const eh = new EngineHarness();
+
+/**
+ *
+ * @param {Engine} engine
+ */
+async function main(engine) {
+
+    await engine.entityManager.addSystem(new ShadedGeometrySystem(engine));
+
+    EngineHarness.buildBasics({ engine })
+
+
+    const ecd = engine.entityManager.dataset;
+
+    new EntityBuilder()
+        .add(new Transform())
+        .add(ShadedGeometry.from(new BoxBufferGeometry(), new MeshBasicMaterial({
+            color: 0xFFFFFF
+        })))
+        .build(ecd);
+}
+
+eh.initialize().then(main);

package/engine/graphics/filter/FlipArrayInPlace.js

@@ -0,0 +1,25 @@
+/**
+ * @param {Uint8Array} input
+ * @param {number} width
+ * @param {number} height
+ * @param {number} channel_count
+ */
+export function flipArrayInPlace(input, width, height, channel_count = 4) {
+    const rowLength = width * channel_count;
+    let t, x0, x1;
+    let i = 0;
+    const l = height >> 1;
+
+    for (; i < l; i++) {
+        //swap lines
+        const k = (height - i - 1) * rowLength;
+        const m = i * rowLength;
+        for (let j = 0; j < rowLength; j++) {
+            x0 = m + j;
+            x1 = k + j;
+            t = input[x0];
+            input[x0] = input[x1];
+            input[x1] = t;
+        }
+    }
+}

package/engine/graphics/filter/FlipArrayViaCanvas.js

@@ -0,0 +1,13 @@
+function flipArrayViaCanvas(input, width, height) {
+    const canvas = document.createElement("canvas");
+    const c = canvas.getContext('2d');
+    const imageData = c.createImageData(width, height);
+    imageData.data.set(input);
+    c.putImageData(imageData, 0, 0);
+    c.translate(0, height);
+    c.scale(1, -1);
+    c.drawImage(canvas, 0, 0);
+    const imgd = c.getImageData(0, 0, width, height);
+
+    return imgd.data;
+}

package/engine/graphics/filter/ImageFilter.js

@@ -3,59 +3,25 @@
  */
 
 
-import {
-    LinearFilter,
-    Mesh,
-    OrthographicCamera,
-    PlaneBufferGeometry,
-    Scene,
-    ShaderMaterial,
-    WebGLRenderTarget
-} from 'three';
-
-export function flipArrayInPlace(input, width, height) {
-    const rowLength = width * 4;
-    let t, x0, x1;
-    let i = 0;
-    const l = height >> 1;
-    for (; i < l; i++) {
-        //swap lines
-        const k = (height - i - 1) * rowLength;
-        const m = i * rowLength;
-        for (let j = 0; j < rowLength; j++) {
-            x0 = m + j;
-            x1 = k + j;
-            t = input[x0];
-            input[x0] = input[x1];
-            input[x1] = t;
-        }
-    }
-}
-
-function flipArrayViaCanvas(input, width, height) {
-    const canvas = document.createElement("canvas");
-    const c = canvas.getContext('2d');
-    const imageData = c.createImageData(width, height);
-    imageData.data.set(input);
-    c.putImageData(imageData, 0, 0);
-    c.translate(0, height);
-    c.scale(1, -1);
-    c.drawImage(canvas, 0, 0);
-    const imgd = c.getImageData(0, 0, width, height);
-
-    return imgd.data;
-}
+import { LinearFilter, Mesh, OrthographicCamera, Scene, ShaderMaterial, WebGLRenderTarget } from 'three';
+import { FULL_SCREEN_TRIANGLE_GEOMETRY } from "../geometry/FULL_SCREEN_TRIANGLE_GEOMETRY.js";
 
 /**
  *
  * @param {WebGLRenderer} renderer
  * @param {number} width
  * @param {number} height
- * @param processShader
+ * @param {{vertexShader:string,fragmentShader:string, uniforms?:Object, defines?:Object}} processShader
  * @param {Uint8Array} [destination]
  * @return {{array: Uint8Array, renderer: WebGLRenderer}}
  */
-function processTexture(renderer, width, height, processShader, destination) {
+function processTexture(
+    renderer,
+    width,
+    height,
+    processShader,
+    destination
+) {
     if (destination === undefined) {
         destination = new Uint8Array(width * height * 4);
     }
@@ -72,9 +38,10 @@ function processTexture(renderer, width, height, processShader, destination) {
     material.lights = false;
     material.fog = false;
 
-    const quad = new Mesh(new PlaneBufferGeometry(2, 2), material);
+    const quad = new Mesh(FULL_SCREEN_TRIANGLE_GEOMETRY, material);
 
     scene.add(quad);
+
     //render
     const renderTargetOptions = {
         generateMipmaps: false,
@@ -82,28 +49,30 @@ function processTexture(renderer, width, height, processShader, destination) {
         stencilBuffer: false,
         depthBuffer: false
     };
+
     const renderTarget = new WebGLRenderTarget(width, height, renderTargetOptions);
 
+    const __rt = renderer.getRenderTarget(); // remember old renderer state
+
     renderer.setRenderTarget(renderTarget);
 
     renderer.render(scene, camera);
 
     const gl = renderer.getContext();
+
     //void readPixels(GLint x, GLint y, GLsizei width, GLsizei height, GLenum format, GLenum type, ArrayBufferView? pixels)
     gl.readPixels(0, 0, width, height, gl.RGBA, gl.UNSIGNED_BYTE, destination);
 
-    renderer.setRenderTarget(null);
+    // restore renderer state
+    renderer.setRenderTarget(__rt);
 
-    //reorder lines in the buffer to make Y axis match
-
-    //uint8Array = flipArrayViaCanvas(uint8Array, width, height);
-    //
+    // cleanup resources
     renderTarget.dispose();
     material.dispose();
+
     return {
         array: destination,
         graphics: renderer
-        //renderTarget: renderTarget
     };
 }