@woosh/meep-engine 2.48.15 → 2.48.16

package/package.json

@@ -5,7 +5,7 @@
   "description": "Fully featured ECS game engine written in JavaScript",
   "type": "module",
   "author": "Alexander Goldring",
-  "version": "2.48.15",
+  "version": "2.48.16",
   "main": "build/meep.module.js",
   "module": "build/meep.module.js",
   "exports": {

package/src/core/geom/Quaternion.d.ts

@@ -34,12 +34,8 @@ export default class Quaternion {
 
     normalize(): void
 
-    __setThreeEuler(threeEuler: any): void
-
     __setFromEuler(x: number, y: number, z: number, order?: string): void
 
-    threeSetRotationMatrix(result: Matrix4): void
-
     setFromRotationMatrix(m: Matrix4): void
 
     decodeFromUint32(uint: number): void

package/src/engine/ecs/systems/RenderSystem.js

@@ -138,7 +138,10 @@ class RenderSystem extends System {
 
         function handleRotationChange() {
             const m = renderable.object;
-            transform.rotation.__setThreeEuler(m.rotation);
+            const euler = m.rotation;
+
+            transform.rotation.__setFromEuler(euler.x, euler.y, euler.z, euler.order);
+
             updateMeshTransform(renderable);
             updateNodeByTransformAndBBB(renderable.bvh, renderable.boundingBox, transform);
         }

package/src/engine/graphics/texture/3d/SingleChannelSampler3D.js

@@ -1,10 +1,24 @@
-import { clamp } from "../../../../core/math/clamp.js";
-import { lerp } from "../../../../core/math/lerp.js";
+import { scs3d_sample_linear } from "./scs3d_sample_linear.js";
 
 export class SingleChannelSampler3D {
 
     data = new Float32Array(0)
-    #resolution = [0, 0, 0]
+    #resolution = new Uint32Array([0, 0, 0])
+
+    /**
+     *
+     * @param {Float32Array} data
+     * @param {ArrayLike<number>|Uint32Array|number[]} resolution
+     * @return {SingleChannelSampler3D}
+     */
+    static from(data, resolution) {
+        const r = new SingleChannelSampler3D();
+
+        r.data = data;
+        r.#resolution.set(resolution);
+
+        return r;
+    }
 
     set resolution(v) {
         const width = v[0];
@@ -66,64 +80,7 @@ export class SingleChannelSampler3D {
         const res_x = resolution[0];
         const res_y = resolution[1];
         const res_z = resolution[2];
-
-        const x_max = res_x - 1;
-        const y_max = res_y - 1;
-        const z_max = res_z - 1;
-
-        const x_clamped = clamp(x, 0, x_max);
-        const y_clamped = clamp(y, 0, y_max);
-        const z_clamped = clamp(z, 0, z_max);
-
-        const x0 = x_clamped | 0;
-        const y0 = y_clamped | 0;
-        const z0 = z_clamped | 0;
-
-        const f_x = x_clamped - x0;
-        const f_y = y_clamped - y0;
-        const f_z = z_clamped - z0;
-
-        const x1 = x_clamped === x0 ? x0 : x0 + 1;
-        const y1 = y_clamped === y0 ? y0 : y0 + 1;
-        const z1 = z_clamped === z0 ? z0 : z0 + 1;
-
-        // get 8 points
-        const data = this.data;
-
-        const z0_offset = z0 * (res_x * res_y);
-
-        const y0_offset = y0 * res_x;
-
-        const x0_offset = x0;
-        const x1_offset = x1;
-
-        const x0y0z0 = data[z0_offset + y0_offset + x0_offset];
-        const x1y0z0 = data[z0_offset + y0_offset + x1_offset];
-
-        const y1_offset = y1 * res_x;
-
-        const x0y1z0 = data[z0_offset + y1_offset + x0_offset];
-        const x1y1z0 = data[z0_offset + y1_offset + x1_offset];
-
-        const z1_offset = z1 * (res_x * res_y);
-
-        const x0y0z1 = data[z1_offset + y0_offset + x0_offset];
-        const x1y0z1 = data[z1_offset + y0_offset + x1_offset];
-
-        const x0y1z1 = data[z1_offset + y1_offset + x0_offset];
-        const x1y1z1 = data[z1_offset + y1_offset + x1_offset];
-
-        // filter on z0
-        const lerp_z0_y0 = lerp(x0y0z0, x1y0z0, f_x);
-        const lerp_z0_y1 = lerp(x0y1z0, x1y1z0, f_x);
-        const lerp_z0 = lerp(lerp_z0_y0, lerp_z0_y1, f_y);
-
-        // filter on z1
-        const lerp_z1_y0 = lerp(x0y0z1, x1y0z1, f_x);
-        const lerp_z1_y1 = lerp(x0y1z1, x1y1z1, f_x);
-        const lerp_z1 = lerp(lerp_z1_y0, lerp_z1_y1, f_y);
-
-        return lerp(lerp_z0, lerp_z1, f_z);
+        return scs3d_sample_linear(this.data, res_x, res_y, res_z, x, y, z);
     }
 
     /**

package/src/engine/graphics/texture/3d/scs3d_sample_linear.js

@@ -0,0 +1,71 @@
+import { clamp } from "../../../../core/math/clamp.js";
+import { lerp } from "../../../../core/math/lerp.js";
+
+/**
+ *
+ * @param {Float32Array} data
+ * @param {number} res_x
+ * @param {number} res_y
+ * @param {number} res_z
+ * @param {number} x
+ * @param {number} y
+ * @param {number} z
+ * @return {number}
+ */
+export function scs3d_sample_linear(data, res_x, res_y, res_z, x, y, z) {
+    const x_max = res_x - 1;
+    const y_max = res_y - 1;
+    const z_max = res_z - 1;
+
+    const x_clamped = clamp(x, 0, x_max);
+    const y_clamped = clamp(y, 0, y_max);
+    const z_clamped = clamp(z, 0, z_max);
+
+    const x0 = x_clamped | 0;
+    const y0 = y_clamped | 0;
+    const z0 = z_clamped | 0;
+
+    const f_x = x_clamped - x0;
+    const f_y = y_clamped - y0;
+    const f_z = z_clamped - z0;
+
+    const x1 = x_clamped === x0 ? x0 : x0 + 1;
+    const y1 = y_clamped === y0 ? y0 : y0 + 1;
+    const z1 = z_clamped === z0 ? z0 : z0 + 1;
+
+    // get 8 points
+    const z0_offset = z0 * (res_x * res_y);
+
+    const y0_offset = y0 * res_x;
+
+    const x0_offset = x0;
+    const x1_offset = x1;
+
+    const x0y0z0 = data[z0_offset + y0_offset + x0_offset];
+    const x1y0z0 = data[z0_offset + y0_offset + x1_offset];
+
+    const y1_offset = y1 * res_x;
+
+    const x0y1z0 = data[z0_offset + y1_offset + x0_offset];
+    const x1y1z0 = data[z0_offset + y1_offset + x1_offset];
+
+    const z1_offset = z1 * (res_x * res_y);
+
+    const x0y0z1 = data[z1_offset + y0_offset + x0_offset];
+    const x1y0z1 = data[z1_offset + y0_offset + x1_offset];
+
+    const x0y1z1 = data[z1_offset + y1_offset + x0_offset];
+    const x1y1z1 = data[z1_offset + y1_offset + x1_offset];
+
+    // filter on z0
+    const lerp_z0_y0 = lerp(x0y0z0, x1y0z0, f_x);
+    const lerp_z0_y1 = lerp(x0y1z0, x1y1z0, f_x);
+    const lerp_z0 = lerp(lerp_z0_y0, lerp_z0_y1, f_y);
+
+    // filter on z1
+    const lerp_z1_y0 = lerp(x0y0z1, x1y0z1, f_x);
+    const lerp_z1_y1 = lerp(x0y1z1, x1y1z1, f_x);
+    const lerp_z1 = lerp(lerp_z1_y0, lerp_z1_y1, f_y);
+
+    return lerp(lerp_z0, lerp_z1, f_z);
+}

package/src/engine/physics/fluid/Fluid.js

@@ -0,0 +1,218 @@
+export class Fluid {
+    constructor(density, numX, numY, h) {
+        this.density = density;
+        this.numX = numX + 2;
+        this.numY = numY + 2;
+        this.numCells = this.numX * this.numY;
+        this.h = h;
+        this.u = new Float32Array(this.numCells);
+        this.v = new Float32Array(this.numCells);
+        this.newU = new Float32Array(this.numCells);
+        this.newV = new Float32Array(this.numCells);
+        this.p = new Float32Array(this.numCells);
+        this.s = new Float32Array(this.numCells);
+        this.m = new Float32Array(this.numCells);
+        this.newM = new Float32Array(this.numCells);
+        this.m.fill(1.0)
+    }
+
+    integrate(dt, gravity) {
+        var n = this.numY;
+        for (var i = 1; i < this.numX; i++) {
+            for (var j = 1; j < this.numY-1; j++) {
+                if (this.s[i*n + j] != 0.0 && this.s[i*n + j-1] != 0.0)
+                    this.v[i*n + j] += gravity * dt;
+            }
+        }
+    }
+
+    solveIncompressibility(numIters, dt) {
+
+        var n = this.numY;
+        var cp = this.density * this.h / dt;
+
+        for (var iter = 0; iter < numIters; iter++) {
+
+            for (var i = 1; i < this.numX-1; i++) {
+                for (var j = 1; j < this.numY-1; j++) {
+
+                    if (this.s[i*n + j] == 0.0)
+                        continue;
+
+                    var s = this.s[i*n + j];
+                    var sx0 = this.s[(i-1)*n + j];
+                    var sx1 = this.s[(i+1)*n + j];
+                    var sy0 = this.s[i*n + j-1];
+                    var sy1 = this.s[i*n + j+1];
+                    var s = sx0 + sx1 + sy0 + sy1;
+                    if (s == 0.0)
+                        continue;
+
+                    var div = this.u[(i+1)*n + j] - this.u[i*n + j] +
+                        this.v[i*n + j+1] - this.v[i*n + j];
+
+                    var p = -div / s;
+                    p *= scene.overRelaxation;
+                    this.p[i*n + j] += cp * p;
+
+                    this.u[i*n + j] -= sx0 * p;
+                    this.u[(i+1)*n + j] += sx1 * p;
+                    this.v[i*n + j] -= sy0 * p;
+                    this.v[i*n + j+1] += sy1 * p;
+                }
+            }
+        }
+    }
+
+    extrapolate() {
+        var n = this.numY;
+        for (var i = 0; i < this.numX; i++) {
+            this.u[i*n + 0] = this.u[i*n + 1];
+            this.u[i*n + this.numY-1] = this.u[i*n + this.numY-2];
+        }
+        for (var j = 0; j < this.numY; j++) {
+            this.v[0*n + j] = this.v[1*n + j];
+            this.v[(this.numX-1)*n + j] = this.v[(this.numX-2)*n + j]
+        }
+    }
+
+    sampleField(x, y, field) {
+        var n = this.numY;
+        var h = this.h;
+        var h1 = 1.0 / h;
+        var h2 = 0.5 * h;
+
+        x = Math.max(Math.min(x, this.numX * h), h);
+        y = Math.max(Math.min(y, this.numY * h), h);
+
+        var dx = 0.0;
+        var dy = 0.0;
+
+        var f;
+
+        switch (field) {
+            case U_FIELD: f = this.u; dy = h2; break;
+            case V_FIELD: f = this.v; dx = h2; break;
+            case S_FIELD: f = this.m; dx = h2; dy = h2; break
+
+        }
+
+        var x0 = Math.min(Math.floor((x-dx)*h1), this.numX-1);
+        var tx = ((x-dx) - x0*h) * h1;
+        var x1 = Math.min(x0 + 1, this.numX-1);
+
+        var y0 = Math.min(Math.floor((y-dy)*h1), this.numY-1);
+        var ty = ((y-dy) - y0*h) * h1;
+        var y1 = Math.min(y0 + 1, this.numY-1);
+
+        var sx = 1.0 - tx;
+        var sy = 1.0 - ty;
+
+        var val = sx*sy * f[x0*n + y0] +
+            tx*sy * f[x1*n + y0] +
+            tx*ty * f[x1*n + y1] +
+            sx*ty * f[x0*n + y1];
+
+        return val;
+    }
+
+    avgU(i, j) {
+        var n = this.numY;
+        var u = (this.u[i*n + j-1] + this.u[i*n + j] +
+            this.u[(i+1)*n + j-1] + this.u[(i+1)*n + j]) * 0.25;
+        return u;
+
+    }
+
+    avgV(i, j) {
+        var n = this.numY;
+        var v = (this.v[(i-1)*n + j] + this.v[i*n + j] +
+            this.v[(i-1)*n + j+1] + this.v[i*n + j+1]) * 0.25;
+        return v;
+    }
+
+    advectVel(dt) {
+
+        this.newU.set(this.u);
+        this.newV.set(this.v);
+
+        var n = this.numY;
+        var h = this.h;
+        var h2 = 0.5 * h;
+
+        for (var i = 1; i < this.numX; i++) {
+            for (var j = 1; j < this.numY; j++) {
+
+                cnt++;
+
+                // u component
+                if (this.s[i*n + j] != 0.0 && this.s[(i-1)*n + j] != 0.0 && j < this.numY - 1) {
+                    var x = i*h;
+                    var y = j*h + h2;
+                    var u = this.u[i*n + j];
+                    var v = this.avgV(i, j);
+//						var v = this.sampleField(x,y, V_FIELD);
+                    x = x - dt*u;
+                    y = y - dt*v;
+                    u = this.sampleField(x,y, U_FIELD);
+                    this.newU[i*n + j] = u;
+                }
+                // v component
+                if (this.s[i*n + j] != 0.0 && this.s[i*n + j-1] != 0.0 && i < this.numX - 1) {
+                    var x = i*h + h2;
+                    var y = j*h;
+                    var u = this.avgU(i, j);
+//						var u = this.sampleField(x,y, U_FIELD);
+                    var v = this.v[i*n + j];
+                    x = x - dt*u;
+                    y = y - dt*v;
+                    v = this.sampleField(x,y, V_FIELD);
+                    this.newV[i*n + j] = v;
+                }
+            }
+        }
+
+        this.u.set(this.newU);
+        this.v.set(this.newV);
+    }
+
+    advectSmoke(dt) {
+
+        this.newM.set(this.m);
+
+        var n = this.numY;
+        var h = this.h;
+        var h2 = 0.5 * h;
+
+        for (var i = 1; i < this.numX-1; i++) {
+            for (var j = 1; j < this.numY-1; j++) {
+
+                if (this.s[i*n + j] != 0.0) {
+                    var u = (this.u[i*n + j] + this.u[(i+1)*n + j]) * 0.5;
+                    var v = (this.v[i*n + j] + this.v[i*n + j+1]) * 0.5;
+                    var x = i*h + h2 - dt*u;
+                    var y = j*h + h2 - dt*v;
+
+                    this.newM[i*n + j] = this.sampleField(x,y, S_FIELD);
+                }
+            }
+        }
+        this.m.set(this.newM);
+    }
+
+    // ----------------- end of simulator ------------------------------
+
+
+    simulate(dt, gravity, numIters) {
+
+        this.integrate(dt, gravity);
+
+        this.p.fill(0.0);
+        this.solveIncompressibility(numIters, dt);
+
+        this.extrapolate();
+        this.advectVel(dt);
+        this.advectSmoke(dt);
+    }
+}
+

package/src/engine/physics/fluid/FluidField.js

@@ -1,22 +1,12 @@
-import { clamp } from "../../../core/math/clamp.js";
-import { lerp } from "../../../core/math/lerp.js";
 
-/**
- *
- * @param {Float32Array} data
- * @param {number[]} resolution
- */
-function v3_grid_apply_advection_forward(data, resolution) {
-
-}
-
-/**
- *
- * @param {Float32Array} data
- * @param {number[]} resolution
- */
-function v3_grid_apply_advection_reverse(data, resolution) {
 
+class FluidAttribute {
+    name = "unnamed"
+    /**
+     *
+     * @type {Float32Array}
+     */
+    data = null
 }
 
 /**
@@ -26,117 +16,84 @@ function v3_grid_apply_advection_reverse(data, resolution) {
  * @see Inspired by GDC talk "Interactive Wind and Vegetation in 'God of War'" - https://www.youtube.com/watch?v=MKX45_riWQA
  */
 export class FluidField {
-    data = new Float32Array(0)
+
+    #attributes = [];
+
+
     #size = [0, 0, 0]
     #resolution = [0, 0, 0]
 
+    buffer = null;
 
-    build() {
-        this.data = new Float32Array(
-            this.#resolution[0] * this.#resolution[1] * this.#resolution[2] * 3
-        );
-    }
+    addAttribute(name) {
+        const attribute = new FluidAttribute();
+        attribute.name = name;
 
-    /**
-     *
-     * @param {number[]} out
-     * @param {number} u
-     * @param {number} v
-     * @param {number} w
-     */
-    sample_linear_uv(out, u, v, w) {
-        const max_x = this.#resolution[0] - 1;
-        const max_y = this.#resolution[1] - 1;
-        const max_z = this.#resolution[2] - 1;
+        const index = this.#attributes.length;
+
+        this.#attributes.push(attribute);
 
-        this.sample_linear(out, u * max_x, v * max_y, w * max_z);
+        return index;
+    }
+
+    #findAttribute(name) {
+        return this.#attributes.find(a => a.name === name);
     }
 
     /**
      *
-     * @param {number[]} out
-     * @param {number} x
-     * @param {number} y
-     * @param {number} z
+     * @param {string} name
+     * @return {Float32Array}
      */
-    sample_linear(out, x, y, z) {
-        out[0] = this.sample_channel_linear(x, y, z, 0);
-        out[1] = this.sample_channel_linear(x, y, z, 1);
-        out[2] = this.sample_channel_linear(x, y, z, 2);
+    getAttributeData(name) {
+        return this.#findAttribute(name)?.data;
+    }
+
+    getAttributeCount() {
+        return this.#attributes.length;
     }
 
     /**
      *
-     * @param {number} x
-     * @param {number} y
-     * @param {number} z
-     * @param {number} channel
-     * @returns {number}
+     * @param {ArrayBuffer} buffer
+     * @param {number} offset
      */
-    sample_channel_linear(x, y, z, channel) {
-        const resolution = this.#resolution;
+    attachBuffer(buffer, offset = 0) {
 
-        const res_x = resolution[0];
-        const res_y = resolution[1];
-        const res_z = resolution[2];
+        const attribute_count = this.#attributes.length;
 
-        const x_max = res_x - 1;
-        const y_max = res_y - 1;
-        const z_max = res_z - 1;
+        const cell_count = this.#resolution[0] * this.#resolution[1] * this.#resolution[2];
 
-        const x_clamped = clamp(x, 0, x_max);
-        const y_clamped = clamp(y, 0, y_max);
-        const z_clamped = clamp(z, 0, z_max);
+        for (let i = 0; i < attribute_count; i++) {
+            const attribute = this.#attributes[i];
 
-        const x0 = x_clamped | 0;
-        const y0 = y_clamped | 0;
-        const z0 = z_clamped | 0;
+            const array = new Float32Array(buffer, offset + i * cell_count * 4, cell_count);
 
-        const f_x = x_clamped - x0;
-        const f_y = y_clamped - y0;
-        const f_z = z_clamped - z0;
 
-        const x1 = x_clamped === x0 ? x0 : x0 + 1;
-        const y1 = y_clamped === y0 ? y0 : y0 + 1;
-        const z1 = z_clamped === z0 ? z0 : z0 + 1;
+            attribute.data = array;
+        }
 
-        // get 8 points
-        const data = this.data;
-
-        const z0_offset = z0 * (res_x * res_y) * 3;
-
-        const y0_offset = y0 * res_x * 3;
-
-        const x0_offset = x0 * 3 + channel;
-        const x1_offset = x1 * 3 + channel;
+        this.buffer = buffer;
+    }
 
-        const x0y0z0 = data[z0_offset + y0_offset + x0_offset];
-        const x1y0z0 = data[z0_offset + y0_offset + x1_offset];
+    setAttributeAt(attribute_index, x, y, z, value) {
 
-        const y1_offset = y1 * res_x * 3;
+        const attribute = this.#attributes[attribute_index];
 
-        const x0y1z0 = data[z0_offset + y1_offset + x0_offset];
-        const x1y1z0 = data[z0_offset + y1_offset + x1_offset];
+        const data = attribute.data;
 
-        const z1_offset = z1 * (res_x * res_y) * 3;
+        data[z * this.#resolution[0] * this.#resolution[1] + y * this.#resolution[0] + x] = value;
 
-        const x0y0z1 = data[z1_offset + y0_offset + x0_offset];
-        const x1y0z1 = data[z1_offset + y0_offset + x1_offset];
+    }
 
-        const x0y1z1 = data[z1_offset + y1_offset + x0_offset];
-        const x1y1z1 = data[z1_offset + y1_offset + x1_offset];
+    build() {
+        const attribute_count = this.#attributes.length;
 
-        // filter on z0
-        const lerp_z0_y0 = lerp(x0y0z0, x1y0z0, f_x);
-        const lerp_z0_y1 = lerp(x0y1z0, x1y1z0, f_x);
-        const lerp_z0 = lerp(lerp_z0_y0, lerp_z0_y1, f_y);
+        const cell_count = this.#resolution[0] * this.#resolution[1] * this.#resolution[2];
 
-        // filter on z1
-        const lerp_z1_y0 = lerp(x0y0z1, x1y0z1, f_x);
-        const lerp_z1_y1 = lerp(x0y1z1, x1y1z1, f_x);
-        const lerp_z1 = lerp(lerp_z1_y0, lerp_z1_y1, f_y);
+        const data_buffer = new ArrayBuffer(cell_count * attribute_count * 4);
 
-        return lerp(lerp_z0, lerp_z1, f_z);
+        this.attachBuffer(data_buffer);
     }
 
     set size(v) {
@@ -158,4 +115,8 @@ export class FluidField {
         this.#resolution[1] = height;
         this.#resolution[2] = depth
     }
+
+    get resolution() {
+        return this.#resolution;
+    }
 }

package/src/engine/physics/fluid/FluidSimulator.js

@@ -0,0 +1,95 @@
+import { v3_grid_apply_diffusion } from "./solver/v3_grid_apply_diffusion.js";
+import { v3_grid_apply_advection_forward } from "./solver/v3_grid_apply_advection_forward.js";
+
+
+export class FluidSimulator {
+
+    /**
+     *
+     * @type {ArrayBuffer|null}
+     */
+    buffer = null;
+
+    ensure_buffer(size) {
+        if (this.buffer === null || this.buffer.byteLength < size) {
+            this.buffer = new ArrayBuffer(size);
+        }
+    }
+
+    /**
+     *
+     * @param {FluidField} field
+     * @param {number} time_delta_in_seconds
+     */
+    step(field, time_delta_in_seconds) {
+        // create buffer big enough to store all attribute twice
+        const resolution = field.resolution;
+
+        const attribute_cell_count = resolution[0] * resolution[1] * resolution[2];
+        const attribute_byte_size = attribute_cell_count * 4;
+        const field_byte_size = field.getAttributeCount() * attribute_byte_size;
+
+        this.ensure_buffer(field_byte_size * 2);
+
+        const sim_buffer = this.buffer;
+
+        // remember current data
+        new Uint8Array(sim_buffer, 0, field_byte_size).set(new Uint8Array(field.buffer, 0, field_byte_size))
+
+        let ping_pong_index = 0;
+
+        const DIFFUSE_STEPS = 2;
+
+        for (let i = 0; i < 3; i++) {
+            // perform diffusion
+            let source = new Float32Array(sim_buffer, attribute_byte_size * i, attribute_cell_count)
+            let target = new Float32Array(sim_buffer, field_byte_size + attribute_byte_size * i, attribute_cell_count);
+
+            const ping_pong = [source, target];
+
+            ping_pong_index = 0;
+
+            for (let j = 0; j < DIFFUSE_STEPS; j++) {
+
+                source = ping_pong[ping_pong_index % 2];
+                target = ping_pong[(ping_pong_index + 1) % 2];
+
+                v3_grid_apply_diffusion(target, source, resolution);
+
+                ping_pong_index++;
+            }
+
+        }
+
+        ping_pong_index = DIFFUSE_STEPS;
+
+        const inputs = [];
+        const outputs = [];
+
+        for (let i = 0; i < 3; i++) {
+            const source = ping_pong_index % 2
+            const target = (ping_pong_index + 1) % 2
+
+            inputs[i] = new Float32Array(
+                sim_buffer, source * field_byte_size + attribute_byte_size * i, attribute_cell_count
+            );
+
+            outputs[i] = new Float32Array(
+                sim_buffer, target * field_byte_size + attribute_byte_size * i, attribute_cell_count
+            );
+        }
+
+        ping_pong_index++;
+
+        // advection
+        v3_grid_apply_advection_forward(outputs, inputs, resolution, time_delta_in_seconds);
+
+
+        if (ping_pong_index % 2 !== 0) {
+            // data is not at source
+            field.attachBuffer(sim_buffer, field_byte_size);
+        } else {
+            field.attachBuffer(sim_buffer, 0);
+        }
+    }
+}

package/src/engine/physics/fluid/SliceVisualiser.js

@@ -0,0 +1,165 @@
+import EmptyView from "../../../view/elements/EmptyView.js";
+import { float2uint8 } from "../../../core/binary/float2uint8.js";
+import { max2 } from "../../../core/math/max2.js";
+import { Sampler2D } from "../../graphics/texture/sampler/Sampler2D.js";
+import { CanvasView } from "../../../view/elements/CanvasView.js";
+
+export class SliceVisualiser extends EmptyView {
+
+    #data = null;
+    #views = [];
+    #slices = [];
+    #resolution = [0, 0, 0];
+    #imageData = null;
+    #channelCount = 1
+    #drawMethod = (out, out_offset, sample, channelCount) => {
+        let i = 0;
+
+        for (; i < channelCount; i++) {
+            out[out_offset + i] = float2uint8(sample[i])
+        }
+
+        if (channelCount < 4) {
+            out[out_offset + 3] = 255;
+        }
+
+    }
+
+
+    /**
+     *
+     */
+    constructor() {
+        super({ classList: ['slice-visualizer'] });
+
+
+        this.on.linked.add(this.layout, this);
+        this.size.onChanged.add(this.layout, this);
+    }
+
+    draw() {
+
+        const resolution_x = this.#resolution[0];
+        const resolution_y = this.#resolution[1];
+        const resolution_z = this.#resolution[2];
+
+        const imageData = this.#imageData;
+
+        const slice_size = resolution_x * resolution_y;
+
+        const data = this.#data;
+
+        const sample = new Float32Array(this.#channelCount);
+
+        for (let i = 0; i < resolution_z; i++) {
+            const view = this.#views[i];
+
+            for (let j = 0; j < slice_size; j++) {
+                const j4 = j * 4;
+
+                for (let k = 0; k < this.#channelCount; k++) {
+                    const channel = data[slice_size * k + j];
+
+                    sample[k] = channel;
+                }
+
+                this.#drawMethod(imageData.data, j4, sample, this.#channelCount);
+
+            }
+
+            view.context2d.putImageData(imageData, 0, 0);
+        }
+    }
+
+    layout() {
+
+        const resolution_x = this.#resolution[0];
+        const resolution_y = this.#resolution[1];
+        const resolution_z = this.#resolution[2];
+
+        const width = this.size.x;
+
+        const grid_width = max2(1, Math.floor(width / resolution_x));
+
+        for (let i = 0; i < resolution_z; i++) {
+            const view = this.#views[i];
+
+            const grid_x = i % grid_width;
+            const grid_y = Math.floor(i / grid_width);
+
+            view.position.set(grid_x * resolution_x, grid_y * resolution_y);
+        }
+    }
+
+    /**
+     *
+     * @param {ArrayBuffer} data
+     * @param {number[]} resolution
+     */
+    setData(
+        data,
+        resolution) {
+        this.#data = new Float32Array(data);
+        this.#resolution = resolution;
+
+
+        const resolution_x = this.#resolution[0];
+        const resolution_y = this.#resolution[1];
+        const resolution_z = this.#resolution[2];
+
+        const slice_size = resolution_x * resolution_y;
+
+        /**
+         *
+         * @type {ImageData|null}
+         */
+        this.#imageData = null;
+
+        let slice_index = 0;
+
+        for (; slice_index < resolution_z; slice_index++) {
+            this.#slices[slice_index] = new Sampler2D(new Float32Array(data, slice_index * slice_size * 4, slice_size), 1, resolution_x, resolution_y);
+
+            let child;
+            if (slice_index + 1 >= this.#views.length) {
+                child = new CanvasView();
+                this.#views[slice_index] = child
+                this.addChild(child);
+            } else {
+                child = this.#views[slice_index];
+            }
+
+            child.size.set(resolution_x, resolution_y);
+
+            if (this.#imageData === null) {
+                this.#imageData = child.context2d.getImageData(0, 0, resolution_x, resolution_y);
+            }
+
+            child.css({
+                position: "absolute",
+                left: 0,
+                top: 0
+            });
+
+            this.#views[slice_index] = child;
+
+            this.addChild(child);
+        }
+
+        //remove left-overs
+
+        for (; slice_index < this.#slices.length; slice_index++) {
+
+            this.#slices.splice(slice_index, 1);
+            const view = this.#views.splice(slice_index, 1)[0];
+
+            this.removeChild(view);
+
+            slice_index--;
+
+        }
+
+        this.layout();
+    }
+
+}

package/src/engine/physics/fluid/prototype.js

@@ -1,116 +1,18 @@
 import { EngineHarness } from "../../EngineHarness.js";
-import { SingleChannelSampler3D } from "../../graphics/texture/3d/SingleChannelSampler3D.js";
 import GUIElementSystem from "../../ecs/gui/GUIElementSystem.js";
 import EntityBuilder from "../../ecs/EntityBuilder.js";
 import GUIElement from "../../ecs/gui/GUIElement.js";
-import EmptyView from "../../../view/elements/EmptyView.js";
-import { Sampler2D } from "../../graphics/texture/sampler/Sampler2D.js";
-import { CanvasView } from "../../../view/elements/CanvasView.js";
-import { float2uint8 } from "../../../core/binary/float2uint8.js";
-import { clamp } from "../../../core/math/clamp.js";
-import { randomIntegerBetween } from "../../../core/math/random/randomIntegerBetween.js";
-import { seededRandom } from "../../../core/math/random/seededRandom.js";
 import { BehaviorComponent } from "../../intelligence/behavior/ecs/BehaviorComponent.js";
 import { BehaviorSystem } from "../../intelligence/behavior/ecs/BehaviorSystem.js";
-import { v3_grid_apply_diffusion } from "./solver/v3_grid_apply_diffusion.js";
-import { max2 } from "../../../core/math/max2.js";
 import { MetricCollection } from "../../development/performance/MetricCollection.js";
 import { PeriodicConsolePrinter } from "../../development/performance/monitor/PeriodicConsolePrinter.js";
 import { MetricStatistics } from "../../development/performance/MetricStatistics.js";
+import { FluidField } from "./FluidField.js";
+import { FluidSimulator } from "./FluidSimulator.js";
+import { SliceVisualiser } from "./SliceVisualiser.js";
 
 const harness = new EngineHarness();
 
-class SliceVisualiser extends EmptyView {
-
-    /**
-     *
-     * @param {SingleChannelSampler3D} source
-     */
-    constructor(source) {
-        super({ classList: ['slice-visualizer'] });
-
-        this.source = source;
-
-        const slices = [];
-        const views = [];
-
-        const resolution = source.resolution;
-        const resolution_x = resolution[0];
-        const resolution_y = resolution[1];
-        const resolution_z = resolution[2];
-
-        const slice_size = resolution_x * resolution_y;
-
-        /**
-         *
-         * @type {ImageData|null}
-         */
-        let imageData = null;
-
-        for (let i = 0; i < resolution_z; i++) {
-            slices[i] = new Sampler2D(new Float32Array(source.data.buffer, i * slice_size * 4, slice_size), 1, resolution_x, resolution_y);
-
-            const child = new CanvasView();
-            child.size.set(resolution_x, resolution_y);
-
-            if (imageData === null) {
-                imageData = child.context2d.getImageData(0, 0, resolution_x, resolution_y);
-            }
-
-            child.css({
-                position: "absolute",
-                left: 0,
-                top: 0
-            });
-
-            views[i] = child;
-
-            this.addChild(child);
-        }
-
-        this.draw = () => {
-
-            for (let i = 0; i < resolution_z; i++) {
-                const view = views[i];
-                const slice = slices[i];
-
-                for (let j = 0; j < slice_size; j++) {
-                    const j4 = j * 4;
-
-
-                    const uint8_value = float2uint8(slice.data[j]);
-
-                    imageData.data[j4] = clamp(uint8_value, 0, 255);
-                    imageData.data[j4 + 3] = 255;
-                }
-
-                view.context2d.putImageData(imageData, 0, 0);
-            }
-
-        };
-
-        const layout = () => {
-            const width = this.size.x;
-
-            const grid_width = max2(1, Math.floor(width / resolution_x));
-
-            for (let i = 0; i < resolution_z; i++) {
-                const view = views[i];
-
-                const grid_x = i % grid_width;
-                const grid_y = Math.floor(i / grid_width);
-
-                view.position.set(grid_x * resolution_x, grid_y * resolution_y);
-            }
-        }
-
-        this.on.linked.add(layout);
-        this.size.onChanged.add(layout);
-    }
-
-
-}
-
 const metrics = new MetricCollection();
 
 metrics.create({ name: 'sim' })
@@ -123,56 +25,49 @@ function main(engine) {
 
     const ecd = engine.entityManager.dataset;
 
-    const sampler = new SingleChannelSampler3D();
+    const field = new FluidField();
 
-    sampler.resolution = [32, 32, 16];
+    field.addAttribute('x');
+    field.addAttribute('y');
+    field.addAttribute('z');
 
-    const random = seededRandom();
+    field.resolution = [32, 32, 64];
 
-    sampler.data.fill(1000, 20, 40);
+    field.build();
 
-    for (let i = 0; i < 100; i++) {
+    field.setAttributeAt(0, 15, 16, 0, -100);
+    field.setAttributeAt(0, 17, 16, 0, 100);
+    field.setAttributeAt(1, 16, 15, 0, -100);
+    field.setAttributeAt(1, 16, 17, 0, 100);
 
-        sampler.write(
-            randomIntegerBetween(random, 0, 16),
-            randomIntegerBetween(random, 0, 16),
-            randomIntegerBetween(random, 0, 4),
-            random()
-        );
+    field.setAttributeAt(2, 15, 16, 0, 100);
+    field.setAttributeAt(2, 17, 16, 0, 100);
+    field.setAttributeAt(2, 16, 15, 0, 100);
+    field.setAttributeAt(2, 16, 17, 0, 100);
 
-    }
 
+    const sim = new FluidSimulator();
 
-    const slice_view = new SliceVisualiser(sampler);
+
+    const slice_view = new SliceVisualiser();
 
     slice_view.size.set(432, 1000);
     slice_view.scale.setScalar(2);
     slice_view.transformOrigin.set(0, 0);
 
-    const sampler_0 = sampler.clone();
-    const sampler_1 = sampler.clone();
-
-    const ping_pong = [sampler_0, sampler_1];
-    let ping_pong_index = 0;
+    slice_view.setData(field.buffer, field.resolution);
 
 
     new EntityBuilder()
         .add(BehaviorComponent.looping_function(time_delta => {
 
-            const source = ping_pong[ping_pong_index % 2];
-            const target = ping_pong[(ping_pong_index + 1) % 2];
-
-            ping_pong_index++;
-
             const t0 = performance.now();
 
-            for (let i = 0; i < 5; i++) {
-                v3_grid_apply_diffusion(target.data, source.data, source.resolution);
-            }
+            sim.step(field, 0.015);
 
             metrics.get('sim').record(performance.now() - t0);
 
-            sampler.copy(target);
+            slice_view.setData(field.buffer, field.resolution);
 
             slice_view.draw();
 

package/src/engine/physics/fluid/solver/v3_grid_apply_advection_forward.js

@@ -0,0 +1,62 @@
+import { scs3d_sample_linear } from "../../../graphics/texture/3d/scs3d_sample_linear.js";
+
+/**
+ *
+ * @param {Float32Array[]} outputs
+ * @param {Float32Array[]} inputs
+ * @param {number[]} resolution
+ * @param {number} time_delta
+ */
+export function v3_grid_apply_advection_forward(outputs, inputs, resolution, time_delta) {
+
+    const res_x = resolution[0];
+    const res_y = resolution[1];
+    const res_z = resolution[2];
+
+    const input_x = inputs[0];
+    const input_y = inputs[1];
+    const input_z = inputs[2];
+
+    const slice_size = res_y * res_x;
+
+    for (
+        let z = 0;
+        z < res_z - 1;
+        z++
+    ) {
+
+        const current_z_slice_offset = z * slice_size;
+
+        for (
+            let y = 0;
+            y < res_y;
+            y++
+        ) {
+            const current_y_line_offset = y * res_x;
+
+            for (let x = 0; x < res_x; x++) {
+
+
+                const current_index = current_z_slice_offset + current_y_line_offset + x;
+
+                const v_x = input_x[current_index]
+                const v_y = input_y[current_index]
+                const v_z = input_z[current_index]
+
+                // compute previous position of the particle
+                const s_x = x - v_x * time_delta;
+                const s_y = y - v_y * time_delta;
+                const s_z = z - v_z * time_delta;
+
+                // sample values at previous position
+                const new_x = scs3d_sample_linear(input_x, res_x, res_y, res_z, s_x, s_y, s_z);
+                const new_y = scs3d_sample_linear(input_y, res_x, res_y, res_z, s_x, s_y, s_z);
+                const new_z = scs3d_sample_linear(input_z, res_x, res_y, res_z, s_x, s_y, s_z);
+
+                outputs[0][current_index] = new_x;
+                outputs[1][current_index] = new_y;
+                outputs[2][current_index] = new_z;
+            }
+        }
+    }
+}

package/src/engine/physics/fluid/solver/v3_grid_apply_advection_reverse.js

@@ -0,0 +1,8 @@
+/**
+ *
+ * @param {Float32Array} data
+ * @param {number[]} resolution
+ */
+export function v3_grid_apply_advection_reverse(data, resolution) {
+
+}

package/src/engine/physics/fluid/solver/v3_grid_apply_diffusion.js

@@ -5,18 +5,32 @@
  * @param {number[]} resolution
  */
 export function v3_grid_apply_diffusion(output, input, resolution) {
+    let sum = 0;
+
     const res_x = resolution[0];
     const res_y = resolution[1];
     const res_z = resolution[2];
 
-    const factor = 1 / 7;
-
-    let sum = 0;
 
     const slice_size = res_y * res_x;
 
-    for (let z = 0; z < res_z; z++) {
-        for (let y = 0; y < res_y; y++) {
+    // TODO consider taking inspiration from blur filters and performing convolution in 3 separate steps, one per axis. This would require fewer samples in total and potentially offer better cache utilization
+
+    const last_z_slice_offset = (res_z - 1) * slice_size;
+    const last_y_line_offset = (res_y - 1) * res_x;
+
+    for (
+        let current_z_slice_offset = 0;
+        current_z_slice_offset <= last_z_slice_offset;
+        current_z_slice_offset += slice_size
+    ) {
+
+        for (
+            let current_y_line_offset = 0;
+            current_y_line_offset <= last_y_line_offset;
+            current_y_line_offset += res_x
+        ) {
+
             for (let x = 0; x < res_x; x++) {
 
                 let sample_count = 1;
@@ -24,39 +38,40 @@ export function v3_grid_apply_diffusion(output, input, resolution) {
                 sum = 0;
 
                 // sample cells around
-                if (z > 0) {
+                if (current_z_slice_offset > 0) {
                     sample_count++;
-                    sum += input[(z - 1) * slice_size + y * res_x + x]
+                    sum += input[current_z_slice_offset - slice_size + current_y_line_offset + x]
                 }
 
-                if (y > 0) {
+
+                if (current_y_line_offset > 0) {
                     sample_count++;
-                    sum += input[z * slice_size + (y - 1) * res_x + x]
+                    sum += input[current_z_slice_offset + current_y_line_offset - res_x + x]
                 }
 
                 if (x > 0) {
                     sample_count++;
-                    sum += input[z * slice_size + y * res_x + (x - 1)]
+                    sum += input[current_z_slice_offset + current_y_line_offset + (x - 1)]
                 }
 
 
-                const current = z * slice_size + y * res_x + x;
+                const current = current_z_slice_offset + current_y_line_offset + x;
 
                 sum += input[current];
 
                 if (x < res_x - 1) {
                     sample_count++;
-                    sum += input[z * slice_size + y * res_x + (x + 1)]
+                    sum += input[current_z_slice_offset + current_y_line_offset + (x + 1)]
                 }
 
-                if (y < res_y - 1) {
+                if (current_y_line_offset < last_y_line_offset) {
                     sample_count++;
-                    sum += input[z * slice_size + (y + 1) * res_x + x]
+                    sum += input[current_z_slice_offset + current_y_line_offset + res_x + x]
                 }
 
-                if (z < res_z - 1) {
+                if (current_z_slice_offset < last_z_slice_offset) {
                     sample_count++;
-                    sum += input[(z + 1) * slice_size + y * res_x + x]
+                    sum += input[current_z_slice_offset + slice_size + current_y_line_offset + x]
                 }
 
                 output[current] = sum / sample_count;