@woosh/meep-engine 2.33.21 → 2.33.25

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

@@ -1,9 +1,10 @@
-import { Mesh, Quaternion } from "three";
+import { Line, LineSegments, Mesh } from "three";
 import { updateNodeByMatrix4AndBBB } from "../mesh/updateNodeByTransformAndBBB.js";
 import { LeafNode } from "../../../../core/bvh2/LeafNode.js";
 import { AABB3 } from "../../../../core/bvh2/aabb3/AABB3.js";
+import { DrawMode } from "./DrawMode.js";
+import { applyTransformToThreeObject } from "../mesh/applyTransformToThreeObject.js";
 
-const _q = new Quaternion();
 const _aabb3 = new AABB3();
 
 export class ShadedGeometry {
@@ -19,6 +20,12 @@ export class ShadedGeometry {
          */
         this.material = null;
 
+        /**
+         *
+         * @type {DrawMode|number}
+         */
+        this.mode = DrawMode.Triangles;
+
         /**
          *
          * @type {THREE.Object3D|null}
@@ -34,6 +41,19 @@ export class ShadedGeometry {
         this.__bvh_leaf = new LeafNode(this, 0, 0, 0, 0, 0, 0);
     }
 
+    __build_object() {
+        const mode = this.mode;
+        if (mode === DrawMode.Triangles) {
+            this.__cached_object = new Mesh(this.geometry, this.material);
+        } else if (mode === DrawMode.Lines) {
+            this.__cached_object = new Line(this.geometry, this.material);
+        } else if (mode === DrawMode.LineSegments) {
+            this.__cached_object = new LineSegments(this.geometry, this.material);
+        } else {
+            throw new Error(`Unsupported draw mode '${mode}'`);
+        }
+    }
+
     get bvh() {
         return this.__bvh_leaf;
     }
@@ -42,10 +62,12 @@ export class ShadedGeometry {
      *
      * @param {THREE.BufferGeometry} geometry
      * @param {THREE.Material} material
+     * @param draw_mode
      */
-    from(geometry, material) {
+    from(geometry, material, draw_mode = DrawMode.Triangles) {
         this.geometry = geometry;
         this.material = material;
+        this.mode = draw_mode;
 
         // ensure that geometry has a bounding box
         if (geometry.boundingBox === null) {
@@ -53,7 +75,7 @@ export class ShadedGeometry {
         }
 
         if (this.__cached_object === null) {
-            this.__cached_object = new Mesh(geometry, material);
+            this.__build_object();
         } else {
             this.__cached_object.material = material;
             this.__cached_object.geometry = geometry;
@@ -64,12 +86,13 @@ export class ShadedGeometry {
      *
      * @param geometry
      * @param material
+     * @param mode
      * @return {ShadedGeometry}
      */
-    static from(geometry, material) {
+    static from(geometry, material, mode) {
         const r = new ShadedGeometry();
 
-        r.from(geometry, material);
+        r.from(geometry, material, mode);
 
         return r;
     }
@@ -77,6 +100,7 @@ export class ShadedGeometry {
     updateTransform() {
         // update matrix
         this.__cached_object.updateMatrix();
+        this.__cached_object.updateMatrixWorld();
 
         // update bounds
 
@@ -116,9 +140,7 @@ export class ShadedGeometry {
      */
     setRotationByComponents(x, y, z, w) {
 
-        _q.set(x, y, z, w);
-
-        this.__cached_object.rotation.setFromQuaternion(_q);
+        this.__cached_object.quaternion.set(x, y, z, w);
 
         this.updateTransform();
     }
@@ -140,15 +162,7 @@ export class ShadedGeometry {
      * @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);
+        applyTransformToThreeObject(this.__cached_object, t);
 
         this.updateTransform();
     }

package/engine/graphics/ecs/mesh-v2/ShadedGeometrySystem.d.ts

@@ -0,0 +1,6 @@
+import {System} from "../../../ecs/System";
+import Engine from "../../../Engine";
+
+export class ShadedGeometrySystem extends System {
+    constructor(engine: Engine)
+}

package/engine/graphics/ecs/path/testPathDisplaySystem.js

@@ -106,11 +106,11 @@ function makeConfig(engine) {
         new TopDownCameraControllerSystem(graphics),
         new TopDownCameraLanderSystem(),
         new CameraSystem(graphics.scene, graphics),
-        new MeshSystem(graphics, assetManager),
+        new MeshSystem(engine),
         new ClingToTerrainSystem(),
         new TerrainSystem(graphics, assetManager),
         new WaterSystem(graphics),
-        new Trail2DSystem(graphics, assetManager),
+        new Trail2DSystem(engine),
         new Foliage2System(assetManager, graphics),
         new ViewportPositionSystem(graphics.viewport.size),
         new GridPosition2TransformSystem(),
@@ -179,11 +179,11 @@ function catmullRom(points) {
     cv.link();
 
     cv.css({
-               position: "absolute",
-               left: 0,
-               right: 0,
-               zIndex: 99999
-           });
+        position: "absolute",
+        left: 0,
+        right: 0,
+        zIndex: 99999
+    });
 
     const sample = [];
 
@@ -216,92 +216,92 @@ function sample_style_entity() {
     const style = new EntityPathStyle();
     style.spacing = 0.6;
     style.marker_start = EntityPathMarkerDefinition.from({
-                                                             blueprint: EntityBlueprint.from([
-                                                                                                 Transform.fromJSON({}),
-                                                                                                 Mesh.fromJSON({
-                                                                                                                   url: "data/models/arrow-symbols/arrow4/model-green.gltf",
-                                                                                                                   castShadow: true,
-                                                                                                                   receiveShadow: true
-                                                                                                               })
-                                                                                             ]),
-                                                             transform: Transform.fromJSON({
-                                                                                               scale: {
-                                                                                                   x: 0.3,
-                                                                                                   y: 0.3,
-                                                                                                   z: 0.3
-                                                                                               },
-                                                                                               rotation: {
-                                                                                                   x: 0.5,
-                                                                                                   y: -0.5,
-                                                                                                   z: 0.5,
-                                                                                                   w: 0.5
-                                                                                               },
-                                                                                               position: {
-                                                                                                   x: 0,
-                                                                                                   y: 1,
-                                                                                                   z: 0
-                                                                                               }
-                                                                                           })
-                                                         });
+        blueprint: EntityBlueprint.from([
+            Transform.fromJSON({}),
+            Mesh.fromJSON({
+                url: "data/models/arrow-symbols/arrow4/model-green.gltf",
+                castShadow: true,
+                receiveShadow: true
+            })
+        ]),
+        transform: Transform.fromJSON({
+            scale: {
+                x: 0.3,
+                y: 0.3,
+                z: 0.3
+            },
+            rotation: {
+                x: 0.5,
+                y: -0.5,
+                z: 0.5,
+                w: 0.5
+            },
+            position: {
+                x: 0,
+                y: 1,
+                z: 0
+            }
+        })
+    });
     style.marker_end = EntityPathMarkerDefinition.from({
-                                                           blueprint: EntityBlueprint.from([
-                                                                                               Transform.fromJSON({}),
-                                                                                               Mesh.fromJSON({
-                                                                                                                 url: "data/models/arrow-symbols/arrow4/model-red.gltf",
-                                                                                                                 castShadow: true,
-                                                                                                                 receiveShadow: true
-                                                                                                             })
-                                                                                           ]),
-                                                           transform: Transform.fromJSON({
-                                                                                             scale: {
-                                                                                                 x: 0.3,
-                                                                                                 y: 0.3,
-                                                                                                 z: 0.3
-                                                                                             },
-                                                                                             rotation: {
-                                                                                                 x: 0.5,
-                                                                                                 y: -0.5,
-                                                                                                 z: 0.5,
-                                                                                                 w: 0.5
-                                                                                             },
-                                                                                             position: {
-                                                                                                 x: 0,
-                                                                                                 y: 1,
-                                                                                                 z: 0
-                                                                                             }
-                                                                                         })
-                                                       });
+        blueprint: EntityBlueprint.from([
+            Transform.fromJSON({}),
+            Mesh.fromJSON({
+                url: "data/models/arrow-symbols/arrow4/model-red.gltf",
+                castShadow: true,
+                receiveShadow: true
+            })
+        ]),
+        transform: Transform.fromJSON({
+            scale: {
+                x: 0.3,
+                y: 0.3,
+                z: 0.3
+            },
+            rotation: {
+                x: 0.5,
+                y: -0.5,
+                z: 0.5,
+                w: 0.5
+            },
+            position: {
+                x: 0,
+                y: 1,
+                z: 0
+            }
+        })
+    });
     style.marker_main = EntityPathMarkerDefinition.from({
-                                                            blueprint: EntityBlueprint.from([
-                                                                                                Transform.fromJSON({}),
-                                                                                                Mesh.fromJSON({
-                                                                                                                  url: "data/models/Barel-Roll Droid/handpainted.gltf",
-                                                                                                                  castShadow: true,
-                                                                                                                  receiveShadow: true
-                                                                                                              }),
-                                                                                                Animation.fromJSON({
-                                                                                                                       clips: [
-                                                                                                                           {
-                                                                                                                               name: "fly",
-                                                                                                                               repeatCount: Infinity
-                                                                                                                           }
-                                                                                                                       ]
-                                                                                                                   }),
-                                                                                                Highlight.fromOne(1, 0, 0, 1)
-                                                                                            ]),
-                                                            transform: Transform.fromJSON({
-                                                                                              scale: {
-                                                                                                  x: 0.2,
-                                                                                                  y: 0.2,
-                                                                                                  z: 0.2
-                                                                                              },
-                                                                                              position: {
-                                                                                                  x: 0,
-                                                                                                  y: 1,
-                                                                                                  z: 0
-                                                                                              }
-                                                                                          })
-                                                        });
+        blueprint: EntityBlueprint.from([
+            Transform.fromJSON({}),
+            Mesh.fromJSON({
+                url: "data/models/Barel-Roll Droid/handpainted.gltf",
+                castShadow: true,
+                receiveShadow: true
+            }),
+            Animation.fromJSON({
+                clips: [
+                    {
+                        name: "fly",
+                        repeatCount: Infinity
+                    }
+                ]
+            }),
+            Highlight.fromOne(1, 0, 0, 1)
+        ]),
+        transform: Transform.fromJSON({
+            scale: {
+                x: 0.2,
+                y: 0.2,
+                z: 0.2
+            },
+            position: {
+                x: 0,
+                y: 1,
+                z: 0
+            }
+        })
+    });
 
     return style;
 }
@@ -337,13 +337,13 @@ function main(engine) {
     // ], 50));
 
     _p.setPositionsFromVectorArray([
-                                       new Vector3(3, 1, 1),
-                                       new Vector3(3, 1, 3),
-                                       new Vector3(7, 1, 3),
-                                       new Vector3(7, 1, 7),
-                                       new Vector3(3, 1, 7),
-                                       new Vector3(3, 1, 8),
-                                   ]);
+        new Vector3(3, 1, 1),
+        new Vector3(3, 1, 3),
+        new Vector3(7, 1, 3),
+        new Vector3(7, 1, 7),
+        new Vector3(3, 1, 7),
+        new Vector3(3, 1, 8),
+    ]);
 
 
     const trailPathStyle = new RibbonPathStyle();

package/engine/graphics/ecs/trail2d/Trail2D.js

@@ -5,6 +5,7 @@
 
 import Vector3 from "../../../../core/geom/Vector3.js";
 import Vector4 from "../../../../core/geom/Vector4.js";
+import { RibbonXMaterialSpec } from "../../trail/x/RibbonXMaterialSpec.js";
 
 /**
  * @readonly
@@ -24,8 +25,6 @@ class Trail2D {
          */
         this.maxAge = 5;
 
-        this.textureURL = null;
-
         /**
          * Trail width
          * @type {number}
@@ -65,9 +64,9 @@ class Trail2D {
 
         /**
          * transient
-         * @type {Material|null}
+         * @type {RibbonXMaterialSpec}
          */
-        this.material = null;
+        this.material = new RibbonXMaterialSpec();
 
         /**
          * transient
@@ -82,6 +81,20 @@ class Trail2D {
         this.flags = Trail2DFlags.Spawning | Trail2DFlags.Aging;
     }
 
+    dispose() {
+        if (this.ribbon !== null) {
+            this.ribbon.dispose();
+        }
+    }
+
+    get textureURL() {
+        return this.material.diffuse;
+    }
+
+    set textureURL(v) {
+        this.material.diffuse = v;
+    }
+
     /**
      *
      * @param {number|Trail2DFlags} flag

package/engine/graphics/ecs/trail2d/Trail2DSystem.d.ts

@@ -1,7 +1,6 @@
 import {System} from "../../../ecs/System";
-import {GraphicsEngine} from "../../GraphicsEngine";
-import {AssetManager} from "../../../asset/AssetManager";
+import Engine from "../../../Engine";
 
 export default class Trail2DSystem extends System {
-    constructor(graphics: GraphicsEngine, assetManager: AssetManager)
+    constructor(engine: Engine)
 }

package/engine/graphics/ecs/trail2d/Trail2DSystem.js

@@ -8,25 +8,21 @@ import { max2 } from "../../../../core/math/max2.js";
 import { System } from '../../../ecs/System.js';
 import { Transform } from '../../../ecs/transform/Transform.js';
 import Vector3 from '../../../../core/geom/Vector3.js';
-import { computeHashFloat, computeHashIntegerArray } from '../../../../core/math/MathUtils.js';
 
 import Trail2D, { Trail2DFlags } from './Trail2D.js';
-import { ClampToEdgeWrapping, DoubleSide, LinearFilter, TextureLoader } from 'three';
 
 import { LeafNode } from '../../../../core/bvh2/LeafNode.js';
 import ThreeFactory from '../../three/ThreeFactory.js';
 import { GraphicsEngine } from "../../GraphicsEngine.js";
-import { ReferenceManager } from "../../../reference/v1/ReferenceManager.js";
-import { AssetManager } from "../../../asset/AssetManager.js";
-import { Cache } from "../../../../core/cache/Cache.js";
 import { RibbonXFixedPhysicsSimulator } from "../../trail/x/simulator/RibbonXFixedPhysicsSimulator.js";
 import { RibbonX } from "../../trail/x/RibbonX.js";
 import {
     RIBBON_ATTRIBUTE_ADDRESS_AGE,
     RIBBON_ATTRIBUTE_ADDRESS_UV_OFFSET
 } from "../../trail/x/ribbon_attributes_spec.js";
-import { RibbonMaterialX } from "../../trail/x/RibbonMaterialX.js";
-import { computeStringHash } from "../../../../core/primitives/strings/computeStringHash.js";
+import { Reference } from "../../../reference/v2/Reference.js";
+import { RibbonXPlugin } from "../../trail/x/RibbonXPlugin.js";
+import { assert } from "../../../../core/assert.js";
 
 const v3Temp1 = new Vector3();
 
@@ -34,69 +30,32 @@ const v3_array = [];
 
 class Trail2DSystem extends System {
     /**
-     *
-     * @param {GraphicsEngine} graphics
-     * @param {AssetManager} assetManager
+     * @param {Engine} engine
      * @constructor
      */
-    constructor(graphics, assetManager) {
+    constructor(engine) {
         super();
 
-        this.dependencies = [Trail2D, Transform];
-
-        if (!(graphics instanceof GraphicsEngine)) {
-            throw new Error("'renderer' must be of type GraphicsEngine");
-        }
-
-        if (!(assetManager instanceof AssetManager)) {
-            throw new Error("'assetManager' must be of type AssetManager");
-        }
+        assert.defined(engine, 'engine');
+        assert.notNull(engine, 'engine');
+        assert.equal(engine.isEngine, true, 'engine.isEngine !== true');
 
-        /**
-         *
-         * @type {GraphicsEngine}
-         */
-        this.graphics = graphics;
+        this.dependencies = [Trail2D, Transform];
 
         /**
          *
-         * @type {AssetManager}
+         * @type {Engine}
+         * @private
          */
-        this.assetManager = assetManager;
-
-        function constructTexture(url) {
-            const assetPromise = assetManager.promise(url, "texture");
-
-            const texturePromise = assetPromise
-                .then(function (asset) {
-
-                    const texture = asset.create();
-
-                    texture.wrapS = ClampToEdgeWrapping;
-                    texture.wrapT = ClampToEdgeWrapping;
-
-                    texture.magFilter = LinearFilter;
-                    texture.minFilter = LinearFilter;
+        this.__engine = engine;
 
-                    return texture;
-                });
-
-            return texturePromise;
-        }
-
-        function destructTexture(url, texturePromise) {
-            texturePromise.then(function (t) {
-                //release used resourced
-                t.dispose();
-            });
-        }
+        const graphics = engine.graphics;
 
         /**
          *
-         * @type {ReferenceManager<string,Promise.<THREE.Texture>>}
+         * @type {GraphicsEngine}
          */
-        this.textures = new ReferenceManager(constructTexture, destructTexture);
-
+        this.graphics = graphics;
 
         /**
          *
@@ -117,28 +76,11 @@ class Trail2DSystem extends System {
         this.simulator = new RibbonXFixedPhysicsSimulator();
 
         /**
+         *
+         * @type {Reference<RibbonXPlugin>}
          * @private
-         * @readonly
-         * @type {Cache<Trail2D, Material>}
          */
-        this.materialCache = new Cache({
-            maxWeight: 100,
-            keyHashFunction(trail) {
-                return computeHashIntegerArray(
-                    computeStringHash(trail.textureURL),
-                    computeHashFloat(trail.width),
-                    computeHashFloat(trail.maxAge),
-                    trail.color.hash()
-                );
-            },
-            keyEqualityFunction(a, b) {
-                return a.textureURL === b.textureURL
-                    && a.width === b.width
-                    && a.maxAge === b.maxAge
-                    && a.color.equals(b.color)
-                    ;
-            }
-        });
+        this.__ribbon_plugin = Reference.NULL;
 
 
         /**
@@ -149,7 +91,7 @@ class Trail2DSystem extends System {
         this.__timeDelta = 0;
     }
 
-    startup(entityManager, readyCallback, errorCallback) {
+    async startup(entityManager, readyCallback, errorCallback) {
         this.entityManager = entityManager;
 
         this.renderLayer = this.graphics.layers.create('trail-2d-system');
@@ -161,19 +103,7 @@ class Trail2DSystem extends System {
 
         this.bvh = this.renderLayer.bvh;
 
-
-        this.graphics.viewport.size.onChanged.add((x, y) => {
-            const ecd = this.entityManager.dataset;
-
-            if (ecd === null) {
-                // no dataset attached
-                return;
-            }
-
-            ecd.traverseComponents(Trail2D, trail => {
-                trail.material.uniforms.resolution.value.set(x, y);
-            });
-        });
+        this.__ribbon_plugin = await this.__engine.plugins.acquire(RibbonXPlugin);
 
         readyCallback();
     }
@@ -181,32 +111,9 @@ class Trail2DSystem extends System {
     shutdown(entityManager, readyCallback, errorCallback) {
         this.graphics.layers.remove(this.renderLayer);
 
-        readyCallback();
-    }
-
-    /**
-     *
-     * @param {Trail2D} trail
-     * @returns {Material}
-     */
-    obtainMaterial(trail) {
-
-        const material = new RibbonMaterialX({
-            transparent: true,
-            depthWrite: false,
-            wireframe: false,
-            side: DoubleSide,
-            defines: {
-                USE_TEXTURE: false
-            }
-        });
-
-        if (trail.textureURL !== null) {
-            material.uniforms.uDiffuse.value = new TextureLoader().load(trail.textureURL);
-            material.defines.USE_TEXTURE = true;
-        }
+        this.__ribbon_plugin.release();
 
-        return material;
+        readyCallback();
     }
 
     /**
@@ -231,9 +138,9 @@ class Trail2DSystem extends System {
 
         const geometry = ribbon.getGeometry();
 
-        const material = this.obtainMaterial(trail);
+        const ribbons = this.__ribbon_plugin.getValue();
 
-        material.uniforms.resolution.value.copy(this.graphics.viewport.size);
+        const material = ribbons.obtain_material_x(trail.material);
 
         const mesh = ThreeFactory.createMesh(geometry, material);
 
@@ -274,12 +181,21 @@ class Trail2DSystem extends System {
         );
 
         trail.bvhLeaf = leafNode;
-        trail.material = material;
 
         this.bvh.insertNode(leafNode);
     }
 
+    /**
+     *
+     * @param {Trail2D} component
+     * @param {Transform} transform
+     * @param {number} entity
+     */
     unlink(component, transform, entity) {
+
+        // release resources
+        component.dispose();
+
         component.bvhLeaf.disconnect();
     }