@emuanalytics/flow-rdf-core 4.0.4 → 4.0.5

package/dist/lib/map/plugins/annotations/maplibre-gl-draw-circle/lib/modes/DirectModeOverride.mjs

@@ -0,0 +1,67 @@
+import MapboxDraw from '@emuanalytics/mapbox-gl-draw';
+import turfCircle from '@turf/circle';
+import turfDistance from '@turf/distance';
+import { point } from '@turf/helpers';
+import createSupplementaryPointsForCircle from '../utils/create_supplementary_points_circle.mjs';
+
+const DirectModeOverride = MapboxDraw.modes.direct_select;
+const moveFeatures = MapboxDraw.lib.moveFeatures;
+const constrainFeatureMovement = MapboxDraw.lib.constrainFeatureMovement;
+const createSupplementaryPoints = MapboxDraw.lib.createSupplementaryPoints;
+const Constants = MapboxDraw.constants;
+DirectModeOverride.dragFeature = function(state, e, delta) {
+  moveFeatures(this.getSelected(), delta);
+  this.getSelected().filter((feature) => feature.properties.type === "Circle").map((circle) => circle.properties.circleCenter).forEach((center) => {
+    center[0] += delta.lng;
+    center[1] += delta.lat;
+  });
+  state.dragMoveLocation = e.lngLat;
+};
+DirectModeOverride.dragVertex = function(state, e, delta) {
+  if (state.feature.properties.type === "Circle") {
+    const center = state.feature.properties.circleCenter;
+    const movedVertex = [e.lngLat.lng, e.lngLat.lat];
+    const radius = turfDistance(point(center), point(movedVertex), { units: "kilometers" });
+    const circleFeature = turfCircle(center, radius);
+    state.feature.incomingCoords(circleFeature.geometry.coordinates);
+    state.feature.properties.circleRadius = radius;
+  } else {
+    const selectedCoords = state.selectedCoordPaths.map((coord_path) => state.feature.getCoordinate(coord_path));
+    const selectedCoordPoints = selectedCoords.map((coords) => ({
+      type: Constants.geojsonTypes.FEATURE,
+      properties: {},
+      geometry: {
+        type: Constants.geojsonTypes.POINT,
+        coordinates: coords
+      }
+    }));
+    const constrainedDelta = constrainFeatureMovement(selectedCoordPoints, delta);
+    for (let i = 0; i < selectedCoords.length; i++) {
+      const coord = selectedCoords[i];
+      state.feature.updateCoordinate(
+        state.selectedCoordPaths[i],
+        coord[0] + constrainedDelta.lng,
+        coord[1] + constrainedDelta.lat
+      );
+    }
+  }
+};
+DirectModeOverride.toDisplayFeatures = function(state, geojson, push) {
+  if (state.featureId === geojson.properties.id) {
+    geojson.properties.active = Constants.activeStates.ACTIVE;
+    push(geojson);
+    const supplementaryPoints = geojson.properties.user_type === "Circle" ? createSupplementaryPointsForCircle(geojson) : createSupplementaryPoints(geojson, {
+      map: this.map,
+      midpoints: true,
+      selectedPaths: state.selectedCoordPaths
+    });
+    supplementaryPoints.forEach(push);
+  } else {
+    geojson.properties.active = Constants.activeStates.INACTIVE;
+    push(geojson);
+  }
+  this.fireActionable(state);
+};
+const DirectMode = DirectModeOverride;
+
+export { DirectMode as default };

package/dist/lib/map/plugins/annotations/maplibre-gl-draw-circle/lib/modes/DragCircleMode.mjs

@@ -0,0 +1,65 @@
+import MapboxDraw from '@emuanalytics/mapbox-gl-draw';
+import turfCircle from '@turf/circle';
+import turfDistance from '@turf/distance';
+import { point } from '@turf/helpers';
+import dragPan from '../utils/drag_pan.mjs';
+
+const DragCircleMode = { ...MapboxDraw.modes.draw_polygon };
+const Constants = MapboxDraw.constants;
+DragCircleMode.onSetup = function(opts) {
+  const polygon = this.newFeature({
+    type: Constants.geojsonTypes.FEATURE,
+    properties: {
+      type: "Circle",
+      circleCenter: []
+    },
+    geometry: {
+      type: Constants.geojsonTypes.POLYGON,
+      coordinates: []
+    }
+  });
+  this.addFeature(polygon);
+  this.clearSelectedFeatures();
+  dragPan.disable(this);
+  this.updateUIClasses({ mouse: Constants.cursors.ADD });
+  this.activateUIButton(Constants.types.POLYGON);
+  this.setActionableState({
+    trash: true
+  });
+  return {
+    polygon,
+    currentVertexPosition: 0
+  };
+};
+DragCircleMode.onMouseDown = DragCircleMode.onTouchStart = function(state, e) {
+  const currentCenter = state.polygon.properties.circleCenter;
+  if (currentCenter.length === 0) {
+    state.polygon.properties.circleCenter = [e.lngLat.lng, e.lngLat.lat];
+  }
+};
+DragCircleMode.onDrag = DragCircleMode.onMouseMove = function(state, e) {
+  const center = state.polygon.properties.circleCenter;
+  if (center.length > 0) {
+    const distanceInKm = turfDistance(point(center), point([e.lngLat.lng, e.lngLat.lat]), {
+      units: "kilometers"
+    });
+    const circleFeature = turfCircle(center, distanceInKm);
+    state.polygon.incomingCoords(circleFeature.geometry.coordinates);
+    state.polygon.properties.circleRadius = distanceInKm;
+  }
+};
+DragCircleMode.onMouseUp = DragCircleMode.onTouchEnd = function(state) {
+  dragPan.enable(this);
+  return this.changeMode(Constants.modes.SIMPLE_SELECT, { featureIds: [state.polygon.id] });
+};
+DragCircleMode.onClick = DragCircleMode.onTap = function(state) {
+  state.polygon.properties.circleCenter = [];
+};
+DragCircleMode.toDisplayFeatures = function(state, geojson, display) {
+  const isActivePolygon = geojson.properties.id === state.polygon.id;
+  geojson.properties.active = isActivePolygon ? Constants.activeStates.ACTIVE : Constants.activeStates.INACTIVE;
+  return display(geojson);
+};
+const DragCircleMode$1 = DragCircleMode;
+
+export { DragCircleMode$1 as default };

package/dist/lib/map/plugins/annotations/maplibre-gl-draw-circle/lib/utils/create_supplementary_points_circle.mjs

@@ -0,0 +1,15 @@
+import MapboxDraw from '@emuanalytics/mapbox-gl-draw';
+
+function createSupplementaryPointsForCircle(geojson) {
+  const { properties, geometry } = geojson;
+  if (properties.user_type !== "Circle")
+    return null;
+  const supplementaryPoints = [];
+  const vertices = geometry.coordinates[0].slice(0, -1);
+  for (let index = 0; index < vertices.length; index += Math.round(vertices.length / 4)) {
+    supplementaryPoints.push(MapboxDraw.lib.createVertex(properties.id, vertices[index], `0.${index}`, false));
+  }
+  return supplementaryPoints;
+}
+
+export { createSupplementaryPointsForCircle as default };

package/dist/lib/map/plugins/annotations/maplibre-gl-draw-circle/lib/utils/drag_pan.mjs

@@ -0,0 +1,20 @@
+const dragPan = {
+  enable(ctx) {
+    setTimeout(() => {
+      if (!ctx.map || !ctx.map.dragPan || !ctx._ctx || !ctx._ctx.store || !ctx._ctx.store.getInitialConfigValue)
+        return;
+      if (!ctx._ctx.store.getInitialConfigValue("dragPan"))
+        return;
+      ctx.map.dragPan.enable();
+    }, 0);
+  },
+  disable(ctx) {
+    setTimeout(() => {
+      if (!ctx.map || !ctx.map.doubleClickZoom)
+        return;
+      ctx.map.dragPan.disable();
+    }, 0);
+  }
+};
+
+export { dragPan as default };

package/dist/lib/map/plugins/data-join.plugin.mjs

@@ -0,0 +1,173 @@
+import Debug from 'debug';
+import { autorun, toJS } from 'mobx';
+import { isString, isURL, isArrayFull, isNil, isNull } from '../../utils/type-checks.mjs';
+import { MapPluginBase } from './map-plugin-base.mjs';
+import { FlowCoreError } from '../../errors/flow-error.mjs';
+import { ReactiveExpression } from '../../expressions/reactive-expression.mjs';
+
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+const debug = Debug("flow:data-join-map-plugin");
+const _DataJoin = class _DataJoin {
+  constructor(id, map, options) {
+    this.id = id;
+    this.map = map;
+    __publicField(this, "autorunDisposer", null);
+    __publicField(this, "dataExpression", null);
+    __publicField(this, "options");
+    __publicField(this, "parameterExpressions", {});
+    this.options = {
+      ..._DataJoin.defaultOptions,
+      ...options
+    };
+  }
+  get source() {
+    return this.options.source;
+  }
+  start() {
+    this.stop();
+    if (isString(this.options.data)) {
+      if (isURL(this.options.data))
+        this.options.data = `'${this.options.data}'`;
+      this.dataExpression = new ReactiveExpression(this.options.data);
+      this.dataExpression.bindState(this.map.context.state);
+    } else {
+      this.dataExpression = null;
+    }
+    if (isArrayFull(this.options.parameters)) {
+      this.parameterExpressions = this.options.parameters.reduce((accum, param) => {
+        const expr = new ReactiveExpression(param.value.toString());
+        expr.bindState(this.map.context.state);
+        accum[param.name] = expr;
+        return accum;
+      }, {});
+    }
+    this.autorunDisposer = autorun(
+      async () => {
+        let data = this.dataExpression ? toJS(this.dataExpression.value) : this.options.data;
+        const missingParams = this.options.parameters.map((p) => p.required && isNil(this.parameterExpressions[p.name].value) ? p.name : void 0).filter((p) => !!p);
+        if (isNull(data)) {
+          debug(`FlowMap<${this.map.id}>: Skipping data join '${this.id}' (null data)`);
+          return;
+        }
+        if (missingParams.length) {
+          debug(
+            `FlowMap<${this.map.id}>: Skipping data join '${this.id}' (null required parameters: ${missingParams.join(
+              ", "
+            )})`
+          );
+          return;
+        }
+        debug(`FlowMap<${this.map.id}>: Performing data join '${this.id}'`);
+        if (isString(data)) {
+          try {
+            data = await this.loadData(data);
+          } catch (e) {
+            this.map.emitError(`Failed to load data for data join '${this.id}' - ${e.message}`, e);
+            data = [];
+          }
+        }
+        this.doDataJoin(data);
+      },
+      { name: `FlowDataJoin.${this.map.id}.${this.id})` }
+    );
+  }
+  stop() {
+    if (this.autorunDisposer) {
+      this.autorunDisposer();
+      this.autorunDisposer = null;
+    }
+  }
+  doDataJoin(data) {
+    const source = this.map.getSource(this.options.source);
+    const sourceLayer = source.type === "vector" ? this.options.sourceLayer || "geometry" : void 0;
+    if (this.options.clear) {
+      this.map.removeFeatureState({ source: source.id, sourceLayer }, this.id);
+    }
+    const featureData = data.reduce((accum, d) => {
+      accum[d[this.options.foreignKey]] = { [this.id]: d };
+      return accum;
+    }, {});
+    this.map.setFeatureStateBulk({ source: source.id, sourceLayer }, featureData);
+  }
+  loadData(datasetOrUrl) {
+    if (isURL(datasetOrUrl)) {
+      const url = new URL(datasetOrUrl);
+      const params = new URLSearchParams(url.searchParams);
+      if (isArrayFull(this.options.parameters)) {
+        this.options.parameters.forEach((p) => {
+          params.append(p.name, this.parameterExpressions[p.name].value);
+        });
+      }
+      url.search = params.toString();
+      const headers = new Headers({ Accept: "application/json" });
+      const request = new Request(url.toString(), {
+        method: "GET",
+        mode: "cors",
+        headers,
+        cache: "default"
+      });
+      return fetch(request).then((response) => {
+        if (!response.ok) {
+          throw new Error(`status=${response.status} ${response.statusText}`);
+        }
+        return response.json();
+      });
+    } else {
+      const params = {};
+      if (isArrayFull(this.options.parameters)) {
+        this.options.parameters.forEach((p) => {
+          params[p.name] = this.parameterExpressions[p.name].value;
+        });
+      }
+      return this.map.context.flowClient.datasets.query(datasetOrUrl, {}, params);
+    }
+  }
+};
+__publicField(_DataJoin, "defaultOptions", {
+  clear: false,
+  parameters: []
+});
+let DataJoin = _DataJoin;
+class DataJoinPlugin extends MapPluginBase {
+  constructor(pluginManager) {
+    super(pluginManager);
+    __publicField(this, "_joins", /* @__PURE__ */ new Map());
+    __publicField(this, "name", "DataJoinPlugin");
+  }
+  addDataJoin(id, options) {
+    const dataJoin = new DataJoin(id, this.map, options);
+    this._joins.set(id, dataJoin);
+    dataJoin.start();
+  }
+  bindState(state) {
+    this._joins.forEach((join) => join.start());
+  }
+  destroy() {
+    this._joins.forEach((join) => join.stop());
+    this._joins.clear();
+  }
+  handleSourceRemoved(event) {
+    this._joins.forEach((join) => {
+      if (join.source === event.source) {
+        join.stop();
+        this._joins.delete(join.id);
+      }
+    });
+  }
+  removeDataJoin(id) {
+    const dataJoin = this._joins.get(id);
+    if (dataJoin) {
+      dataJoin.stop();
+      this._joins.delete(id);
+    } else {
+      throw new FlowCoreError(`Cannot remove unrecognized data join '${id}'`);
+    }
+  }
+}
+
+export { DataJoin, DataJoinPlugin };

package/dist/lib/map/plugins/export/export.plugin.mjs

@@ -0,0 +1,21 @@
+import { MapPluginBase } from '../map-plugin-base.mjs';
+import { MapExporter } from './map-exporter.mjs';
+
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class ExportPlugin extends MapPluginBase {
+  constructor(pluginManager) {
+    super(pluginManager);
+    __publicField(this, "name", "ExportPlugin");
+  }
+  exportMap(options) {
+    const mapExporter = new MapExporter(this.map);
+    return mapExporter.export(options);
+  }
+}
+
+export { ExportPlugin };

package/dist/lib/map/plugins/export/map-exporter.mjs

@@ -0,0 +1,177 @@
+import maplibre from '@emuanalytics/maplibre-gl';
+import saveAs from 'file-saver';
+import { randomId } from '../../../utils/random-id.mjs';
+import { isFunction } from '../../../utils/type-checks.mjs';
+
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+const _MapExporter = class _MapExporter {
+  constructor(map) {
+    this.map = map;
+    __publicField(this, "nativePixelRatio", window.devicePixelRatio);
+  }
+  async export(options) {
+    options = { ..._MapExporter.defaultOptions, ...options };
+    const [container, mapCopy] = await this.createMapCopy(options);
+    return new Promise((resolve, reject) => {
+      const fileName = `${options.name}.${options.format}`;
+      const mapCanvas = mapCopy.getCanvas();
+      const exportCanvas = this.createExportCanvas(container, mapCanvas);
+      const exportContext = exportCanvas.getContext("2d");
+      if (!exportContext) {
+        this.destroyMapCopy(container, mapCopy);
+        reject(new Error("Failed to create export canvas context"));
+        return;
+      }
+      const drawOverlayCallback = (err) => {
+        if (err) {
+          this.destroyMapCopy(container, mapCopy);
+          reject(err);
+        } else {
+          switch (options.format) {
+            case "png":
+              exportCanvas.toBlob((blob) => {
+                blob && saveAs(blob, fileName);
+              });
+              break;
+            case "pdf":
+              throw new Error("Export to PDF is not currently supported");
+          }
+          this.destroyMapCopy(container, mapCopy);
+          resolve(fileName);
+        }
+      };
+      const mapImage = new Image();
+      mapImage.onload = () => {
+        exportContext.drawImage(mapImage, 0, 0);
+        if (isFunction(options.drawOverlayFn)) {
+          options.drawOverlayFn(
+            exportContext,
+            exportCanvas.width,
+            exportCanvas.height,
+            options.dpmm,
+            drawOverlayCallback
+          );
+        } else {
+          drawOverlayCallback(null);
+        }
+      };
+      mapImage.src = mapCopy.getCanvas().toDataURL();
+    });
+  }
+  createMapCopy(options) {
+    const geoBounds = options.bounds || this.map.maplibreMap.getBounds().toArray().flat();
+    const geoBottomLeft = [geoBounds[0], geoBounds[1]];
+    const geoTopRight = [geoBounds[2], geoBounds[3]];
+    const geoCenter = [
+      (geoBottomLeft[0] + geoTopRight[0]) / 2,
+      (geoBottomLeft[1] + geoTopRight[1]) / 2
+    ];
+    const pxBottomLeft = this.map.maplibreMap.project(geoBottomLeft);
+    const pxTopRight = this.map.maplibreMap.project(geoTopRight);
+    const pxWidth = pxTopRight.x - pxBottomLeft.x;
+    const pxHeight = pxBottomLeft.y - pxTopRight.y;
+    const exportWidth = options.width * options.dpmm;
+    const exportHeight = options.height * options.dpmm;
+    const aspectRatios = {
+      width: pxWidth / exportWidth,
+      height: pxHeight / exportHeight
+    };
+    const coverRatio = Math.max(aspectRatios.width, aspectRatios.height);
+    const copyWidth = exportWidth * coverRatio;
+    const copyHeight = exportHeight * coverRatio;
+    const pixelRatio = exportWidth / copyWidth;
+    this.setDevicePixelRatio(pixelRatio);
+    const container = document.createElement("div");
+    container.id = randomId("export");
+    container.classList.add("maplibregl-export-container");
+    container.style.width = `${copyWidth}px`;
+    container.style.height = `${copyHeight}px`;
+    this.map.container.insertBefore(container, this.map.container.firstChild);
+    const mapCopy = new maplibre.Map({
+      container,
+      center: geoCenter,
+      zoom: this.map.maplibreMap.getZoom(),
+      style: { ...this.map.maplibreMap.getStyle(), transition: { delay: 0, duration: 0 } },
+      bearing: this.map.maplibreMap.getBearing(),
+      pitch: this.map.maplibreMap.getPitch(),
+      interactive: false,
+      attributionControl: false,
+      fadeDuration: 0,
+      preserveDrawingBuffer: true,
+      transformRequest: this.transformMapRequest.bind(this)
+    });
+    mapCopy.on("styleimagemissing", this.handleMissingImage.bind(this));
+    return new Promise((resolve) => {
+      mapCopy.once("load", () => {
+        Object.keys(this.map.maplibreMap.style.sourceCaches).forEach((sourceId) => {
+          mapCopy.style.sourceCaches[sourceId]._state.stateChanges = this.map.maplibreMap.style.sourceCaches[sourceId]._state.state;
+        });
+        mapCopy._update();
+        setTimeout(() => resolve([container, mapCopy]), 500);
+      });
+    });
+  }
+  destroyMapCopy(container, map) {
+    this.setDevicePixelRatio(this.nativePixelRatio);
+    map.remove();
+    container.parentNode.removeChild(container);
+  }
+  createExportCanvas(container, mapCanvas) {
+    const canvasContainer = container.getElementsByClassName("maplibregl-canvas-container")[0];
+    const overlayCanvas = document.createElement("canvas");
+    overlayCanvas.id = randomId("overlay");
+    overlayCanvas.width = mapCanvas.width;
+    overlayCanvas.height = mapCanvas.height;
+    overlayCanvas.style.position = "absolute";
+    overlayCanvas.style.width = mapCanvas.style.width;
+    overlayCanvas.style.height = mapCanvas.style.height;
+    canvasContainer.appendChild(overlayCanvas);
+    return overlayCanvas;
+  }
+  setDevicePixelRatio(pixelRatio) {
+    Object.defineProperty(window, "devicePixelRatio", {
+      get: () => pixelRatio
+    });
+  }
+  async handleMissingImage(e) {
+    const imageInfo = this.map.imageRegistry.getImage(e.id);
+    if (imageInfo === this.map.imageRegistry.unknownImage) {
+      console.error(`Map ${this.map.id}: Image '${e.id}' not registered`);
+    }
+    if (!imageInfo.image.complete) {
+      imageInfo.image.onload = () => {
+        this.map.maplibreMap.updateImage(e.id, imageInfo.image);
+        this.map.maplibreMap.redraw();
+      };
+    }
+    this.map.maplibreMap.addImage(e.id, imageInfo.image, {
+      pixelRatio: imageInfo.pixelDensity,
+      sdf: imageInfo.recolor
+    });
+  }
+  transformMapRequest(url, _resourceType) {
+    if (this.map.context.flowClient.accessToken && url.startsWith(this.map.context.flowClient.baseUrl)) {
+      return {
+        url,
+        headers: { Authorization: `Bearer ${this.map.context.flowClient.accessToken}` }
+      };
+    } else {
+      return { url };
+    }
+  }
+};
+__publicField(_MapExporter, "defaultOptions", {
+  name: "map",
+  width: 297,
+  height: 210,
+  dpmm: 12,
+  format: "png"
+});
+let MapExporter = _MapExporter;
+
+export { MapExporter };

package/dist/lib/map/plugins/hover-effect.plugin.mjs

@@ -0,0 +1,58 @@
+import { isDefined, isObject } from '../../utils/type-checks.mjs';
+import { isFeatureWithId } from '../types.mjs';
+import { MapPluginBase } from './map-plugin-base.mjs';
+
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class HoverEffectPlugin extends MapPluginBase {
+  constructor(pluginManager) {
+    super(pluginManager);
+    __publicField(this, "hoveredFeature", null);
+    __publicField(this, "name", "HoverEffectPlugin");
+  }
+  handleMouseMove(event) {
+    const hoveredFeature = event.features[0];
+    if (hoveredFeature) {
+      this.map.maplibreMap._container.classList.add("feature-hovered");
+    } else {
+      this.map.maplibreMap._container.classList.remove("feature-hovered");
+    }
+    if (!this.compareFeatures(hoveredFeature, this.hoveredFeature)) {
+      this.clearHover();
+      if (isFeatureWithId(hoveredFeature) && isDefined(this.map.getSource(hoveredFeature.source)?.featureId)) {
+        this.map.setFeatureState(hoveredFeature, { hover: true }, false);
+        this.hoveredFeature = hoveredFeature;
+      }
+    }
+  }
+  handleMouseOut(event) {
+    this.clearHover();
+  }
+  handleSetExclusivePlugin(exclusivePlugins) {
+    if (exclusivePlugins.length) {
+      this.clearHover();
+      this.map.maplibreMap._container.classList.remove("feature-hovered");
+    }
+  }
+  compareFeatures(f1, f2) {
+    if (f1 === f2) {
+      return true;
+    }
+    if (isObject(f1) && isObject(f2)) {
+      return f1.id == f2.id && f1.source === f2.source && f1.sourceLayer == f2.sourceLayer;
+    }
+    return false;
+  }
+  clearHover() {
+    if (this.hoveredFeature && this.map.getSource(this.hoveredFeature.source)) {
+      this.map.removeFeatureState(this.hoveredFeature, "hover", false);
+      this.hoveredFeature = null;
+    }
+  }
+}
+
+export { HoverEffectPlugin };