@trailstash/ultra 3.8.7 → 3.9.0

package/components/ultra-map.js

@@ -46,6 +46,7 @@ export class UltraMap extends HTMLElement {
     mapStyle:
       "https://trailstash.github.io/naturalearthtiles/maps/natural_earth.vector.json",
     popupTemplate: null,
+    popupOnHover: false,
     querySources: ["ultra"],
     options: {},
     controls: [],
@@ -63,6 +64,7 @@ export class UltraMap extends HTMLElement {
   mapStyle = UltraMap.defaults.mapStyle;
 
   popupTemplate = UltraMap.defaults.popupTemplate;
+  popupOnHover = UltraMap.defaults.popupOnHover;
   querySources = UltraMap.defaults.querySources;
 
   options = UltraMap.defaults.options;
@@ -85,6 +87,7 @@ export class UltraMap extends HTMLElement {
     "type",
     "server",
     "popupTemplate",
+    "popupOnHover",
     "querySources",
     "query",
     "fitBounds",
@@ -97,6 +100,7 @@ export class UltraMap extends HTMLElement {
     "type",
     "server",
     "popupTemplate",
+    "popupOnHover",
     "querySources",
     "query",
     "fitBounds",
@@ -208,7 +212,13 @@ export class UltraMap extends HTMLElement {
       ),
     );
     this.refs.mapLibre.map.on("mousemove", (e) =>
-      handleMouseMove(e, this.#popupTemplate, this.querySources),
+      handleMouseMove(
+        e,
+        this.#popupTemplate,
+        this.#popupContextBuilder,
+        this.querySources,
+        this.popupOnHover,
+      ),
     );
     this.refs.mapLibre.map.on("styleimagemissing", handleStyleImageMissing);
     this.refs.mapLibre.map.on("moveend", this.onMoveEnd);

package/lib/queryMap.js

@@ -1,8 +1,18 @@
 import maplibregl from "maplibre-gl";
+import equal from "fast-deep-equal";
 
 import { h } from "../lib/dom.js";
 
-export const handleMouseMove = (e, popupTemplate, querySources) => {
+let currentPopup;
+let currentFeatures;
+
+export const handleMouseMove = (
+  e,
+  popupTemplate,
+  popupContextBuilder,
+  querySources,
+  onHover = false,
+) => {
   if (popupTemplate === false) {
     return;
   }
@@ -14,6 +24,9 @@ export const handleMouseMove = (e, popupTemplate, querySources) => {
   } else {
     e.target.getCanvas().style.cursor = "";
   }
+  if (onHover) {
+    handleMouseClick(e, popupTemplate, popupContextBuilder, querySources);
+  }
 };
 
 export const handleMouseClick = (
@@ -32,6 +45,14 @@ export const handleMouseClick = (
   for (const f of features) {
     distinctFeatures[f.id] = f;
   }
+  if (equal(currentFeatures, distinctFeatures) && currentPopup) {
+    currentPopup.setLngLat(e.lngLat);
+    return;
+  }
+  currentFeatures = distinctFeatures;
+  if (currentPopup) {
+    currentPopup.remove();
+  }
   const popup = h("map-popup");
   popup.features = distinctFeatures;
   if (popupTemplate) {
@@ -41,7 +62,7 @@ export const handleMouseClick = (
     popup.contextBuilder = popupContextBuilder;
   }
   if (features.length > 0) {
-    new maplibregl.Popup()
+    currentPopup = new maplibregl.Popup()
       .setMaxWidth("400px")
       .setLngLat(e.lngLat)
       .setDOMContent(popup)

package/lib/queryProviders/overpass.js

@@ -87,12 +87,22 @@ export async function callInterpreter(
   ) {
     let geoJSON;
     if (resp.headers.get("content-type") == "application/osm3s+xml") {
-      geoJSON = osmtogeojson(
-        new window.DOMParser().parseFromString(await resp.text(), "text/xml"),
-        { flatProperties: false },
+      const dom = new window.DOMParser().parseFromString(
+        await resp.text(),
+        "text/xml",
       );
+      if (dom.querySelector("remark")) {
+        alert(dom.querySelector("remark").textContent);
+        return { type: "FeatureCollection", features: [] };
+      }
+      geoJSON = osmtogeojson(dom, { flatProperties: false });
     } else {
-      geoJSON = osmtogeojson(await resp.json(), { flatProperties: false });
+      const json = await resp.json();
+      if (json.remark) {
+        alert(json.remark);
+        return { type: "FeatureCollection", features: [] };
+      }
+      geoJSON = osmtogeojson(json, { flatProperties: false });
     }
 
     return flattenProperties(geoJSON);

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "3.8.7",
+  "version": "3.9.0",
   "description": "A web based tool for making MapLibre GL maps with data from sources such as Overpass, GeoJSON, GPX, KML, TCX, etc",
   "main": "index.js",
   "scripts": {