simulationjsv2 0.7.4 → 0.8.0

package/dist/index.js

@@ -2,4 +2,6 @@ export * from './simulation.js';
 export * from './graphics.js';
 export * from './utils.js';
 export * from './types.js';
+export * from './shaders.js';
+export * from './materials.js';
 export { vec2, vec3, vec4, mat3, mat4 } from 'wgpu-matrix';

package/dist/internalUtils.d.ts

@@ -1,9 +1,8 @@
 /// <reference types="@webgpu/types" />
-import { VertexParamGeneratorInfo, Mat4, Vector2, Vector3, VertexParamInfo } from './types.js';
-import { Color } from './utils.js';
+import { Mat4, Vector2, Vector3 } from './types.js';
 import { SimulationElement3d } from './graphics.js';
 import { Shader } from './shaders.js';
-export declare class VertexCache {
+export declare class Float32ArrayCache {
     private vertices;
     private hasUpdated;
     constructor();
@@ -11,24 +10,16 @@ export declare class VertexCache {
     getCache(): Float32Array;
     updated(): void;
     shouldUpdate(): boolean;
-    getVertexCount(): number;
+    getVertexCount(stride?: number): number;
 }
-export declare class GlobalInfo {
-    private device;
-    constructor();
-    setDevice(device: GPUDevice): void;
-    errorGetDevice(): GPUDevice;
-    getDevice(): GPUDevice | null;
-}
-export declare const globalInfo: GlobalInfo;
 export declare class CachedArray<T> {
-    private length;
+    length: number;
     private data;
     constructor();
     add(index: T): void;
     reset(): void;
     clearCache(): void;
-    toArray(): T[];
+    getArray(): T[];
 }
 export declare const updateProjectionMatrix: (mat: Mat4, aspectRatio: number, zNear?: number, zFar?: number) => any;
 export declare const updateWorldProjectionMatrix: (worldProjMat: Mat4, projMat: Mat4) => void;
@@ -55,41 +46,13 @@ export declare class SimSceneObjInfo {
     getObj(): SimulationElement3d;
     getId(): string | null;
 }
-declare class Logger {
-    constructor();
-    private fmt;
-    log(msg: string): void;
-    error(msg: string): Error;
-    warn(msg: string): void;
-    log_error(msg: string): void;
-}
-export declare const logger: Logger;
 export declare function lossyTriangulate<T>(vertices: T[]): (readonly [T, T, T])[];
 export declare function lossyTriangulateStrip<T>(vertices: T[]): T[];
-declare class BufferGenerator {
-    private instancing;
-    constructor();
-    setInstancing(state: boolean): void;
-    generate(x: number, y: number, z: number, color: Color, uv?: Vector2, vertexParamGenerator?: VertexParamGeneratorInfo): number[];
-}
-export declare const bufferGenerator: BufferGenerator;
+export declare function createIndexArray(length: number): number[];
 export declare function vector3ToPixelRatio(vec: Vector3): void;
 export declare function vector2ToPixelRatio(vec: Vector2): void;
-export declare function createPipeline(device: GPUDevice, module: GPUShaderModule, bindGroupLayouts: GPUBindGroupLayout[], presentationFormat: GPUTextureFormat, topology: GPUPrimitiveTopology, transparent: boolean, vertexParams?: VertexParamInfo[]): GPURenderPipeline;
 export declare function triangulateWireFrameOrder(len: number): number[];
-export declare function getTotalVertices(scene: SimSceneObjInfo[]): number;
-export declare function vectorCompAngle(a: number, b: number): number;
-export declare function angleBetween(pos1: Vector3, pos2: Vector3): Vector3;
+export declare function getVertexAndIndexSize(scene: SimSceneObjInfo[]): readonly [number, number];
 export declare function internalTransitionValues(onFrame: (deltaT: number, t: number, total: number) => void, adjustment: () => void, transitionLength: number, func?: (n: number) => number): Promise<void>;
 export declare function posTo2dScreen(pos: Vector3): Vector3;
-export declare function createShaderModule(shader: Shader): GPUShaderModule;
-export declare function createDefaultPipelines(shader: Shader): {
-    triangleList: GPURenderPipeline;
-    triangleStrip: GPURenderPipeline;
-    lineStrip: GPURenderPipeline;
-    triangleListTransparent: GPURenderPipeline;
-    triangleStripTransparent: GPURenderPipeline;
-    lineStripTransparent: GPURenderPipeline;
-};
-export default function createUniformBindGroup(shader: Shader, buffers: GPUBuffer[]): GPUBindGroup;
-export {};
+export declare function createPipeline(device: GPUDevice, info: string, shader: Shader): GPURenderPipeline;

package/dist/internalUtils.js

@@ -1,9 +1,8 @@
 import { mat4, vec3 } from 'wgpu-matrix';
-import { BUF_LEN, colorOffset, drawingInstancesOffset, uvOffset, vertexSize } from './constants.js';
-import { cloneBuf, transitionValues, vector2, vector3 } from './utils.js';
+import { cloneBuf, transitionValues } from './utils.js';
 import { camera } from './simulation.js';
 import { settings } from './settings.js';
-export class VertexCache {
+export class Float32ArrayCache {
     vertices;
     hasUpdated = true;
     constructor() {
@@ -22,28 +21,10 @@ export class VertexCache {
     shouldUpdate() {
         return this.hasUpdated;
     }
-    getVertexCount() {
-        return this.vertices.length / BUF_LEN;
+    getVertexCount(stride = 1) {
+        return this.vertices.length / stride;
     }
 }
-export class GlobalInfo {
-    device;
-    constructor() {
-        this.device = null;
-    }
-    setDevice(device) {
-        this.device = device;
-    }
-    errorGetDevice() {
-        if (!this.device)
-            throw logger.error('GPUDevice is null');
-        return this.device;
-    }
-    getDevice() {
-        return this.device;
-    }
-}
-export const globalInfo = new GlobalInfo();
 export class CachedArray {
     length;
     data;
@@ -67,8 +48,8 @@ export class CachedArray {
         this.reset();
         this.data = [];
     }
-    toArray() {
-        return this.data.slice(0, this.length);
+    getArray() {
+        return this.data;
     }
 }
 export const updateProjectionMatrix = (mat, aspectRatio, zNear = 1, zFar = 500) => {
@@ -79,7 +60,7 @@ export const updateWorldProjectionMatrix = (worldProjMat, projMat) => {
     mat4.identity(worldProjMat);
     const camPos = cloneBuf(camera.getPos());
     const rotation = camera.getRotation();
-    vec3.scale(camPos, -1, camPos);
+    vec3.negate(camPos, camPos);
     mat4.rotateZ(worldProjMat, rotation[2], worldProjMat);
     mat4.rotateY(worldProjMat, rotation[1], worldProjMat);
     mat4.rotateX(worldProjMat, rotation[0], worldProjMat);
@@ -151,25 +132,6 @@ export class SimSceneObjInfo {
         return this.id;
     }
 }
-class Logger {
-    constructor() { }
-    fmt(msg) {
-        return `SimJS: ${msg}`;
-    }
-    log(msg) {
-        console.log(this.fmt(msg));
-    }
-    error(msg) {
-        return new Error(this.fmt(msg));
-    }
-    warn(msg) {
-        console.warn(this.fmt(msg));
-    }
-    log_error(msg) {
-        console.error(this.fmt(msg));
-    }
-}
-export const logger = new Logger();
 // optomized for speed, depending on orientation of vertices as input, shape may not be preserved
 export function lossyTriangulate(vertices) {
     const res = [];
@@ -218,25 +180,11 @@ export function lossyTriangulateStrip(vertices) {
     res.push(vertices[upper]);
     return res;
 }
-class BufferGenerator {
-    instancing = false;
-    constructor() { }
-    setInstancing(state) {
-        this.instancing = state;
-    }
-    generate(x, y, z, color, uv = vector2(), vertexParamGenerator) {
-        if (vertexParamGenerator) {
-            const buf = vertexParamGenerator.createBuffer(x, y, z, color);
-            if (buf.length !== vertexParamGenerator.bufferSize) {
-                logger.log_error(`Vertex size for shader group does not match buffer extension size (${buf.length} to expected ${vertexParamGenerator.bufferSize})`);
-                return [];
-            }
-            return buf;
-        }
-        return [x, y, z, ...color.toBuffer(), ...uv, this.instancing ? 1 : 0];
-    }
+export function createIndexArray(length) {
+    return Array(length)
+        .fill(0)
+        .map((_, index) => index);
 }
-export const bufferGenerator = new BufferGenerator();
 export function vector3ToPixelRatio(vec) {
     vec[0] *= devicePixelRatio;
     vec[1] *= devicePixelRatio;
@@ -246,63 +194,56 @@ export function vector2ToPixelRatio(vec) {
     vec[0] *= devicePixelRatio;
     vec[1] *= devicePixelRatio;
 }
-export function createPipeline(device, module, bindGroupLayouts, presentationFormat, topology, transparent, vertexParams) {
-    let params = [
-        {
-            // position
-            shaderLocation: 0,
-            offset: 0,
-            format: 'float32x4'
-        },
-        {
-            // color
-            shaderLocation: 1,
-            offset: colorOffset,
-            format: 'float32x4'
-        },
-        {
-            // size
-            shaderLocation: 2,
-            offset: uvOffset,
-            format: 'float32x2'
-        },
-        {
-            // drawing instances
-            shaderLocation: 3,
-            offset: drawingInstancesOffset,
-            format: 'float32'
-        }
-    ];
-    let stride = vertexSize;
-    if (vertexParams) {
-        params = [];
-        let offset = 0;
-        for (let i = 0; i < vertexParams.length; i++) {
-            params.push({
-                shaderLocation: i,
-                offset,
-                format: vertexParams[i].format
-            });
-            offset += vertexParams[i].size;
-        }
-        stride = offset;
+export function triangulateWireFrameOrder(len) {
+    const order = Array(len)
+        .fill(0)
+        .map((_, index) => index);
+    let front = 0;
+    let back = len - 1;
+    while (front < back) {
+        order.push(front, back);
+        front++;
+        back--;
     }
+    return order;
+}
+export function getVertexAndIndexSize(scene) {
+    let vertexSize = 0;
+    let indexSize = 0;
+    for (let i = 0; i < scene.length; i++) {
+        const obj = scene[i].getObj();
+        vertexSize += obj.getVertexCount() * obj.getShader().getBufferLength();
+        indexSize += obj.getIndexCount();
+    }
+    return [vertexSize, indexSize];
+}
+export function internalTransitionValues(onFrame, adjustment, transitionLength, func) {
+    const newAdjustment = () => {
+        if (settings.transformAdjustments)
+            adjustment();
+    };
+    return transitionValues(onFrame, newAdjustment, transitionLength, func);
+}
+export function posTo2dScreen(pos) {
+    const newPos = cloneBuf(pos);
+    newPos[1] = camera.getScreenSize()[1] + newPos[1];
+    return newPos;
+}
+export function createPipeline(device, info, shader) {
+    const shaderModule = shader.getModule();
+    const presentationFormat = navigator.gpu.getPreferredCanvasFormat();
+    const infoObj = JSON.parse(info);
     return device.createRenderPipeline({
         layout: device.createPipelineLayout({
-            bindGroupLayouts: bindGroupLayouts
+            bindGroupLayouts: shader.getBindGroupLayouts()
         }),
         vertex: {
-            module,
-            entryPoint: 'vertex_main',
-            buffers: [
-                {
-                    arrayStride: stride,
-                    attributes: params
-                }
-            ]
+            module: shaderModule,
+            entryPoint: shader.getVertexMain(),
+            buffers: [shader.getVertexBuffers()]
         },
         fragment: {
-            module,
+            module: shaderModule,
             entryPoint: 'fragment_main',
             targets: [
                 {
@@ -321,98 +262,17 @@ export function createPipeline(device, module, bindGroupLayouts, presentationFor
             ]
         },
         primitive: {
-            topology
+            topology: infoObj.topology,
+            stripIndexFormat: infoObj.topology.endsWith('strip') ? 'uint32' : undefined,
+            cullMode: infoObj.cullMode
         },
         multisample: {
             count: 4
         },
         depthStencil: {
-            depthWriteEnabled: !transparent,
+            depthWriteEnabled: !infoObj.transparent,
             depthCompare: 'less',
             format: 'depth24plus'
         }
     });
 }
-export function triangulateWireFrameOrder(len) {
-    const order = Array(len)
-        .fill(0)
-        .map((_, index) => index);
-    let front = 0;
-    let back = len - 1;
-    while (front < back) {
-        order.push(front, back);
-        front++;
-        back--;
-    }
-    return order;
-}
-export function getTotalVertices(scene) {
-    let total = 0;
-    for (let i = 0; i < scene.length; i++) {
-        const obj = scene[i].getObj();
-        total += obj.getVertexCount();
-    }
-    return total;
-}
-export function vectorCompAngle(a, b) {
-    if (a === 0)
-        return 0;
-    else {
-        if (b === 0)
-            return 0;
-        else
-            return Math.atan2(a, b);
-    }
-}
-export function angleBetween(pos1, pos2) {
-    const diff = vec3.sub(pos1, pos2);
-    const angleZ = vectorCompAngle(diff[0], diff[1]);
-    const angleY = vectorCompAngle(diff[2], diff[0]);
-    const angleX = vectorCompAngle(diff[2], diff[1]);
-    return vector3(angleX, angleY, angleZ);
-}
-export function internalTransitionValues(onFrame, adjustment, transitionLength, func) {
-    const newAdjustment = () => {
-        if (settings.transformAdjustments)
-            adjustment();
-    };
-    return transitionValues(onFrame, newAdjustment, transitionLength, func);
-}
-export function posTo2dScreen(pos) {
-    const newPos = cloneBuf(pos);
-    newPos[1] = camera.getScreenSize()[1] + newPos[1];
-    return newPos;
-}
-export function createShaderModule(shader) {
-    const device = globalInfo.errorGetDevice();
-    return device.createShaderModule({
-        code: shader.getCode()
-    });
-}
-export function createDefaultPipelines(shader) {
-    const device = globalInfo.errorGetDevice();
-    const bindGroupLayout = device.createBindGroupLayout(shader.getBindGroupLayoutDescriptor());
-    const shaderModule = createShaderModule(shader);
-    const presentationFormat = navigator.gpu.getPreferredCanvasFormat();
-    return {
-        triangleList: createPipeline(device, shaderModule, [bindGroupLayout], presentationFormat, 'triangle-list', false),
-        triangleStrip: createPipeline(device, shaderModule, [bindGroupLayout], presentationFormat, 'triangle-strip', false),
-        lineStrip: createPipeline(device, shaderModule, [bindGroupLayout], presentationFormat, 'line-strip', false),
-        triangleListTransparent: createPipeline(device, shaderModule, [bindGroupLayout], presentationFormat, 'triangle-list', true),
-        triangleStripTransparent: createPipeline(device, shaderModule, [bindGroupLayout], presentationFormat, 'triangle-strip', true),
-        lineStripTransparent: createPipeline(device, shaderModule, [bindGroupLayout], presentationFormat, 'line-strip', true)
-    };
-}
-export default function createUniformBindGroup(shader, buffers) {
-    const device = globalInfo.errorGetDevice();
-    const bindGroupLayout = shader.getBindGroupLayout();
-    return device.createBindGroup({
-        layout: bindGroupLayout,
-        entries: buffers.map((buffer, index) => ({
-            binding: index,
-            resource: {
-                buffer
-            }
-        }))
-    });
-}

package/dist/materials.d.ts

@@ -1,3 +1,20 @@
+import { Color } from './utils.js';
 export declare class Material {
+    protected color: Color;
+    protected vertexColors: Color[];
+    protected isVertexColors: boolean;
+    constructor();
+    hasVertexColors(): boolean;
+    getVertexColors(): Color[];
+    getColor(): Color;
+    addVertexColor(color: Color): void;
+    setVertexColors(colors: Color[]): void;
+    isTransparent(): boolean;
+    setColor(color: Color): void;
+}
+export declare class BasicMaterial extends Material {
+    constructor(color: Color);
+}
+export declare class VertexColorMaterial extends Material {
     constructor();
 }

package/dist/materials.js

@@ -1,3 +1,51 @@
+import { color } from './utils.js';
 export class Material {
-    constructor() { }
+    color;
+    vertexColors;
+    isVertexColors;
+    constructor() {
+        this.color = color();
+        this.vertexColors = [];
+        this.isVertexColors = false;
+    }
+    hasVertexColors() {
+        return this.isVertexColors;
+    }
+    getVertexColors() {
+        return this.vertexColors;
+    }
+    getColor() {
+        return this.color;
+    }
+    addVertexColor(color) {
+        this.vertexColors.push(color);
+    }
+    setVertexColors(colors) {
+        this.vertexColors = colors;
+    }
+    isTransparent() {
+        if (this.isVertexColors) {
+            for (let i = 0; i < this.vertexColors.length; i++) {
+                if (this.vertexColors[i].isTransparent())
+                    return true;
+            }
+            return false;
+        }
+        return this.color.isTransparent();
+    }
+    setColor(color) {
+        this.color = color;
+    }
+}
+export class BasicMaterial extends Material {
+    constructor(color) {
+        super();
+        this.color = color;
+    }
+}
+export class VertexColorMaterial extends Material {
+    constructor() {
+        super();
+        this.isVertexColors = true;
+    }
 }

package/dist/shaders.d.ts

@@ -1,11 +1,37 @@
 /// <reference types="@webgpu/types" />
+import { SimulationElement3d } from './graphics.js';
+import { BindGroupGenerator, BufferInfo, BufferWriter, Vector3, VertexBufferWriter, VertexParamInfo } from './types.js';
+export declare const uniformBufferSize: number;
 export declare class Shader {
-    private bindGroupLayoutDescriptor;
-    private bindGroupLayout;
+    private bindGroupLayoutDescriptors;
+    private bindGroupLayouts;
+    private module;
     private code;
-    constructor(code: string, descriptor: GPUBindGroupLayoutDescriptor);
+    private fragmentMain;
+    private vertexMain;
+    private vertexBuffers;
+    private bufferLength;
+    private bufferWriter;
+    private vertexBufferWriter;
+    private bindGroupGenerator;
+    private buffers;
+    private bufferInfos;
+    constructor(code: string, descriptors: GPUBindGroupLayoutDescriptor[], vertexParams: VertexParamInfo[], bufferInfos: BufferInfo[], bufferWriter: BufferWriter, bindGroupGenerator: BindGroupGenerator, vertexBufferWriter: VertexBufferWriter, vertexMain?: string, fragmentMain?: string);
     getCode(): string;
-    getBindGroupLayout(): GPUBindGroupLayout;
-    getBindGroupLayoutDescriptor(): GPUBindGroupLayoutDescriptor;
+    getBufferLength(): number;
+    getVertexBuffers(): GPUVertexBufferLayout;
+    getBindGroupLayouts(): GPUBindGroupLayout[];
+    getBindGroupLayoutDescriptors(): GPUBindGroupLayoutDescriptor[];
+    getBufferInfo(): BufferInfo[];
+    getBufferWriter(): BufferWriter;
+    getVertexBufferWriter(): VertexBufferWriter;
+    getBindGroupGenerator(): BindGroupGenerator;
+    getModule(): GPUShaderModule;
+    getVertexMain(): string;
+    getFragmentMain(): string;
+    setVertexInfo(element: SimulationElement3d, buffer: Float32Array, vertex: Vector3, vertexIndex: number, offset: number): void;
+    writeBuffers(el: SimulationElement3d): void;
+    getBindGroups(el: SimulationElement3d): GPUBindGroup[];
 }
 export declare const defaultShader: Shader;
+export declare const vertexColorShader: Shader;