@woosh/meep-engine 2.72.0 → 2.74.0

package/src/engine/graphics/texture/virtual/v2/TileLoader.js

@@ -0,0 +1,232 @@
+import { assert } from "../../../../../core/assert.js";
+import { arrayQuickSort } from "../../../../../core/collection/array/arrayQuickSort.js";
+import Signal from "../../../../../core/events/signal/Signal.js";
+import { AssetManager } from "../../../../asset/AssetManager.js";
+import { GameAssetType } from "../../../../asset/GameAssetType.js";
+import { compose_finger_print } from "./tile/compose_finger_print.js";
+import { decompose_finger_print } from "./tile/decompose_finger_print.js";
+import { TextureTile } from "./tile/TextureTile.js";
+
+export class TileLoader {
+    /**
+     * Where the tiles are stored
+     * @type {string}
+     */
+    #root_path = "";
+
+    set path(v) {
+        this.#root_path = v;
+    }
+
+    /**
+     * When queue gets larger than this, we start discarding elements
+     * @type {number}
+     */
+    queue_limit = Infinity;
+
+    /**
+     *
+     * @type {AssetManager}
+     */
+    #asset_manager = null;
+
+    set asset_manager(v) {
+        this.#asset_manager = v;
+    }
+
+    /**
+     * How many tiles can be loaded at the same time
+     * @type {number}
+     */
+    #concurrency = 2;
+
+    /**
+     * Tiles that are currently being loaded
+     * @readonly
+     * @type {number[]}
+     */
+    #in_flight = [];
+
+    /**
+     * Contains fingerprints
+     * @readonly
+     * @type {number[]}
+     */
+    #queue = [];
+
+    /**
+     * @readonly
+     */
+    on = {
+        /**
+         * @type {Signal<TextureTile>}
+         */
+        loaded: new Signal()
+    };
+
+
+    /**
+     *
+     * @param {number} fingerprint
+     * @returns {boolean}
+     */
+    #queue_remove(fingerprint) {
+        assert.isNonNegativeInteger(fingerprint, 'fingerprint');
+
+        const i = this.#queue.indexOf(fingerprint);
+
+        if (i === -1) {
+            return false;
+        }
+
+        this.#queue.splice(i, 1);
+
+        return true;
+    }
+
+    #queue_add(fingerprint) {
+        assert.isNonNegativeInteger(fingerprint, 'fingerprint');
+
+        if (this.is_queued(fingerprint)) {
+            return false;
+        }
+
+        this.#queue.push(fingerprint);
+
+        return true;
+    }
+
+    /**
+     *
+     * @param {number} fingerprint
+     */
+    enqueue(fingerprint) {
+        if (this.#in_flight.indexOf(fingerprint) !== -1) {
+            return false;
+        }
+
+        if (this.#queue_add(fingerprint) === false) {
+            return false;
+        }
+
+        this.#prod();
+
+        return true;
+    }
+
+    /**
+     *
+     * @param {number} fingerprint
+     * @returns {boolean}
+     */
+    is_queued(fingerprint) {
+        assert.isNonNegativeInteger(fingerprint, 'fingerprint');
+
+        return this.#queue.indexOf(fingerprint) !== -1;
+    }
+
+    /**
+     *
+     * @param {UsageMetadata} usage
+     */
+    #sort_queue_by_usage(usage) {
+
+        /**
+         *
+         * @param {number} fingerprint
+         */
+        const score = (fingerprint) => -usage.getCountByFingerprint(fingerprint);
+
+        arrayQuickSort(
+            this.#queue,
+            score, null,
+            0, this.#queue.length - 1
+        );
+
+    }
+
+    /**
+     *
+     * @param {UsageMetadata} usage
+     */
+    update_usage(usage) {
+        this.#sort_queue_by_usage(usage);
+
+        // truncate the queue if necessary
+        const queue_overflow = this.#queue.length - this.queue_limit;
+        if (queue_overflow > 0) {
+            this.#queue.splice(this.queue_limit, queue_overflow);
+        }
+    }
+
+    /**
+     *
+     * @param {number} mip
+     * @param {number} x
+     * @param {number} y
+     * @returns {string}
+     */
+    #build_file_name(mip, x, y) {
+
+        assert.isNonNegativeInteger(mip, 'mip');
+        assert.isNonNegativeInteger(x, 'x');
+        assert.isNonNegativeInteger(y, 'y');
+
+        return `${mip}-${x}-${y}.png`;
+    }
+
+    /**
+     * Initializes load of the next element in the queue if there is capacity
+     */
+    #prod() {
+        while (this.#in_flight.length < this.#concurrency && this.#queue.length > 0) {
+            const fingerprint = this.#queue[0];
+            const { mip, x, y } = decompose_finger_print(fingerprint);
+
+            this.#load(mip, x, y);
+        }
+    }
+
+    /**
+     *
+     * @param {number} mip
+     * @param {number} x
+     * @param {number} y
+     * @returns {Promise<TextureTile>}
+     */
+    #load(mip, x, y) {
+        const file_name = this.#build_file_name(mip, x, y);
+        const finger_print = compose_finger_print(mip, x, y);
+
+        this.#queue_remove(finger_print);
+        this.#in_flight.push(finger_print);
+
+        return this.#asset_manager.promise(`${this.#root_path}/${file_name}`, GameAssetType.Image)
+            .then(asset => {
+
+                const sampler = asset.create();
+
+                const tile = new TextureTile();
+
+
+                tile.data = sampler;
+                tile.finder_print = finger_print;
+
+                this.on.loaded.send1(tile);
+
+
+                return tile;
+            }, (reason) => {
+                console.error(`Failed to load tile ${file_name}, reason:${reason}`);
+            })
+            .finally(() => {
+
+                const index = this.#in_flight.indexOf(finger_print);
+                this.#in_flight.splice(index, 1);
+
+                this.#prod();
+
+            })
+
+    }
+}

package/src/engine/graphics/texture/virtual/v2/UsageMetadata.js

@@ -1,182 +1,166 @@
-import { array_get_index_in_range } from "../../../../../core/collection/array/array_get_index_in_range.js";
-import { array_swap } from "../../../../../core/collection/array/array_swap.js";
 import { arrayQuickSort } from "../../../../../core/collection/array/arrayQuickSort.js";
-import { passThrough } from "../../../../../core/function/Functions.js";
-import { split_by_2 } from "../../../../../core/geom/3d/morton/split_by_2.js";
+import { compose_finger_print } from "./tile/compose_finger_print.js";
+import { finger_print_to_tile_address } from "./tile/finger_print_to_tile_address.js";
 
-const DEFAULT_CAPACITY = 64;
 
-/**
- *
- * @param {number} finger_print
- * @returns {number}
- */
-function finger_print_to_tile_index(finger_print) {
-    // decode fingerprint
-    const mip = (finger_print >> 24) & 0xFF;
-    const x = (finger_print >> 16) & 0xFF;
-    const y = (finger_print >> 8) & 0xFF;
+function compose_tile_address(mip, x, y) {
+    const finger_print = compose_finger_print(mip, x, y);
 
-    // figure out resolution of this mip level
-    const mip_resolution = 1 << mip;
+    return finger_print_to_tile_address(finger_print);
+}
 
-    // this is basically converting something like 0100 to 0011;
-    const mip_mask = mip_resolution - 1;
+export class UsageMetadata {
 
-    // where data for this mip starts
-    const index_offset = split_by_2(mip_mask);
+    #counts_intrinsic = new Uint32Array(0);
+    /**
+     * Stores indices of tiles with usage > 0
+     * @type {Uint32Array}
+     */
+    #occupancy = new Uint32Array(0);
+    /**
+     * Points at the end of the occupancy list
+     * @type {number}
+     */
+    #occupancy_cursor = 0;
 
-    return index_offset + x + y * mip_resolution;
-}
+    get counts() {
+        return this.#counts_intrinsic;
+    }
 
-export class UsageMetadata {
+    #max_mip_level = 0;
 
-    #cursor = 0;
 
-    #lookup = new Uint32Array(0);
-    #counts = new Uint32Array(0);
+    set max_mip_level(v) {
+        this.#max_mip_level = v;
 
-    #counts_intrinsic = new Uint32Array(0);
+        this.#ensureCapacity();
+    }
+
+    get max_mip_level() {
+        return this.#max_mip_level;
+    }
 
-    #capacity = 0;
 
-    constructor() {
-        this.#ensureCapacity(DEFAULT_CAPACITY);
+    get occupancy() {
+        return this.#occupancy;
+    }
+
+    get occupancy_count() {
+        return this.#occupancy_cursor;
     }
 
     /**
      *
-     * @param {number} min_size
      */
-    #ensureCapacity(min_size) {
-        if (this.#capacity >= min_size) {
-            return;
-        }
-
-        const buffer = new ArrayBuffer(min_size * 2 * 4);
+    #ensureCapacity() {
 
-        this.#lookup = new Uint32Array(buffer, 0, min_size);
-        this.#counts = new Uint32Array(buffer, min_size * 4, min_size);
+        const size = compose_tile_address(this.#max_mip_level + 1, 0, 0);
 
-        this.#capacity = min_size;
-    }
+        if (this.#counts_intrinsic.length >= size) {
+            // already large enough
+            return;
+        }
 
-    get tile_count() {
-        return this.#cursor;
+        this.#counts_intrinsic = new Uint32Array(size);
+        this.#occupancy = new Uint32Array(size);
     }
 
-    getTile(index) {
-        return this.#lookup[index];
-    }
+    /**
+     *
+     * @param {number} fingerprint
+     * @returns {number}
+     */
+    getCountByFingerprint(fingerprint) {
+        const index = finger_print_to_tile_address(fingerprint);
 
-    getCount(index) {
-        return this.#counts[index];
+        return this.#counts_intrinsic[index];
     }
 
-    clear() {
-        this.#cursor = 0;
-        this.#counts.fill(0);
-    }
+    /**
+     *
+     * @param {number} mip
+     * @param {number} x
+     * @param {number} y
+     * @returns {number}
+     */
+    getCountBy(mip, x, y) {
+        const address = compose_tile_address(mip, x, y);
 
-    swap(a, b) {
-        array_swap(
-            this.#lookup,
-            a,
-            this.#lookup,
-            b,
-            1
-        );
-        array_swap(
-            this.#counts,
-            a,
-            this.#counts,
-            b,
-            1
-        );
+        return this.#counts_intrinsic[address];
     }
 
-    sortByCount() {
-        arrayQuickSort(this.#counts, passThrough, undefined, 0, this.#cursor - 1, (counts, i, j) => {
-            this.swap(i, j);
-        });
+    clear() {
+        this.#counts_intrinsic.fill(0);
+        this.#occupancy_cursor = 0;
     }
 
     /**
      * Given existing usage, award same usage to all tiles up the chain all the way to the root
      * This helps avoid popping and ensures that when there's not enough space - at least the higher level LOD tiles are available
      * @param {number} bias added to the ancestor tiles to make them more likely to be loaded
-     * @returns {number} number of tiles added
      */
-    promoteAncestors(bias = 0) {
-        const start_cursor = this.#cursor;
+    promoteAncestors(bias = 1) {
 
-        for (let tile_index = 0; tile_index < this.#cursor; tile_index++) {
-            let finger_print = this.#lookup[tile_index];
+        // traverse mip pyramid in reverse, so we can push counts to parents one level at a time
+        for (let mip = this.#max_mip_level; mip > 0; mip--) {
 
-            let level = (finger_print >> 24) & 0xFF;
+            const mip_resolution = 1 << mip;
 
-            let index = tile_index;
+            for (let y = 0; y < mip_resolution; y++) {
+                for (let x = 0; x < mip_resolution; x++) {
 
-            while (level > 0) {
+                    const count = this.getCountBy(mip, x, y);
 
-                const x = (finger_print >> 16) & 0xFF;
-                const y = (finger_print >> 8) & 0xFF;
-                const texture_id = (finger_print) & 0xFF;
+                    if (count <= 0) {
+                        continue;
+                    }
 
-                // get higher-level lod
-                const parent_level = level - 1;
-                const parent_x = x >>> 1;
-                const parent_y = y >>> 1;
+                    // get higher-level lod
+                    const parent_level = mip - 1;
+                    const parent_x = x >>> 1;
+                    const parent_y = y >>> 1;
 
-                const parent_finger_print =
-                    (parent_level << 24)
-                    | (parent_x << 16)
-                    | (parent_y << 8)
-                    | (texture_id << 0);
+                    const parent_index = compose_tile_address(parent_level, parent_x, parent_y);
 
-                const parent_index = this.bindTileIndex(parent_finger_print);
+                    const parent_count = this.#counts_intrinsic[parent_index];
 
-                const push_value = this.#counts[tile_index] + bias;
-                const parent_count = this.#counts[parent_index];
+                    const expected_count = count + bias;
 
-                if (parent_count >= push_value) {
-                    // already high, no need to do anything
-                    break;
-                }
-
-                this.#counts[parent_index] = push_value;
+                    if (parent_count < expected_count) {
+                        this.#counts_intrinsic[parent_index] = expected_count;
 
+                        if (parent_count === 0) {
+                            this.#append_to_occupancy(parent_index);
+                        }
+                    }
 
-                //
-                finger_print = parent_finger_print;
-                level = parent_level;
-
-                index = parent_index;
+                }
             }
-        }
 
-        return this.#cursor - start_cursor;
+        }
     }
 
     /**
      *
-     * @param {number} finger_print
-     * @returns {number}
+     * @param {number} address
      */
-    bindTileIndex(finger_print) {
-
-        const lookup = this.#lookup;
-
-        let index = array_get_index_in_range(lookup, finger_print, 0, this.#cursor - 1);
-
-        if (index === -1) {
-            index = this.#cursor++;
-            lookup[index] = finger_print;
-        }
+    #append_to_occupancy(address) {
+        this.#occupancy[this.#occupancy_cursor] = address;
+        this.#occupancy_cursor++;
+    }
 
-        return index;
+    /**
+     * Sort occupancy list in descending order
+     */
+    sortOccupancy() {
+        arrayQuickSort(
+            this.#occupancy,
+            (index) => -this.#counts_intrinsic[index], null,
+            0, this.#occupancy_cursor - 1
+        );
     }
 
+
     /**
      *
      * @param {Uint8Array} data usage texture data
@@ -186,12 +170,17 @@ export class UsageMetadata {
 
         const data_size = data.length;
 
-        this.#ensureCapacity(data_size >> 2);
+        this.#ensureCapacity();
 
-        const counts = this.#counts;
+        const counts = this.#counts_intrinsic;
 
         for (let offset = 0; offset < data_size; offset += 4) {
 
+            if (data[offset + 3] === 0) {
+                // no data
+                continue;
+            }
+
             const mip_level = data[offset];
 
             // we create a mask to make sure we don't end up with invalid tile position values
@@ -200,21 +189,16 @@ export class UsageMetadata {
             const tile_x = data[offset + 1] & max_tile_value;
             const tile_y = data[offset + 2] & max_tile_value;
 
-            const texture_id = data[offset + 3];
+            const tile_address = compose_tile_address(mip_level, tile_x, tile_y);
 
-            const finger_print =
-                (mip_level << 24)
-                | (tile_x << 16)
-                | (tile_y << 8)
-                | (texture_id << 0);
+            const previous_count = counts[tile_address];
 
-            if (finger_print === 0) {
-                continue;
+            if (previous_count === 0) {
+                // first occurrence, mark occupancy
+                this.#append_to_occupancy(tile_address);
             }
 
-            const index = this.bindTileIndex(finger_print);
-
-            counts[index]++;
+            counts[tile_address] = previous_count + 1;
         }
 
     }