@woosh/meep-engine 2.43.44 → 2.43.46

package/editor/process/symbolic/makeSolidArrowGeometry.js

@@ -0,0 +1,391 @@
+import { StreamGeometryBuilder } from "../../../engine/graphics/ecs/path/tube/build/StreamGeometryBuilder.js";
+import { make_ring_faces } from "../../../engine/graphics/ecs/path/tube/build/make_ring_faces.js";
+import { BufferGeometry } from "three/src/core/BufferGeometry.js";
+import { Float32BufferAttribute } from "three/src/core/BufferAttribute.js";
+import { Vector2, Vector3 } from "three";
+
+// Modified from https://github.com/mrdoob/three.js/blob/master/src/geometries/CylinderBufferGeometry.js
+class ArrowBufferGeometry extends BufferGeometry {
+
+    constructor( {radiusTop = 1/7, radiusBottom = 1/20, height = 1, heightTop = 0.6, radialSegments = 8, heightSegments = 1, openEnded = false, heightIncludesHead = true} = {} ) {
+
+        super();
+        this.type = 'ArrowBufferGeometry';
+
+        this.parameters = {
+            radiusTop: radiusTop,
+            radiusBottom: radiusBottom,
+            height: height,
+            heightTop: heightTop,
+            radialSegments: radialSegments,
+            heightSegments: heightSegments,
+            openEnded: openEnded,
+            heightIncludesHead: heightIncludesHead,
+        };
+
+        const scope = this;
+        const thetaStart = 0, thetaLength = 2 * Math.PI;
+
+        radialSegments = Math.floor( radialSegments );
+        heightSegments = Math.floor( heightSegments );
+
+        // buffers
+
+        const indices = [];
+        const vertices = [];
+        const normals = [];
+        const uvs = [];
+
+        // helper variables
+
+        let index = 0;
+        const indexArray = [];
+        const halfHeight = height / 2;
+        const tubeHeight = heightIncludesHead ? height - heightTop : height;
+        let groupStart = 0;
+
+        // generate geometry
+
+        generateTorso();
+        generateCap( true );
+        generateCap( false, true );
+
+        if ( openEnded === false ) {
+
+            if ( radiusBottom > 0 ) generateCap( false );
+
+        }
+
+        // build geometry
+
+        this.setIndex( indices );
+        this.setAttribute( 'position', new Float32BufferAttribute( vertices, 3 ) );
+        this.setAttribute( 'normal', new Float32BufferAttribute( normals, 3 ) );
+        this.setAttribute( 'uv', new Float32BufferAttribute( uvs, 2 ) );
+
+        function generateTorso() {
+
+            const normal = new Vector3();
+            const vertex = new Vector3();
+
+            let groupCount = 0;
+
+            // this will be used to calculate the normal
+            const slope = 0;
+
+            // generate vertices, normals and uvs
+
+            for ( let y = 0; y <= heightSegments; y ++ ) {
+
+                const indexRow = [];
+
+                const v = y / heightSegments;
+
+                // calculate the radius of the current row
+
+                const radius = radiusBottom;
+
+                for ( let x = 0; x <= radialSegments; x ++ ) {
+
+                    const u = x / radialSegments;
+
+                    const theta = u * Math.PI * 2;
+
+                    const sinTheta = Math.sin( theta );
+                    const cosTheta = Math.cos( theta );
+
+                    // vertex
+
+                    vertex.x = radius * cosTheta;
+                    vertex.y = radius * sinTheta;
+                    vertex.z = v * tubeHeight;
+                    vertices.push( vertex.x, vertex.y, vertex.z );
+
+                    // normal
+
+                    normal.set( cosTheta, sinTheta, 0 ).normalize();
+                    normals.push( normal.x, normal.y, normal.z );
+
+                    // uv
+
+                    uvs.push( u, 1 - v );
+
+                    // save index of vertex in respective row
+
+                    indexRow.push( index ++ );
+
+                }
+
+                // now save vertices of the row in our index array
+
+                indexArray.push( indexRow );
+
+            }
+
+            // generate indices
+
+            for ( let x = 0; x < radialSegments; x ++ ) {
+
+                for ( let y = 0; y < heightSegments; y ++ ) {
+
+                    // we use the index array to access the correct indices
+
+                    const a = indexArray[ y ][ x ];
+                    const b = indexArray[ y + 1 ][ x ];
+                    const c = indexArray[ y + 1 ][ x + 1 ];
+                    const d = indexArray[ y ][ x + 1 ];
+
+                    // faces
+
+                    indices.push( b, a, d );
+                    indices.push( c, b, d );
+
+                    // update group counter
+
+                    groupCount += 6;
+
+                }
+
+            }
+
+            // add a group to the geometry. this will ensure multi material support
+
+            scope.addGroup( groupStart, groupCount, 0 );
+
+            // calculate new start value for groups
+
+            groupStart += groupCount;
+
+        }
+
+        function generateCap( top, headBase = false ) {
+
+            // save the index of the first center vertex
+            const centerIndexStart = index;
+
+            const uv = new Vector2();
+            const vertex = new Vector3();
+
+            let groupCount = 0;
+
+            const radius = ( top || headBase ) ? radiusTop : radiusBottom;
+            const sign = ( top ) ? 1 : -1;
+
+            // first we generate the center vertex data of the cap.
+            // because the geometry needs one set of uvs per face,
+            // we must generate a center vertex per face/segment
+
+            for ( let x = 1; x <= radialSegments; x ++ ) {
+
+                // vertex
+
+                vertices.push( 0, 0, top ? tubeHeight + heightTop : (headBase ? tubeHeight : 0) );
+
+                // normal
+
+                if (top) {
+                    const theta = (x - 1/2) / radialSegments * Math.PI * 2;
+                    const sinTheta = Math.sin(theta), cosTheta = Math.cos(theta);
+                    const normal = new Vector3( cosTheta, sinTheta, radiusTop / heightTop );
+                    normal.normalize();
+                    normals.push( normal.x, normal.y, normal.z);
+                } else {
+                    normals.push( 0, 0, sign );
+                }
+                // uv
+
+                uvs.push( 0.5, 0.5 );
+
+                // increase index
+
+                index ++;
+
+            }
+
+            // save the index of the last center vertex
+            const centerIndexEnd = index;
+
+            // now we generate the surrounding vertices, normals and uvs
+
+            for ( let x = 0; x <= radialSegments; x ++ ) {
+
+                const u = x / radialSegments;
+                const theta = u * thetaLength + thetaStart;
+
+                const cosTheta = Math.cos( theta );
+                const sinTheta = Math.sin( theta );
+
+                // vertex
+
+                vertex.x = radius * cosTheta;
+                vertex.y = radius * sinTheta;
+                vertex.z = top || headBase ? tubeHeight : 0;
+                vertices.push( vertex.x, vertex.y, vertex.z );
+
+                // normal
+
+                if (top) {
+                    const normal = new Vector3(cosTheta, sinTheta, radiusTop / heightTop );
+                    normal.normalize();
+                    normals.push( normal.x, normal.y, normal.z);
+                } else {
+                    normals.push( 0, 0, sign );
+                }
+                // uv
+
+                uv.x = ( cosTheta * 0.5 ) + 0.5;
+                uv.y = ( sinTheta * 0.5 * sign ) + 0.5;
+                uvs.push( uv.x, uv.y );
+
+                // increase index
+
+                index ++;
+
+            }
+
+            // generate indices
+
+            for ( let x = 0; x < radialSegments; x ++ ) {
+
+                const c = centerIndexStart + x;
+                const i = centerIndexEnd + x;
+
+                if ( top === true ) {
+
+                    // face top
+
+                    indices.push( i, i + 1, c );
+
+                } else {
+
+                    // face bottom
+
+                    indices.push( i + 1, i, c );
+
+                }
+
+                groupCount += 3;
+
+            }
+
+            // add a group to the geometry. this will ensure multi material support
+
+            scope.addGroup( groupStart, groupCount, top === true ? 1 : 2 );
+
+            // calculate new start value for groups
+
+            groupStart += groupCount;
+
+        }
+
+    }
+
+}
+
+/**
+ *
+ * @param {StreamGeometryBuilder} out
+ * @param {number} count
+ * @param {number} radius
+ * @param {number} z
+ */
+function make_ring_vertices(out, count, radius, z) {
+
+    const positions = out.positions;
+
+    for (let i = 0; i < count; i++) {
+
+        const vertex_index = out.cursor_vertices++;
+
+        const fraction = i / count;
+
+        const angle = Math.PI * 2 * fraction;
+
+        const vertex_offset = vertex_index * 3;
+
+        positions[vertex_offset] = Math.cos(angle) * radius;
+        positions[vertex_offset + 1] = Math.sin(angle) * radius;
+        positions[vertex_offset + 2] = z;
+
+    }
+
+}
+
+/**
+ *
+ * @param {StreamGeometryBuilder} out
+ * @param {number} count
+ * @param {number} vertex_offset
+ * @param {number} tip_vertex_index
+ */
+function make_cone_indices(out, count, vertex_offset, tip_vertex_index) {
+    const indices = out.indices;
+
+    for (let i = 0; i < count; i++) {
+        const index_0 = i + vertex_offset;
+        const index_1 = tip_vertex_index;
+        const index_2 = ((i + 1) % count) + vertex_offset;
+
+        const triangle_index = out.cursor_indices++;
+
+        const triangle_offset = triangle_index * 3;
+
+        indices[triangle_offset] = index_1;
+        indices[triangle_offset + 1] = index_2;
+        indices[triangle_offset + 2] = index_0;
+    }
+
+}
+
+export function makeSolidArrowGeometry(){
+return new ArrowBufferGeometry();
+}
+
+ function makeSolidArrowGeometry2(
+    radial_resolution = 16,
+    pointer_length = 0.5,
+    pointer_width = 0.2,
+    stem_width = 0.1
+) {
+
+    const Z_OFFSET = -0.5;
+
+    const vertex_count = radial_resolution * 3 + 1;
+
+    const triangle_count = radial_resolution //arrow cap
+        + radial_resolution * 2 // under-arrow ring
+        + radial_resolution * 2 // stem
+        + radial_resolution //cap for base of the stem
+    ;
+
+    const builder = new StreamGeometryBuilder();
+
+    builder.allocate(vertex_count, triangle_count);
+
+    const positions = builder.positions;
+
+    // write tip
+    const tip_vertex_index = builder.cursor_vertices++;
+    positions[tip_vertex_index * 3] = 0;
+    positions[tip_vertex_index * 3 + 1] = 0;
+    positions[tip_vertex_index * 3 + 2] = Z_OFFSET + 1;
+
+    const ring_0_start = builder.cursor_vertices;
+
+    // make cone ring - arrow cap
+    make_ring_vertices(builder, radial_resolution, pointer_width, Z_OFFSET + 1 - pointer_length);
+    make_cone_indices(builder, radial_resolution, ring_0_start, tip_vertex_index);
+
+    const ring_1_start = builder.cursor_vertices;
+
+    // make ring 1
+    make_ring_vertices(builder, radial_resolution, stem_width, Z_OFFSET + 1 - pointer_length);
+    make_ring_faces(builder, ring_1_start, 1, radial_resolution);
+
+    const ring_2_start = builder.cursor_vertices;
+
+    make_ring_vertices(builder, radial_resolution, stem_width, Z_OFFSET + 0);
+    make_ring_faces(builder, ring_2_start, 1, radial_resolution);
+
+    return builder.build();
+}

package/engine/asset/loaders/image/codec/CodecWithFallback.js

@@ -22,7 +22,9 @@ export class CodecWithFallback extends Codec {
         for (let i = 0; i < codec_count; i++) {
             const codec = codecs[i];
 
-            if (codec.test(data)) {
+            const codec_supports_data = await codec.test(data);
+
+            if (codec_supports_data) {
                 return true;
             }
         }
@@ -42,7 +44,9 @@ export class CodecWithFallback extends Codec {
         for (let i = 0; i < codec_count; i++) {
             const codec = codecs[i];
 
-            if (!codec.test(data)) {
+            const codec_supports_data = await codec.test(data);
+
+            if (!codec_supports_data) {
                 errors.push({
                     index: i, error: "Codec doesn't support this data"
                 });

package/engine/graphics/ecs/decal/v2/prototypeDecalSystem.js

@@ -16,6 +16,16 @@ import { GLTFAssetLoader } from "../../../../asset/loaders/GLTFAssetLoader.js";
 import '../../../../../../../../css/game.scss';
 import { countTask } from "../../../../../core/process/task/util/countTask.js";
 import Vector2 from "../../../../../core/geom/Vector2.js";
+import { RotationBehavior } from "../../../../intelligence/behavior/util/RotationBehavior.js";
+import { BehaviorComponent } from "../../../../intelligence/behavior/ecs/BehaviorComponent.js";
+import Vector3 from "../../../../../core/geom/Vector3.js";
+import { ShadedGeometry } from "../../mesh-v2/ShadedGeometry.js";
+import { makeHelperBoxGeometry } from "../../../../../editor/process/symbolic/makeHelperBoxGeometry.js";
+import { DoubleSide, LineBasicMaterial, MeshStandardMaterial } from "three";
+import { DrawMode } from "../../mesh-v2/DrawMode.js";
+import { OctahedralUvEncoder } from "../../../impostors/octahedral/grid/OctahedralUvEncoder.js";
+import { makeSolidArrowGeometry } from "../../../../../editor/process/symbolic/makeSolidArrowGeometry.js";
+import { vec3 } from "gl-matrix";
 
 const decal_urls = `data/textures/icons/FantasyIconsMegaPack/MagicItems/MagicItems_png/transparent/x64/staff_13_t.png
 data/textures/icons/FantasyIconsMegaPack/MagicItems/MagicItems_png/transparent/x64/artifact_01_t.png
@@ -217,7 +227,7 @@ function promise_time_out(t) {
  * @param {number} spacing
  * @param {string[]} textures
  */
-function grid(ecd, offset_x, offset_y,x, y, size_x, size_y, spacing, textures) {
+function grid(ecd, offset_x, offset_y, x, y, size_x, size_y, spacing, textures) {
 
     const random = seededRandom();
 
@@ -243,7 +253,7 @@ function grid(ecd, offset_x, offset_y,x, y, size_x, size_y, spacing, textures) {
             // transform.rotation.set(0,0.7,0,0.7);
             transform.rotation.set(-0.7, 0, 0, 0.7);
             // transform.rotation.random(random);
-            transform.scale.set(size_x, size_y,1 );
+            transform.scale.set(size_x, size_y, 1);
             // transform.scale.setScalar(1);
 
             entity
@@ -256,6 +266,100 @@ function grid(ecd, offset_x, offset_y,x, y, size_x, size_y, spacing, textures) {
 
 }
 
+function makeNormalTestGridDecal(ecd) {
+
+    const GRID_OFFSET = new Vector3(5, 0, 5);
+
+    const uv = new OctahedralUvEncoder();
+
+    const GRID_SIZE = 9;
+
+    const SPACING = 2;
+
+    const DEBUG_BOX = makeHelperBoxGeometry();
+
+    for (let i = 0; i < GRID_SIZE; i++) {
+        for (let j = 0; j < GRID_SIZE; j++) {
+
+            const direction = [];
+
+            uv.uv_to_unit(direction, [i / (GRID_SIZE - 1), j / (GRID_SIZE - 1)]);
+
+            vec3.negate(direction,direction);
+
+            const decal = new Decal();
+
+            decal.uri = decal_urls[1];
+
+            const entity = new EntityBuilder();
+
+            entity.clearFlag(EntityBuilderFlags.WatchDestruction);
+
+            const transform = new Transform();
+            transform.position.set(
+                SPACING * i,
+                0,
+                SPACING * j
+            );
+
+            transform.position.add(GRID_OFFSET);
+
+            transform.scale.setScalar(1);
+            transform.rotation._lookRotation(direction[0], direction[1], direction[2], 0, 1, 0);
+
+            entity
+                .add(ShadedGeometry.from(DEBUG_BOX, new LineBasicMaterial(), DrawMode.LineSegments))
+                .add(transform)
+                .add(decal)
+                .build(ecd);
+
+
+            // make an arrow helper
+            const arrow_transform = Transform.fromJSON({
+                position: new Vector3(0, 0, -0.5)
+            });
+            arrow_transform.multiplyTransforms(transform, arrow_transform);
+
+            new EntityBuilder()
+                .add(ShadedGeometry.from(makeSolidArrowGeometry(), new MeshStandardMaterial({
+                    side: DoubleSide
+                }), DrawMode.Triangles))
+                .add(arrow_transform)
+                .build(ecd);
+        }
+    }
+}
+
+/**
+ * @returns {EntityBuilder}
+ */
+function makeNormalTestDecal() {
+    const decal = new Decal();
+
+    decal.uri = decal_urls[1];
+
+    const entity = new EntityBuilder();
+
+    entity.clearFlag(EntityBuilderFlags.WatchDestruction);
+
+    const transform = new Transform();
+    transform.position.set(
+        5,
+        0,
+        5
+    );
+    transform.scale.setScalar(1);
+    transform.rotation.lookRotation(Vector3.down);
+
+    entity
+        .add(ShadedGeometry.from(DEBUG_BOX, new LineBasicMaterial(), DrawMode.LineSegments))
+        .add(transform)
+        .add(decal)
+        .add(BehaviorComponent.fromOne(RotationBehavior.fromJSON({ speed: 1, axis: Vector3.left })))
+
+    return entity;
+}
+
 /**
  *
  * @param {Engine} engine
@@ -281,7 +385,9 @@ async function main(engine) {
 
     const random = seededRandom();
 
-    const ENTITY_COUNT = 100000;
+    const ENTITY_COUNT = 1;
+
+    const ecd = engine.entityManager.dataset;
 
     function makeOne() {
         const decal = new Decal();
@@ -304,9 +410,9 @@ async function main(engine) {
         entity
             .add(transform)
             .add(decal)
-        // .add(BehaviorComponent.fromOne(RotationBehavior.fromJSON({ speed: 1 })))
+            .add(BehaviorComponent.fromOne(RotationBehavior.fromJSON({ speed: 1 })))
 
-        entity.build(engine.entityManager.dataset);
+        entity.build(ecd);
     }
 
     // for (let i = 0; i < ENTITY_COUNT; i++) {
@@ -316,6 +422,8 @@ async function main(engine) {
 
     const task = countTask(0, ENTITY_COUNT, makeOne);
 
+    makeNormalTestGridDecal(ecd);
+
     // TaskLoadingScreen.instance.load(engine, task);
 
     // console.profile('spawn');
@@ -327,9 +435,9 @@ async function main(engine) {
     // engine.executor.run(task);
 
 
-    grid(engine.entityManager.dataset, 20,10,80, 25, .4, .6, .1, decal_urls.slice(105, 105+3));
+    //grid(engine.entityManager.dataset, 20,10,80, 25, .4, .6, .1, decal_urls.slice(105, 105+3));
 
-    grid(engine.entityManager.dataset, 20,30,80, 25, .4, .6, .1, decal_urls.slice(105, 105+3));
+    //grid(engine.entityManager.dataset, 20,30,80, 25, .4, .6, .1, decal_urls.slice(105, 105+3));
     // await promise_time_out(10);
 
 

package/engine/graphics/ecs/mesh-v2/render/adapters/InstancedRendererAdapter.js

@@ -2,7 +2,6 @@ import { AbstractRenderAdapter } from "./AbstractRenderAdapter.js";
 import { HashMap } from "../../../../../../core/collection/HashMap.js";
 import { InstancedMeshGroup } from "../../../../geometry/instancing/InstancedMeshGroup.js";
 import { ShadedGeometryFlags } from "../../ShadedGeometryFlags.js";
-import { DrawMode } from "../../DrawMode.js";
 import { StreamDrawUsage } from "three";
 
 const INSTANCED_EQUALITY_FLAGS = ShadedGeometryFlags.CastShadow
@@ -68,14 +67,12 @@ export class InstancedRendererAdapter extends AbstractRenderAdapter {
 
         } else {
 
-            if (sg.mode !== DrawMode.Triangles) {
-                throw new Error(`Unsupported draw mode ${sg.mode}`);
-            }
-
             im = new InstancedMeshGroup();
             im.instance_usage = StreamDrawUsage;
             im.shrinkFactor = 0; // prevent shrinking as we're essentially rebuilding this geometry frame
 
+            im.draw_mode = sg.mode;
+
             im.setMaterial(sg.material);
             im.setGeometry(sg.geometry);
 

package/engine/graphics/render/forward_plus/materials/FP_SHADER_CHUNK_ACCUMULATION.js

@@ -60,16 +60,22 @@ export const FP_SHADER_CHUNK_ACCUMULATION = `
                 // we're inside decal volume
                 vec4 light_data_4 = texelFetch(fp_t_light_data, address_to_data_texture_coordinates(light_address+4u), 0);
                 
-                // compute normal of the decal
-                vec4 decal_normal = normalize( viewMatrix*decal_transform_matrix*vec4(0.0, 0.0, 1.0, 0.0) );
-                float decal_surface_dot = dot(decal_normal.xyz, geometry.normal);
+                // compute normal of the decal, we get this by extracting rotation matrix and transforming (0,1,0) vector using that 
+                
+                mat4 decal_view_transform = viewMatrix*decal_transform_matrix;
+                
+                vec3 decal_normal = normalize(vec3(
+                    decal_view_transform[1][0], decal_view_transform[1][1], decal_view_transform[1][2]
+                ));
+                
+                float decal_surface_dot = dot(decal_normal, geometry.normal);
                 
                 // we fade out decals when the projection angle to the surface gets too steep
                 // 0.7 is cos(45deg) and 0.5 is cos(60deg), dot returns cos of angle between two normals
-                float decal_surface_angle_fade = smoothstep(-0.5,-0.7,decal_surface_dot);
+                float decal_surface_angle_fade = smoothstep(0.7,0.5,decal_surface_dot);
                 
                 if(decal_surface_angle_fade <= 0.0){
-                continue;
+                    continue;
                 }
                 
                 vec2 decal_local_uv = (local_position.xy + 0.5);
@@ -81,7 +87,7 @@ export const FP_SHADER_CHUNK_ACCUMULATION = `
                 float decal_alpha = decal_color.a * decal_surface_angle_fade;
                 
                 if(decal_alpha < 0.003){
-                continue;
+                    continue;
                 }
                 
                 material.diffuseColor = material.diffuseColor*(1.0-decal_alpha) + decal_color.xyz*decal_alpha;

package/package.json

@@ -5,7 +5,7 @@
   "productName": "Meep",
   "description": "production-ready JavaScript game engine based on Entity Component System Architecture",
   "author": "Alexander Goldring",
-  "version": "2.43.44",
+  "version": "2.43.46",
   "dependencies": {
     "gl-matrix": "3.4.3",
     "fast-levenshtein": "2.0.6",