@adatechnology/game-fluids-three 0.3.1 → 0.4.0

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import * as THREE_NS from 'three';
+import { WarmUpProbes } from '@adatechnology/game-contracts';
 import { VfxWorld } from '@adatechnology/game-vfx';
 import { ThreeLib as ThreeLib$1 } from '@adatechnology/game-vfx-three';
 import { Vec3, FluidWorld, Film, StainTint, FilmLayout, FilmProfile, FilmRandom, LiquidId, SurfaceSpec, FilmLook, FilmRegion } from '@adatechnology/game-fluids';
@@ -56,6 +57,8 @@ interface FluidRenderer {
     /** Draw the liquid of a world container inside `object` (a volume clipped by the liquid surface, plus steam). */
     bindContainer(containerId: string, object: THREE_NS.Object3D, options?: BindOptions): void;
     unbindContainer(containerId: string): void;
+    /** Meshes that use the materials of the liquid bodies, streams and stains, to render once so that the first leak does not build their shader programs in the middle of a frame. */
+    warmUpProbes(): WarmUpProbes;
     /** Advance the visuals (call it after `fluids.update(dt)`). */
     update(dt: number): void;
     /** Remove every stain, stream and particle (the bindings stay). */

package/dist/index.global.js

@@ -3088,6 +3088,17 @@ var GameFluidsThree = (() => {
       ])
     ]
   };
+  var FUEL_LEAK_ONLY = {
+    id: "fuel_leak_only",
+    pageId: "vazamento",
+    team: "vehicles",
+    budget: { particles: 200, lights: 0 },
+    loop: 11,
+    view: FUEL_LEAK.view,
+    setup: FUEL_LEAK.setup,
+    timeline: [decal(POOL[0], 0, POOL[2], 2.2, 2040368, { grow: 3, life: 60, ar: 0.6, fluid: "oil" })],
+    tick: [emit("drip", "normal", 12, { p: TANK, box: [0.05, 0, 0.05], sp: 0, life: 1, size: 0.03, c0: 5921402, a: 0.9, g: 9.8, fi: 0, gnd: 1 })]
+  };
   var CAR_EXPLOSION = {
     id: "car_explosion",
     pageId: "explosao",
@@ -3441,6 +3452,8 @@ var GameFluidsThree = (() => {
   ];
   var PI = Math.PI;
   var SMOKE = { color: 9079430, width: 10, height: 8, gravity: -0.08, drag: 2.2, growth: 2.1 };
+  var DEFAULT_SMOKE = { puffs: 2, radius: 0.01, opacity: 0.14, life: 0.7, drift: 0.2, rise: 0.06, growth: 2.1, flash: 1 };
+  var DEFAULT_SPREAD = { drift: 0.1, rise: 0.04, side: 0.06 };
   var FLASH_SECONDS = 0.055;
   var FLASH_RAMP = [0.6, 0.9];
   var FLASH_OPACITY = 0.95;
@@ -3448,8 +3461,10 @@ var GameFluidsThree = (() => {
   var FLAME_ADDITIVE = 3;
   var ORIGIN2 = [0, 0, 0];
   var SIZE = variable("size");
+  var FLASH_SCALE = variable("flash");
+  var fallback = (name, defaultValue) => ite(ne(variable(name), void 0), variable(name), defaultValue);
   var wide = (width) => mul(sub(rand(), 0.5), width);
-  var puff2 = (point, velocity, world, radius, life, opacity) => mesh({
+  var puff2 = (point, velocity, world, radius, life, opacity, growth = SMOKE.growth) => mesh({
     shape: "sphere",
     p: point,
     v: velocity,
@@ -3464,7 +3479,7 @@ var GameFluidsThree = (() => {
     lit: true,
     g: SMOKE.gravity,
     drag: SMOKE.drag,
-    grow: SMOKE.growth
+    grow: growth
   });
   var flameBit = (point, velocity, world, radius, life) => [
     set("bitPoint", point),
@@ -3497,37 +3512,55 @@ var GameFluidsThree = (() => {
     id: "viewmodel_muzzle_flash",
     pageId: "event:viewmodel_muzzle_flash",
     team: "weapons",
-    budget: { particles: 12, lights: 1 },
+    budget: { particles: 14, lights: 1 },
     loop: 0.1,
+    setup: [
+      set("size", fallback("size", 1)),
+      set("puffs", fallback("puffs", DEFAULT_SMOKE.puffs)),
+      set("radius", fallback("radius", DEFAULT_SMOKE.radius)),
+      set("opacity", fallback("opacity", DEFAULT_SMOKE.opacity)),
+      set("life", fallback("life", DEFAULT_SMOKE.life)),
+      set("drift", fallback("drift", DEFAULT_SMOKE.drift)),
+      set("rise", fallback("rise", DEFAULT_SMOKE.rise)),
+      set("growth", fallback("growth", DEFAULT_SMOKE.growth)),
+      set("flash", fallback("flash", DEFAULT_SMOKE.flash)),
+      set("driftSpread", fallback("driftSpread", DEFAULT_SPREAD.drift)),
+      set("riseSpread", fallback("riseSpread", DEFAULT_SPREAD.rise)),
+      set("sideSpread", fallback("sideSpread", DEFAULT_SPREAD.side)),
+      set("lifeSpread", ite(ne(variable("lifeSpread"), void 0), variable("lifeSpread"), mul(variable("life"), 0.3)))
+    ],
     timeline: [
       set("angles", []),
       repeat(4, append("angles", add(div(mul(INDEX, PI), 2), mul(rand(), 0.6)))),
       set("roll", mul(rand(), PI)),
-      flash(ORIGIN2, 16756832, mul(4, SIZE), FLASH_SECONDS, mul(2, SIZE), true, true),
-      flashPiece("cone_open", mul(0.013, SIZE), mul(0.085, SIZE), 10, [mul(0.042, SIZE), 0, 0], [0, 0, -PI / 2], 16757575),
-      repeat(
-        4,
-        set("angle", pick(variable("angles"), INDEX)),
-        flashPiece(
-          "cone",
-          mul(5e-3, SIZE),
-          mul(0.04, SIZE),
-          6,
-          [mul(0.012, SIZE), mul(cos(variable("angle")), 0.016, SIZE), mul(sin(variable("angle")), 0.016, SIZE)],
-          [variable("angle"), 0, -PI / 2],
-          16757575
-        )
-      ),
-      flashPiece("sphere", mul(0.016, SIZE), void 0, 12, [mul(8e-3, SIZE), 0, 0], [0, 0, 0], 16773568),
+      when(gt(FLASH_SCALE, 0), [
+        flash(ORIGIN2, 16756832, mul(4, SIZE, FLASH_SCALE), FLASH_SECONDS, mul(2, SIZE, FLASH_SCALE), true, true),
+        flashPiece("cone_open", mul(0.013, SIZE, FLASH_SCALE), mul(0.085, SIZE, FLASH_SCALE), 10, [mul(0.042, SIZE, FLASH_SCALE), 0, 0], [0, 0, -PI / 2], 16757575),
+        repeat(
+          4,
+          set("angle", pick(variable("angles"), INDEX)),
+          flashPiece(
+            "cone",
+            mul(5e-3, SIZE, FLASH_SCALE),
+            mul(0.04, SIZE, FLASH_SCALE),
+            6,
+            [mul(0.012, SIZE, FLASH_SCALE), mul(cos(variable("angle")), 0.016, SIZE, FLASH_SCALE), mul(sin(variable("angle")), 0.016, SIZE, FLASH_SCALE)],
+            [variable("angle"), 0, -PI / 2],
+            16757575
+          )
+        ),
+        flashPiece("sphere", mul(0.016, SIZE, FLASH_SCALE), void 0, 12, [mul(8e-3, SIZE, FLASH_SCALE), 0, 0], [0, 0, 0], 16773568)
+      ]),
       repeat(
-        6,
+        variable("puffs"),
         puff2(
           ORIGIN2,
-          [add(0.15, mul(rand(), 0.35)), add(0.03, mul(rand(), 0.12)), mul(sub(rand(), 0.5), 0.14)],
+          [add(variable("drift"), mul(rand(), variable("driftSpread"))), add(variable("rise"), mul(rand(), variable("riseSpread"))), mul(sub(rand(), 0.5), variable("sideSpread"))],
           [0, 0, 0],
-          mul(0.013, SIZE),
-          add(1.3, mul(rand(), 0.6)),
-          0.45
+          mul(variable("radius"), SIZE),
+          add(variable("life"), mul(rand(), variable("lifeSpread"))),
+          variable("opacity"),
+          variable("growth")
         )
       )
     ]
@@ -3581,8 +3614,10 @@ var GameFluidsThree = (() => {
     aliasOf(ENGINE_SMOKE, "vehicle_fire", { params: { id: "condition", options: ["100", "60", "30", "10"], default: 3 }, loop: 12 }),
     /** The exhaust of a car under way: `engine_smoke` in the best condition, for half a second so a moving car asks again. */
     aliasOf(ENGINE_SMOKE, "vehicle_exhaust", { params: { id: "condition", options: ["100", "60", "30", "10"], default: 0 }, loop: 0.5 }),
-    /** A hole in the tank: the page's own petrol leak (drips, pool, sparks, fire running to the tank). */
-    aliasOf(FUEL_LEAK, "vehicle_leak", {})
+    /** A hole in the tank: the page's petrol leak without the fire and the blast (the pool and the drips). A normal bullet does only this. */
+    aliasOf(FUEL_LEAK_ONLY, "vehicle_leak", {}),
+    /** The leak caught fire (an incendiary or tracer round, a spark, a fire near): the page's whole sequence, the fire running along the pool to the tank and the blast. */
+    aliasOf(FUEL_LEAK, "vehicle_leak_ignited", {})
   ];
   var ALL_EFFECTS = [BLOOD_HIT, HEADSHOT, DISMEMBER, BLOATER_CLOUD, SCREAMER_SHRIEK, CORPSE_DECAY, REANIMATION, EYES_IN_FOG, MUZZLE_FLASH, IMPACT_BY_MATERIAL, PENETRATION, CASINGS_AND_MAGAZINE, MOLOTOV, GRENADE, EXPLOSIVE_BARREL, SHOPFRONT_GLASS, DOOR_STAGES, BUILDING_COLLAPSE, BLOCK_WALL, METAL_DOOR_EFFECT, IRON_RAILING, WOODEN_FENCE, HIT_POINT_BREAKAGE, PRESSURE_CYLINDERS, BUILDING_FIRE, RAIN_AND_PUDDLES, FOG_AND_ASH, SCRAPING_SPARKS, ENGINE_SMOKE, FUEL_LEAK, CAR_EXPLOSION, WINDSHIELD, HEADLIGHTS_IN_RAIN, DAMAGE_AND_BITE, INFECTION_PHASES, PANIC, BLOATER_BLINDNESS, CAMPFIRE, COUGH_AND_BREATH];
   var WORKSHOP_EFFECTS = Object.fromEntries(ALL_EFFECTS.map((effect) => [effect.id, effect]));
@@ -7739,6 +7774,79 @@ void main(){
       }
     };
   }
+  var SPHERE_DEFAULT_WIDTH = 8;
+  var SPHERE_DEFAULT_HEIGHT = 6;
+  function geometryOf(THREE, particle) {
+    switch (particle.shape) {
+      case "cone":
+        return new THREE.ConeGeometry(particle.radius, particle.height, particle.segments || void 0, particle.segments2 || 1, false);
+      case "cone_open":
+        return new THREE.ConeGeometry(particle.radius, particle.height, particle.segments || void 0, particle.segments2 || 1, true);
+      case "sphere":
+        return new THREE.SphereGeometry(particle.radius, particle.segments || SPHERE_DEFAULT_WIDTH, particle.segments2 || SPHERE_DEFAULT_HEIGHT);
+      case "icosahedron":
+        return new THREE.IcosahedronGeometry(particle.radius, particle.segments);
+    }
+  }
+  function materialOf(THREE, particle) {
+    if (particle.lit) return new THREE.MeshStandardMaterial({ color: particle.color, roughness: 1, metalness: 0, transparent: true, opacity: particle.opacity, depthWrite: false });
+    return new THREE.MeshBasicMaterial({ color: particle.color, transparent: true, opacity: particle.opacity, depthWrite: false, ...particle.additive ? { blending: THREE.AdditiveBlending } : {} });
+  }
+  function createMeshLayerProbes(THREE) {
+    const geometry = new THREE.BoxGeometry(1e-3, 1e-3, 1e-3);
+    return [{ lit: true, additive: false }, { lit: false, additive: false }, { lit: false, additive: true }].map(
+      (kind) => new THREE.Mesh(geometry, materialOf(THREE, { ...kind, color: 8421504, opacity: 0.5 }))
+    );
+  }
+  function createMeshLayer(THREE, pool) {
+    const group = new THREE.Group();
+    group.name = "workshop-meshes";
+    const drawn = /* @__PURE__ */ new Map();
+    const frame = new THREE.Quaternion();
+    const euler = new THREE.Euler();
+    const turn = new THREE.Quaternion();
+    const offset = new THREE.Vector3();
+    function release(mesh2) {
+      mesh2.removeFromParent();
+      mesh2.geometry.dispose();
+      mesh2.material.dispose();
+    }
+    return {
+      group,
+      sync() {
+        const live = /* @__PURE__ */ new Set();
+        for (const particle of pool.particles) {
+          live.add(particle.id);
+          let mesh2 = drawn.get(particle.id);
+          if (!mesh2) {
+            mesh2 = new THREE.Mesh(geometryOf(THREE, particle), materialOf(THREE, particle));
+            mesh2.frustumCulled = false;
+            mesh2.renderOrder = particle.additive ? 5 : 3;
+            drawn.set(particle.id, mesh2);
+            group.add(mesh2);
+          }
+          frame.set(particle.frame[0], particle.frame[1], particle.frame[2], particle.frame[3]);
+          offset.set(particle.at[0], particle.at[1], particle.at[2]).multiplyScalar(particle.scale).applyQuaternion(frame);
+          mesh2.position.set(particle.x + offset.x, particle.y + offset.y, particle.z + offset.z);
+          turn.setFromEuler(euler.set(particle.rx, particle.ry, particle.rz));
+          mesh2.quaternion.copy(frame).multiply(turn);
+          mesh2.scale.setScalar(particle.scale);
+          mesh2.material.opacity = particle.opacity;
+        }
+        for (const [id, mesh2] of drawn) {
+          if (live.has(id)) continue;
+          release(mesh2);
+          drawn.delete(id);
+        }
+        return pool.count;
+      },
+      dispose() {
+        for (const mesh2 of drawn.values()) release(mesh2);
+        drawn.clear();
+        group.removeFromParent();
+      }
+    };
+  }
   var clamp5 = (value, min2, max2) => value < min2 ? min2 : value > max2 ? max2 : value;
   function layer(container, name, blend) {
     const element = container.ownerDocument.createElement("div");
@@ -7908,73 +8016,6 @@ void main() {
       }
     };
   }
-  var SPHERE_DEFAULT_WIDTH = 8;
-  var SPHERE_DEFAULT_HEIGHT = 6;
-  function geometryOf(THREE, particle) {
-    switch (particle.shape) {
-      case "cone":
-        return new THREE.ConeGeometry(particle.radius, particle.height, particle.segments || void 0, particle.segments2 || 1, false);
-      case "cone_open":
-        return new THREE.ConeGeometry(particle.radius, particle.height, particle.segments || void 0, particle.segments2 || 1, true);
-      case "sphere":
-        return new THREE.SphereGeometry(particle.radius, particle.segments || SPHERE_DEFAULT_WIDTH, particle.segments2 || SPHERE_DEFAULT_HEIGHT);
-      case "icosahedron":
-        return new THREE.IcosahedronGeometry(particle.radius, particle.segments);
-    }
-  }
-  function materialOf(THREE, particle) {
-    if (particle.lit) return new THREE.MeshStandardMaterial({ color: particle.color, roughness: 1, metalness: 0, transparent: true, opacity: particle.opacity, depthWrite: false });
-    return new THREE.MeshBasicMaterial({ color: particle.color, transparent: true, opacity: particle.opacity, depthWrite: false, ...particle.additive ? { blending: THREE.AdditiveBlending } : {} });
-  }
-  function createMeshLayer(THREE, pool) {
-    const group = new THREE.Group();
-    group.name = "workshop-meshes";
-    const drawn = /* @__PURE__ */ new Map();
-    const frame = new THREE.Quaternion();
-    const euler = new THREE.Euler();
-    const turn = new THREE.Quaternion();
-    const offset = new THREE.Vector3();
-    function release(mesh2) {
-      mesh2.removeFromParent();
-      mesh2.geometry.dispose();
-      mesh2.material.dispose();
-    }
-    return {
-      group,
-      sync() {
-        const live = /* @__PURE__ */ new Set();
-        for (const particle of pool.particles) {
-          live.add(particle.id);
-          let mesh2 = drawn.get(particle.id);
-          if (!mesh2) {
-            mesh2 = new THREE.Mesh(geometryOf(THREE, particle), materialOf(THREE, particle));
-            mesh2.frustumCulled = false;
-            mesh2.renderOrder = particle.additive ? 5 : 3;
-            drawn.set(particle.id, mesh2);
-            group.add(mesh2);
-          }
-          frame.set(particle.frame[0], particle.frame[1], particle.frame[2], particle.frame[3]);
-          offset.set(particle.at[0], particle.at[1], particle.at[2]).multiplyScalar(particle.scale).applyQuaternion(frame);
-          mesh2.position.set(particle.x + offset.x, particle.y + offset.y, particle.z + offset.z);
-          turn.setFromEuler(euler.set(particle.rx, particle.ry, particle.rz));
-          mesh2.quaternion.copy(frame).multiply(turn);
-          mesh2.scale.setScalar(particle.scale);
-          mesh2.material.opacity = particle.opacity;
-        }
-        for (const [id, mesh2] of drawn) {
-          if (live.has(id)) continue;
-          release(mesh2);
-          drawn.delete(id);
-        }
-        return pool.count;
-      },
-      dispose() {
-        for (const mesh2 of drawn.values()) release(mesh2);
-        drawn.clear();
-        group.removeFromParent();
-      }
-    };
-  }
   var WORKSHOP_SPRITE_VERTEX = `attribute float size;attribute float alpha;attribute vec3 pcol;varying vec3 vC;varying float vA;uniform float uScale;
 void main(){vC=pcol;vA=alpha;vec4 mv=modelViewMatrix*vec4(position,1.);gl_PointSize=clamp(size*uScale/-mv.z,1.,512.);gl_Position=projectionMatrix*mv;}`;
   var WORKSHOP_SPRITE_FRAGMENT = `uniform float uSoft;varying vec3 vC;varying float vA;
@@ -8339,6 +8380,13 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
     const requested = options.vfx;
     const world = isWorld(requested) ? requested : createVfx({ profile: options.quality ?? "medium", reducedMotion, ...requested });
     const pools = world.pools();
+    let anchors;
+    const releaseAnchors = () => {
+      if (!anchors) return;
+      anchors.meshes[0]?.geometry.dispose();
+      for (const mesh2 of anchors.meshes) mesh2.material.dispose();
+      anchors = void 0;
+    };
     const root = new THREE.Group();
     options.scene.add(root);
     const direction = new THREE.Vector3(...options.lightDirection ?? LAB_LIGHT_DIRECTION).normalize();
@@ -8455,6 +8503,16 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
         syncAll();
         overlay?.update(screenNow());
       },
+      warmUpProbes() {
+        releaseAnchors();
+        const meshes = createMeshLayerProbes(THREE);
+        for (const mesh2 of meshes) mesh2.frustumCulled = false;
+        const group = new THREE.Group();
+        group.add(...meshes);
+        anchors = { meshes, group };
+        return { group, dispose: () => {
+        } };
+      },
       applyCamera() {
         const shake = screenNow().shake;
         if (reducedMotion || !(shake > SHAKE_FLOOR)) return () => {
@@ -8473,6 +8531,7 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
       },
       screen: screenNow,
       dispose() {
+        releaseAnchors();
         stopMarks();
         overlay?.dispose();
         workshopLayers?.dispose();
@@ -8685,6 +8744,11 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
         this.vertices = 0;
         return;
       }
+      if (state.closed && this.isShellOpaque()) {
+        if (this.mesh) this.mesh.visible = false;
+        this.vertices = 0;
+        return;
+      }
       this.build(state, quality);
       if (!this.mesh || !this.solid) return;
       this.mesh.material = materials.liquidBody(def);
@@ -8710,6 +8774,17 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
         }
       } else this.steamAcc = 0;
     }
+    /** Every mesh of the bound object (the liquid itself aside) is drawn with an opaque material. */
+    isShellOpaque() {
+      let opaque = true;
+      this.object.traverse((child) => {
+        const mesh2 = child;
+        if (!opaque || !mesh2.isMesh || child === this.mesh) return;
+        const materials = Array.isArray(mesh2.material) ? mesh2.material : [mesh2.material];
+        if (materials.some((material) => material.transparent || material.opacity < 1)) opaque = false;
+      });
+      return opaque;
+    }
     get triangles() {
       return this.visible ? Math.floor(this.vertices / 3) : 0;
     }
@@ -8835,6 +8910,16 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
       }
       return m;
     }
+    /** One material per role, in a clear and in an opaque liquid, which are the shader programs a leak will need (the colour is not part of a program). */
+    probes() {
+      const base = { id: "warm_up", color: 8421504, viscosity: 1, density: 1e3, dryTime: 60, gloss: 0.5 };
+      const defs = [{ ...base, opacity: 0.5 }, { ...base, opacity: 1 }];
+      return {
+        plain: defs.flatMap((def) => [this.liquidBody(def), this.liquidStream(def)]),
+        instanced: defs.map((def) => this.liquidStream(def)),
+        coloured: defs.flatMap((def) => [this.stainFilm(def), this.stainWet(def)])
+      };
+    }
     dispose() {
       for (const map of [this.body, this.stream, this.film, this.wet]) {
         for (const m of map.values()) m.dispose();
@@ -8910,9 +8995,9 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
   var dot2 = (a, b) => a[0] * b[0] + a[1] * b[1] + a[2] * b[2];
   var cross3 = (a, b) => [a[1] * b[2] - a[2] * b[1], a[2] * b[0] - a[0] * b[2], a[0] * b[1] - a[1] * b[0]];
   var length = (a) => Math.hypot(a[0], a[1], a[2]);
-  var normalize2 = (a, fallback = [0, 1, 0]) => {
+  var normalize2 = (a, fallback2 = [0, 1, 0]) => {
     const l = length(a);
-    return l < 1e-9 ? [fallback[0], fallback[1], fallback[2]] : [a[0] / l, a[1] / l, a[2] / l];
+    return l < 1e-9 ? [fallback2[0], fallback2[1], fallback2[2]] : [a[0] / l, a[1] / l, a[2] / l];
   };
   var ballistic = (origin, velocity, gravity, t) => [
     origin[0] + velocity[0] * t,
@@ -10348,6 +10433,29 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
         body.dispose();
         bodies.delete(containerId);
       },
+      warmUpProbes() {
+        const plainGeometry = new THREE.BufferGeometry();
+        plainGeometry.setAttribute("position", new THREE.BufferAttribute(new Float32Array(9), 3));
+        plainGeometry.setAttribute("normal", new THREE.BufferAttribute(new Float32Array(9), 3));
+        const stainGeometry = plainGeometry.clone();
+        stainGeometry.setAttribute("color", new THREE.BufferAttribute(new Float32Array(12), 4));
+        const { plain, instanced, coloured } = materials.probes();
+        const meshes = [
+          ...plain.map((material) => new THREE.Mesh(plainGeometry, material)),
+          ...instanced.map((material) => new THREE.InstancedMesh(dropGeometry, material, 1)),
+          ...coloured.map((material) => new THREE.Mesh(stainGeometry, material))
+        ];
+        const group = new THREE.Group();
+        for (const mesh2 of meshes) mesh2.frustumCulled = false;
+        group.add(...meshes);
+        return {
+          group,
+          dispose() {
+            plainGeometry.dispose();
+            stainGeometry.dispose();
+          }
+        };
+      },
       update(dt) {
         if (disposed) return;
         time += dt;