function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

import React from "react";
import { IconLayer } from "deck.gl";
import shortid from "shortid";
import { number, string, bool, func, arrayOf, shape } from "prop-types";
import { createColorScale, createSizeScale } from "./createLayers";

var getIconSizeScale = function getIconSizeScale(zoom) {
  return zoom > 11.5 ? 6 : zoom > 10.5 ? 5 : zoom > 9.5 ? 4 : zoom > 8.5 ? 3 : zoom > 7.5 ? 2 : 1;
};

var MultiIconMap = function MultiIconMap(props) {
  var id = props.id,
      data = props.data,
      _props$pickable = props.pickable,
      pickable = _props$pickable === void 0 ? true : _props$pickable,
      _props$opacity = props.opacity,
      opacity = _props$opacity === void 0 ? 0.7 : _props$opacity,
      _props$getPosition = props.getPosition,
      getPosition = _props$getPosition === void 0 ? function (f) {
    return f.geometry.coordinates;
  } : _props$getPosition,
      iconAtlas = props.iconAtlas,
      _props$iconMapping = props.iconMapping,
      iconMapping = _props$iconMapping === void 0 ? {} : _props$iconMapping,
      _props$getSizeScale = props.getSizeScale,
      getSizeScale = _props$getSizeScale === void 0 ? getIconSizeScale : _props$getSizeScale,
      _props$iconSize = props.iconSize,
      iconSize = _props$iconSize === void 0 ? 10 : _props$iconSize,
      _props$autoHighlight = props.autoHighlight,
      autoHighlight = _props$autoHighlight === void 0 ? true : _props$autoHighlight,
      _props$highlightColor = props.highlightColor,
      highlightColor = _props$highlightColor === void 0 ? [0, 0, 128, 128] : _props$highlightColor,
      onHoverSlide = props.onHoverSlide,
      onLayerClick = props.onLayerClick,
      viewport = props.viewport,
      _props$civicColor = props.civicColor,
      civicColor = _props$civicColor === void 0 ? "civicYellow" : _props$civicColor,
      scaleType = props.scaleType,
      _props$fieldName = props.fieldName,
      fieldName = _props$fieldName === void 0 ? {} : _props$fieldName,
      dataRange = props.dataRange,
      colorRange = props.colorRange,
      index = props.index;
  var colorScale = createColorScale(civicColor, scaleType, dataRange, colorRange);

  var getColor = function getColor(feature) {
    var fieldNameColor = fieldName.color;

    if (fieldName && fieldNameColor) {
      var value = feature.properties[fieldNameColor];
      return value ? colorScale(value) : [0, 0, 0, 128];
    }

    return colorScale("icon");
  };

  var getSize = createSizeScale(iconSize, scaleType, fieldName);
  var zoom = viewport.zoom;
  var sizeScale = getSizeScale(zoom);
  var iconMap = Object.keys(iconMapping).length !== 0 ? iconMapping : _defineProperty({}, dataRange[0], {
    x: 0,
    y: 0,
    width: 250,
    height: 250,
    mask: true
  });
  return React.createElement(IconLayer, {
    key: shortid.generate(),
    id: id,
    data: data.filter(function (d) {
      return d.geometry;
    }),
    pickable: pickable,
    opacity: opacity,
    getPosition: getPosition,
    iconAtlas: iconAtlas,
    iconMapping: iconMap,
    sizeScale: sizeScale,
    getIcon: function getIcon(f) {
      return fieldName && fieldName.color ? f.properties.type : "icon";
    },
    getSize: getSize,
    getColor: getColor,
    autoHighlight: autoHighlight,
    highlightColor: highlightColor,
    onHover: function onHover(info) {
      return onHoverSlide(info, index);
    },
    onClick: onLayerClick
  });
};

MultiIconMap.propTypes = {
  id: string.isRequired,
  data: arrayOf(shape({})).isRequired,
  pickable: bool,
  civicColor: string,
  opacity: number,
  getPosition: func,
  iconAtlas: string,
  iconMapping: shape({
    x: number,
    y: number,
    width: number,
    height: number,
    mask: bool
  }),
  getSizeScale: func,
  iconSize: number,
  autoHighlight: bool,
  highlightColor: arrayOf(number),
  onHoverSlide: func,
  onLayerClick: func,
  scaleType: shape({
    area: string,
    color: string
  }),
  fieldName: shape({
    area: string,
    color: string
  }),
  dataRange: arrayOf(string),
  colorRange: arrayOf(arrayOf(number)),
  viewport: shape({}),
  index: number
};
export default MultiIconMap;