@zephyr3d/scene 0.1.0

package/dist/render/primitive.js

@@ -0,0 +1,246 @@
+import { Application } from '../app.js';
+
+/**
+ * Primitive contains only the vertex and index data of a mesh
+ * @public
+ */ class Primitive {
+    /** @internal */ _vertexLayout;
+    /** @internal */ _vertexLayoutOptions;
+    /** @internal */ _primitiveType;
+    /** @internal */ _indexStart;
+    /** @internal */ _indexCount;
+    /** @internal */ _defaultIndexCount;
+    /** @internal */ _vertexLayoutDirty;
+    /** @internal */ static _nextId = 0;
+    /** @internal */ _id;
+    /** @internal */ _bbox;
+    /** @internal */ _bboxChangeCallback;
+    /**
+   * Creates an instance of a primitive
+   */ constructor(){
+        this._vertexLayout = null;
+        this._vertexLayoutOptions = {
+            vertexBuffers: []
+        };
+        this._primitiveType = 'triangle-list';
+        this._indexStart = 0;
+        this._indexCount = null;
+        this._defaultIndexCount = 0;
+        this._vertexLayoutDirty = false;
+        this._id = ++Primitive._nextId;
+        this._bbox = null;
+        this._bboxChangeCallback = [];
+    }
+    /**
+   * Unique identifier of the primitive
+   * @internal
+   */ get id() {
+        return this._id;
+    }
+    /**
+   * Adds a callback function that will be called whenever the bounding box of the primitive changes.
+   * @param cb - The callback function
+   *
+   * @internal
+   */ addBoundingboxChangeCallback(cb) {
+        cb && this._bboxChangeCallback.push(cb);
+    }
+    /**
+   * Removes a callback function for bounding box changing
+   * @param cb - The callback function to be removed
+   */ removeBoundingboxChangeCallback(cb) {
+        const index = this._bboxChangeCallback.indexOf(cb);
+        if (index >= 0) {
+            this._bboxChangeCallback.splice(index, 1);
+        }
+    }
+    /** Primitive type */ get primitiveType() {
+        return this._primitiveType;
+    }
+    set primitiveType(type) {
+        this._primitiveType = type;
+    }
+    /** Start index for drawing */ get indexStart() {
+        return this._indexStart;
+    }
+    set indexStart(val) {
+        this._indexStart = val;
+    }
+    /** The number of the indices or vertices to be drawn */ get indexCount() {
+        this._indexCount = this._indexCount ?? this.calcDefaultIndexCount();
+        return this._indexCount;
+    }
+    set indexCount(val) {
+        this._indexCount = val;
+    }
+    /**
+   * Removes a vertex buffer from the primitive
+   * @param buffer - The vertex buffer to be removed
+   */ removeVertexBuffer(buffer) {
+        for(let loc = 0; loc < this._vertexLayoutOptions.vertexBuffers.length; loc++){
+            const info = this._vertexLayoutOptions.vertexBuffers[loc];
+            if (info?.buffer === buffer) {
+                info[loc] = null;
+                this._vertexLayoutDirty = true;
+            }
+        }
+    }
+    /**
+   * Gets the vertex buffer by a given semantic
+   * @param semantic - The semantic of the vertex buffer
+   * @returns The vertex buffer which semantic matches the given value
+   */ getVertexBuffer(semantic) {
+        this.checkVertexLayout();
+        return this._vertexLayout.getVertexBuffer(semantic);
+    }
+    /**
+   * Gets the vertex buffer information by a given semantic
+   * @param semantic - The semantic of the vertex buffer
+   * @returns The vertex buffer information of the given semantic
+   */ getVertexBufferInfo(semantic) {
+        this.checkVertexLayout();
+        return this._vertexLayout.getVertexBufferInfo(semantic);
+    }
+    /**
+   * Creates a vertex buffer from the given options and then adds it to the primitive
+   * @param format - Vertex format for the vertex buffer
+   * @param data - Contents of the vertex buffer
+   * @param stepMode - Step mode of the vertex buffer
+   * @returns The created vertex buffer
+   */ createAndSetVertexBuffer(format, data, stepMode) {
+        const buffer = Application.instance.device.createVertexBuffer(format, data);
+        return this.setVertexBuffer(buffer, stepMode);
+    }
+    /**
+   * Adds a vertex buffer to the primitive
+   * @param buffer - The vertex buffer to be added
+   * @param stepMode - Step mode of the vertex buffer
+   * @returns The added vertex buffer
+   */ setVertexBuffer(buffer, stepMode) {
+        this._vertexLayoutOptions.vertexBuffers.push({
+            buffer,
+            stepMode
+        });
+        this._vertexLayoutDirty = true;
+        return buffer;
+    }
+    /**
+   * Creates an index buffer from the given options and then adds it to the prmitive
+   * @param data - Contents of the index buffer
+   * @param dynamic - true if the index buffer is dynamic
+   * @returns The created index buffer
+   */ createAndSetIndexBuffer(data, dynamic) {
+        const buffer = Application.instance.device.createIndexBuffer(data, {
+            dynamic: !!dynamic,
+            managed: !dynamic
+        });
+        this.setIndexBuffer(buffer);
+        return buffer;
+    }
+    /**
+   * Adds an index buffer to the primitive
+   * @param buffer - The index buffer to be added
+   */ setIndexBuffer(buffer) {
+        if (this._vertexLayoutOptions.indexBuffer !== buffer) {
+            this._vertexLayoutOptions.indexBuffer = buffer;
+            this._vertexLayoutDirty = true;
+        }
+    }
+    /**
+   * Gets the index buffer of the primitive
+   * @returns The index buffer of the primitive
+   */ getIndexBuffer() {
+        return this._vertexLayoutOptions.indexBuffer;
+    }
+    /**
+   * Draw the prmitive
+   */ draw() {
+        this.checkVertexLayout();
+        if (this.indexCount > 0) {
+            this._vertexLayout?.draw(this._primitiveType, this._indexStart, this.indexCount);
+        }
+    }
+    /**
+   * Draw multiple instances of the primitive
+   * @param numInstances - How many instances of the primitive should be drawn
+   */ drawInstanced(numInstances) {
+        this.checkVertexLayout();
+        if (this.indexCount > 0) {
+            this._vertexLayout?.drawInstanced(this._primitiveType, this._indexStart, this.indexCount, numInstances);
+        }
+    }
+    /**
+   * Disposes the primitive
+   *
+   * @remarks
+   * The vertex buffers and index buffer will also be disposed.
+   * To prevent specific vertex buffer or index buffer to be disposed,
+   * call removeVertexBuffer() or setIndexBuffer(null) first.
+   */ dispose() {
+        if (this._vertexLayout) {
+            const vertexBuffers = this._vertexLayout.vertexBuffers;
+            for(const k in vertexBuffers){
+                vertexBuffers[k]?.buffer?.dispose();
+            }
+            this._vertexLayout.indexBuffer?.dispose();
+            this._vertexLayout.dispose();
+            this._vertexLayout = null;
+        }
+        this._indexCount = null;
+        this._indexStart = 0;
+    }
+    /*
+  createAABBTree(): AABBTree {
+    const indices = this.getIndexBuffer() ? this.getIndexBuffer().getData() : null;
+    const vertices = (this.getVertexBuffer(VERTEX_ATTRIB_POSITION)?.getData() as Float32Array) || null;
+    const aabbtree = new AABBTree();
+    aabbtree.buildFromPrimitives(vertices, indices, this._primitiveType);
+    return aabbtree;
+  }
+  */ /**
+   * Gets the bounding volume of the primitive
+   * @returns The bounding volume of the primitive, or null if no bounding volume set
+   */ getBoundingVolume() {
+        return this._bbox;
+    }
+    /**
+   * Sets the bounding volume of the primitive
+   * @param bv - The bounding volume to be set
+   */ setBoundingVolume(bv) {
+        if (bv !== this._bbox) {
+            this._bbox = bv;
+            for (const cb of this._bboxChangeCallback){
+                cb();
+            }
+        }
+    }
+    /**
+   * Ray intersection test
+   * @param ray - Ray object used to do intersection test with this object
+   * @returns The distance from ray origin to the intersection point if ray intersects with this object, otherwise null
+   */ raycast(ray) {
+        const aabb = this.getBoundingVolume()?.toAABB();
+        return aabb ? ray.bboxIntersectionTestEx(aabb) : null;
+    }
+    /** @internal */ checkVertexLayout() {
+        if (this._vertexLayoutDirty) {
+            this._vertexLayout?.dispose();
+            this._vertexLayout = Application.instance.device.createVertexLayout(this._vertexLayoutOptions);
+            this._vertexLayoutDirty = false;
+        }
+    }
+    /** @internal */ calcDefaultIndexCount() {
+        const indexBuffer = this.getIndexBuffer();
+        if (indexBuffer) {
+            return Math.max(0, indexBuffer.length - this._indexStart);
+        }
+        const info = this.getVertexBufferInfo('position');
+        if (info) {
+            return Math.max(0, Math.floor((info.buffer.byteLength - info.drawOffset) / info.stride) - this._indexStart);
+        }
+        return 0;
+    }
+}
+
+export { Primitive };
+//# sourceMappingURL=primitive.js.map

package/dist/render/primitive.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"primitive.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/render/render_queue.js

@@ -0,0 +1,163 @@
+import { Application } from '../app.js';
+
+/**
+ * A queue that contains the items to be rendered
+ * @public
+ */ class RenderQueue {
+    /** @internal */ _itemLists;
+    /** @internal */ _renderPass;
+    /** @internal */ _shadowedLightList;
+    /** @internal */ _unshadowedLightList;
+    /** @internal */ _sunLight;
+    /**
+   * Creates an instance of a render queue
+   * @param renderPass - The render pass to which the render queue belongs
+   */ constructor(renderPass){
+        this._itemLists = {};
+        this._renderPass = renderPass;
+        this._shadowedLightList = [];
+        this._unshadowedLightList = [];
+        this._sunLight = null;
+    }
+    /** The sun light */ get sunLight() {
+        return this._sunLight;
+    }
+    set sunLight(light) {
+        this._sunLight = light;
+    }
+    /** The render pass to which the render queue belongs */ get renderPass() {
+        return this._renderPass;
+    }
+    /**
+   * Gets the items of the render queue
+   */ get items() {
+        return this._itemLists;
+    }
+    /**
+   * Gets the shadowed lights
+   */ get shadowedLights() {
+        return this._shadowedLightList;
+    }
+    /**
+   * Gets the unshadowed lights
+   */ get unshadowedLights() {
+        return this._unshadowedLightList;
+    }
+    /**
+   * Gets the maximum batch size of a given device
+   * @returns The maximum batch size of the device
+   *
+   * @internal
+   */ getMaxBatchSize() {
+        return Application.instance.device.getDeviceCaps().shaderCaps.maxUniformBufferSize / 64;
+    }
+    /**
+   * Push a punctual light
+   * @param light - The light to be pushed
+   */ pushLight(light) {
+        if (light.castShadow) {
+            this._shadowedLightList.push(light);
+        } else {
+            this._unshadowedLightList.push(light);
+        }
+        if (light.isDirectionLight() && light.sunLight) {
+            this.sunLight = light;
+        }
+    }
+    /**
+   * Push an item to the render queue
+   * @param camera - The camera for drawing the item
+   * @param drawable - The object to be drawn
+   * @param renderOrder - Render order of the object
+   */ push(camera, drawable, renderOrder) {
+        if (drawable) {
+            let itemList = this._itemLists[renderOrder];
+            if (!itemList) {
+                itemList = {
+                    opaqueList: [],
+                    opaqueInstanceList: {},
+                    transList: [],
+                    transInstanceList: {}
+                };
+                this._itemLists[renderOrder] = itemList;
+            }
+            const trans = drawable.isTransparency();
+            const list = trans ? itemList.transList : itemList.opaqueList;
+            if (drawable.isBatchable()) {
+                const instanceList = trans ? itemList.transInstanceList : itemList.opaqueInstanceList;
+                const hash = drawable.getInstanceId(this._renderPass);
+                const index = instanceList[hash];
+                if (index === undefined || list[index].instanceData.worldMatrices.length === this.getMaxBatchSize()) {
+                    instanceList[hash] = list.length;
+                    list.push({
+                        drawable,
+                        sortDistance: drawable.getSortDistance(camera),
+                        instanceData: {
+                            worldMatrices: [
+                                drawable.getXForm().worldMatrix
+                            ],
+                            hash: hash
+                        }
+                    });
+                } else {
+                    list[index].instanceData.worldMatrices.push(drawable.getXForm().worldMatrix);
+                }
+            } else {
+                list.push({
+                    drawable,
+                    sortDistance: drawable.getSortDistance(camera),
+                    instanceData: null
+                });
+            }
+        }
+    }
+    /**
+   * Removes all items in the render queue
+   */ clear() {
+        this._itemLists = {};
+        this._shadowedLightList = [];
+        this._unshadowedLightList = [];
+        this._sunLight = null;
+    }
+    /**
+   * Sorts the items in the render queue for rendering
+   */ sortItems() {
+        for (const list of Object.values(this._itemLists)){
+            list.opaqueList.sort((a, b)=>a.sortDistance - b.sortDistance);
+            list.transList.sort((a, b)=>b.sortDistance - a.sortDistance);
+        }
+    }
+    encodeInstanceColor(index, outColor) {
+        outColor[0] = (index >> 24 & 255) / 255;
+        outColor[1] = (index >> 16 & 255) / 255;
+        outColor[2] = (index >> 8 && 255) / 255;
+        outColor[3] = (index >> 0 && 255) / 255;
+    }
+    /*
+  private decodeInstanceColor(value: Float32Array): number {
+    return (value[0] << 24) + (value[1] << 16) + (value[2] << 8) + value[3];
+  }
+  */ setInstanceColors() {
+        const nodes = [];
+        let id = 0;
+        for(const k in this._itemLists){
+            const lists = this._itemLists[k];
+            for (const item of lists.opaqueList){
+                if (item.instanceColor) {
+                    item.instanceData.instanceColorList = [];
+                    for(let i = 0; i < item.instanceData.worldMatrices.length; i++){
+                        const v = item.drawable.getInstanceColor();
+                        this.encodeInstanceColor(id, v);
+                        nodes[id] = item.drawable.getPickTarget();
+                        item.instanceData.instanceColorList.push(v);
+                        id++;
+                    }
+                }
+            }
+        }
+        return nodes;
+    }
+}
+
+export { RenderQueue };
+//# sourceMappingURL=render_queue.js.map

package/dist/render/render_queue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"render_queue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/render/renderpass.js

@@ -0,0 +1,151 @@
+import { Vector4 } from '@zephyr3d/base';
+import { CullVisitor } from './cull_visitor.js';
+import { Material } from '../material/material.js';
+import '@zephyr3d/device';
+import { ShaderFramework } from '../shaders/framework.js';
+import { Application } from '../app.js';
+import './scatteringlut.js';
+import '../material/lambert.js';
+import '../material/blinn.js';
+import '../material/unlit.js';
+import '../material/lightmodel.js';
+import { RenderQueue } from './render_queue.js';
+
+/**
+ * Base class for any kind of render passes
+ * @public
+ */ class RenderPass {
+    /** @internal */ _type;
+    /** @internal */ _globalBindGroups;
+    /** @internal */ _clearColor;
+    /** @internal */ _clearDepth;
+    /** @internal */ _clearStencil;
+    /**
+   * Creates an instanceof RenderPass
+   * @param type - Render pass type
+   */ constructor(type){
+        this._type = type;
+        this._clearColor = new Vector4(0, 0, 0, 1);
+        this._clearDepth = 1;
+        this._clearStencil = 0;
+        this._globalBindGroups = {};
+    }
+    /** Color value that is used to clear the frame buffer  */ get clearColor() {
+        return this._clearColor;
+    }
+    set clearColor(color) {
+        this._clearColor = color ?? null;
+    }
+    /** Depth value that is used to clear the frame buffer */ get clearDepth() {
+        return this._clearDepth;
+    }
+    set clearDepth(depth) {
+        this._clearDepth = depth ?? null;
+    }
+    /** Stencil value that is used to clear the frame buffer */ get clearStencil() {
+        return this._clearStencil;
+    }
+    set clearStencil(stencil) {
+        this._clearStencil = stencil ?? null;
+    }
+    /**
+   * The render pass type
+   */ get type() {
+        return this._type;
+    }
+    /** @internal */ isAutoFlip() {
+        return !!(Application.instance.device.getFramebuffer() && Application.instance.device.type === 'webgpu');
+    }
+    /**
+   * Renders a scene
+   * @param ctx - Drawing context
+   */ render(ctx, cullCamera, renderQueue) {
+        ctx.renderPass = this;
+        this.drawScene(ctx, cullCamera ?? ctx.camera, renderQueue);
+    }
+    /** @internal */ applyRenderStates(device, stateSet, ctx) {
+        device.setRenderStates(stateSet);
+    }
+    /** @internal */ getGlobalBindGroupInfo(ctx) {
+        const hash = this.getGlobalBindGroupHash(ctx);
+        let bindGroup = this._globalBindGroups[hash];
+        if (!bindGroup) {
+            //const programBuilder = new ProgramBuilder(Application.instance.device);
+            const ret = Application.instance.device.programBuilder.buildRender({
+                vertex (pb) {
+                    ShaderFramework.prepareVertexShader(pb, ctx);
+                    pb.main(function() {});
+                },
+                fragment (pb) {
+                    ShaderFramework.prepareFragmentShader(pb, ctx);
+                    pb.main(function() {});
+                }
+            });
+            bindGroup = {
+                bindGroup: Application.instance.device.createBindGroup(ret[2][0]),
+                layout: ret[2][0]
+            };
+            this._globalBindGroups[hash] = bindGroup;
+        }
+        if (bindGroup.bindGroup.disposed) {
+            bindGroup.bindGroup.reload();
+        }
+        return bindGroup;
+    }
+    /**
+   * Disposes the render pass
+   */ dispose() {
+        for(const k in this._globalBindGroups){
+            Material.bindGroupGarbageCollect(this._globalBindGroups[k].bindGroup);
+        }
+        this._globalBindGroups = {};
+    }
+    /** @internal */ getGlobalBindGroupHash(ctx) {
+        return `${this.constructor.name}:${this._getGlobalBindGroupHash(ctx)}`;
+    }
+    /** @internal */ drawScene(ctx, cullCamera, renderQueue) {
+        const device = Application.instance.device;
+        this.clearFramebuffer();
+        renderQueue = renderQueue ?? this.cullScene(ctx, cullCamera);
+        if (renderQueue) {
+            const windingReversed = device.isWindingOrderReversed();
+            device.reverseVertexWindingOrder(this.isAutoFlip() ? !windingReversed : windingReversed);
+            this.renderItems(ctx, renderQueue);
+            device.reverseVertexWindingOrder(windingReversed);
+        }
+    }
+    /**
+   * Culls a scene by a given camera
+   * @param ctx - The draw context
+   * @param cullCamera - The camera that will be used to cull the scene
+   * @returns The cull result
+   */ cullScene(ctx, cullCamera) {
+        if (cullCamera) {
+            const renderQueue = new RenderQueue(this);
+            const cullVisitor = new CullVisitor(this, cullCamera, renderQueue, ctx.primaryCamera);
+            if (ctx.scene.octree) {
+                ctx.scene.octree.getRootNode().traverse(cullVisitor);
+            } else {
+                ctx.scene.rootNode.traverse(cullVisitor);
+            }
+            return renderQueue;
+        }
+        return null;
+    }
+    /** @internal */ drawItem(device, item, ctx, reverseWinding) {
+        const reverse = reverseWinding !== item.drawable.getXForm().worldMatrixDet < 0;
+        if (reverse) {
+            device.reverseVertexWindingOrder(!device.isWindingOrderReversed());
+        }
+        item.drawable.draw(ctx);
+        if (reverse) {
+            device.reverseVertexWindingOrder(!device.isWindingOrderReversed());
+        }
+    }
+    /** @internal */ clearFramebuffer() {
+        Application.instance.device.clearFrameBuffer(this._clearColor, this._clearDepth, this._clearStencil);
+    }
+}
+
+export { RenderPass };
+//# sourceMappingURL=renderpass.js.map

package/dist/render/renderpass.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderpass.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/render/renderscheme.js

@@ -0,0 +1,61 @@
+import { Application } from '../app.js';
+
+/**
+ * Base class for any kind of render scheme
+ * @public
+ */ class RenderScheme {
+    /** @internal */ _shadowMapFormat;
+    /** @internal */ _enableDepthPass;
+    /** @internal */ _currentScene;
+    /**
+   * Creates an instance of RenderScheme
+   */ constructor(){
+        this._shadowMapFormat = null;
+        this._enableDepthPass = false;
+        this._currentScene = null;
+    }
+    /** True if an early depth pass is required  */ get requireDepthPass() {
+        return this._enableDepthPass;
+    }
+    set requireDepthPass(val) {
+        this._enableDepthPass = !!val;
+    }
+    /** The scene that is currently been rendered */ get currentScene() {
+        return this._currentScene;
+    }
+    /**
+   * Renders a scene by given camera
+   * @param scene - The scene to be rendered
+   * @param camera - The camera that will be used to render the scene
+   */ renderScene(scene, camera, compositor) {
+        this._currentScene = scene;
+        const ctx = {
+            scene,
+            camera,
+            compositor
+        };
+        scene.frameUpdate();
+        if (camera && !Application.instance.device.isContextLost()) {
+            this._renderScene(ctx);
+        }
+        this._currentScene = null;
+    }
+    /**
+   * Disposes the render scheme
+   */ dispose() {
+        this._dispose();
+    }
+    /**
+   * Gets the texture format for shadow maps
+   * @returns Texture format for shadow maps
+   */ getShadowMapFormat() {
+        if (!this._shadowMapFormat) {
+            const device = Application.instance.device;
+            this._shadowMapFormat = device.getDeviceCaps().textureCaps.supportHalfFloatColorBuffer ? device.type === 'webgl' ? 'rgba16f' : 'r16f' : device.getDeviceCaps().textureCaps.supportFloatColorBuffer ? device.type === 'webgl' ? 'rgba32f' : 'r32f' : 'rgba8unorm';
+        }
+        return this._shadowMapFormat;
+    }
+}
+
+export { RenderScheme };
+//# sourceMappingURL=renderscheme.js.map

package/dist/render/renderscheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderscheme.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}