@xviewer.js/core 1.0.5-alhpa.1 → 1.0.5-alhpa.3

package/dist/main.cjs

@@ -6,7 +6,7 @@ var GLTFLoader_js = require('three/examples/jsm/loaders/GLTFLoader.js');
 var DRACOLoader_js = require('three/examples/jsm/loaders/DRACOLoader.js');
 var meshopt_decoder_module_js = require('three/examples/jsm/libs/meshopt_decoder.module.js');
 var THREE = require('three');
-var RGBELoader_js = require('three/examples/jsm/loaders/RGBELoader.js');
+var HDRLoader_js = require('three/examples/jsm/loaders/HDRLoader.js');
 var SVGLoader_js = require('three/examples/jsm/loaders/SVGLoader.js');
 var KTX2Loader_js = require('three/examples/jsm/loaders/KTX2Loader.js');
 var Addons_js = require('three/examples/jsm/Addons.js');
@@ -273,10 +273,28 @@ class GLTFLoader extends Loader {
         loader.manager = manager;
         loader.setPath(path);
         loader.setResourcePath(resourcePath);
+        const cb = (gltf)=>{
+            const meshes = new Map();
+            const materials = new Map();
+            gltf.scene.traverse((mesh)=>{
+                if (mesh.isMesh) {
+                    gltf.mesh = mesh;
+                    gltf.material = mesh.material;
+                    meshes.set(mesh.name, mesh);
+                    const arr = Array.isArray(mesh.material) ? mesh.material : [
+                        mesh.material
+                    ];
+                    arr.forEach((m)=>materials.set(m.name, m));
+                }
+            });
+            gltf.meshes = meshes;
+            gltf.materials = materials;
+            onLoad(gltf);
+        };
         if (buffer) {
-            loader.parse(buffer, resourcePath, onLoad, onError);
+            loader.parse(buffer, resourcePath, cb, onError);
         } else {
-            loader.load(url, onLoad, onProgress, onError);
+            loader.load(url, cb, onProgress, onError);
         }
     }
     constructor(...args){
@@ -291,7 +309,7 @@ class HDRLoader extends Loader {
     load({ url, path, resourcePath, manager, texSettings, onLoad, onProgress, onError }) {
         let loader = this._loader;
         if (loader === undefined) {
-            loader = this._loader = new RGBELoader_js.RGBELoader();
+            loader = this._loader = new HDRLoader_js.HDRLoader();
         }
         loader.manager = manager;
         loader.setPath(path);
@@ -1330,8 +1348,17 @@ class Component extends ObjectInstance {
 }
 
 class Reflector extends Component {
+    get texture() {
+        return this._renderTarget.texture;
+    }
+    get textureMatrix() {
+        return this._textureMatrix;
+    }
+    onDestroy() {
+        this._renderTarget.dispose();
+    }
     constructor({ resolution = 512, clipBias = 0, multisample = 4, layerMask = 1 << 0, normal = new THREE.Vector3(0, 1, 0), mipmap = false } = {}){
-        super(), this.node = new THREE.Object3D(), this.layerMask = 1 << 0;
+        super(), this.node = new THREE.Object3D(), this.layerMask = 1 << 0, this._renderTarget = null, this._textureMatrix = new THREE.Matrix4();
         this.layerMask = layerMask;
         const reflectorPlane = new THREE.Plane();
         const reflectorNormal = new THREE.Vector3();
@@ -1343,15 +1370,14 @@ class Reflector extends Component {
         const view = new THREE.Vector3();
         const target = new THREE.Vector3();
         const q = new THREE.Vector4();
-        const textureMatrix = new THREE.Matrix4();
         const virtualCamera = new THREE.PerspectiveCamera();
-        const renderTarget = new THREE.WebGLRenderTarget(resolution, resolution, {
+        this._renderTarget = new THREE.WebGLRenderTarget(resolution, resolution, {
             samples: multisample,
             type: THREE.HalfFloatType,
             minFilter: mipmap ? THREE.LinearMipMapLinearFilter : THREE.LinearFilter,
             generateMipmaps: mipmap
         });
-        const update = ()=>{
+        this.lastUpdate = ()=>{
             const node = this.node;
             const { renderer, camera, scene } = this.context;
             reflectorWorldPosition.setFromMatrixPosition(node.matrixWorld);
@@ -1382,9 +1408,9 @@ class Reflector extends Component {
             virtualCamera.updateMatrixWorld();
             virtualCamera.projectionMatrix.copy(camera.projectionMatrix);
             // Update the texture matrix
-            textureMatrix.set(0.5, 0.0, 0.0, 0.5, 0.0, 0.5, 0.0, 0.5, 0.0, 0.0, 0.5, 0.5, 0.0, 0.0, 0.0, 1.0);
-            textureMatrix.multiply(virtualCamera.projectionMatrix);
-            textureMatrix.multiply(virtualCamera.matrixWorldInverse);
+            this.textureMatrix.set(0.5, 0.0, 0.0, 0.5, 0.0, 0.5, 0.0, 0.5, 0.0, 0.0, 0.5, 0.5, 0.0, 0.0, 0.0, 1.0);
+            this.textureMatrix.multiply(virtualCamera.projectionMatrix);
+            this.textureMatrix.multiply(virtualCamera.matrixWorldInverse);
             // Now update projection matrix with new clip plane, implementing code from: http://www.terathon.com/code/oblique.html
             // Paper explaining this technique: http://www.terathon.com/lengyel/Lengyel-Oblique.pdf
             reflectorPlane.setFromNormalAndCoplanarPoint(reflectorNormal, reflectorWorldPosition);
@@ -1413,7 +1439,7 @@ class Reflector extends Component {
             renderer.shadowMap.autoUpdate = false; // Avoid re-computing shadows
             const clearAlpha = renderer.getClearAlpha();
             renderer.setClearAlpha(0);
-            renderer.setRenderTarget(renderTarget);
+            renderer.setRenderTarget(this._renderTarget);
             renderer.state.buffers.depth.setMask(true); // make sure the depth buffer is writable so it can be properly cleared, see #18897
             if (renderer.autoClear === false) renderer.clear();
             renderer.render(scene, virtualCamera);
@@ -1428,10 +1454,6 @@ class Reflector extends Component {
             }
             node.visible = true;
         };
-        this.lastUpdate = update;
-        this.onDestroy = ()=>renderTarget.dispose();
-        this.getRenderTarget = ()=>renderTarget;
-        this.getTextureMatrix = ()=>textureMatrix;
     }
 }
 
@@ -2647,9 +2669,15 @@ class DeviceInput extends Component {
     get pointerPixel() {
         return this._pointerPixel;
     }
+    get pointerDown() {
+        return this._pointerDown;
+    }
     get pointerButton() {
         return this._pointerButton;
     }
+    get pointerMoving() {
+        return this._pointerMoving;
+    }
     get prePointer() {
         return this._prePointer;
     }
@@ -2677,6 +2705,9 @@ class DeviceInput extends Component {
     get keys() {
         return this._keys;
     }
+    get pressability() {
+        return this._pressability;
+    }
     onEnable() {
         const dom = this._target;
         this._addEventListener(dom, 'contextmenu', (e)=>e.preventDefault());
@@ -2729,6 +2760,8 @@ class DeviceInput extends Component {
         this._listeners = [];
     }
     lastUpdate(dt) {
+        this._pointerDown = false;
+        this._pointerMoving = false;
         this._prePointer.copy(this._pointer);
         this._prePointerPixel.copy(this._pointerPixel);
         for(let i = this._touchCount; i--;){
@@ -2813,6 +2846,7 @@ class DeviceInput extends Component {
     }
     _onPointerDown(e) {
         e = this._remapPointer(e);
+        this._pointerDown = true;
         this._pointerButton = e.button;
         this._computePointer(e);
         this._prePointer.copy(this._pointer);
@@ -2830,6 +2864,7 @@ class DeviceInput extends Component {
     _onPointerMove(e) {
         e = this._remapPointer(e);
         this._computePointer(e);
+        this._pointerMoving = true;
         this._pressability.pointerMove(this._pointer, this.viewer.camera);
         this.viewer.emit(DeviceInput.POINTER_MOVE, e);
     }
@@ -2897,7 +2932,7 @@ class DeviceInput extends Component {
         this.viewer.emit(DeviceInput.KEYUP, e);
     }
     constructor(option){
-        super(), this._listeners = [], this._touches = [], this._touchCount = 0, this._touchStart = false, this._touchMoving = false, this._pointer = new THREE.Vector2(), this._pointerPixel = new THREE.Vector2(), this._pointerButton = -1, this._prePointer = new THREE.Vector2(), this._prePointerPixel = new THREE.Vector2(), this._preTouches = [], this._mouseWheel = 0, this._keys = {}, this._pressability = new Pressability();
+        super(), this._listeners = [], this._touches = [], this._touchCount = 0, this._touchStart = false, this._touchMoving = false, this._pointer = new THREE.Vector2(), this._pointerPixel = new THREE.Vector2(), this._pointerButton = -1, this._pointerDown = false, this._pointerMoving = false, this._prePointer = new THREE.Vector2(), this._prePointerPixel = new THREE.Vector2(), this._preTouches = [], this._mouseWheel = 0, this._keys = {}, this._pressability = new Pressability();
         this._target = option.source;
         this._normalizeWheel = option.normalizeWheel || normalizeWheel;
     }
@@ -3127,6 +3162,13 @@ const { tan, PI } = Math;
 const PI2 = PI * 2;
 const ESP = 0.001;
 class FreelookVirtualCamera extends Component {
+    get up() {
+        return this._up;
+    }
+    set up(v) {
+        this._up.copy(v);
+        this._targetUp.copy(v);
+    }
     get lookAt() {
         return this._lookAt;
     }
@@ -3141,11 +3183,11 @@ class FreelookVirtualCamera extends Component {
         this._offset.copy(v);
         this._targetOffset.copy(v);
     }
-    get springLength() {
+    get radius() {
         return this._spherical.radius;
     }
-    set springLength(v) {
-        this._spherical.radius = this._targetSpringLength = clamp(v, this.distanceMin, this.distanceMax);
+    set radius(v) {
+        this._spherical.radius = this._targetRadius = clamp(v, this.radiusMin, this.radiusMax);
     }
     get theta() {
         return this._spherical.theta;
@@ -3197,18 +3239,20 @@ class FreelookVirtualCamera extends Component {
         this._targetFar = this.far;
         this._targetTheta = this.theta;
         this._targetPhi = this.phi;
-        this._targetSpringLength = this.springLength;
+        this._targetRadius = this.radius;
         this._targetLookAt.copy(this._lookAt);
+        this._targetUp.copy(this._up);
     }
-    goto({ phi = this._targetPhi, theta = this._targetTheta, springLength = this._targetSpringLength, offset = this._targetOffset, lookAt = this._lookAt, fov = this._fov, near = this._near, far = this._far, smoothing = this.smoothing, rotateSmoothing = this.smoothing }) {
+    goto({ phi = this._targetPhi, theta = this._targetTheta, radius = this._targetRadius, offset = this._targetOffset, lookAt = this._lookAt, up = this._up, fov = this._fov, near = this._near, far = this._far, smoothing = this.smoothing, rotateSmoothing = this.smoothing }) {
         const t0 = this._spherical.theta = this._spherical.theta % PI2;
         const t1 = theta % PI2;
         const delta = THREE.MathUtils.euclideanModulo(t1 - t0 + Math.PI, PI2) - Math.PI;
         this._targetTheta = clamp(t0 + delta, this.thetaMin, this.thetaMax);
         this._targetPhi = clamp(phi, this.phiMin, this.phiMax);
-        this._targetSpringLength = clamp(springLength, this.distanceMin, this.distanceMax);
+        this._targetRadius = clamp(radius, this.radiusMin, this.radiusMax);
         this._targetLookAt.copy(lookAt);
         this._targetOffset.copy(offset);
+        this._targetUp.copy(up);
         this._targetFov = fov;
         this._targetNear = near;
         this._targetFar = far;
@@ -3217,7 +3261,9 @@ class FreelookVirtualCamera extends Component {
     }
     update(dt) {
         this._lerpCamera(dt);
-        this._syncCamera();
+        if (this.sync) {
+            this._syncCamera();
+        }
     }
     _onPointerDown(e) {
         if (SystemInfo.isMobile) return;
@@ -3269,7 +3315,7 @@ class FreelookVirtualCamera extends Component {
     }
     _calculateDistanceScale(scale) {
         this._tempRotateSmoothing = this.rotateSmoothing;
-        if (this.forbidZ) {
+        if (this.forbitAll || this.forbidZ) {
             scale = 1;
         }
         return this._onDistanceScale(scale);
@@ -3278,10 +3324,10 @@ class FreelookVirtualCamera extends Component {
         this._tempRotateSmoothing = this.rotateSmoothing;
         out.copy(loc1).sub(loc0).multiplyScalar(this.rotateSpeed * 2 * Math.PI / this.viewer.height);
         out.y = -out.y;
-        if (this.forbidX) {
+        if (this.forbitAll || this.forbidX) {
             out.x = 0;
         }
-        if (this.forbidY) {
+        if (this.forbitAll || this.forbidY) {
             out.y = 0;
         }
         return out;
@@ -3289,10 +3335,10 @@ class FreelookVirtualCamera extends Component {
     _calculatePanDelta(out, loc0, loc1) {
         this._tempRotateSmoothing = this.rotateSmoothing;
         this._onCalculatePan(out, loc0, loc1);
-        if (this.forbidPanX) {
+        if (this.forbitAll || this.forbidPanX) {
             out.x = 0;
         }
-        if (this.forbidPanY) {
+        if (this.forbitAll || this.forbidPanY) {
             out.y = 0;
         }
         return out;
@@ -3301,7 +3347,7 @@ class FreelookVirtualCamera extends Component {
         const { xAxis, yAxis, posDelta } = FreelookVirtualCamera;
         xAxis.setFromMatrixColumn(this.node.matrix, 0);
         yAxis.setFromMatrixColumn(this.node.matrix, 1);
-        if (this.forbitPanOffsetY) {
+        if (this.forbitAll || this.forbitPanOffsetY) {
             yAxis.y = 0;
             yAxis.normalize();
         }
@@ -3324,11 +3370,11 @@ class FreelookVirtualCamera extends Component {
         this._targetPosition.y += panOffset.y;
     }
     _setTargetSpringLength(scale) {
-        this._targetSpringLength *= scale;
-        this._targetSpringLength = clamp(this._targetSpringLength, this.distanceMin, this.distanceMax);
+        this._targetRadius *= scale;
+        this._targetRadius = clamp(this._targetRadius, this.radiusMin, this.radiusMax);
     }
     constructor(){
-        super(), this._button = -1, this._touchID = -1, this._preLoc0 = new THREE.Vector2(), this._preLoc1 = new THREE.Vector2(), this._spherical = new THREE.Spherical(4, Math.PI / 2), this._lookAt = new THREE.Vector3(), this._offset = new THREE.Vector2(), this._fov = 45, this._near = 0.1, this._far = 1000, this._tempSmoothing = 6, this._tempRotateSmoothing = 8, this._targetPosition = new THREE.Vector3(), this._targetTheta = 0, this._targetPhi = 0, this._targetSpringLength = 4, this._targetFov = this._fov, this._targetNear = this._near, this._targetFar = this._far, this._targetLookAt = new THREE.Vector3(), this._targetOffset = new THREE.Vector2(), this._finalLookAt = new THREE.Vector3(), this.name = "FreelookVirtualCamera", this.forbidX = false, this.forbidY = false, this.forbidZ = false, this.forbidPanX = false, this.forbidPanY = false, this.forbitPanOffsetY = false, this.panSpeed = 1, this.rotateSpeed = 1, this.smoothing = 5, this.rotateSmoothing = 8, this.phiMin = ESP, this.phiMax = Math.PI - ESP, this.thetaMin = -Infinity, this.thetaMax = Infinity, this.distanceMin = ESP, this.distanceMax = Infinity;
+        super(), this._button = -1, this._touchID = -1, this._preLoc0 = new THREE.Vector2(), this._preLoc1 = new THREE.Vector2(), this._spherical = new THREE.Spherical(4, Math.PI / 2), this._lookAt = new THREE.Vector3(), this._up = new THREE.Vector3(0, 1, 0), this._offset = new THREE.Vector2(), this._fov = 45, this._near = 0.1, this._far = 1000, this._tempSmoothing = 6, this._tempRotateSmoothing = 8, this._targetPosition = new THREE.Vector3(), this._targetTheta = 0, this._targetPhi = 0, this._targetRadius = 4, this._targetFov = this._fov, this._targetNear = this._near, this._targetFar = this._far, this._targetLookAt = new THREE.Vector3(), this._targetOffset = new THREE.Vector2(), this._targetUp = new THREE.Vector3(0, 1, 0), this._finalLookAt = new THREE.Vector3(), this.name = "FreelookVirtualCamera", this.sync = true, this.forbitAll = false, this.forbidX = false, this.forbidY = false, this.forbidZ = false, this.forbidPanX = false, this.forbidPanY = false, this.forbitPanOffsetY = false, this.panSpeed = 1, this.rotateSpeed = 1, this.smoothing = 5, this.rotateSmoothing = 8, this.phiMin = ESP, this.phiMax = Math.PI - ESP, this.thetaMin = -Infinity, this.thetaMax = Infinity, this.radiusMin = ESP, this.radiusMax = Infinity;
         this.node = new THREE.Object3D();
         this.node.isCamera = true;
         this.onLoad = ()=>{
@@ -3371,10 +3417,12 @@ class FreelookVirtualCamera extends Component {
                     const rotateSmoothing = this._tempRotateSmoothing;
                     this._spherical.theta = FInterpTo(this._spherical.theta, this._targetTheta, dt, rotateSmoothing);
                     this._spherical.phi = FInterpTo(this._spherical.phi, this._targetPhi, dt, rotateSmoothing);
-                    this._spherical.radius = FInterpTo(this._spherical.radius, this._targetSpringLength, dt, smoothing);
+                    this._spherical.radius = FInterpTo(this._spherical.radius, this._targetRadius, dt, smoothing);
                     VInterpTo(this._lookAt, this._targetLookAt, dt, smoothing);
                     VInterpTo(this._offset, this._targetOffset, dt, smoothing);
+                    VInterpTo(this._up, this._targetUp, dt, smoothing);
                     this._calculateLookAtOffset(this._offset, this._finalLookAt).add(this._lookAt);
+                    this.node.up.copy(this._up);
                     this.node.position.setFromSpherical(this._spherical).add(this._finalLookAt);
                     this.node.lookAt(this._finalLookAt);
                     this._fov = FInterpTo(this._fov, this._targetFov, dt, smoothing);
@@ -3394,7 +3442,7 @@ class FreelookVirtualCamera extends Component {
                     }
                 };
             } else if (camera instanceof THREE.OrthographicCamera) {
-                this.springLength = camera.zoom;
+                this.radius = camera.zoom;
                 this._onDistanceScale = (scale)=>{
                     return 1 / scale;
                 };
@@ -3424,7 +3472,7 @@ class FreelookVirtualCamera extends Component {
                     const smoothing = this._tempSmoothing;
                     this.node.position.x = FInterpTo(this.node.position.x, this._targetPosition.x, dt, smoothing);
                     this.node.position.y = FInterpTo(this.node.position.y, this._targetPosition.y, dt, smoothing);
-                    this._spherical.radius = FInterpTo(this._spherical.radius, this._targetSpringLength, dt, smoothing);
+                    this._spherical.radius = FInterpTo(this._spherical.radius, this._targetRadius, dt, smoothing);
                 };
                 this._syncCamera = ()=>{
                     const { zoom } = camera;
@@ -3450,6 +3498,14 @@ FreelookVirtualCamera.lookAtOffset = new THREE.Vector3();
 FreelookVirtualCamera.xAxis = new THREE.Vector3();
 FreelookVirtualCamera.yAxis = new THREE.Vector3();
 FreelookVirtualCamera.quat = new THREE.Quaternion();
+__decorate([
+    property
+], FreelookVirtualCamera.prototype, "sync", void 0);
+__decorate([
+    property({
+        dir: "set"
+    })
+], FreelookVirtualCamera.prototype, "forbitAll", void 0);
 __decorate([
     property({
         dir: "set"
@@ -3533,24 +3589,33 @@ __decorate([
         dir: "set",
         step: 0.01
     })
-], FreelookVirtualCamera.prototype, "distanceMin", void 0);
+], FreelookVirtualCamera.prototype, "radiusMin", void 0);
 __decorate([
     property({
         dir: "set",
         step: 0.01
     })
-], FreelookVirtualCamera.prototype, "distanceMax", void 0);
+], FreelookVirtualCamera.prototype, "radiusMax", void 0);
 __decorate([
-    property
+    property({
+        step: 0.01
+    })
+], FreelookVirtualCamera.prototype, "up", null);
+__decorate([
+    property({
+        step: 0.01
+    })
 ], FreelookVirtualCamera.prototype, "lookAt", null);
 __decorate([
-    property
+    property({
+        step: 0.01
+    })
 ], FreelookVirtualCamera.prototype, "offset", null);
 __decorate([
     property({
         step: 0.01
     })
-], FreelookVirtualCamera.prototype, "springLength", null);
+], FreelookVirtualCamera.prototype, "radius", null);
 __decorate([
     property({
         step: 0.01
@@ -3934,6 +3999,12 @@ class ReflectorMaterial extends THREE.ShaderMaterial {
     set aoMap(v) {
         this.uniforms.aoMap.value = v;
     }
+    get aoMapIntensity() {
+        return this.uniforms.aoMapIntensity.value;
+    }
+    set aoMapIntensity(v) {
+        this.uniforms.aoMapIntensity.value = v;
+    }
     get lightMap() {
         return this.uniforms.lightMap.value;
     }
@@ -4012,14 +4083,17 @@ class ReflectorMaterial extends THREE.ShaderMaterial {
             },
             lightMapIntensity: {
                 value: 1
+            },
+            dfgLUT: {
+                value: null
             }
         };
         Object.defineProperty(this, "opacity", {
             get: ()=>this.uniforms.opacity.value,
             set: (v)=>this.uniforms.opacity.value = v
         });
-        this.uniforms.reflectMap.value = reflector.getRenderTarget().texture;
-        this.uniforms.textureMatrix.value = reflector.getTextureMatrix();
+        this.uniforms.reflectMap.value = reflector.texture;
+        this.uniforms.textureMatrix.value = reflector.textureMatrix;
         this.setValues(parameters);
     }
 }
@@ -4058,6 +4132,12 @@ __decorate([
 __decorate([
     property
 ], ReflectorMaterial.prototype, "aoMap", null);
+__decorate([
+    property({
+        min: 0,
+        max: 1
+    })
+], ReflectorMaterial.prototype, "aoMapIntensity", null);
 __decorate([
     property
 ], ReflectorMaterial.prototype, "lightMap", null);
@@ -4730,6 +4810,12 @@ class Viewer extends EventEmitter {
     get renderer() {
         return this._renderer;
     }
+    get freeze() {
+        return this._freeze;
+    }
+    set freeze(v) {
+        this._freeze = v;
+    }
     destroy() {
         this.stop();
         this._renderer.dispose();
@@ -4751,44 +4837,43 @@ class Viewer extends EventEmitter {
             };
         }
     }
-    _frame(time) {
-        this._time = time;
-        if (this._targetFrameRate > -1) {
-            const interval = 1 / this._targetFrameRate;
-            const delta = this._time - this._lastFrameTime;
-            if (delta >= interval) {
-                this.loop(this._fixedFrameTime ? interval : this._time - this._lastTime);
-                this._lastTime = this._time;
-                this._lastFrameTime = this._time - delta % interval;
+    animate() {
+        const loop = (dt)=>{
+            if (!this._active) return;
+            if (this._resourceManager.isComplete) {
+                this._taskManager.isComplete ? this._running = true : this._taskManager.update();
             }
-        } else {
-            this.loop(this._time - this._lastTime);
-            this._lastTime = this._time;
-        }
-    }
-    loop(dt) {
-        if (this._resourceManager.isComplete) {
-            this._taskManager.update();
-            if (this._taskManager.isComplete) {
-                this._running = true;
+            if (this._running) {
+                dt = Math.min(dt, 0.067);
+                this._renderer.info.reset();
+                this._componentManager.update(dt);
+                if (!this._freeze) {
+                    this._componentManager.render(dt);
+                }
             }
-        }
-        if (this._running) {
-            dt = Math.min(dt, 0.067);
-            this._renderer.info.reset();
-            this._componentManager.update(dt);
-            this._componentManager.render(dt);
-        }
+        };
+        const frame = (time)=>{
+            this._time = time * 0.001;
+            if (this._targetFrameRate > -1) {
+                const interval = 1 / this._targetFrameRate;
+                const delta = this._time - this._lastFrameTime;
+                if (delta >= interval) {
+                    loop(this._fixedFrameTime ? interval : this._time - this._lastTime);
+                    this._lastTime = this._time;
+                    this._lastFrameTime = this._time - delta % interval;
+                }
+            } else {
+                loop(this._time - this._lastTime);
+                this._lastTime = this._time;
+            }
+        };
+        this._renderer.setAnimationLoop(frame);
     }
     start() {
-        if (this._active == false) {
+        if (this._active === false) {
             this._active = true;
-            const frameCallback = (time)=>{
-                if (this._active) {
-                    this._frame(time * 0.001);
-                }
-            };
-            this._renderer.setAnimationLoop(frameCallback);
+            this.rotate();
+            this.resize();
         }
         return this;
     }
@@ -4903,7 +4988,7 @@ class Viewer extends EventEmitter {
         this._taskManager.add(new Task(excute));
         return target;
     }
-    add(object, { node, args, scale, parent, position, rotation, manual, makeDefault, component, layerMask, ...props } = {}) {
+    add(object, { node, args, scale, parent, position, rotation, manual, makeDefault, component, layerMask, children, ...props } = {}) {
         let mount = false;
         let ins = getClassInstance(object, args);
         if (ins.isObject3D) {
@@ -4928,7 +5013,7 @@ class Viewer extends EventEmitter {
         if (parent === undefined) {
             parent = mount ? this._mount : this._scene;
         }
-        if (parent && !node.parent) {
+        if (parent !== node) {
             parent.add(node);
         }
         if (component) {
@@ -4939,6 +5024,12 @@ class Viewer extends EventEmitter {
                 this._componentManager.addComponent(node, comp);
             }
         }
+        if (children) {
+            const children_ = Array.isArray(children) ? children : [
+                children
+            ];
+            node.add(...children_);
+        }
         if (layerMask) {
             node.layers.mask = layerMask;
         }
@@ -5148,10 +5239,10 @@ class Viewer extends EventEmitter {
             width: 1,
             height: 1,
             factor: 1
-        }, this._active = false, this._loading = false, this._tasking = false, this._running = false, this._rootRotated = false, this._time = 0, this._lastTime = 0, this._lastFrameTime = 0, this._targetFrameRate = -1, this._fixedFrameTime = false, this._windowSize = ()=>[
+        }, this._active = false, this._running = false, this._rootRotated = false, this._time = 0, this._lastTime = 0, this._lastFrameTime = 0, this._targetFrameRate = -1, this._fixedFrameTime = false, this._windowSize = ()=>[
                 window.innerWidth,
                 window.innerHeight
-            ], this._orientation = Orientation.AUTO;
+            ], this._orientation = Orientation.AUTO, this._freeze = false;
         const el = canvas || document.getElementById("canvas");
         const webgl = checkWebGL(el, webglOpts);
         if (!webgl) {
@@ -5206,11 +5297,9 @@ class Viewer extends EventEmitter {
         this.addLoader(BINLoader);
         this.addLoader(SVGLoader);
         this.addLoader(KTX2Loader);
-        setTimeout(()=>{
-            this.rotate();
-            this.resize();
-            this.start();
-        });
+        this.rotate();
+        this.resize();
+        this.animate();
     }
 }
 Viewer.instanceCount = 0;
@@ -5290,8 +5379,6 @@ class MergeRefectPass {
             this._cubeMapMaterial = _getCubeMapMaterial();
             this._copyTexMaterial = _getClearMaterial();
             this._copyMesh = new THREE.Mesh(Viewer.fullscreenMesh.geometry, this._copyTexMaterial);
-            this._lodMeshes = this._lodPlanes.map((v)=>new THREE.Mesh(v, this._cubeMapMaterial));
-            this._sourceInit = false;
             return target;
         };
         pmremGenerator._fromCubeTexture = function(texture) {
@@ -5422,7 +5509,6 @@ class MergeMipBlurPass {
             const target = this._allocateTargets();
             this._mipBlurMaterial = _getMipBlurMaterial(this._lodMax, target.width, target.height);
             this._mipCopyMaterial = _getMipCopyMaterial(this._lodMax, target.width, target.height);
-            this._lodMeshes = this._lodPlanes.map((v)=>new THREE.Mesh(v, this._mipBlurMaterial));
             return target;
         };
         pmremGenerator._applyMipBlur = function(sourceTarget, texture, blurMinLod, blurMaxLod, sigma, exposure = 1) {
@@ -5623,7 +5709,7 @@ class BoxProjection extends Component {
             `);
         THREE.ShaderLib.physical.fragmentShader = THREE.ShaderLib.physical.fragmentShader.replace("varying vec3 vViewPosition;", `
             varying vec3 vViewPosition;
-            #if defined(USE_BOX_PROJECTION)
+            #if defined(USE_TRANSMISSION) || defined(USE_BOX_PROJECTION)
             varying vec3 vWorldPosition;
             #endif
             `);
@@ -5663,7 +5749,6 @@ class BoxProjection extends Component {
                 worldNormal = boxProjection(worldNormal, vWorldPosition, probePos.xyz, probeBoxMin.xyz, probeBoxMax.xyz);
             }
             #endif
-
             `);
     }
     useBoxProjection(shader) {
@@ -6503,6 +6588,9 @@ void main() {
 
     color.a *= u_opacity;
     gl_FragColor = color;
+
+    #include <tonemapping_fragment>
+	#include <colorspace_fragment>
 }
 `;
 class BMFontAtlas {
@@ -6584,13 +6672,13 @@ class BMFontAtlas {
                 value: 0.2
             },
             u_strokeColor: {
-                value: new THREE.Color(0xff0000)
+                value: new THREE.Color(0xffffff)
             },
             u_strokeWidth: {
                 value: 0
             },
             u_shadowColor: {
-                value: new THREE.Color(0xff0000)
+                value: new THREE.Color(0xffffff)
             },
             u_shadowBlur: {
                 value: 0
@@ -6701,6 +6789,7 @@ exports.mixin = mixin;
 exports.property = property;
 exports.quarticDamp = quarticDamp;
 exports.queryValues = queryValues;
+exports.single = single;
 exports.smoothDamp = smoothDamp;
 exports.vert_fullscreen = vert_fullscreen;
 //# sourceMappingURL=main.cjs.map