@trailstash/ultra 4.2.6 → 4.3.0

package/.gitlab-ci.yml

@@ -19,8 +19,7 @@ pages:
     paths:
     - public
   only:
-  - main
-  - tags
+  - develop
 npm:
   image: node:20
   script:

package/build-examples-images.js

@@ -10,7 +10,7 @@ const {
   width,
   waitTime,
   output,
-} = minimist(process.argv.slice(2))
+} = minimist(process.argv.slice(2));
 
 const browser = await puppeteer.launch({ headless: true });
 
@@ -50,7 +50,8 @@ async function createImage(exampleName) {
     console.log(`Timed out waiting for map load on ${exampleName}.`);
   }
 
-  const filename = output || `./docs/assets/${exampleName.replace(".ultra", ".png")}`;
+  const filename =
+    output || `./docs/assets/${exampleName.replace(".ultra", ".png")}`;
 
   await page
     .screenshot({

package/components/map-popup.js

@@ -51,7 +51,16 @@ export class MapPopup extends HTMLElement {
         this.template,
         this.contextBuilder(f),
       );
-      div.appendChild(h("div", {}, DOMPurify.sanitize(html)));
+      div.appendChild(
+        h(
+          "div",
+          {},
+          DOMPurify.sanitize(html, {
+            ALLOWED_URI_REGEXP:
+              /^(?:(?:(?:f|ht)tps?|mailto|tel|callto|sms|cid|xmpp|geo):|[^a-z]|[a-z+.\-]+(?:[^a-z+.\-:]|$))/i,
+          }),
+        ),
+      );
     }
     shadow.appendChild(div);
   }

package/components/style-picker.js

@@ -70,7 +70,10 @@ export class StylePicker extends HTMLElement {
       return;
     }
 
-    const div = h("div", { slot: "modal-content", style: "max-width: 1055px;" });
+    const div = h("div", {
+      slot: "modal-content",
+      style: "max-width: 1055px;",
+    });
     const button = h(
       "button-modal",
       { text: "Pick Style", icon: "paintbrush" },
@@ -83,18 +86,16 @@ export class StylePicker extends HTMLElement {
       if (!stylesByProvider[provider]) {
         stylesByProvider[provider] = [];
       }
-      stylesByProvider[provider].push({name, value});
+      stylesByProvider[provider].push({ name, value });
     }
     for (const [provider, styles] of Object.entries(stylesByProvider)) {
-      const div2 = h("div", {style:"display:inline-block;margin-right:1.25em;"});
+      const div2 = h("div", {
+        style: "display:inline-block;margin-right:1.25em;",
+      });
       div.appendChild(div2);
       div2.appendChild(h("h3", {}, provider));
-      for (const {name, value} of styles) {
-        const styleButton = h(
-          "button",
-          {},
-          name,
-        );
+      for (const { name, value } of styles) {
+        const styleButton = h("button", {}, name);
         styleButton.addEventListener("click", (e) => {
           button.toggle();
           this.dispatchEvent(

package/docs/style.md

@@ -89,11 +89,11 @@ In order to place your layers below existing style layers, you can use the `befo
 
 [Example](./Examples/bike-infra.md)
 
-## PNG sprites via HTTPS
+## sprites via HTTPS
 
 In order to facilitate adding icons to the map that don't exist in the basemap's
 [sprites](),
-if `icon-image` is set to an HTTPS URL to a PNG image, Ultra will automatically download
+if `icon-image` is set to an HTTPS URL to an image, Ultra will automatically download
 it and add it to the Map's images.
 
 [Example](./MapLibre-Examples/add-image.md)

package/lib/sprites.js

@@ -4,8 +4,11 @@ export const handleStyleImageMissing = async (ev) => {
   if (ev.id.startsWith("https://") || ev.id.startsWith("data:")) {
     if (!fetchedImages[ev.id]) {
       fetchedImages[ev.id] = true;
-      const image = await ev.target.loadImage(ev.id);
-      ev.target.addImage(ev.id, image.data);
+      const image = new Image();
+      image.crossOrigin = "anonymous";
+      image.src = ev.id;
+      await image.decode();
+      ev.target.addImage(ev.id, image);
     }
   }
   if (builtin) {

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "4.2.6",
+  "version": "4.3.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": {
@@ -70,7 +70,7 @@
     "liquidjs": "^10.17.0",
     "lodash.pick": "^4.4.0",
     "lz-string": "^1.5.0",
-    "maplibre-gl": "^5.1.0",
+    "maplibre-gl": "^5.5.0",
     "marked": "^14.1.2",
     "node-events": "^0.0.2",
     "normalize.css": "^8.0.1",