simulationjsv2 0.4.3 → 0.4.5

package/dist/graphics.d.ts

@@ -184,7 +184,11 @@ export declare class Instance<T extends SimulationElement2d | SimulationElement3
     private matrixBuffer;
     private device;
     readonly isInstance = true;
+    private baseMat;
     constructor(obj: T, numInstances: number);
+    setNumInstances(numInstances: number): void;
+    setInstance(instance: number, transformation: Mat4): void;
+    private mapBuffer;
     private setMatrixBuffer;
     getInstances(): Mat4[];
     getNumInstances(): number;

package/dist/graphics.js

@@ -373,6 +373,7 @@ export class Circle extends SimulationElement2d {
     detail;
     constructor(pos, radius, color, detail = 50) {
         super(pos, 0, color);
+        vector2ToPixelRatio(this.pos);
         this.radius = radius;
         this.detail = detail;
         this.geometry = new CircleGeometry(this.radius, this.detail);
@@ -894,6 +895,7 @@ export class Instance extends SimulationElement3d {
     matrixBuffer;
     device;
     isInstance = true;
+    baseMat;
     constructor(obj, numInstances) {
         super(vector3());
         this.device = null;
@@ -903,18 +905,55 @@ export class Instance extends SimulationElement3d {
         this.instanceMatrix = [];
         this.is3d = Boolean(obj.is3d);
         this.geometry = new BlankGeometry();
-        const mat = matrix4();
+        this.baseMat = matrix4();
         if (typeof obj.getRotation() === 'number') {
-            mat4.rotateZ(mat, obj.getRotation(), mat);
+            mat4.rotateZ(this.baseMat, obj.getRotation(), this.baseMat);
         }
         else {
-            rotateMat4(mat, obj.getRotation());
+            rotateMat4(this.baseMat, obj.getRotation());
         }
         for (let i = 0; i < numInstances; i++) {
-            const clone = cloneBuf(mat);
+            const clone = cloneBuf(this.baseMat);
             this.instanceMatrix.push(clone);
         }
     }
+    setNumInstances(numInstances) {
+        if (numInstances < 0)
+            throw logger.error('Num instances is less than 0');
+        const oldLen = this.instanceMatrix.length;
+        if (numInstances < oldLen) {
+            const diff = oldLen - numInstances;
+            this.instanceMatrix.splice(oldLen - diff, diff);
+            return;
+        }
+        const oldArr = this.instanceMatrix;
+        this.instanceMatrix = Array(numInstances);
+        for (let i = 0; i < numInstances; i++) {
+            if (i < oldLen) {
+                this.instanceMatrix[i] = oldArr[i];
+                continue;
+            }
+            const clone = cloneBuf(this.baseMat);
+            this.instanceMatrix[i] = clone;
+        }
+        if (this.device) {
+            this.setMatrixBuffer();
+            this.mapBuffer();
+        }
+    }
+    setInstance(instance, transformation) {
+        if (instance >= this.instanceMatrix.length)
+            return;
+        this.instanceMatrix[instance] = transformation;
+        this.mapBuffer();
+    }
+    mapBuffer() {
+        if (!this.device || this.matrixBuffer === null)
+            return;
+        const buf = new Float32Array(this.instanceMatrix.map((mat) => [...mat]).flat());
+        this.device.queue.writeBuffer(this.matrixBuffer, 0, buf.buffer, buf.byteOffset, buf.byteLength);
+        this.matrixBuffer.unmap();
+    }
     setMatrixBuffer() {
         if (!this.device || this.instanceMatrix.length === 0)
             return;
@@ -922,12 +961,9 @@ export class Instance extends SimulationElement3d {
         const size = Math.max(minSize, this.instanceMatrix[0].byteLength * this.instanceMatrix.length);
         this.matrixBuffer = this.device.createBuffer({
             size,
-            usage: GPUBufferUsage.STORAGE,
-            mappedAtCreation: true
+            usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST
         });
-        const buf = this.instanceMatrix.map((mat) => [...mat]).flat();
-        new Float32Array(this.matrixBuffer.getMappedRange()).set(buf);
-        this.matrixBuffer.unmap();
+        this.mapBuffer();
     }
     getInstances() {
         return this.instanceMatrix;

package/dist/internalUtils.js

@@ -283,8 +283,6 @@ export function getTotalVertices(scene) {
     let total = 0;
     for (let i = 0; i < scene.length; i++) {
         const obj = scene[i].getObj();
-        if (obj.isCollection)
-            continue;
         total += obj.getVertexCount();
     }
     return total;

package/dist/simulation.d.ts

@@ -44,6 +44,7 @@ export declare class SceneCollection extends SimulationElement3d {
     setWireframe(_: boolean): void;
     getName(): string;
     getScene(): SimSceneObjInfo[];
+    getVertexCount(): number;
     getSceneObjects(): SimulationElement<Vector3 | Vector2>[];
     setSceneObjects(newScene: SimulationElement<any>[]): void;
     setScene(newScene: SimSceneObjInfo[]): void;

package/dist/simulation.js

@@ -266,7 +266,8 @@ export class Simulation {
         this.renderInfo = {
             uniformBuffer,
             bindGroupLayout,
-            instanceBuffer
+            instanceBuffer,
+            vertexBuffer: null
         };
         this.pipelines = {
             triangleList2d: createPipeline(device, shaderModule, bindGroupLayout, presentationFormat, 'vertex_main_2d', 'triangle-list'),
@@ -329,6 +330,8 @@ export class Simulation {
         const frame = async () => {
             if (!canvas)
                 return;
+            if (!this.renderInfo)
+                return;
             requestAnimationFrame(frame);
             if (!this.running)
                 return;
@@ -369,22 +372,25 @@ export class Simulation {
             const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor);
             passEncoder.setPipeline(this.pipelines.triangleList3d);
             passEncoder.setBindGroup(0, uniformBindGroup);
-            this.renderScene(device, passEncoder, this.scene, diff);
+            const totalVertices = getTotalVertices(this.scene);
+            if (this.renderInfo.vertexBuffer === null ||
+                this.renderInfo.vertexBuffer.size / (4 * BUF_LEN) < totalVertices) {
+                this.renderInfo.vertexBuffer = device.createBuffer({
+                    size: totalVertices * 4 * BUF_LEN,
+                    usage: GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_DST
+                });
+            }
+            this.renderScene(device, passEncoder, this.renderInfo.vertexBuffer, this.scene, 0, diff);
             this.camera.updateConsumed();
             passEncoder.end();
             device.queue.submit([commandEncoder.finish()]);
         };
         requestAnimationFrame(frame);
     }
-    async renderScene(device, passEncoder, scene, diff) {
+    renderScene(device, passEncoder, vertexBuffer, scene, startOffset, diff) {
         if (this.pipelines === null)
-            return;
-        let totalVertices = getTotalVertices(scene);
-        const vertexBuffer = device.createBuffer({
-            size: totalVertices * 4 * BUF_LEN,
-            usage: GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_DST
-        });
-        let currentOffset = 0;
+            return 0;
+        let currentOffset = startOffset;
         let toRemove = [];
         for (let i = 0; i < scene.length; i++) {
             const lifetime = scene[i].getLifetime();
@@ -398,7 +404,7 @@ export class Simulation {
             }
             const obj = scene[i].getObj();
             if (obj.isCollection) {
-                this.renderScene(device, passEncoder, obj.getScene(), diff);
+                currentOffset += this.renderScene(device, passEncoder, vertexBuffer, obj.getScene(), currentOffset, diff);
                 continue;
             }
             const buffer = new Float32Array(obj.getBuffer(this.camera));
@@ -465,6 +471,7 @@ export class Simulation {
         for (let i = toRemove.length - 1; i >= 0; i--) {
             removeObject(scene, scene[i].getObj());
         }
+        return currentOffset - startOffset;
     }
     fitElement() {
         this.assertHasCanvas();
@@ -501,6 +508,13 @@ export class SceneCollection extends SimulationElement3d {
     getScene() {
         return this.scene;
     }
+    getVertexCount() {
+        let total = 0;
+        for (let i = 0; i < this.scene.length; i++) {
+            total += this.scene[i].getObj().getVertexCount();
+        }
+        return total;
+    }
     getSceneObjects() {
         return this.scene.map((item) => item.getObj());
     }

package/dist/types.d.ts

@@ -75,4 +75,5 @@ export type RenderInfo = {
     uniformBuffer: GPUBuffer;
     instanceBuffer: GPUBuffer;
     bindGroupLayout: GPUBindGroupLayout;
+    vertexBuffer: GPUBuffer | null;
 };

package/package.json

@@ -5,7 +5,7 @@
   "types": "./dist/index.d.ts",
   "author": "Jackson Otto",
   "description": "A simple graphics library using WebGPU",
-  "version": "0.4.3",
+  "version": "0.4.5",
   "exports": {
     ".": {
       "import": "./dist/index.js",