@carto/kepler.gl 0.0.88 → 0.0.89

package/src/vendor/react-map-gl-draw/feature.js

@@ -0,0 +1,171 @@
+// Vendored from react-map-gl-draw@0.14.8 (MIT, Copyright (c) 2018 Uber Technologies, Inc.), see ./LICENSE
+import {GEOJSON_TYPE} from './constants';
+
+export default class Feature {
+  static fromFeature(feature) {
+    const {
+      id,
+      geometry: {coordinates, type},
+      properties: {renderType, ...otherProps}
+    } = feature;
+
+    switch (type) {
+      case GEOJSON_TYPE.POINT:
+        return new Feature({
+          id,
+          type,
+          renderType,
+          points: [coordinates],
+          otherProps
+        });
+
+      case GEOJSON_TYPE.LINE_STRING:
+        return new Feature({
+          id,
+          type,
+          renderType,
+          points: coordinates,
+          otherProps
+        });
+
+      case GEOJSON_TYPE.POLYGON:
+        const points = coordinates[0] && coordinates[0].slice(0, -1);
+        return new Feature({
+          id,
+          type,
+          renderType,
+          points,
+          isClosed: true,
+          otherProps
+        });
+
+      default:
+        return null;
+    }
+  }
+
+  constructor(props) {
+    this.id = props.id;
+    this.type = props.type;
+    this.renderType = props.renderType;
+    this.points = props.points || [];
+    this.isClosed = props.isClosed;
+    this.otherProps = props.otherProps;
+  }
+
+  id;
+  type;
+  renderType;
+  isClosed = false;
+  points;
+  otherProps;
+
+  addPoint(pt) {
+    this.points.push(pt);
+    return true;
+  }
+
+  insertPoint(pt, index) {
+    this.points.splice(index, 0, pt);
+  }
+
+  getBoundingBox() {
+    if (!this.points || !this.points.length) {
+      return null;
+    }
+    const bbox = this.points.reduce(
+      (result, pt) => {
+        result.xmin = Math.min(pt[0], result.xmin);
+        result.xmax = Math.min(pt[0], result.xmax);
+        result.ymin = Math.min(pt[1], result.ymin);
+        result.ymax = Math.min(pt[1], result.ymax);
+
+        return result;
+      },
+      {xmin: Infinity, xmax: -Infinity, ymin: Infinity, ymax: -Infinity}
+    );
+
+    return bbox;
+  }
+
+  removePoint(index) {
+    const {points} = this;
+    if (index >= 0 && index < points.length) {
+      points.splice(index, 1);
+      if (points.length < 3) {
+        this.isClosed = false;
+      }
+      return true;
+    }
+    return false;
+  }
+
+  replacePoint(index, pt) {
+    const {points} = this;
+    if (index >= 0 && index < points.length) {
+      points[index] = pt;
+      return true;
+    }
+    return false;
+  }
+
+  closePath() {
+    const {points} = this;
+    if (points.length >= 3 && !this.isClosed) {
+      this.isClosed = true;
+      return true;
+    }
+    return false;
+  }
+
+  toFeature() {
+    const {id, points, isClosed, renderType, otherProps} = this;
+
+    let feature = null;
+    if (points.length < 2) {
+      feature = {
+        type: 'Feature',
+        geometry: {
+          type: GEOJSON_TYPE.POINT,
+          coordinates: points[0]
+        },
+        properties: {
+          renderType,
+          ...otherProps
+        },
+        id
+      };
+    } else if (points.length < 3 || !isClosed) {
+      feature = {
+        type: 'Feature',
+        geometry: {
+          type: GEOJSON_TYPE.LINE_STRING,
+          coordinates: points
+        },
+        properties: {
+          renderType,
+          bbox: this.getBoundingBox(),
+          ...otherProps
+        },
+        id
+      };
+    } else {
+      feature = {
+        type: 'Feature',
+        geometry: {
+          type: GEOJSON_TYPE.POLYGON,
+          coordinates: [[...points, points[0]]]
+        },
+        properties: {
+          renderType,
+          isClosed,
+          bbox: this.getBoundingBox(),
+          ...otherProps
+        },
+        id
+      };
+    }
+
+    return feature;
+  }
+}

package/src/vendor/react-map-gl-draw/index.js

@@ -0,0 +1,7 @@
+// Vendored from react-map-gl-draw@0.14.8 (MIT, Copyright (c) 2018 Uber Technologies, Inc.), see ./LICENSE
+export {default as Editor} from './editor';
+export {
+  MODES as EditorModes,
+  RENDER_TYPE as RenderTypes,
+  RENDER_STATE as RenderStates
+} from './constants';

package/src/vendor/react-map-gl-draw/style.js

@@ -0,0 +1,153 @@
+// Vendored from react-map-gl-draw@0.14.8 (MIT, Copyright (c) 2018 Uber Technologies, Inc.), see ./LICENSE
+/* eslint-disable complexity, max-statements */
+import {RENDER_STATE, RENDER_TYPE} from './constants';
+
+const RECT_STYLE = {
+  x: -6,
+  y: -6,
+  height: 12,
+  width: 12
+};
+
+const CLOSING_RECT_STYLE = {
+  x: -10,
+  y: -10,
+  height: 20,
+  width: 20
+};
+
+const DEFAULT_STROKE_WIDTH = 2;
+const HIGHLIGHTED_STROKE_WIDTH = 4;
+const DEFAULT_RADIUS = 8;
+
+export const HIDDEN_CLICKABLE_STYLE = {
+  fill: '#000',
+  opacity: 0
+};
+
+export function getFeatureStyle({feature, state}) {
+  const style = {
+    stroke:
+      state === RENDER_STATE.SELECTED || state === RENDER_STATE.HOVERED
+        ? '#7ac943'
+        : state === RENDER_STATE.UNCOMMITTED || state === RENDER_STATE.CLOSING
+        ? '#a9a9a9'
+        : '#000',
+    strokeWidth: DEFAULT_STROKE_WIDTH,
+    fill:
+      state === RENDER_STATE.INACTIVE
+        ? '#333333'
+        : state === RENDER_STATE.HOVERED
+        ? '#7ac943'
+        : state === RENDER_STATE.SELECTED
+        ? '#ffff00'
+        : state === RENDER_STATE.UNCOMMITTED || state === RENDER_STATE.CLOSING
+        ? '#a9a9a9'
+        : '#000000',
+    fillOpacity:
+      state === RENDER_STATE.INACTIVE
+        ? 0.1
+        : state === RENDER_STATE.SELECTED
+        ? 0.7
+        : state === RENDER_STATE.HOVERED
+        ? 0.5
+        : state === RENDER_STATE.UNCOMMITTED || state === RENDER_STATE.CLOSING
+        ? 0.3
+        : 1
+  };
+
+  const renderType = feature.properties ? feature.properties.renderType : feature.renderType;
+
+  switch (renderType) {
+    case RENDER_TYPE.POINT:
+      style.r = DEFAULT_RADIUS;
+      break;
+    case RENDER_TYPE.LINE_STRING:
+      style.fill = 'none';
+      break;
+    case RENDER_TYPE.POLYGON:
+      if (state === RENDER_STATE.CLOSING) {
+        style.strokeDasharray = '4,2';
+      }
+      break;
+    case RENDER_TYPE.RECTANGLE:
+      if (state === RENDER_STATE.UNCOMMITTED) {
+        style.strokeDasharray = '4,2';
+      }
+      break;
+    default:
+  }
+
+  return style;
+}
+
+export function getEditHandleStyle({feature, index, state}) {
+  const style = {
+    fill:
+      state === RENDER_STATE.INACTIVE
+        ? '#ffffff'
+        : state === RENDER_STATE.SELECTED || state === RENDER_STATE.CLOSING
+        ? '#ffff00'
+        : state === RENDER_STATE.HOVERED
+        ? '#7ac943'
+        : state === RENDER_STATE.UNCOMMITTED
+        ? '#a9a9a9'
+        : '#000000',
+    fillOpacity:
+      state === RENDER_STATE.INACTIVE
+        ? 1
+        : state === RENDER_STATE.HOVERED
+        ? 1
+        : state === RENDER_STATE.SELECTED || state === RENDER_STATE.CLOSING
+        ? 0.8
+        : state === RENDER_STATE.UNCOMMITTED
+        ? 0.3
+        : 1,
+    stroke:
+      state === RENDER_STATE.SELECTED ||
+      state === RENDER_STATE.HOVERED ||
+      state === RENDER_STATE.CLOSING
+        ? '#7ac943'
+        : '#000',
+    strokeWidth:
+      state === RENDER_STATE.SELECTED || state === RENDER_STATE.CLOSING
+        ? HIGHLIGHTED_STROKE_WIDTH
+        : DEFAULT_STROKE_WIDTH,
+    r: DEFAULT_RADIUS
+  };
+
+  const renderType = feature.properties ? feature.properties.renderType : feature.renderType;
+
+  switch (renderType) {
+    case RENDER_TYPE.POINT:
+      style.fill =
+        state === RENDER_STATE.INACTIVE
+          ? '#333333'
+          : state === RENDER_STATE.SELECTED
+          ? '#ffff00'
+          : state === RENDER_STATE.HOVERED
+          ? '#7ac943'
+          : state === RENDER_STATE.UNCOMMITTED
+          ? 'none'
+          : '#000000';
+      style.stroke =
+        state === RENDER_STATE.SELECTED
+          ? '#7ac943'
+          : state === RENDER_STATE.UNCOMMITTED
+          ? 'none'
+          : '#000';
+      break;
+    case RENDER_TYPE.LINE_STRING:
+    case RENDER_TYPE.POLYGON:
+    case RENDER_TYPE.RECTANGLE:
+      if (state === RENDER_STATE.CLOSING) {
+        Object.assign(style, CLOSING_RECT_STYLE);
+      } else {
+        Object.assign(style, RECT_STYLE);
+      }
+      break;
+    default:
+  }
+
+  return style;
+}

package/src/vendor/react-map-gl-draw/utils.js

@@ -0,0 +1,55 @@
+// Vendored from react-map-gl-draw@0.14.8 (MIT, Copyright (c) 2018 Uber Technologies, Inc.), see ./LICENSE
+
+function inBounds(p1, p2, p) {
+  const bounds = [
+    Math.min(p1[0], p2[0]),
+    Math.max(p1[0], p2[0]),
+    Math.min(p1[1], p2[1]),
+    Math.max(p1[1], p2[1])
+  ];
+
+  return p[0] >= bounds[0] && p[0] <= bounds[1] && p[1] >= bounds[2] && p[1] <= bounds[3];
+}
+
+export function findClosestPointOnLineSegment(p1, p2, p) {
+  // line
+  const k = (p2[1] - p1[1]) / (p2[0] - p1[0]);
+  const b = p1[1] - k * p1[0];
+
+  // vertical line
+  if (!isFinite(k)) {
+    const q = [p1[0], p[1]];
+    return inBounds(p1, p2, q) ? q : null;
+  }
+
+  // p is on line [p1, p2]
+  if (p[0] * k + b - p[1] === 0) {
+    return inBounds(p1, p2, p) ? p : null;
+  }
+
+  const qx = (k * p[1] + p[0] - k * b) / (k * k + 1);
+  const qy = k * qx + b;
+
+  return inBounds(p1, p2, [qx, qy]) ? [qx, qy] : null;
+}
+
+export function isNumeric(n) {
+  return !Array.isArray(n) && !isNaN(parseFloat(n)) && isFinite(n);
+}
+
+export function parseElemDataAttributes(elem) {
+  const data = elem && elem.dataset;
+  if (!data) {
+    return null;
+  }
+
+  const featureIndex = data.featureIndex;
+  const vertexIndex = data.vertexIndex;
+
+  return {
+    type: data.type,
+    operation: data.operation,
+    featureIndex: isNumeric(featureIndex) ? Number(featureIndex) : undefined,
+    vertexIndex: isNumeric(vertexIndex) ? Number(vertexIndex) : undefined
+  };
+}