@zephyr3d/scene 0.4.0 → 0.5.0

package/dist/render/render_queue.js

@@ -63,7 +63,7 @@ const defaultInstanceBindGroupAlloator = new InstanceBindGroupAllocator();
  * A queue that contains the items to be rendered
  * @public
  */ class RenderQueue {
-    /** @internal */ _itemLists;
+    /** @internal */ _itemList;
     /** @internal */ _renderPass;
     /** @internal */ _shadowedLightList;
     /** @internal */ _unshadowedLightList;
@@ -71,12 +71,15 @@ const defaultInstanceBindGroupAlloator = new InstanceBindGroupAllocator();
     /** @internal */ _bindGroupAllocator;
     /** @internal */ _ref;
     /** @internal */ _instanceInfo;
+    /** @internal */ _needSceneColor;
+    /** @internal */ _drawTransparent;
+    /** @internal */ _objectColorMaps;
     /**
    * Creates an instance of a render queue
    * @param renderPass - The render pass to which the render queue belongs
    */ constructor(renderPass, bindGroupAllocator){
         this._bindGroupAllocator = bindGroupAllocator ?? defaultInstanceBindGroupAlloator;
-        this._itemLists = {};
+        this._itemList = null;
         this._renderPass = renderPass;
         this._shadowedLightList = [];
         this._unshadowedLightList = [];
@@ -85,6 +88,11 @@ const defaultInstanceBindGroupAlloator = new InstanceBindGroupAllocator();
             ref: this
         };
         this._instanceInfo = new Map();
+        this._needSceneColor = false;
+        this._drawTransparent = false;
+        this._objectColorMaps = [
+            new Map()
+        ];
     }
     /** The sun light */ get sunLight() {
         return this._sunLight;
@@ -92,13 +100,19 @@ const defaultInstanceBindGroupAlloator = new InstanceBindGroupAllocator();
     set sunLight(light) {
         this._sunLight = light;
     }
+    /** Whether this render queue requires scene color pass */ get needSceneColor() {
+        return this._needSceneColor;
+    }
+    /** Whether this render queue has transparent objects to be drawn */ get drawTransparent() {
+        return this._drawTransparent;
+    }
     /** 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;
+   */ get itemList() {
+        return this._itemList;
     }
     /**
    * Gets the shadowed lights
@@ -147,35 +161,43 @@ const defaultInstanceBindGroupAlloator = new InstanceBindGroupAllocator();
    * Push items from another render queue
    * @param queue - The render queue to be pushed
    */ pushRenderQueue(queue) {
-        for(const order in queue._itemLists){
-            let itemLists = this._itemLists[order];
-            if (!itemLists) {
-                itemLists = this.newRenderItemList(true);
-                this._itemLists[order] = itemLists;
-            }
-            const newItemLists = queue._itemLists[order];
-            itemLists.opaque.lit.push(...newItemLists.opaque.lit);
-            itemLists.opaque.unlit.push(...newItemLists.opaque.unlit);
-            itemLists.transparent.lit.push(...newItemLists.transparent.lit);
-            itemLists.transparent.unlit.push(...newItemLists.transparent.unlit);
+        const newItemLists = queue._itemList;
+        if (!newItemLists) {
+            return;
         }
+        if (!this._itemList) {
+            this._itemList = this.newRenderItemList();
+        }
+        this._itemList.opaque.lit.push(...newItemLists.opaque.lit);
+        this._itemList.opaque.unlit.push(...newItemLists.opaque.unlit);
+        this._itemList.transmission.lit.push(...newItemLists.transmission.lit);
+        this._itemList.transmission.unlit.push(...newItemLists.transmission.unlit);
+        this._itemList.transparent.lit.push(...newItemLists.transparent.lit);
+        this._itemList.transparent.unlit.push(...newItemLists.transparent.unlit);
+        this._needSceneColor ||= queue._needSceneColor;
+        this._drawTransparent ||= queue._drawTransparent;
+        this._objectColorMaps.push(...queue._objectColorMaps);
     }
     /**
    * 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) {
+   */ push(camera, drawable) {
         if (drawable) {
-            let itemList = this._itemLists[renderOrder];
-            if (!itemList) {
-                itemList = this.newRenderItemList(false);
-                this._itemLists[renderOrder] = itemList;
+            if (!this._itemList) {
+                this._itemList = this.newRenderItemList();
             }
             const trans = drawable.getQueueType() === QUEUE_TRANSPARENT;
             const unlit = drawable.isUnlit();
+            const transmission = !trans && drawable.needSceneColor();
+            this._needSceneColor ||= transmission;
+            this._drawTransparent ||= trans;
+            if (camera.enablePicking) {
+                drawable.getMaterial().objectColor = drawable.getObjectColor();
+                this._objectColorMaps[0].set(drawable.getId(), drawable);
+            }
             if (drawable.isBatchable()) {
-                const instanceList = trans ? unlit ? itemList.transparent.unlit[0].instanceList : itemList.transparent.lit[0].instanceList : unlit ? itemList.opaque.unlit[0].instanceList : itemList.opaque.lit[0].instanceList;
+                const instanceList = trans ? unlit ? this._itemList.transparent.unlit[0].instanceList : this._itemList.transparent.lit[0].instanceList : unlit ? transmission ? this._itemList.transmission.unlit[0].instanceList : this._itemList.opaque.unlit[0].instanceList : transmission ? this._itemList.transmission.lit[0].instanceList : this._itemList.opaque.lit[0].instanceList;
                 const hash = drawable.getInstanceId(this._renderPass);
                 let drawableList = instanceList[hash];
                 if (!drawableList) {
@@ -184,8 +206,20 @@ const defaultInstanceBindGroupAlloator = new InstanceBindGroupAllocator();
                 }
                 drawableList.push(drawable);
             } else {
-                const list = trans ? unlit ? itemList.transparent.unlit[0] : itemList.transparent.lit[0] : unlit ? itemList.opaque.unlit[0] : itemList.opaque.lit[0];
-                this.binaryInsert(drawable.getBoneMatrices() ? list.skinItemList : list.itemList, {
+                const list = trans ? unlit ? this._itemList.transparent.unlit[0] : this._itemList.transparent.lit[0] : unlit ? transmission ? this._itemList.transmission.unlit[0] : this._itemList.opaque.unlit[0] : transmission ? this._itemList.transmission.lit[0] : this._itemList.opaque.lit[0];
+                const skinAnimation = !!drawable.getBoneMatrices();
+                const morphAnimation = !!drawable.getMorphData();
+                let queue;
+                if (skinAnimation && morphAnimation) {
+                    queue = list.skinAndMorphItemList;
+                } else if (skinAnimation) {
+                    queue = list.skinItemList;
+                } else if (morphAnimation) {
+                    queue = list.morphItemList;
+                } else {
+                    queue = list.itemList;
+                }
+                this.binaryInsert(queue, {
                     drawable,
                     sortDistance: drawable.getSortDistance(camera),
                     instanceData: null
@@ -199,13 +233,25 @@ const defaultInstanceBindGroupAlloator = new InstanceBindGroupAllocator();
             drawable.pushRenderQueueRef(this._ref);
         }
     }
+    /** @internal */ getDrawableByColor(c) {
+        const id = (c[0] << 24) + (c[1] << 16) + (c[2] << 8) + c[3];
+        for (const m of this._objectColorMaps){
+            const drawable = m.get(id);
+            if (drawable) {
+                return drawable;
+            }
+        }
+        return null;
+    }
     /**
    * Removes all items in the render queue
    */ reset() {
-        this._itemLists = {};
+        this._itemList = null;
         this._shadowedLightList = [];
         this._unshadowedLightList = [];
         this._sunLight = null;
+        this._needSceneColor = false;
+        this._drawTransparent = false;
     }
     /** @internal */ dispose() {
         this._ref.ref = null;
@@ -214,95 +260,97 @@ const defaultInstanceBindGroupAlloator = new InstanceBindGroupAllocator();
     }
     /** @internal */ end(camera, createRenderBundles) {
         const frameCounter = Application.instance.device.frameInfo.frameCounter;
-        for(const k in this._itemLists){
-            const itemList = this._itemLists[k];
-            const lists = [
-                itemList.opaque.lit,
-                itemList.opaque.unlit,
-                itemList.transparent.lit,
-                itemList.transparent.unlit
-            ];
-            for(let i = 0; i < 4; i++){
-                const list = lists[i];
-                for (const info of list){
-                    if (info.renderQueue !== this) {
-                        continue;
-                    }
-                    const instanceList = info.instanceList;
-                    for(const x in instanceList){
-                        const drawables = instanceList[x];
-                        if (drawables.length === 1) {
-                            this.binaryInsert(info.itemList, {
-                                drawable: drawables[0],
-                                sortDistance: drawables[0].getSortDistance(camera),
-                                instanceData: null
-                            });
-                            drawables[0].applyTransformUniforms(this);
-                            const mat = drawables[0].getMaterial();
+        const itemList = this._itemList;
+        if (!this.itemList) {
+            return this;
+        }
+        const lists = [
+            itemList.opaque.lit,
+            itemList.opaque.unlit,
+            itemList.transmission.lit,
+            itemList.transmission.unlit,
+            itemList.transparent.lit,
+            itemList.transparent.unlit
+        ];
+        for(let i = 0; i < lists.length; i++){
+            const list = lists[i];
+            for (const info of list){
+                if (info.renderQueue !== this) {
+                    continue;
+                }
+                const instanceList = info.instanceList;
+                for(const x in instanceList){
+                    const drawables = instanceList[x];
+                    if (drawables.length === 1) {
+                        this.binaryInsert(info.itemList, {
+                            drawable: drawables[0],
+                            sortDistance: drawables[0].getSortDistance(camera),
+                            instanceData: null
+                        });
+                        drawables[0].applyTransformUniforms(this);
+                        const mat = drawables[0].getMaterial();
+                        if (mat) {
+                            info.materialList.add(mat.coreMaterial);
+                        }
+                    } else {
+                        let bindGroup = null;
+                        let item = null;
+                        for(let i = 0; i < drawables.length; i++){
+                            const drawable = drawables[i];
+                            const instanceUniforms = drawable.getInstanceUniforms();
+                            const instanceUniformsSize = instanceUniforms?.length ?? 0;
+                            const stride = 16 + instanceUniformsSize;
+                            if (!bindGroup || bindGroup.offset + stride > maxBufferSizeInFloats) {
+                                bindGroup = this._bindGroupAllocator.allocateInstanceBindGroup(frameCounter, stride);
+                                item = {
+                                    drawable,
+                                    sortDistance: drawable.getSortDistance(camera),
+                                    instanceData: {
+                                        bindGroup,
+                                        offset: bindGroup.offset,
+                                        numInstances: 0,
+                                        stride
+                                    }
+                                };
+                                this.binaryInsert(info.instanceItemList, item);
+                                drawable.applyInstanceOffsetAndStride(this, stride, bindGroup.offset);
+                            }
+                            const instanceInfo = {
+                                bindGroup,
+                                offset: bindGroup.offset
+                            };
+                            this._instanceInfo.set(drawable, instanceInfo);
+                            drawable.applyTransformUniforms(this);
+                            drawable.applyMaterialUniforms(instanceInfo);
+                            bindGroup.offset += stride;
+                            item.instanceData.numInstances++;
+                            const mat = drawable.getMaterial();
                             if (mat) {
                                 info.materialList.add(mat.coreMaterial);
                             }
-                        } else {
-                            let bindGroup = null;
-                            let item = null;
-                            for(let i = 0; i < drawables.length; i++){
-                                const drawable = drawables[i];
-                                const instanceUniforms = drawable.getInstanceUniforms();
-                                const instanceUniformsSize = instanceUniforms?.length ?? 0;
-                                const stride = 16 + instanceUniformsSize;
-                                if (!bindGroup || bindGroup.offset + stride > maxBufferSizeInFloats) {
-                                    bindGroup = this._bindGroupAllocator.allocateInstanceBindGroup(frameCounter, stride);
-                                    item = {
-                                        drawable,
-                                        sortDistance: drawable.getSortDistance(camera),
-                                        instanceData: {
-                                            bindGroup,
-                                            offset: bindGroup.offset,
-                                            numInstances: 0,
-                                            stride
-                                        }
-                                    };
-                                    this.binaryInsert(info.instanceItemList, item);
-                                    drawable.applyInstanceOffsetAndStride(this, stride, bindGroup.offset);
-                                }
-                                const instanceInfo = {
-                                    bindGroup,
-                                    offset: bindGroup.offset
-                                };
-                                this._instanceInfo.set(drawable, instanceInfo);
-                                drawable.applyTransformUniforms(this);
-                                drawable.applyMaterialUniforms(instanceInfo);
-                                bindGroup.offset += stride;
-                                item.instanceData.numInstances++;
-                                const mat = drawable.getMaterial();
-                                if (mat) {
-                                    info.materialList.add(mat.coreMaterial);
-                                }
-                            }
                         }
                     }
-                    info.instanceList = {};
-                    if (createRenderBundles) {
-                        if (info.itemList.length > 0) {
-                            info.renderBundle = new RenderBundleWrapper();
-                        }
-                        if (info.skinItemList.length > 0) {
-                            info.skinRenderBundle = new RenderBundleWrapper();
-                        }
-                        if (info.instanceItemList.length > 0) {
-                            info.instanceRenderBundle = new RenderBundleWrapper();
-                        }
+                }
+                info.instanceList = {};
+                if (createRenderBundles) {
+                    if (info.itemList.length > 0) {
+                        info.renderBundle = new RenderBundleWrapper();
+                    }
+                    if (info.skinItemList.length > 0) {
+                        info.skinRenderBundle = new RenderBundleWrapper();
+                    }
+                    if (info.morphItemList.length > 0) {
+                        info.morphRenderBundle = new RenderBundleWrapper();
+                    }
+                    if (info.skinAndMorphItemList.length > 0) {
+                        info.skinAndMorphRenderBundle = new RenderBundleWrapper();
+                    }
+                    if (info.instanceItemList.length > 0) {
+                        info.instanceRenderBundle = new RenderBundleWrapper();
                     }
                 }
             }
-        /*
-      itemList.opaque.lit.forEach(info => {
-        info.itemList.sort((a, b) => (a.drawable.getMaterial()?.instanceId ?? 0) - (b.drawable.getMaterial()?.instanceId ?? 0))
-      });
-      itemList.opaque.unlit.forEach(info => {
-        info.itemList.sort((a, b) => (a.drawable.getMaterial()?.instanceId ?? 0) - (b.drawable.getMaterial()?.instanceId ?? 0))
-      });
-      */ }
+        }
         return this;
     }
     binaryInsert(itemList, item) {
@@ -326,63 +374,48 @@ const defaultInstanceBindGroupAlloator = new InstanceBindGroupAllocator();
     /**
    * Sorts the items in the render queue for rendering
    */ sortTransparentItems(cameraPos) {
-        for (const list of Object.values(this._itemLists)){
-            list.transparent.lit[0].itemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
-            list.transparent.lit[0].skinItemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
-            list.transparent.unlit[0].itemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
-            list.transparent.unlit[0].skinItemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
+        if (this._itemList) {
+            this._itemList.transparent.lit[0].itemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
+            this._itemList.transparent.lit[0].skinItemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
+            this._itemList.transparent.lit[0].morphItemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
+            this._itemList.transparent.lit[0].skinAndMorphItemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
+            this._itemList.transparent.unlit[0].itemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
+            this._itemList.transparent.unlit[0].skinItemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
+            this._itemList.transparent.unlit[0].morphItemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
+            this._itemList.transparent.unlit[0].skinAndMorphItemList.sort((a, b)=>this.drawableDistanceToCamera(b.drawable, cameraPos) - this.drawableDistanceToCamera(a.drawable, cameraPos));
         }
     }
     drawableDistanceToCamera(drawable, cameraPos) {
         const drawablePos = drawable.getXForm().position;
         return Vector3.distanceSq(drawablePos, cameraPos);
     }
-    newRenderItemList(empty) {
+    newRenderItemListInfo() {
         return {
-            opaque: {
-                lit: empty ? [] : [
-                    {
-                        itemList: [],
-                        skinItemList: [],
-                        instanceItemList: [],
-                        materialList: new Set(),
-                        instanceList: {},
-                        renderQueue: this
-                    }
-                ],
-                unlit: empty ? [] : [
-                    {
-                        itemList: [],
-                        skinItemList: [],
-                        instanceItemList: [],
-                        materialList: new Set(),
-                        instanceList: {},
-                        renderQueue: this
-                    }
-                ]
-            },
-            transparent: {
-                lit: empty ? [] : [
-                    {
-                        itemList: [],
-                        skinItemList: [],
-                        instanceItemList: [],
-                        materialList: new Set(),
-                        instanceList: {},
-                        renderQueue: this
-                    }
-                ],
-                unlit: empty ? [] : [
-                    {
-                        itemList: [],
-                        skinItemList: [],
-                        instanceItemList: [],
-                        materialList: new Set(),
-                        instanceList: {},
-                        renderQueue: this
-                    }
-                ]
-            }
+            itemList: [],
+            skinItemList: [],
+            morphItemList: [],
+            skinAndMorphItemList: [],
+            instanceItemList: [],
+            materialList: new Set(),
+            instanceList: {},
+            renderQueue: this
+        };
+    }
+    newRenderItemListBundle() {
+        return {
+            lit: [
+                this.newRenderItemListInfo()
+            ],
+            unlit: [
+                this.newRenderItemListInfo()
+            ]
+        };
+    }
+    newRenderItemList() {
+        return {
+            opaque: this.newRenderItemListBundle(),
+            transmission: this.newRenderItemListBundle(),
+            transparent: this.newRenderItemListBundle()
         };
     }
 }

package/dist/render/render_queue.js.map

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