import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _createClass from 'babel-runtime/helpers/createClass';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
/**
 * @文件说明: 构建地图Popup气泡弹窗接口对象
 * @创建人: pjtools@vip.qq.com
 * @创建时间: 2020-06-15 11:38:17
 */

import assign from 'lodash/assign';
import BasicMapApi from '../util/basicMapApiClass';
import { getPrefixCls, isBooleanTrue, isBooleanFlase, addClass, removeClass } from '../../_util/methods-util';
import { ElementWrapper } from '../../map/components';

var defaultPopupOptions = {
  // Popup的内容插槽
  slots: null,
  // Popup容器的Class类名
  className: null,
  // Popup容器的Style样式
  style: null,
  // Popup插槽作用域的自定义数据
  data: null,
  // 是否仅只渲染显示单个Popup
  showSingle: false,
  // 是否渲染默认皮肤
  defaultSkin: true,
  // Popup定位到坐标点的位置
  anchor: 'bottom',
  // Popup的相对偏移量
  offset: [0, 0],
  // Popup的最大宽度
  maxWidth: null,
  // 是否渲染Popup弹窗的Close按钮
  closeButton: true,
  // 是否单击Popup之外则触发关闭
  closeOnClick: true
};

var _map = Symbol('map');
var _popups = Symbol('popups');

var Popup = function (_BasicMapApi) {
  _inherits(Popup, _BasicMapApi);

  function Popup(iMapApi) {
    _classCallCheck(this, Popup);

    // 地图Map对象
    var _this = _possibleConstructorReturn(this, (Popup.__proto__ || Object.getPrototypeOf(Popup)).call(this, iMapApi));

    _this[_map] = iMapApi && iMapApi.map;
    // 定义地图的Popup对象存储器
    _this[_popups] = {};
    return _this;
  }

  /**
   * 获取所有创建的Popup对象
   */


  _createClass(Popup, [{
    key: 'add',


    /**
     * 动态创建Vue组件版的Popup气泡弹窗对象
     * @param {String} id Popup的唯一Id名
     * @param {Array} coordinates Popup的坐标点
     * @param {Object} options Popup对象的参数选项
     */
    value: function add(id, coordinates) {
      var _this2 = this;

      var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
      var mapboxgl = this.iMapApi.exports.mapboxgl;

      var opts = assign({}, defaultPopupOptions, options || {});

      // 判断是否为仅单一Popup渲染，则移除其他Popup实例
      if (isBooleanTrue(opts.showSingle)) {
        this.removeAll();
      }
      // 实例化Popup对象
      var popupOptions = {
        closeButton: false,
        closeOnClick: opts.closeOnClick,
        closeOnMove: opts.closeOnMove,
        anchor: opts.anchor,
        offset: opts.offset,
        maxWidth: opts.maxWidth
      };
      var popup = new mapboxgl.Popup(popupOptions);
      popup.id = id;
      popup.setDOMContent(document.createElement('div'));
      // 添加Popup到地图
      popup.setLngLat(coordinates);
      popup.addTo(this[_map]);
      // 替换Popup的Element对象
      var popupWrapper = popup.getElement();
      popupWrapper.setAttribute('data-id', id);
      popupWrapper.innerHTML = '';

      // 创建组件包的Props属性
      var props = {};
      props.getContainer = function () {
        return popupWrapper;
      };
      props.iMapApi = this.iMapApi;
      props.type = 'popup';
      var prefixCls = getPrefixCls('map');
      props['class'] = [prefixCls + '-popup'];
      isBooleanFlase(opts.defaultSkin) && props['class'].push('no-skin');
      opts.className && props['class'].push(opts.className);
      opts.style && (props.style = opts.style);
      opts.slots && (props.slots = opts.slots);
      props.vProps = { popup: popup, data: opts.data || null };
      props.options = opts;
      // 创建Vue组件包实例
      ElementWrapper.newInstance(props, function (instance) {
        popup._content = popupWrapper.querySelector('.' + prefixCls + '-popup .popup-inner-content');
        popup._instance = instance;
        // 绑定Popup组件对象关闭事件监听
        popup.on('close', function () {
          popup._instance && popup._instance.destroy();
          // 移除Popup的存储对象记录
          _this2[_popups][popup.id] && delete _this2[_popups][popup.id];
        });
        popup.fire('open');
      });

      // 删除部分原生方法
      var deleteMethods = function deleteMethods() {
        console.error('Popup\u5BF9\u8C61\u4E0B\u7684[setDOMContent]\u3001[setHTML]\u3001[setText]\u51FD\u6570\u65B9\u6CD5\u5DF2\u88AB\u7981\u7528\uFF0C\u8BF7\u4F7F\u7528Vue\u7EC4\u4EF6\u7684Slots\u63D2\u69FD\u6A21\u677F\u8FDB\u884C\u5185\u5BB9\u66F4\u65B0\uFF01');
      };
      popup.setDOMContent && (popup.setDOMContent = deleteMethods);
      popup.setHTML && (popup.setHTML = deleteMethods);
      popup.setText && (popup.setText = deleteMethods);
      popup.addTo && (popup.addTo = function () {
        return null;
      });
      // 重构原生方法
      var container = popupWrapper.querySelector('.' + prefixCls + '-popup');
      var isClassPass = function isClassPass(className) {
        return !className || className === prefixCls + '-popup';
      };
      popup.addClassName = function (className) {
        if (isClassPass(className)) return;
        container && addClass(container, className);
      };
      popup.removeClassName = function (className) {
        if (isClassPass(className)) return;
        container && removeClass(container, className);
      };
      popup.toggleClassName = function (className) {
        if (isClassPass(className)) return;
        container && container.classList.toggle(className);
      };

      // 存储当前实例的Marker对象
      this[_popups][id] = popup;

      return popup;
    }

    /**
     * 获取指定Id的Popup对象
     * @param {String} id Popup的唯一Id名
     */

  }, {
    key: 'get',
    value: function get(id) {
      return id && this[_popups] && this[_popups][id];
    }

    /**
     * 删除指定Id的Popup对象
     * @param {String} id Popup的唯一Id名
     */

  }, {
    key: 'remove',
    value: function remove(id) {
      var popup = this.get(id);
      popup && popup.remove();
    }

    /**
     * 清空所有的Popup标注对象
     */

  }, {
    key: 'removeAll',
    value: function removeAll() {
      if (this.popups && this.popups.length) {
        for (var i = this.popups.length - 1; i >= 0; i--) {
          var popup = this.popups[i];
          this.remove(popup.id);
        }
      }
    }
  }, {
    key: 'popups',
    get: function get() {
      var _this3 = this;

      var keys = Object.keys(this[_popups]);
      return keys.map(function (key) {
        return _this3[_popups][key];
      });
    }
  }]);

  return Popup;
}(BasicMapApi);

export default Popup;