@woosh/meep-engine 3.15.0 → 3.16.0

package/editor/particles/effect/make_starter_particle_effect.js

@@ -0,0 +1,177 @@
+import {
+    EMITTER_BLEND,
+    EMITTER_PROJECTION,
+} from "../../../src/shade/renderer/particles/data/PARTICLE_EMITTER_STRUCT.js";
+import {
+    particle_node,
+    particle_wire,
+} from "../../../src/shade/renderer/particles/graph/particle_graph_authoring.js";
+import {
+    particle_unit_disk,
+    particle_uniform_signed,
+} from "../../../src/shade/renderer/particles/graph/particle_graph_distributions.js";
+import { VM_BUILTIN } from "../../../src/shade/renderer/particles/isa/ParticleVMISA.js";
+import { ParticleEffectDocument } from "./ParticleEffectDocument.js";
+
+/**
+ * The effect a new document starts as.
+ *
+ * An editor that opens on an empty graph asks the author to build a working effect from nothing
+ * before they can see anything at all — and a particle effect has a floor below which it shows
+ * nothing: something has to seed a position, something has to age, something has to kill. So the
+ * starting point is the smallest effect that actually runs, and every part of it is there to be
+ * changed:
+ *
+ * - INIT seeds position from the emitter with a little scatter, an upward velocity with scatter, a
+ *   zero age, a random lifetime, a size and a colour.
+ * - UPDATE ages the particle, kills it at the end of its life, integrates its position, and fades
+ *   its colour out over the same normalized age.
+ *
+ * The result is a plume. It is the same shape as the worked examples in the particle playground,
+ * built with the same authoring helpers, so an author who wants to compare the two is looking at
+ * the same kind of graph.
+ *
+ * @returns {ParticleEffectDocument}
+ */
+export function make_starter_particle_effect() {
+    const document = new ParticleEffectDocument();
+
+    document.name = "plume";
+
+    build_init(document.init);
+    build_update(document.update);
+
+    document.emitter.spawn_rate = 220;
+    document.emitter.blend = EMITTER_BLEND.ADDITIVE;
+    document.emitter.projection = EMITTER_PROJECTION.BILLBOARD;
+    document.emitter.bounds_center = [0, 1.5, 0];
+    document.emitter.bounds_radius = 4;
+    document.emitter.render = { position: "position", size: "size", color: "color", velocity: "velocity" };
+
+    return document;
+}
+
+/**
+ * @param {NodeGraph} graph
+ */
+function build_init(graph) {
+    // position = emitter position + a small disk of scatter on the ground. The disk is a vec2 and
+    // the ground is the xz plane, so the disk is laid down with a constructor: its two lanes go to
+    // x and z, and nothing to y.
+    const origin = particle_node(graph, "builtin", { id: VM_BUILTIN.EMITTER_POSITION });
+    const disk = particle_unit_disk(graph);
+    const scatter = particle_node(graph, "scale");
+
+    particle_wire(graph, scatter, "v", disk);
+    particle_wire(graph, scatter, "s", [0.25]);
+
+    const scatter_x = particle_node(graph, "swizzle", { pattern: [0] });
+    const scatter_z = particle_node(graph, "swizzle", { pattern: [1] });
+
+    particle_wire(graph, scatter_x, "x", scatter);
+    particle_wire(graph, scatter_z, "x", scatter);
+
+    const ground = particle_node(graph, "vec3");
+
+    particle_wire(graph, ground, "x", scatter_x);
+    particle_wire(graph, ground, "y", [0]);
+    particle_wire(graph, ground, "z", scatter_z);
+
+    const position = particle_node(graph, "add");
+
+    particle_wire(graph, position, "a", origin);
+    particle_wire(graph, position, "b", ground);
+    particle_wire(graph, particle_node(graph, "setAttribute", { name: "position" }), "value", position);
+
+    // velocity = up + signed scatter, a draw per lane
+    const rise = particle_node(graph, "const", { value: [0, 2.2, 0] });
+    const turbulence = particle_uniform_signed(graph, 3);
+    const turbulence_scaled = particle_node(graph, "scale");
+
+    particle_wire(graph, turbulence_scaled, "v", turbulence);
+    particle_wire(graph, turbulence_scaled, "s", [0.55]);
+
+    const velocity = particle_node(graph, "add");
+
+    particle_wire(graph, velocity, "a", rise);
+    particle_wire(graph, velocity, "b", turbulence_scaled);
+    particle_wire(graph, particle_node(graph, "setAttribute", { name: "velocity" }), "value", velocity);
+
+    particle_wire(graph, particle_node(graph, "setAttribute", { name: "age" }), "value", [0]);
+
+    // lifetime = 1.1 .. 1.9s, one draw
+    const life_random = particle_node(graph, "random", { components: 1 });
+    const lifetime = particle_node(graph, "mad");
+
+    particle_wire(graph, lifetime, "a", life_random);
+    particle_wire(graph, lifetime, "b", [0.8]);
+    particle_wire(graph, lifetime, "c", [1.1]);
+    particle_wire(graph, particle_node(graph, "setAttribute", { name: "lifetime" }), "value", lifetime);
+
+    particle_wire(graph, particle_node(graph, "setAttribute", { name: "size" }), "value", [0.35]);
+
+    // A `color` rather than a four-number literal, because the attribute it is written to is
+    // declared a colour: the two ends agree, the swatch is the control, and the whole colour path
+    // through the effect reads as one.
+    const ember = particle_node(graph, "color", { value: [1.0, 0.55, 0.2, 1.0] });
+
+    particle_wire(graph, particle_node(graph, "setAttribute", { name: "color" }), "value", ember);
+}
+
+/**
+ * @param {NodeGraph} graph
+ */
+function build_update(graph) {
+    const dt = particle_node(graph, "builtin", { id: VM_BUILTIN.DELTA_TIME });
+
+    // age += dt
+    const age = particle_node(graph, "attribute", { name: "age" });
+    const aged = particle_node(graph, "add");
+
+    particle_wire(graph, aged, "a", age);
+    particle_wire(graph, aged, "b", dt);
+    particle_wire(graph, particle_node(graph, "setAttribute", { name: "age" }), "value", aged);
+
+    // normalized age drives both the kill and the fade
+    const lifetime = particle_node(graph, "attribute", { name: "lifetime" });
+    const normalized = particle_node(graph, "div");
+
+    particle_wire(graph, normalized, "a", aged);
+    particle_wire(graph, normalized, "b", lifetime);
+
+    const spent = particle_node(graph, "compare", { op: "ge" });
+
+    particle_wire(graph, spent, "a", normalized);
+    particle_wire(graph, spent, "b", [1]);
+    particle_wire(graph, particle_node(graph, "kill"), "condition", spent);
+
+    // position += velocity * dt
+    const velocity = particle_node(graph, "attribute", { name: "velocity" });
+    const step = particle_node(graph, "scale");
+
+    particle_wire(graph, step, "v", velocity);
+    particle_wire(graph, step, "s", dt);
+
+    const position = particle_node(graph, "attribute", { name: "position" });
+    const moved = particle_node(graph, "add");
+
+    particle_wire(graph, moved, "a", position);
+    particle_wire(graph, moved, "b", step);
+    particle_wire(graph, particle_node(graph, "setAttribute", { name: "position" }), "value", moved);
+
+    // colour *= 1 - normalizedAge, so it fades out over its life. Scaling the whole vector fades
+    // the emission with the alpha, which is what an additive plume wants. `age` and `lifetime` are
+    // one-component attributes, so `normalized` and `remaining` are scalars, and a scalar meeting
+    // the colour scales every lane of it.
+    const remaining = particle_node(graph, "sub");
+
+    particle_wire(graph, remaining, "a", [1]);
+    particle_wire(graph, remaining, "b", normalized);
+
+    const colour = particle_node(graph, "attribute", { name: "color" });
+    const faded = particle_node(graph, "scale");
+
+    particle_wire(graph, faded, "v", colour);
+    particle_wire(graph, faded, "s", remaining);
+    particle_wire(graph, particle_node(graph, "setAttribute", { name: "color" }), "value", faded);
+}

package/editor/persistence/buildNewSceneDataset.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"buildNewSceneDataset.d.ts","sourceRoot":"","sources":["../../../editor/persistence/buildNewSceneDataset.js"],"names":[],"mappings":"AASA;;;;;;GAMG;AACH,sDAFa,sBAAsB,CAoDlC;uCAhEsC,gDAAgD"}
+{"version":3,"file":"buildNewSceneDataset.d.ts","sourceRoot":"","sources":["../../../editor/persistence/buildNewSceneDataset.js"],"names":[],"mappings":"AAUA;;;;;;GAMG;AACH,sDAFa,sBAAsB,CAqDlC;uCAlEsC,gDAAgD"}

package/editor/persistence/buildNewSceneDataset.js

@@ -2,10 +2,11 @@ import { Color } from "../../src/core/color/Color.js";
 import Vector3 from "../../src/core/geom/Vector3.js";
 import { EntityComponentDataset } from "../../src/engine/ecs/EntityComponentDataset.js";
 import { Name } from "../../src/engine/ecs/name/Name.js";
-import { Transform } from "../../src/engine/ecs/transform/Transform.js";
+import { Transform64 } from "../../src/engine/ecs/transform/Transform64.js";
 import Entity from "../../src/engine/ecs/Entity.js";
 import { Camera } from "../../src/engine/graphics/ecs/camera/Camera.js";
 import { Light } from "../../src/engine/graphics/ecs/light/Light.js";
+import { t64_look_rotation } from "../../src/engine/ecs/transform/t64_look_rotation.js";
 
 /**
  * A minimal usable scene: an active camera, a sun and an ambient light. A completely
@@ -19,7 +20,7 @@ export function buildNewSceneDataset(engine) {
 
     ecd.setComponentTypeMap(engine.entityManager.getComponentTypeMap());
 
-    for (const type of [Transform, Name, Camera, Light]) {
+    for (const type of [Transform64, Name, Camera, Light]) {
         if (!ecd.isComponentTypeRegistered(type)) {
             ecd.registerComponentType(type);
         }
@@ -28,8 +29,8 @@ export function buildNewSceneDataset(engine) {
     const camera = new Camera();
     camera.active.set(true);
 
-    const camera_transform = new Transform();
-    camera_transform.position.set(10, 10, 10);
+    const camera_transform = new Transform64();
+    camera_transform.setTranslation(10, 10, 10);
 
     new Entity()
         .add(camera)
@@ -42,9 +43,10 @@ export function buildNewSceneDataset(engine) {
     sun.intensity.set(0.9);
     sun.castShadow.set(true);
 
-    const sun_transform = new Transform();
-    sun_transform.position.set(30, 70, 30);
-    sun_transform.rotation.lookRotation(new Vector3(0.17, -1, 0.17));
+    const sun_transform = new Transform64();
+    sun_transform.setTranslation(30, 70, 30);
+    t64_look_rotation(sun_transform, 0.17, -1, 0.17, 0, 1, 0);
+    sun_transform.updateMatrix();
 
     new Entity()
         .add(sun)
@@ -59,7 +61,7 @@ export function buildNewSceneDataset(engine) {
 
     new Entity()
         .add(ambient)
-        .add(new Transform())
+        .add(new Transform64())
         .add(new Name('Ambient'))
         .build(ecd);
 

package/editor/process/symbolic/AudioEmitterSymbolicDisplay.js

@@ -1,67 +1,67 @@
-import { Transform } from "../../../src/engine/ecs/transform/Transform.js";
-import { Gizmo } from "../../../src/engine/graphics/render/gizmo/Gizmo.js";
-import { AudioEmitter } from "../../../src/engine/sound/ecs/audio/AudioEmitter.js";
-import { entity_is_editor_owned, SymbolicDisplay } from "./SymbolicDisplay.js";
-
-/**
- * Inside this one an emitter is at full volume.
- *
- * @type {number[]}
- */
-const NEAR_COLOR = [1, 0.67, 0, 1];
-
-/**
- * Outside this one it is inaudible.
- *
- * @type {number[]}
- */
-const FAR_COLOR = [1, 1, 0, 0.5];
-
-/**
- * @type {Float32Array}
- */
-const scratch_center = new Float32Array(3);
-
-/**
- * The two distances a native audio emitter rolls off between.
- *
- * The same pair of spheres and the same two colours the three version drew, because what they mean is
- * the attenuation model rather than anything about a component or a renderer: inside the near one there
- * is no attenuation, past the far one there is no sound.
- *
- * Only drawn for a 3D event. A 2D one is position-independent — it sounds the same wherever the
- * entity is — so its distance pair is inert data and drawing it would claim a rolloff that is not
- * there.
- *
- * @see SymbolicDisplay
- */
-export class AudioEmitterSymbolicDisplay extends SymbolicDisplay {
-    /**
-     * @param {EntityComponentDataset} dataset
-     */
-    record(dataset) {
-        dataset.traverseEntities([AudioEmitter, Transform], (emitter, transform, entity) => {
-            if (entity_is_editor_owned(dataset, entity)) {
-                return;
-            }
-
-            const event = emitter.event;
-
-            if (!event.is3D) {
-                return;
-            }
-
-            const position = transform.position;
-
-            scratch_center[0] = position.x;
-            scratch_center[1] = position.y;
-            scratch_center[2] = position.z;
-
-            Gizmo.color = NEAR_COLOR;
-            Gizmo.draw_wire_sphere(scratch_center, event.distanceMin);
-
-            Gizmo.color = FAR_COLOR;
-            Gizmo.draw_wire_sphere(scratch_center, event.distanceMax);
-        });
-    }
-}
+import { Transform64 } from "../../../src/engine/ecs/transform/Transform64.js";
+import { Gizmo } from "../../../src/engine/graphics/render/gizmo/Gizmo.js";
+import { AudioEmitter } from "../../../src/engine/sound/ecs/audio/AudioEmitter.js";
+import { entity_is_editor_owned, SymbolicDisplay } from "./SymbolicDisplay.js";
+
+/**
+ * Inside this one an emitter is at full volume.
+ *
+ * @type {number[]}
+ */
+const NEAR_COLOR = [1, 0.67, 0, 1];
+
+/**
+ * Outside this one it is inaudible.
+ *
+ * @type {number[]}
+ */
+const FAR_COLOR = [1, 1, 0, 0.5];
+
+/**
+ * @type {Float32Array}
+ */
+const scratch_center = new Float32Array(3);
+
+/**
+ * The two distances a native audio emitter rolls off between.
+ *
+ * The same pair of spheres and the same two colours the three version drew, because what they mean is
+ * the attenuation model rather than anything about a component or a renderer: inside the near one there
+ * is no attenuation, past the far one there is no sound.
+ *
+ * Only drawn for a 3D event. A 2D one is position-independent — it sounds the same wherever the
+ * entity is — so its distance pair is inert data and drawing it would claim a rolloff that is not
+ * there.
+ *
+ * @see SymbolicDisplay
+ */
+export class AudioEmitterSymbolicDisplay extends SymbolicDisplay {
+    /**
+     * @param {EntityComponentDataset} dataset
+     */
+    record(dataset) {
+        dataset.traverseEntities([AudioEmitter, Transform64], (emitter, transform, entity) => {
+            if (entity_is_editor_owned(dataset, entity)) {
+                return;
+            }
+
+            const event = emitter.event;
+
+            if (!event.is3D) {
+                return;
+            }
+
+            const position = transform.translation;
+
+            scratch_center[0] = position[0];
+            scratch_center[1] = position[1];
+            scratch_center[2] = position[2];
+
+            Gizmo.color = NEAR_COLOR;
+            Gizmo.draw_wire_sphere(scratch_center, event.distanceMin);
+
+            Gizmo.color = FAR_COLOR;
+            Gizmo.draw_wire_sphere(scratch_center, event.distanceMax);
+        });
+    }
+}

package/editor/process/symbolic/CameraSymbolicDisplay.js

@@ -1,146 +1,146 @@
-import { DEG_TO_RAD } from "../../../src/core/math/DEG_TO_RAD.js";
-import { v3_quaternion_apply } from "../../../src/core/geom/vec3/v3_quaternion_apply.js";
-import { Transform } from "../../../src/engine/ecs/transform/Transform.js";
-import { Camera } from "../../../src/engine/graphics/ecs/camera/Camera.js";
-import { Gizmo } from "../../../src/engine/graphics/render/gizmo/Gizmo.js";
-import { entity_is_editor_owned, SymbolicDisplay } from "./SymbolicDisplay.js";
-
-/**
- * @type {number[]}
- */
-const CAMERA_COLOR = [0.4, 0.9, 1, 1];
-
-/**
- * Which corners are joined: the near rectangle, the far one, and the four edges between them.
- *
- * @type {number[]}
- */
-const EDGES = [
-    0, 1, 1, 2, 2, 3, 3, 0,
-    4, 5, 5, 6, 6, 7, 7, 4,
-    0, 4, 1, 5, 2, 6, 3, 7
-];
-
-/**
- * Eight frustum corners in world space, near plane first.
- *
- * @type {Float32Array}
- */
-const corners = new Float32Array(24);
-
-/**
- * @type {Float32Array}
- */
-const from = new Float32Array(3);
-
-/**
- * @type {Float32Array}
- */
-const to = new Float32Array(3);
-
-/**
- * The two depths the corners are taken at, near then far.
- *
- * @type {Float64Array}
- */
-const depths = new Float64Array(2);
-
-/**
- * The volume a camera entity can see.
- *
- * **Built from the component rather than from a renderer's camera object.** A camera entity has no
- * renderer object of its own, which is why the three `CameraHelper` this replaces could not survive
- * the port; everything the frustum needs — field of view, the two clip planes — is on the component,
- * and where the camera is and which way it faces is its `Transform`.
- * The one thing that is not is the aspect ratio, which belongs to the frame rather than to the
- * camera: it is the viewport's, exactly as the renderer's own is.
- *
- * **Perspective always, because that is what gets drawn.** `Camera.projectionType` carries an
- * orthographic option and no renderer in the program reads it — `CameraSystem` copies the field of
- * view and the clip planes and nothing else — so a symbol that branched on it would be drawing a
- * projection the game cannot render.
- *
- * The transform's scale is deliberately not applied. A camera has no size, and a scaled entity
- * carrying one still sees exactly as far as its clip planes say.
- *
- * @see SymbolicDisplay
- */
-export class CameraSymbolicDisplay extends SymbolicDisplay {
-    /**
-     * Record a frustum per camera entity.
-     *
-     * The engine's viewport is expected to have a size: `preRender` is dispatched from inside a
-     * frame, and a frame is not drawn into a collapsed viewport at all.
-     *
-     * @param {EntityComponentDataset} dataset
-     */
-    record(dataset) {
-        const viewport = this.engine.graphics.viewport.size;
-        const aspect = viewport.x / viewport.y;
-
-        Gizmo.color = CAMERA_COLOR;
-
-        dataset.traverseEntities([Camera, Transform], (camera, transform, entity) => {
-            if (entity_is_editor_owned(dataset, entity)) {
-                return;
-            }
-
-            this.#write_corners(camera, transform, aspect);
-
-            for (let i = 0; i < 12; i++) {
-                const a = EDGES[i * 2] * 3;
-                const b = EDGES[i * 2 + 1] * 3;
-
-                from[0] = corners[a];
-                from[1] = corners[a + 1];
-                from[2] = corners[a + 2];
-
-                to[0] = corners[b];
-                to[1] = corners[b + 1];
-                to[2] = corners[b + 2];
-
-                Gizmo.draw_line(from, to);
-            }
-        });
-    }
-
-    /**
-     * @param {Camera} camera
-     * @param {Transform} transform
-     * @param {number} aspect
-     */
-    #write_corners(camera, transform, aspect) {
-        const tangent = Math.tan(camera.fov.getValue() * DEG_TO_RAD / 2);
-
-        const rotation = transform.rotation;
-        const position = transform.position;
-
-        // near plane first, then far, each anticlockwise from the top right as the camera sees it
-        depths[0] = camera.clip_near;
-        depths[1] = camera.clip_far;
-
-        for (let plane = 0; plane < 2; plane++) {
-            const depth = depths[plane];
-
-            const half_height = depth * tangent;
-            const half_width = half_height * aspect;
-
-            for (let corner = 0; corner < 4; corner++) {
-                const x = (corner === 0 || corner === 3) ? half_width : -half_width;
-                const y = (corner === 0 || corner === 1) ? half_height : -half_height;
-
-                const address = (plane * 4 + corner) * 3;
-
-                v3_quaternion_apply(
-                    corners, address,
-                    x, y, depth,
-                    rotation.x, rotation.y, rotation.z, rotation.w
-                );
-
-                corners[address] += position.x;
-                corners[address + 1] += position.y;
-                corners[address + 2] += position.z;
-            }
-        }
-    }
-}
+import { DEG_TO_RAD } from "../../../src/core/math/DEG_TO_RAD.js";
+import { v3_quaternion_apply } from "../../../src/core/geom/vec3/v3_quaternion_apply.js";
+import { Transform64 } from "../../../src/engine/ecs/transform/Transform64.js";
+import { Camera } from "../../../src/engine/graphics/ecs/camera/Camera.js";
+import { Gizmo } from "../../../src/engine/graphics/render/gizmo/Gizmo.js";
+import { entity_is_editor_owned, SymbolicDisplay } from "./SymbolicDisplay.js";
+
+/**
+ * @type {number[]}
+ */
+const CAMERA_COLOR = [0.4, 0.9, 1, 1];
+
+/**
+ * Which corners are joined: the near rectangle, the far one, and the four edges between them.
+ *
+ * @type {number[]}
+ */
+const EDGES = [
+    0, 1, 1, 2, 2, 3, 3, 0,
+    4, 5, 5, 6, 6, 7, 7, 4,
+    0, 4, 1, 5, 2, 6, 3, 7
+];
+
+/**
+ * Eight frustum corners in world space, near plane first.
+ *
+ * @type {Float32Array}
+ */
+const corners = new Float32Array(24);
+
+/**
+ * @type {Float32Array}
+ */
+const from = new Float32Array(3);
+
+/**
+ * @type {Float32Array}
+ */
+const to = new Float32Array(3);
+
+/**
+ * The two depths the corners are taken at, near then far.
+ *
+ * @type {Float64Array}
+ */
+const depths = new Float64Array(2);
+
+/**
+ * The volume a camera entity can see.
+ *
+ * **Built from the component rather than from a renderer's camera object.** A camera entity has no
+ * renderer object of its own, which is why the three `CameraHelper` this replaces could not survive
+ * the port; everything the frustum needs — field of view, the two clip planes — is on the component,
+ * and where the camera is and which way it faces is its `Transform`.
+ * The one thing that is not is the aspect ratio, which belongs to the frame rather than to the
+ * camera: it is the viewport's, exactly as the renderer's own is.
+ *
+ * **Perspective always, because that is what gets drawn.** `Camera.projectionType` carries an
+ * orthographic option and no renderer in the program reads it — `CameraSystem` copies the field of
+ * view and the clip planes and nothing else — so a symbol that branched on it would be drawing a
+ * projection the game cannot render.
+ *
+ * The transform's scale is deliberately not applied. A camera has no size, and a scaled entity
+ * carrying one still sees exactly as far as its clip planes say.
+ *
+ * @see SymbolicDisplay
+ */
+export class CameraSymbolicDisplay extends SymbolicDisplay {
+    /**
+     * Record a frustum per camera entity.
+     *
+     * The engine's viewport is expected to have a size: `preRender` is dispatched from inside a
+     * frame, and a frame is not drawn into a collapsed viewport at all.
+     *
+     * @param {EntityComponentDataset} dataset
+     */
+    record(dataset) {
+        const viewport = this.engine.graphics.viewport.size;
+        const aspect = viewport.x / viewport.y;
+
+        Gizmo.color = CAMERA_COLOR;
+
+        dataset.traverseEntities([Camera, Transform64], (camera, transform, entity) => {
+            if (entity_is_editor_owned(dataset, entity)) {
+                return;
+            }
+
+            this.#write_corners(camera, transform, aspect);
+
+            for (let i = 0; i < 12; i++) {
+                const a = EDGES[i * 2] * 3;
+                const b = EDGES[i * 2 + 1] * 3;
+
+                from[0] = corners[a];
+                from[1] = corners[a + 1];
+                from[2] = corners[a + 2];
+
+                to[0] = corners[b];
+                to[1] = corners[b + 1];
+                to[2] = corners[b + 2];
+
+                Gizmo.draw_line(from, to);
+            }
+        });
+    }
+
+    /**
+     * @param {Camera} camera
+     * @param {Transform64} transform
+     * @param {number} aspect
+     */
+    #write_corners(camera, transform, aspect) {
+        const tangent = Math.tan(camera.fov.getValue() * DEG_TO_RAD / 2);
+
+        const rotation = transform.rotation;
+        const position = transform.translation;
+
+        // near plane first, then far, each anticlockwise from the top right as the camera sees it
+        depths[0] = camera.clip_near;
+        depths[1] = camera.clip_far;
+
+        for (let plane = 0; plane < 2; plane++) {
+            const depth = depths[plane];
+
+            const half_height = depth * tangent;
+            const half_width = half_height * aspect;
+
+            for (let corner = 0; corner < 4; corner++) {
+                const x = (corner === 0 || corner === 3) ? half_width : -half_width;
+                const y = (corner === 0 || corner === 1) ? half_height : -half_height;
+
+                const address = (plane * 4 + corner) * 3;
+
+                v3_quaternion_apply(
+                    corners, address,
+                    x, y, depth,
+                    rotation[0], rotation[1], rotation[2], rotation[3]
+                );
+
+                corners[address] += position[0];
+                corners[address + 1] += position[1];
+                corners[address + 2] += position[2];
+            }
+        }
+    }
+}