@earthview/core 0.2.5 → 0.2.7

package/dist/index.mjs

@@ -23134,13 +23134,14 @@ class dm {
             bottom: 0;
             background: transparent;
             z-index: 10000;
+            pointer-events: auto;
         `, t.onclick = (e) => {
       e.stopPropagation(), this.options.onCancel(), this.destroy();
     }, t;
   }
   createElement() {
     const t = this.options.theme === "dark", e = document.createElement("div");
-    e.className = "text-input-modal-container", e.style.cssText = `
+    e.style.userSelect = "none", e.className = "text-input-modal-container", e.style.cssText = `
             position: fixed;
             z-index: 10001;
             width: 280px;
@@ -23163,6 +23164,7 @@ class dm {
             padding: 8px 12px;
             border-bottom: 1px solid ${t ? "#3d3d3d" : "#eee"};
             background: ${t ? "#252525" : "#f5f5f5"};
+            user-select: none;
         `;
     const i = document.createElement("span");
     return i.style.cssText = `
@@ -23562,10 +23564,11 @@ class um extends Lt {
         },
         onDelete: n,
         theme: this.currentTheme,
-        t: c
+        t: c,
+        container: this.mapView?.getTargetElement()
       },
       { x: l, y: h }
-    );
+    ), this.textInputModal.getElement().style.userSelect = "none";
   }
   hideTextInputModal() {
     this.textInputModal && (this.textInputModal.destroy(), this.textInputModal = null), this.isInputActive = !1;
@@ -31384,23 +31387,33 @@ class ar extends Lt {
       duration: 300
     }), n && n.onClick && n.onClick(n, e);
     const a = t.getProperties(), l = a.bubbleBoxCoverImage && a.bubbleBoxCoverImage.trim() !== "", h = a.bubbleBoxTitle && a.bubbleBoxTitle.trim() !== "", c = a.bubbleBoxDescription && a.bubbleBoxDescription.trim() !== "", u = (document.body.getAttribute("data-theme") || "dark") === "dark", f = u ? "#1e1e1e" : "#ffffff", g = u ? "#333" : "#e0e0e0", p = u ? "#fff" : "#333", m = u ? "#aaa" : "#666", y = document.createElement("div");
-    y.style.position = "absolute", y.style.zIndex = "10000", y.style.background = f, y.style.border = `1px solid ${g}`, y.style.borderRadius = "8px", y.style.boxShadow = "0 4px 12px rgba(0,0,0,0.3)", y.style.width = `${this.popupWidth}px`, y.style.maxWidth = `${this.popupWidth}px`, y.style.overflow = "hidden";
+    y.style.position = "absolute", y.style.zIndex = "10000", y.style.background = f, y.style.border = `1px solid ${g}`, y.style.borderRadius = "8px", y.style.boxShadow = "0 4px 12px rgba(0,0,0,0.3)", y.style.width = `${this.popupWidth}px`, y.style.maxWidth = `${this.popupWidth}px`, y.style.overflow = "hidden", y.style.userSelect = "none";
     let x = "";
     l && (x += `<div style="height: ${this.coverImageHeight}px; overflow: hidden;">
-                    <img src="${a.bubbleBoxCoverImage}" style="width: 100%; height: 100%; object-fit: cover;" />
-                </div>`), x += '<div style="padding: 12px;">', h && (x += `<div style="font-size: 14px; font-weight: 600; color: ${p}; margin-bottom: 8px;">${a.bubbleBoxTitle}</div>`), c && (x += `<div style="font-size: 12px; color: ${m}; line-height: 1.5;">${a.bubbleBoxDescription}</div>`), x += "</div>", y.innerHTML = x;
-    const E = this.view.getTargetElement();
-    getComputedStyle(E).position === "static" && (E.style.position = "relative"), E.appendChild(y);
-    const w = t.getGeometry(), C = this.view.getPixelFromCoordinate(w.getCoordinates()), v = E.getBoundingClientRect(), _ = y.offsetWidth, b = y.offsetHeight;
-    if (!(C[0] >= 0 && C[0] <= v.width && C[1] >= 0 && C[1] <= v.height)) {
-      y.style.display = "none", this.currentPopup = y;
-      return;
-    }
-    let P = C[0] - v.left - _ / 2, L = C[1] - v.top - b - 15;
-    L < 5 && (L = C[1] - v.top + 15), P = Math.max(5, Math.min(P, v.width - _ - 5)), L = Math.max(5, Math.min(L, v.height - b - 5)), y.style.left = `${P}px`, y.style.top = `${L}px`, y.style.display = "block", this.currentPopup = y;
+            <img src="${a.bubbleBoxCoverImage}" style="width: 100%; height: 100%; object-fit: cover;" />
+        </div>`), x += '<div style="padding: 12px;">', h && (x += `<div style="font-size: 14px; font-weight: 600; color: ${p}; margin-bottom: 8px;">${this.escapeHtml(a.bubbleBoxTitle)}</div>`), c && (x += `<div style="font-size: 12px; color: ${m}; line-height: 1.5;">${this.escapeHtml(a.bubbleBoxDescription)}</div>`), x += "</div>", y.innerHTML = x;
+    const E = t.getGeometry(), w = this.view.getPixelFromCoordinate(E.getCoordinates()), C = this.view.getTargetElement(), v = C.getBoundingClientRect(), _ = y.offsetWidth, b = y.offsetHeight;
+    let S = w[0] - v.left - _ / 2, P = w[1] - v.top - b - 15 + 45;
+    S = Math.max(10, Math.min(S, v.width - _ - 10)), P = Math.max(10, Math.min(P, v.height - b - 10)), y.style.left = `${S}px`, y.style.top = `${P}px`, getComputedStyle(C).position === "static" && (C.style.position = "relative"), C.appendChild(y), this.currentPopup = y;
+  }
+  updatePopupPosition() {
+    !this.currentPopup || !this.currentFeature || (this.updateFrame && cancelAnimationFrame(this.updateFrame), this.updateFrame = requestAnimationFrame(() => {
+      if (!this.currentPopup || !this.currentFeature) return;
+      const t = this.currentFeature.getGeometry(), e = this.view.getPixelFromCoordinate(t.getCoordinates()), n = this.view.getTargetElement().getBoundingClientRect(), r = this.currentPopup.offsetWidth, o = this.currentPopup.offsetHeight;
+      let a = e[0] - n.left - r / 2, l = e[1] - n.top - o - 15 + 45;
+      if (a = Math.max(10, Math.min(a, n.width - r - 10)), l = Math.max(10, Math.min(l, n.height - o - 10)), !(e[0] >= 0 && e[0] <= n.width && e[1] >= 0 && e[1] <= n.height)) {
+        this.currentPopup.style.display = "none";
+        return;
+      }
+      this.currentPopup.style.display = "block", this.currentPopup.style.left = `${a}px`, this.currentPopup.style.top = `${l}px`;
+    }));
+  }
+  escapeHtml(t) {
+    const e = document.createElement("div");
+    return e.textContent = t, e.innerHTML;
   }
   hidePopup() {
-    this.currentPopup && (this.currentPopup.remove(), this.currentPopup = null), this.currentFeature = null;
+    this.currentPopup && (this.currentPopup.parentNode && this.currentPopup.parentNode.removeChild(this.currentPopup), this.currentPopup = null), this.currentFeature = null;
   }
   clearAllMarkers() {
     this.animationFrames.forEach((t, e) => {
@@ -31419,19 +31432,6 @@ class ar extends Lt {
   updateData(t) {
     t.markers && (this.clearAllMarkers(), t.markers.forEach((e) => this.addMarker(e)));
   }
-  updatePopupPosition() {
-    !this.currentPopup || !this.currentFeature || (this.updateFrame && cancelAnimationFrame(this.updateFrame), this.updateFrame = requestAnimationFrame(() => {
-      if (!this.currentPopup || !this.currentFeature) return;
-      const t = this.currentFeature.getGeometry(), e = this.view.getPixelFromCoordinate(t.getCoordinates()), n = this.view.getTargetElement().getBoundingClientRect(), r = this.currentPopup.offsetWidth, o = this.currentPopup.offsetHeight;
-      if (!(e[0] >= 0 && e[0] <= n.width && e[1] >= 0 && e[1] <= n.height)) {
-        this.currentPopup.style.display = "none";
-        return;
-      }
-      this.currentPopup.style.display = "block";
-      let l = e[0] - n.left - r / 2, h = e[1] - n.top - o - 15;
-      l = Math.max(5, Math.min(l, n.width - r - 5)), h = Math.max(5, Math.min(h, n.height - o - 5)), this.currentPopup.style.left = `${l}px`, this.currentPopup.style.top = `${h}px`;
-    }));
-  }
   destroy() {
     this.animationFrames.forEach((t, e) => {
       this.stopAnimation(e);
@@ -33095,6 +33095,7 @@ class e_ {
         border-radius: 8px;
         padding: 4px;
         backdrop-filter: blur(4px);
+        user-select: none;
     `, this.scrollUpBtn = this.createScrollButton("▲", this.options.t.topScroll || "Top Scroll"), e.appendChild(this.scrollUpBtn), this.scrollUpBtn.style.display = "none";
     const i = document.createElement("div");
     i.className = "toolbar-scroll-container", i.style.cssText = `
@@ -33306,6 +33307,7 @@ class lr {
         overflow: hidden;
         display: flex;
         flex-direction: column;
+        user-select: none; 
     `;
     let n = 328;
     if (this.element?.parentElement) {
@@ -33335,6 +33337,7 @@ class lr {
             padding: 2px 10px;
             border-bottom: 1px solid ${t ? "#333" : "#e0e0e0"};
             background: ${t ? "#2d2d2d" : "#f5f5f5"};
+            user-select: none;
         `;
     const o = document.createElement("span");
     o.style.cssText = `color: ${t ? "#fff" : "#333"}; font-size: 12px; font-weight: 500;`, o.textContent = this.options.title, r.appendChild(o);
@@ -33429,6 +33432,7 @@ class i_ {
     return t.style.cssText = `
             width: 100%;
             height: 100%;
+            user-select: none; 
         `, t;
   }
   isSystemLayer(t) {
@@ -33568,6 +33572,7 @@ class i_ {
             border-left: ${n ? "3px solid #00aaff" : "3px solid transparent"};
             transition: all 0.2s;
             border-bottom: 1px solid ${r ? "#333" : "#eee"};
+            user-select: none;
         `, a.onmouseenter = () => {
       n || (a.style.background = r ? "#2a2a2a" : "#f5f5f5");
     }, a.onmouseleave = () => {
@@ -33686,6 +33691,7 @@ class i_ {
         background: ${i ? "#2d2d2d" : "#f5f5f5"};
         border-bottom: 1px solid ${i ? "#333" : "#e0e0e0"};
         flex-shrink: 0;
+        user-select: none;
     `;
     const d = document.createElement("span");
     d.style.cssText = `color: ${i ? "#fff" : "#333"}; font-size: 12px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1;`, d.textContent = `${e} - ${this.options.t.coordinateData || "coordinateData"}`, c.appendChild(d);
@@ -33850,6 +33856,7 @@ class i_ {
         background: ${i ? "#2d2d2d" : "#f5f5f5"};
         border-bottom: 1px solid ${i ? "#444" : "#ddd"};
         flex-shrink: 0;
+        user-select: none;
     `;
     const g = document.createElement("span");
     g.style.cssText = `color: ${i ? "#fff" : "#333"}; font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1;`, g.textContent = this.options.t.details || "details", f.appendChild(g);
@@ -34031,6 +34038,7 @@ class n_ {
     return t.style.cssText = `
             width: 100%;
             height: 100%;
+            user-select: none;
         `, t;
   }
   render() {
@@ -34086,6 +34094,7 @@ class s_ {
     return t.style.cssText = `
             width: 100%;
             height: 100%;
+            user-select: none;
         `, t;
   }
   render() {
@@ -34216,6 +34225,7 @@ class r_ {
     return t.style.cssText = `
             width: 100%;
             height: 100%;
+            user-select: none; 
         `, t;
   }
   render() {
@@ -34361,6 +34371,7 @@ class ke {
             backdrop-filter: blur(8px);
             box-shadow: 0 4px 12px rgba(0,0,0,0.3);
             cursor: default;
+            user-select: none; 
         `;
     const i = `
             width: 28px;
@@ -34697,6 +34708,7 @@ class o_ {
             backdrop-filter: blur(8px);
             box-shadow: 0 4px 12px rgba(0,0,0,0.3);
             cursor: default;
+            user-select: none;
         `;
     const i = `
             width: 28px;
@@ -34792,6 +34804,7 @@ class a_ {
             color: ${t ? "#fff" : "#333"};
             pointer-events: none;
             border: 1px solid ${t ? "rgba(255,255,255,0.1)" : "rgba(0,0,0,0.1)"};
+            user-select: none;
         `, e.textContent = "", e;
   }
   updateScale(t) {
@@ -34827,6 +34840,7 @@ class l_ {
             flex-direction: column;
             gap: 12px;
             display: none;
+            user-select: none;
         `, this.spinner = document.createElement("div"), this.spinner.className = "loading-spinner", this.spinner.style.cssText = `
             width: 40px;
             height: 40px;
@@ -34884,6 +34898,7 @@ class h_ {
             overflow: hidden;
             display: flex;
             flex-direction: column;
+            user-select: none; 
         `, e;
   }
   getPointData() {
@@ -34930,6 +34945,7 @@ class h_ {
             border-bottom: 1px solid ${t ? "#333" : "#e0e0e0"};
             background: ${t ? "#2d2d2d" : "#f5f5f5"};
             flex-shrink: 0;
+            user-select: none;
         `;
     const i = document.createElement("span");
     i.style.cssText = `color: ${t ? "#fff" : "#333"}; font-size: 12px; font-weight: 500;`, i.textContent = this.options.t.coordinateData, e.appendChild(i);
@@ -35091,6 +35107,7 @@ class h_ {
         background: ${i ? "#2d2d2d" : "#f5f5f5"};
         border-bottom: 1px solid ${i ? "#444" : "#ddd"};
         flex-shrink: 0;
+        user-select: none;
     `;
     const g = document.createElement("span");
     g.style.cssText = `color: ${i ? "#fff" : "#333"}; font-size: 13px; font-weight: 600;`, g.textContent = this.options.t.details, f.appendChild(g);
@@ -37719,7 +37736,7 @@ class G_ {
           theme: this.theme,
           t: this.t,
           onClose: () => {
-            this.handleTogglePopup(null), this.callbacks.onClearMeasurements();
+            this.handleTogglePopup(null);
           }
         });
         const n = new r_({
@@ -38280,7 +38297,7 @@ class X_ {
   }
   createElement() {
     const t = this.options.theme === "dark", e = document.createElement("div");
-    e.className = "image-input-modal-container", e.style.cssText = `
+    e.className = "image-input-modal-container", e.style.userSelect = "none", e.style.cssText = `
             position: fixed;
             z-index: 10001;
             width: 300px;
@@ -38309,6 +38326,7 @@ class X_ {
             padding: 8px 12px;
             border-bottom: 1px solid ${t ? "#3d3d3d" : "#eee"};
             background: ${t ? "#252525" : "#f5f5f5"};
+            user-select: none;
         `;
     const i = document.createElement("span");
     return i.style.cssText = `
@@ -38688,10 +38706,11 @@ class j_ extends Lt {
         },
         onDelete: n,
         theme: this.currentTheme,
-        t: c
+        t: c,
+        container: this.mapView?.getTargetElement()
       },
       { x: l, y: h }
-    );
+    ), this.imageInputModal.getElement().style.userSelect = "none";
   }
   hideImageInputModal() {
     this.imageInputModal && (this.imageInputModal.destroy(), this.imageInputModal = null), this.isInputActive = !1;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@earthview/core",
-  "version": "0.2.5",
+  "version": "0.2.7",
   "description": "A reliable geographic information graphics system developed based on OpenLayers.",
   "author": "happyboy",
   "license": "AGPL-3.0-only",