@antv/l7-component 2.21.0 → 2.21.2

package/es/control/baseControl/control.js

@@ -1,302 +1,256 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 import { PositionType } from '@antv/l7-core';
 import { DOM } from '@antv/l7-utils';
 import EventEmitter from 'eventemitter3';
 export { PositionType } from '@antv/l7-core';
 export { Control };
-var Control = /*#__PURE__*/function (_ref) {
-  _inherits(Control, _ref);
-  var _super = _createSuper(Control);
-  /**
-   * 当前控件实例配置
-   */
+export default class Control extends EventEmitter {
+  constructor(option) {
+    super();
+    /**
+     * 当前控件实例配置
+     */
+    _defineProperty(this, "controlOption", void 0);
+    /**
+     * 控件的 DOM 容器
+     * @protected
+     */
+    _defineProperty(this, "container", void 0);
+    /**
+     * 当前控件是否显示
+     * @protected
+     */
+    _defineProperty(this, "isShow", void 0);
+    _defineProperty(this, "sceneContainer", void 0);
+    _defineProperty(this, "scene", void 0);
+    _defineProperty(this, "mapsService", void 0);
+    _defineProperty(this, "renderService", void 0);
+    _defineProperty(this, "layerService", void 0);
+    _defineProperty(this, "controlService", void 0);
+    _defineProperty(this, "configService", void 0);
+    Control.controlCount++;
+    this.controlOption = _objectSpread(_objectSpread({}, this.getDefault(option)), option || {});
+  }
+  getOptions() {
+    return this.controlOption;
+  }
 
   /**
-   * 控件的 DOM 容器
-   * @protected
+   * 更新配置的方法，子类如果有自己的配置，也需要重写该方法
+   * @param newOptions
    */
+  setOptions(newOptions) {
+    const defaultOptions = this.getDefault(newOptions);
+    Object.entries(newOptions).forEach(([key, value]) => {
+      if (value === undefined) {
+        newOptions[key] = defaultOptions[key];
+      }
+    });
+    if ('position' in newOptions) {
+      this.setPosition(newOptions.position);
+    }
+    if ('className' in newOptions) {
+      this.setClassName(newOptions.className);
+    }
+    if ('style' in newOptions) {
+      this.setStyle(newOptions.style);
+    }
+    this.controlOption = _objectSpread(_objectSpread({}, this.controlOption), newOptions);
+  }
 
   /**
-   * 当前控件是否显示
-   * @protected
+   * 当 Control 被添加至 Scene 中，被 controlService 调用的方法
+   * @param sceneContainer
    */
+  addTo(sceneContainer) {
+    // 初始化各个 Service 实例
+    this.mapsService = sceneContainer.mapService;
+    this.renderService = sceneContainer.rendererService;
+    this.layerService = sceneContainer.layerService;
+    this.controlService = sceneContainer.controlService;
+    this.configService = sceneContainer.globalConfigService;
+    this.scene = sceneContainer.sceneService;
+    this.sceneContainer = sceneContainer;
+    this.isShow = true;
 
-  function Control(option) {
-    var _this;
-    _classCallCheck(this, Control);
-    _this = _super.call(this);
-    Control.controlCount++;
-    _this.controlOption = _objectSpread(_objectSpread({}, _this.getDefault(option)), option || {});
-    return _this;
-  }
-  _createClass(Control, [{
-    key: "getOptions",
-    value: function getOptions() {
-      return this.controlOption;
+    // 初始化 container
+    this.container = this.onAdd();
+    DOM.addClass(this.container, 'l7-control');
+    const {
+      className,
+      style
+    } = this.controlOption;
+    if (className) {
+      this.setClassName(className);
     }
-
-    /**
-     * 更新配置的方法，子类如果有自己的配置，也需要重写该方法
-     * @param newOptions
-     */
-  }, {
-    key: "setOptions",
-    value: function setOptions(newOptions) {
-      var defaultOptions = this.getDefault(newOptions);
-      Object.entries(newOptions).forEach(function (_ref2) {
-        var _ref3 = _slicedToArray(_ref2, 2),
-          key = _ref3[0],
-          value = _ref3[1];
-        if (value === undefined) {
-          newOptions[key] = defaultOptions[key];
-        }
-      });
-      if ('position' in newOptions) {
-        this.setPosition(newOptions.position);
-      }
-      if ('className' in newOptions) {
-        this.setClassName(newOptions.className);
-      }
-      if ('style' in newOptions) {
-        this.setStyle(newOptions.style);
-      }
-      this.controlOption = _objectSpread(_objectSpread({}, this.controlOption), newOptions);
+    if (style) {
+      this.setStyle(style);
     }
+    // 将 container 插入容器中
+    this.insertContainer();
+    this.emit('add', this);
+    return this;
+  }
 
-    /**
-     * 当 Control 被添加至 Scene 中，被 controlService 调用的方法
-     * @param sceneContainer
-     */
-  }, {
-    key: "addTo",
-    value: function addTo(sceneContainer) {
-      // 初始化各个 Service 实例
-      this.mapsService = sceneContainer.mapService;
-      this.renderService = sceneContainer.rendererService;
-      this.layerService = sceneContainer.layerService;
-      this.controlService = sceneContainer.controlService;
-      this.configService = sceneContainer.globalConfigService;
-      this.scene = sceneContainer.sceneService;
-      this.sceneContainer = sceneContainer;
-      this.isShow = true;
-
-      // 初始化 container
-      this.container = this.onAdd();
-      DOM.addClass(this.container, 'l7-control');
-      var _this$controlOption = this.controlOption,
-        className = _this$controlOption.className,
-        style = _this$controlOption.style;
-      if (className) {
-        this.setClassName(className);
-      }
-      if (style) {
-        this.setStyle(style);
-      }
-      // 将 container 插入容器中
-      this.insertContainer();
-      this.emit('add', this);
+  /**
+   * 将控件移除时触发
+   */
+  remove() {
+    if (!this.mapsService) {
       return this;
     }
+    DOM.remove(this.container);
+    this.onRemove();
+    this.emit('remove', this);
+  }
 
-    /**
-     * 将控件移除时触发
-     */
-  }, {
-    key: "remove",
-    value: function remove() {
-      if (!this.mapsService) {
-        return this;
-      }
-      DOM.remove(this.container);
-      this.onRemove();
-      this.emit('remove', this);
-    }
+  /**
+   * Control 被添加的时候被调用，返回 Control 对应的 DOM 容器
+   */
+  onAdd() {
+    return DOM.create('div');
+  }
 
-    /**
-     * Control 被添加的时候被调用，返回 Control 对应的 DOM 容器
-     */
-  }, {
-    key: "onAdd",
-    value: function onAdd() {
-      return DOM.create('div');
-    }
+  /**
+   * Control 被移除时调用
+   */
+  // tslint:disable-next-line:no-empty
+  onRemove() {}
 
-    /**
-     * Control 被移除时调用
-     */
-    // tslint:disable-next-line:no-empty
-  }, {
-    key: "onRemove",
-    value: function onRemove() {}
+  /**
+   * 显示控件时触发
+   */
+  show() {
+    const container = this.container;
+    DOM.removeClass(container, 'l7-control--hide');
+    this.isShow = true;
+    this.emit('show', this);
+  }
 
-    /**
-     * 显示控件时触发
-     */
-  }, {
-    key: "show",
-    value: function show() {
-      var container = this.container;
-      DOM.removeClass(container, 'l7-control--hide');
-      this.isShow = true;
-      this.emit('show', this);
-    }
+  /**
+   * 隐藏控件时触发
+   */
+  hide() {
+    const container = this.container;
+    DOM.addClass(container, 'l7-control--hide');
+    this.isShow = false;
+    this.emit('hide', this);
+  }
 
-    /**
-     * 隐藏控件时触发
-     */
-  }, {
-    key: "hide",
-    value: function hide() {
-      var container = this.container;
-      DOM.addClass(container, 'l7-control--hide');
-      this.isShow = false;
-      this.emit('hide', this);
-    }
+  /**
+   * 获取默认构造器参数
+   */
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  getDefault(option) {
+    // tslint:disable-next-line:no-object-literal-type-assertion
+    return {
+      position: PositionType.TOPRIGHT,
+      name: `${Control.controlCount}`
+    };
+  }
 
-    /**
-     * 获取默认构造器参数
-     */
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  }, {
-    key: "getDefault",
-    value: function getDefault(option) {
-      // tslint:disable-next-line:no-object-literal-type-assertion
-      return {
-        position: PositionType.TOPRIGHT,
-        name: "".concat(Control.controlCount)
-      };
-    }
+  /**
+   * 获取当前控件对应的 DOM 容器
+   */
+  getContainer() {
+    return this.container;
+  }
 
-    /**
-     * 获取当前控件对应的 DOM 容器
-     */
-  }, {
-    key: "getContainer",
-    value: function getContainer() {
-      return this.container;
+  /**
+   * 获取当前 Control 是否展示
+   */
+  getIsShow() {
+    return this.isShow;
+  }
+  _refocusOnMap(e) {
+    // if map exists and event is not a keyboard event
+    if (this.mapsService && e && e.screenX > 0 && e.screenY > 0) {
+      const container = this.mapsService.getContainer();
+      if (container !== null) {
+        container.focus();
+      }
     }
+  }
 
-    /**
-     * 获取当前 Control 是否展示
-     */
-  }, {
-    key: "getIsShow",
-    value: function getIsShow() {
-      return this.isShow;
+  /**
+   * 设置当前控件位置
+   * @param position
+   */
+  setPosition(position = PositionType.TOPLEFT) {
+    // 考虑组件的自动布局，需要销毁重建
+    const controlService = this.controlService;
+    if (controlService) {
+      controlService.removeControl(this);
     }
-  }, {
-    key: "_refocusOnMap",
-    value: function _refocusOnMap(e) {
-      // if map exists and event is not a keyboard event
-      if (this.mapsService && e && e.screenX > 0 && e.screenY > 0) {
-        var container = this.mapsService.getContainer();
-        if (container !== null) {
-          container.focus();
-        }
-      }
+    this.controlOption.position = position;
+    if (controlService) {
+      controlService.addControl(this, this.sceneContainer);
     }
+    return this;
+  }
 
-    /**
-     * 设置当前控件位置
-     * @param position
-     */
-  }, {
-    key: "setPosition",
-    value: function setPosition() {
-      var position = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : PositionType.TOPLEFT;
-      // 考虑组件的自动布局，需要销毁重建
-      var controlService = this.controlService;
-      if (controlService) {
-        controlService.removeControl(this);
-      }
-      this.controlOption.position = position;
-      if (controlService) {
-        controlService.addControl(this, this.sceneContainer);
-      }
-      return this;
+  /**
+   * 设置容器 container 的样式相关位置，包含 className
+   * @param className
+   */
+  setClassName(className) {
+    const container = this.container;
+    const {
+      className: oldClassName
+    } = this.controlOption;
+    if (oldClassName) {
+      DOM.removeClass(container, oldClassName);
     }
-
-    /**
-     * 设置容器 container 的样式相关位置，包含 className
-     * @param className
-     */
-  }, {
-    key: "setClassName",
-    value: function setClassName(className) {
-      var container = this.container;
-      var oldClassName = this.controlOption.className;
-      if (oldClassName) {
-        DOM.removeClass(container, oldClassName);
-      }
-      if (className) {
-        DOM.addClass(container, className);
-      }
+    if (className) {
+      DOM.addClass(container, className);
     }
+  }
 
-    /**
-     * 设置容器 container 的样式相关位置，包含 style
-     * @param style
-     */
-  }, {
-    key: "setStyle",
-    value: function setStyle(style) {
-      var container = this.container;
-      if (style) {
-        container.setAttribute('style', style);
-      } else {
-        container.removeAttribute('style');
-      }
+  /**
+   * 设置容器 container 的样式相关位置，包含 style
+   * @param style
+   */
+  setStyle(style) {
+    const container = this.container;
+    if (style) {
+      container.setAttribute('style', style);
+    } else {
+      container.removeAttribute('style');
     }
+  }
 
-    /**
-     * 将控件 DOM 插入到对应 position 的容器中
-     * @protected
-     */
-  }, {
-    key: "insertContainer",
-    value: function insertContainer() {
-      var position = this.controlOption.position;
-      var container = this.container;
-      if (position instanceof Element) {
-        position.appendChild(container);
+  /**
+   * 将控件 DOM 插入到对应 position 的容器中
+   * @protected
+   */
+  insertContainer() {
+    const position = this.controlOption.position;
+    const container = this.container;
+    if (position instanceof Element) {
+      position.appendChild(container);
+    } else {
+      const corner = this.controlService.controlCorners[position];
+      if (['bottomleft', 'bottomright', 'righttop', 'rightbottom'].includes(position)) {
+        corner.insertBefore(container, corner.firstChild);
       } else {
-        var corner = this.controlService.controlCorners[position];
-        if (['bottomleft', 'bottomright', 'righttop', 'rightbottom'].includes(position)) {
-          corner.insertBefore(container, corner.firstChild);
-        } else {
-          corner.appendChild(container);
-        }
+        corner.appendChild(container);
       }
     }
+  }
 
-    /**
-     * 检查当前传入 option 是否包含 keys 字段
-     * @param option
-     * @param keys
-     * @protected
-     */
-  }, {
-    key: "checkUpdateOption",
-    value: function checkUpdateOption(option, keys) {
-      return keys.some(function (key) {
-        return key in option;
-      });
-    }
-  }]);
-  return Control;
-}(EventEmitter);
+  /**
+   * 检查当前传入 option 是否包含 keys 字段
+   * @param option
+   * @param keys
+   * @protected
+   */
+  checkUpdateOption(option, keys) {
+    return keys.some(key => key in option);
+  }
+}
 /**
  * 当前类型控件实例个数
  * @protected
  */
-_defineProperty(Control, "controlCount", 0);
-export { Control as default };
+_defineProperty(Control, "controlCount", 0);