shop-components 0.1.62 → 0.1.64

package/dist/device-viewer/libs/gizmo/gizmo.d.ts

@@ -54,8 +54,11 @@ export declare class OrbitControlsGizmo {
     _emitter: EventEmitter<string | symbol, any>;
     addListener: <T extends string | symbol>(event: T, fn: (...args: any[]) => void, context?: any) => EventEmitter<string | symbol, any>;
     removeAllListeners: (event?: string | symbol | undefined) => EventEmitter<string | symbol, any>;
+    private _text;
+    private _textTimer;
     constructor(orbitControls: OrbitControls, options: OrbitControlsGizmoProps);
-    private update;
+    appendTo(parent: HTMLElement): void;
+    private _update;
     private createAxes;
     private createCanvas;
     private onPointerDown;

package/dist/shop-components.mjs

@@ -65027,10 +65027,12 @@ class OF {
 }
 class qF {
   constructor(A, e) {
-    this.lock = !1, this.lockX = !1, this.lockY = !1, this.invRotMat = new zA(), this.mouse = new L(), this.rotateStart = new uA(), this.rotateEnd = new uA(), this.rotateDelta = new uA(), this.selectedAxis = null, this.isDragging = !1, this.context = null, this.orbitState = !0, this._animator = 0, this._emitter = new ar(), this.addListener = this._emitter.addListener.bind(this._emitter), this.removeAllListeners = this._emitter.removeAllListeners.bind(this._emitter), this.update = () => {
-      this.lock || (this.camera.updateMatrix(), this.invRotMat.extractRotation(this.camera.matrix).invert(), this.axes.forEach((i) => {
+    this.lock = !1, this.lockX = !1, this.lockY = !1, this.invRotMat = new zA(), this.mouse = new L(), this.rotateStart = new uA(), this.rotateEnd = new uA(), this.rotateDelta = new uA(), this.selectedAxis = null, this.isDragging = !1, this.context = null, this.orbitState = !0, this._animator = 0, this._emitter = new ar(), this.addListener = this._emitter.addListener.bind(this._emitter), this.removeAllListeners = this._emitter.removeAllListeners.bind(this._emitter), this._text = document.createElement("div"), this._textTimer = 0, this._update = () => {
+      this.lock || (this._textTimer && (window.clearTimeout(this._textTimer), this._textTimer = 0), this._textTimer = window.setTimeout(() => {
+        this._text.style.opacity = "0";
+      }, 800), this.camera.updateMatrix(), this.invRotMat.extractRotation(this.camera.matrix).invert(), this.axes.forEach((i) => {
         this.setAxisPosition(i);
-      }), this.axes.sort((i, r) => i.position.z > r.position.z ? 1 : -1), this.drawLayers(!0));
+      }), this.axes.sort((i, r) => i.position.z > r.position.z ? 1 : -1), this.drawLayers(!0), this._text.style.opacity = "1", this._text.innerText = this.camera.position.distanceTo(this.orbit.target).toFixed(2) + " m");
     }, this.onPointerDown = (i) => {
       this.rotateStart.set(i.clientX, i.clientY), this.orbitState = this.orbit.enabled, this.orbit.enabled = !1, window.addEventListener("pointermove", this.onDrag, !1), window.addEventListener("pointerup", this.onPointerUp, !1);
     }, this.onPointerUp = () => {
@@ -65110,7 +65112,20 @@ class qF {
     this.options = {
       ...t,
       ...e
-    }, this.orbit = A, this.camera = A.object, this.center = new L(this.options.size / 2, this.options.size / 2, 0), this.axes = this.createAxes(), this.domElement = this.createCanvas(this.options), this.orbit.addEventListener("change", this.update), this.orbit.addEventListener("start", () => this.domElement.classList.add("inactive")), this.orbit.addEventListener("end", () => this.domElement.classList.remove("inactive")), document.body.appendChild(this.domElement);
+    }, console.log(this.options), this.orbit = A, this.camera = A.object, this.center = new L(this.options.size / 2, this.options.size / 2, 0), this.axes = this.createAxes(), this.domElement = this.createCanvas(this.options), this.orbit.addEventListener("change", this._update), this._text.style.cssText = `
+      transition: all 0.8s ease-in-out;
+      color: rgb(68, 78, 105);
+      position: absolute;
+      right: ${this.options.offset.x + this.options.size / 4}px;
+      top: ${this.options.offset.y + this.options.size / 2 + 2}px;
+      width: ${this.options.size / 2}px;
+      margin-right: ${-this.options.size / 4}px;
+      font-size: 12px;
+      text-align:center;
+    `;
+  }
+  appendTo(A) {
+    A.append(this.domElement), A.append(this._text);
   }
   createAxes() {
     const {
@@ -65188,7 +65203,7 @@ class qF {
     `, e.addEventListener("pointerdown", this.onPointerDown, !1), e.addEventListener("pointerenter", this.onPointerEnter, !1), e.addEventListener("pointermove", this.onPointerMove, !1), e.addEventListener("click", this.onMouseClick, !1), this.context = e.getContext("2d"), e;
   }
   destroy() {
-    cancelAnimationFrame(this._animator), this.orbit.enabled = this.orbitState, window.removeEventListener("pointermove", this.onDrag, !1), window.removeEventListener("pointerup", this.onPointerUp, !1), this._emitter.removeAllListeners(), this.domElement.addEventListener("pointerdown", this.onPointerDown, !1), this.domElement.addEventListener("pointerenter", this.onPointerEnter, !1), this.domElement.addEventListener("pointermove", this.onPointerMove, !1), this.domElement.addEventListener("click", this.onMouseClick, !1), this.domElement.remove();
+    cancelAnimationFrame(this._animator), this.orbit.removeEventListener("change", this._update), this.orbit.enabled = this.orbitState, window.removeEventListener("pointermove", this.onDrag, !1), window.removeEventListener("pointerup", this.onPointerUp, !1), this._emitter.removeAllListeners(), this.domElement.addEventListener("pointerdown", this.onPointerDown, !1), this.domElement.addEventListener("pointerenter", this.onPointerEnter, !1), this.domElement.addEventListener("pointermove", this.onPointerMove, !1), this.domElement.addEventListener("click", this.onMouseClick, !1), this.domElement.remove(), window.clearTimeout(this._textTimer), this._text.remove();
   }
 }
 const NF = new OF(), rH = new kO(_R);
@@ -65250,7 +65265,7 @@ class sH {
       let { top: r, left: s } = this.renderer.domElement.getBoundingClientRect();
       this.offset.set(s, r), this.mousePos.set(i.clientX - s, i.clientY - r), this.mouseCoord.set(
         (i.clientX - s) / this.size.x * 2 - 1,
-        -((i.clientY - r) / window.innerHeight) * 2 + 1
+        -((i.clientY - r) / this.size.y) * 2 + 1
       ), this._raycaster.setFromCamera(this.mouseCoord, this.camera);
     }, this._pointerdown = (i) => {
       const r = () => {
@@ -65330,7 +65345,7 @@ class sH {
     let t = window.devicePixelRatio;
     t < 2 && (t = 2), this.pathTracer.renderScale = t, this.pathTracer.bounces = 10, this.pathTracer.transmissiveBounces = 3, this.pathTracer.tiles.set(e, e), this.pathTracer.fadeDuration = 0, this.pathTracer.setBVHWorker(new vF()), this.orthographicCamera.left = -20, this.orthographicCamera.right = 20, this.orthographicCamera.top = -20, this.orthographicCamera.bottom = 20, this.controls.addEventListener("change", () => {
       var i;
-      this.sampleCount = 0, this.orthographicCamera.position.copy(this.camera.position), this.orthographicCamera.lookAt(this.controls.target), this.usePathTracing && (this.pathTracer.pausePathTracing = !1, (i = this.pathTracer) == null || i.updateCamera()), this._updateCamera(), this._axisMoving || (this.mainCamera = this.camera);
+      this.sampleCount = 0, this.orthographicCamera.position.copy(this.camera.position), this.orthographicCamera.lookAt(this.controls.target), this.usePathTracing && (this.pathTracer.pausePathTracing = !1, (i = this.pathTracer) == null || i.updateCamera()), this._updateCamera(), !(Math.abs(this.camera.position.x) < 1e-3 || Math.abs(this.camera.position.z) < 1e-3) && (this._axisMoving || (this.mainCamera = this.camera));
     }), this.mainCamera = this.camera, this._composer = new zO(this.renderer), this._composer.setPixelRatio(window.devicePixelRatio), this._composer.addPass(new jE(this.scene, this.camera)), this._composer.addPass(new YE()), this._outlinePass = new Zn(new uA(window.innerWidth, window.innerHeight), this.scene, this.camera), this._outlinePass.visibleEdgeColor.set(26367), this._outlinePass.edgeThickness = 0.5, this._outlinePass.hiddenEdgeColor.set(26367), this._outlinePass.edgeStrength = 3, this._outlinePass.edgeGlow = 0, this._composer.addPass(this._outlinePass), this._outlinePassError = new Zn(new uA(window.innerWidth, window.innerHeight), this.scene, this.camera), this._outlinePassError.visibleEdgeColor.set(16711680), this._outlinePassError.edgeThickness = 0.5, this._outlinePassError.hiddenEdgeColor.set(16711680), this._outlinePassError.edgeStrength = 3, this._outlinePassError.edgeGlow = 0, this._composer.addPass(this._outlinePassError), this._composer.renderTarget1.texture.colorSpace = ke, this._composer.renderTarget2.texture.colorSpace = ke, this._fxaaPass = new Z2(KE), this._composer.addPass(this._fxaaPass), this._container.add(this.amr), this.scene.add(this._container), this.ticker(), this._loadEnv(), this._initEvents(), this._ground.rotateX(-Math.PI / 2), this.scene.add(this._ground), (typeof A.useAxisBall != "boolean" || A.useAxisBall) && (this._controlsGizmo = new qF(this.controls, {
       size: 160,
       padding: 12,
@@ -65363,7 +65378,7 @@ class sH {
     this.stats.dom.style.display = "none";
   }
   _updateCamera() {
-    const A = this.mainCamera.position.distanceTo(this.controls.target), e = 2 * Math.tan(this.camera.fov * 0.5 * Math.PI / 180) * A, t = window.innerWidth / window.innerHeight;
+    const A = this.mainCamera.position.distanceTo(this.controls.target), e = 2 * Math.tan(this.camera.fov * 0.5 * Math.PI / 180) * A, t = this.size.x / this.size.y;
     this.orthographicCamera.left = -e * t / 2, this.orthographicCamera.right = e * t / 2, this.orthographicCamera.top = e / 2, this.orthographicCamera.bottom = -e / 2, this.orthographicCamera.updateProjectionMatrix();
   }
   _loadEnv() {
@@ -65448,7 +65463,7 @@ class sH {
     typeof A == "string" || (Array.isArray(A) ? this._outlinePass.selectedObjects = [...A] : this._outlinePass.selectedObjects = [A]);
   }
   appendTo(A) {
-    A.append(this.renderer.domElement), A.append(this.stats.dom), A.append(this.lines), A.append(this.css2dRenderer.domElement), this._controlsGizmo && A.append(this._controlsGizmo.domElement), this.stats.dom.style.bottom = "0", this.stats.dom.style.top = "auto", this.resize(), this._resizeObserver = new ResizeObserver(this.resize.bind(this)), this._resizeObserver.observe(A);
+    A.append(this.renderer.domElement), A.append(this.stats.dom), A.append(this.lines), A.append(this.css2dRenderer.domElement), this._controlsGizmo && this._controlsGizmo.appendTo(A), this.stats.dom.style.bottom = "0", this.stats.dom.style.top = "auto", this.resize(), this._resizeObserver = new ResizeObserver(this.resize.bind(this)), this._resizeObserver.observe(A);
   }
   add(A) {
     this._container.add(A);