@woosh/meep-engine 2.33.2 → 2.33.6

package/engine/graphics/material/optimization/MaterialOptimizationContext.js

@@ -0,0 +1,598 @@
+import { traverseThreeObject } from "../../ecs/highlight/renderer/traverseThreeObject.js";
+import { TextureAttachmentsByMaterialType } from "../../../asset/loaders/material/TextureAttachmensByMaterialType.js";
+import { HashMap } from "../../../../core/collection/HashMap.js";
+import Vector2 from "../../../../core/geom/Vector2.js";
+import { traverseMaterialTextures } from "../../../asset/loaders/material/traverseMaterialTextures.js";
+import { max2 } from "../../../../core/math/max2.js";
+import AABB2 from "../../../../core/geom/AABB2.js";
+import { MaxRectanglesPacker } from "../../../../core/geom/packing/MaxRectangles.js";
+import { Sampler2D } from "../../texture/sampler/Sampler2D.js";
+import { array_push_if_unique } from "../../../../core/collection/array/array_push_if_unique.js";
+import { computeMaterialHash } from "../../../asset/loaders/material/computeMaterialHash.js";
+import { computeMaterialEquality } from "../../../asset/loaders/material/computeMaterialEquality.js";
+import { collectIteratorValueToArray } from "../../../../core/collection/IteratorUtils.js";
+import {
+    ClampToEdgeWrapping,
+    DataTexture,
+    LinearEncoding,
+    LinearFilter,
+    LinearMipmapLinearFilter,
+    Matrix3,
+    sRGBEncoding,
+    UnsignedByteType
+} from "three";
+import { convertTexture2Sampler2D } from "../../texture/sampler/convertTexture2Sampler2D.js";
+
+const ATLAS_PATCH_BORDER = 4;
+
+const BUFFER_GEOMETRY_UVS = [
+    {
+        name: 'uv',
+        index: 0,
+    },
+    {
+        name: 'uv2',
+        index: 1
+    }
+];
+
+class TextureReference {
+    constructor() {
+        /**
+         *
+         * @type {TextureAttachment|null}
+         */
+        this.attachment = null;
+        /**
+         *
+         * @type {THREE.Material|null}
+         */
+        this.material = null;
+        /**
+         *
+         * @type {THREE.Texture|null}
+         */
+        this.source_texture = null;
+    }
+}
+
+/**
+ *
+ * @param {THREE.Mesh} mesh
+ * @returns {boolean}
+ */
+function is_compliant_mesh(mesh) {
+    const material = mesh.material;
+
+    const attachments = TextureAttachmentsByMaterialType[material.type];
+
+    const uv_scales = [1, 1, 1, 1];
+
+    for (let i = 0; i < attachments.length; i++) {
+        const attachment = attachments[i];
+
+        const texture = attachment.read(material);
+        if (texture === undefined || texture === null) {
+            continue;
+        }
+
+        const uv_index = attachment.uv_index;
+
+        uv_scales[uv_index * 2] = max2(uv_scales[uv_index * 2], texture.repeat.x)
+        uv_scales[uv_index * 2 + 1] = max2(uv_scales[uv_index * 2 + 1], texture.repeat.y)
+    }
+
+    const geometry = mesh.geometry;
+
+    for (let i = 0; i < BUFFER_GEOMETRY_UVS.length; i++) {
+        const uv_metadata = BUFFER_GEOMETRY_UVS[i];
+
+        /**
+         *
+         * @type {THREE.BufferAttribute }
+         */
+        const attribute = geometry.attributes[uv_metadata.name];
+
+        if (attribute === undefined) {
+            continue;
+        }
+
+        const attribute_data = attribute.array;
+        const n = attribute_data.length;
+
+        const uv_index = uv_metadata.index;
+        const uv_index_2 = uv_index * 2;
+
+        for (let j = 0; j < n; j += 2) {
+            const x = attribute_data[j];
+            const y = attribute_data[j + 1];
+
+            const scaled_u = x * uv_scales[uv_index_2];
+            const scaled_v = y * uv_scales[uv_index_2 + 1];
+
+            if (scaled_u > 1 || scaled_u < 0 || scaled_v > 1 || scaled_v < 0) {
+                // repeating/negative UV value
+                return false;
+            }
+
+        }
+
+    }
+
+    return true;
+}
+
+class UvContext {
+    constructor() {
+
+        this.resolution = new Vector2(1, 1);
+
+        /**
+         *
+         * @type {AABB2}
+         */
+        this.atlas_patch = new AABB2();
+    }
+}
+
+/**
+ *
+ * @param {Texture} texture
+ * @param {string} attachment_name
+ */
+function prepare_atlas_texture(texture, attachment_name) {
+
+    switch (attachment_name) {
+        case 'diffuse':
+            texture.encoding = sRGBEncoding;
+            break;
+        default:
+            texture.encoding = LinearEncoding;
+    }
+
+    texture.minFilter = LinearMipmapLinearFilter;
+    texture.magFilter = LinearFilter;
+
+    texture.generateMipmaps = true;
+}
+
+
+class MaterialDescriptor {
+    constructor() {
+
+        /**
+         *
+         * @type {THREE.Material|null}
+         */
+        this.source_material = null;
+
+        /**
+         *
+         * @type {UvContext[]}
+         */
+        this.uvs = [];
+    }
+
+    build_uvs() {
+
+        traverseMaterialTextures(this.source_material, (t, attachment) => {
+            const uv_index = attachment.uv_index;
+
+            let uv_context = this.uvs[uv_index];
+
+            if (uv_context === undefined) {
+                uv_context = new UvContext();
+                uv_context.resolution.set(1, 1);
+
+                this.uvs[uv_index] = uv_context;
+            }
+
+            const image = t.image;
+
+            if (image !== undefined && image.width !== undefined) {
+                uv_context.resolution.x = max2(uv_context.resolution.x, image.width);
+                uv_context.resolution.y = max2(uv_context.resolution.y, image.height);
+            }
+
+        });
+
+    }
+
+}
+
+export class MaterialOptimizationContext {
+    constructor() {
+        /**
+         *
+         * @type {THREE.Texture[]}
+         */
+        this.textures = [];
+
+        /**
+         *
+         * @type {THREE.Mesh[]}
+         */
+        this.meshes = [];
+
+
+        /**
+         *
+         * @type {Map<string,Sampler2D>}
+         */
+        this.atlases = new Map();
+
+        /**
+         *
+         * @type {Vector2[]}
+         */
+        this.atlas_size = [];
+    }
+
+    /**
+     *
+     * @param {MaterialDescriptor[]} materials
+     */
+    pack_atlas(materials) {
+        const uv_indices = [];
+        // figure out UV sets
+        materials.forEach(m => {
+            for (let i = 0; i < m.uvs.length; i++) {
+                if (m.uvs[i] !== undefined) {
+                    array_push_if_unique(uv_indices, i);
+                }
+            }
+        });
+
+        for (let i = 0; i < uv_indices.length; i++) {
+            const uv_index = uv_indices[i];
+
+            const packer = new MaxRectanglesPacker(1, 1);
+
+            let pow_x = 0;
+            let pow_y = 0;
+
+            const uv_relevant_materials = materials.filter(d => d.uvs[uv_index] !== undefined);
+
+            const rectangles = uv_relevant_materials.map(d => {
+                const uv_context = d.uvs[uv_index];
+
+                const resolution = uv_context.resolution;
+
+                return new AABB2(0, 0, resolution.x + ATLAS_PATCH_BORDER * 2, resolution.y + ATLAS_PATCH_BORDER * 2);
+
+            });
+
+            let cycle_index = 0;
+
+            while (!packer.addMany(rectangles)) {
+                cycle_index++;
+
+                if (cycle_index % 2 !== 0) {
+                    pow_x++;
+                } else {
+                    pow_y++;
+                }
+
+                const size_x = Math.pow(2, pow_x);
+                const size_y = Math.pow(2, pow_y);
+
+                const max_texture_size = MaterialOptimizationContext.MAX_TEXTURE_SIZE;
+
+                if (size_x > max_texture_size || size_y > max_texture_size) {
+                    throw new Error(`Maximum texture size exceeded '${max_texture_size}'`);
+                }
+
+                packer.resize(size_x, size_y);
+            }
+
+            this.atlas_size[uv_index] = packer.size.clone();
+
+            // all packed, write back bounds
+            rectangles.forEach((r, i) => {
+                const materialDescriptor = uv_relevant_materials[i];
+
+                const p = materialDescriptor.uvs[uv_index].atlas_patch;
+
+                p.set(r.x0 + ATLAS_PATCH_BORDER, r.y0 + ATLAS_PATCH_BORDER, r.x1 - ATLAS_PATCH_BORDER, r.y1 - ATLAS_PATCH_BORDER);
+            });
+        }
+    }
+
+    /**
+     *
+     * @param {MaterialDescriptor[]} materials
+     */
+    build_atlas_samplers(materials) {
+
+        this.atlases.clear();
+
+        const names = [];
+        const uv_indices = [];
+
+        for (let i = 0; i < materials.length; i++) {
+            const material = materials[i];
+
+            const source_material = material.source_material;
+            const materialType = source_material.type;
+
+            /**
+             *
+             * @type {TextureAttachment[]}
+             */
+            const attachments = TextureAttachmentsByMaterialType[materialType];
+
+            for (let i = 0; i < attachments.length; i++) {
+                const attachment = attachments[i];
+
+                if (array_push_if_unique(names, attachment.name)) {
+                    // added
+                    uv_indices[names.length - 1] = attachment.uv_index;
+                }
+
+            }
+        }
+
+        for (let i = 0; i < names.length; i++) {
+            const name = names[i];
+            const uv_index = uv_indices[i];
+
+            const size = this.atlas_size[uv_index];
+
+            this.atlases.set(name, Sampler2D.uint8(4, size.x, size.y));
+        }
+    }
+
+    /**
+     *
+     * @param {MaterialDescriptor} material
+     */
+    write_material_to_atlas(material) {
+        //patch textures
+        const source_material = material.source_material;
+        const materialType = source_material.type;
+
+        /**
+         *
+         * @type {TextureAttachment[]}
+         */
+        const attachments = TextureAttachmentsByMaterialType[materialType];
+
+        for (let i = 0; i < attachments.length; i++) {
+            const attachment = attachments[i];
+
+            const uv_context = material.uvs[attachment.uv_index];
+
+            if (uv_context === undefined) {
+                // material does not participate in this UV set
+                continue;
+            }
+
+            let source_sampler;
+
+            const texture = attachment.read(source_material);
+
+            const texture_width = uv_context.resolution.x;
+            const texture_height = uv_context.resolution.y;
+            if (texture !== undefined && texture !== null) {
+                // source_sampler = Sampler2D.uint8(5, texture_width, texture_height);
+                //
+                // source_sampler.fill(0, 0, texture_width, texture_height, [255, 255, 255, 255]);
+
+                source_sampler = convertTexture2Sampler2D(texture, texture_width, texture_height, false);
+            } else {
+                // TODO proper defaults when a texture is missing
+                source_sampler = Sampler2D.uint8(4, texture_width, texture_height);
+            }
+
+            const atlas = this.atlases.get(attachment.name);
+
+            const patch = uv_context.atlas_patch;
+
+            atlas.copy_sameItemSize(
+                source_sampler,
+                0, 0,
+                patch.x0, patch.y0, patch.getWidth(), patch.getHeight()
+            );
+        }
+    }
+
+    /**
+     *
+     * @param {THREE.Mesh} mesh
+     */
+    addMesh(mesh) {
+        const material = mesh.material;
+
+        if (material.isMeshStandardMaterial) {
+            this.meshes.push(mesh);
+        } else {
+            throw new Error(`Unsupported material type '${material.type}'`);
+        }
+    }
+
+    /**
+     *
+     * @param {THREE.Object} o
+     */
+    addObject(o) {
+        traverseThreeObject(o, (o) => {
+            if (o.isMesh) {
+                this.addMesh(o);
+            }
+        });
+    }
+
+    /**
+     * Update materials and geometries
+     */
+    update() {
+        // collect unique materials and their geometries
+
+        /**
+         *
+         * @type {Map<MaterialDescriptor, THREE.BufferGeometry[]>}
+         */
+        const material_to_geometry_map = new Map();
+
+        /**
+         *
+         * @type {Map<MaterialDescriptor, THREE.Mesh[]>}
+         */
+        const material_to_mesh_map = new Map();
+
+        const unique_materials = new HashMap({
+            keyHashFunction: computeMaterialHash,
+            keyEqualityFunction: computeMaterialEquality
+        });
+
+        const input_meshes = this.meshes;
+        const input_mesh_count = input_meshes.length;
+
+        for (let i = 0; i < input_mesh_count; i++) {
+            const mesh = input_meshes[i];
+
+            if (!is_compliant_mesh(mesh)) {
+                continue;
+            }
+
+            const material = mesh.material;
+
+            let material_descriptor = unique_materials.get(material);
+
+            if (material_descriptor === undefined) {
+                material_descriptor = new MaterialDescriptor();
+                material_descriptor.source_material = material;
+
+                material_descriptor.build_uvs();
+
+                unique_materials.set(material, material_descriptor);
+
+                material_to_geometry_map.set(material_descriptor, []);
+                material_to_mesh_map.set(material_descriptor, []);
+
+            }
+
+            const geometries = material_to_geometry_map.get(material_descriptor);
+
+            array_push_if_unique(geometries, mesh.geometry);
+
+            const mesh_bucket = material_to_mesh_map.get(material_descriptor);
+            mesh_bucket.push(mesh);
+        }
+
+        // collect materials
+        /**
+         *
+         * @type {MaterialDescriptor[]}
+         */
+        const unique_material_array = [];
+        collectIteratorValueToArray(unique_material_array, unique_materials.values());
+
+        if (unique_material_array.length <= 4) {
+            // no point in atlasing
+            return;
+        }
+
+        this.pack_atlas(unique_material_array);
+
+        this.build_atlas_samplers(unique_material_array);
+
+        const textures = new Map();
+        //build new textures
+        for (const [name, sampler] of this.atlases) {
+            const texture = new DataTexture();
+
+            texture.image = {
+                data: sampler.data,
+                width: sampler.width,
+                height: sampler.height
+            };
+
+            texture.wrapS = ClampToEdgeWrapping;
+            texture.wrapT = ClampToEdgeWrapping;
+            texture.type = UnsignedByteType;
+            texture.anisotropy = 4;
+
+            prepare_atlas_texture(texture, name);
+
+            textures.set(name, texture);
+        }
+
+        for (let i = 0; i < unique_material_array.length; i++) {
+            const mat = unique_material_array[i];
+
+            this.write_material_to_atlas(mat);
+
+            // get all associated geometries
+            const geometries = material_to_geometry_map.get(mat);
+
+            for (let j = 0; j < geometries.length; j++) {
+                const bufferGeometry = geometries[j];
+
+                for (let k = 0; k < BUFFER_GEOMETRY_UVS.length; k++) {
+                    const uv_metadata = BUFFER_GEOMETRY_UVS[k];
+
+                    // update UVs
+                    const uv_attribute = bufferGeometry.attributes[uv_metadata.name];
+
+                    if (uv_attribute === undefined) {
+                        // no UVs, nothing to update
+                        continue;
+                    }
+
+
+                    const uv_index = uv_metadata.index;
+                    const uv_context = mat.uvs[uv_index];
+
+                    if (uv_context === undefined) {
+                        // no UV context present
+                        // TODO need to force context to exist in this case or remove the attribute
+                        continue;
+                    }
+
+                    const atlas_size = this.atlas_size[uv_index];
+
+                    const atlas_width = atlas_size.x;
+                    const atlas_height = atlas_size.y;
+
+                    const patch = uv_context.atlas_patch;
+
+                    const matrix3 = new Matrix3();
+                    matrix3.setUvTransform(
+                        patch.x0 / atlas_width,
+                        patch.y0 / atlas_height,
+                        patch.getWidth() / atlas_width,
+                        patch.getHeight() / atlas_height,
+                        0,
+                        0, 0
+                    );
+
+                    uv_attribute.applyMatrix3(matrix3);
+
+                    uv_attribute.needsUpdate = true;
+                }
+            }
+
+            // build material
+            const new_material = mat.source_material.clone();
+
+            traverseMaterialTextures(new_material, (old_texture, attachment) => {
+                attachment.write(new_material, textures.get(attachment.name));
+            });
+
+            // set new material to all associated meshes
+            const meshes = material_to_mesh_map.get(mat);
+            for (let j = 0; j < meshes.length; j++) {
+                const mesh = meshes[j];
+                mesh.material = new_material;
+            }
+        }
+
+    }
+}
+
+/**
+ *
+ * @type {number}
+ */
+MaterialOptimizationContext.MAX_TEXTURE_SIZE = 4096;

package/engine/graphics/micron/build/PatchRepresentation.js

@@ -397,9 +397,11 @@ export class PatchRepresentation {
         result.polygon_count = topology.getFaces().size;
 
         // copy bounding_box
-        result.bounding_box.copy(this.bounding_box);
+        this.bounding_box.writeToArray(result.bounding_box, 0);
 
-        result.group_bounding_box.copy(this.group_aabb);
+        this.group_aabb.writeToArray(result.group_bounding_box, 0);
+
+        this.group_aabb.getCorners(result.group_bounding_box_corners);
 
         vec4.copy(result.group_bounding_sphere, this.group_bounding_sphere);
 
@@ -414,45 +416,4 @@ export class PatchRepresentation {
         // optimize index buffer for better caching
         meshopt_optimizeVertexCache(result.face_indices, result.face_indices, result.face_indices.length, result.vertex_count);
     }
-
-    /**
-     *
-     * @param {THREE.BufferGeometry} source_geometry
-     * @param {MicronVertexDataSpec} vertex_data_spec
-     * @returns {MicronGeometryPatch}
-     */
-    buildGeometryPatch(source_geometry, vertex_data_spec) {
-
-        const result = new MicronGeometryPatch();
-
-        this.buildMicronGeometryPatch(result, source_geometry, vertex_data_spec);
-
-        // patch children
-        result.children = [];
-
-        const rep_children = this.children;
-        const child_count = rep_children.length;
-
-        for (let i = 0; i < child_count; i++) {
-            const child = rep_children[i];
-
-            const child_patch = child.buildGeometryPatch(source_geometry, vertex_data_spec);
-
-            child_patch.parent = result;
-
-            result.children[i] = child_patch;
-        }
-
-        // write dependencies
-        result.dependencies = [];
-
-        const rep_dependencies = this.dependencies;
-        const dependency_count = rep_dependencies.length;
-        for (let i = 0; i < dependency_count; i++) {
-            const rep_dep = rep_dependencies[i];
-            result.dependencies.push(rep_dep.id);
-        }
-
-        return result;
-    }
 }