@supermapgis/vue-iclient-leaflet 11.2.0

package/src/common/_types/event/Event.js

@@ -0,0 +1,315 @@
+/* Copyright© 2000 - 2024 SuperMap Software Co.Ltd. All rights reserved.
+ * This program are made available under the terms of the Apache License, Version 2.0
+ * which accompanies this distribution and is available at http://www.apache.org/licenses/LICENSE-2.0.html. */
+
+import { Util } from 'vue-iclient/src/common/_types/event/Util';
+
+export let Event = {
+  /**
+   * @description  A hash table cache of the event observers. Keyed by element._eventCacheID
+   * @type {boolean}
+   * @default false
+   */
+  observers: false,
+
+  /**
+   * @description KEY_SPACE
+   * @type {number}
+   * @default 32
+   */
+  KEY_SPACE: 32,
+
+  /**
+   * @description KEY_BACKSPACE
+   * @type {number}
+   * @default 8
+   */
+  KEY_BACKSPACE: 8,
+
+  /**
+   * @description KEY_TAB
+   * @type {number}
+   * @default 9
+   */
+  KEY_TAB: 9,
+
+  /**
+   * @description KEY_RETURN
+   * @type {number}
+   * @default 13
+   */
+  KEY_RETURN: 13,
+
+  /**
+   * @description KEY_ESC
+   * @type {number}
+   * @default 27
+   */
+  KEY_ESC: 27,
+
+  /**
+   * @description KEY_LEFT
+   * @type {number}
+   * @default 37
+   */
+  KEY_LEFT: 37,
+
+  /**
+   * @description KEY_UP
+   * @type {number}
+   * @default 38
+   */
+  KEY_UP: 38,
+
+  /**
+   * @description KEY_RIGHT
+   * @type {number}
+   * @default 39
+   */
+  KEY_RIGHT: 39,
+
+  /**
+   * @description KEY_DOWN
+   * @type {number}
+   * @default 40
+   */
+  KEY_DOWN: 40,
+
+  /**
+   * @description KEY_DELETE
+   * @type {number}
+   * @default 46
+   */
+  KEY_DELETE: 46,
+
+  /**
+   * @description Cross browser event element detection.
+   * @param {Event} event - The event
+   * @returns {HTMLElement} The element that caused the event
+   */
+  element: function(event) {
+    return event.target || event.srcElement;
+  },
+
+  /**
+   * @description Determine whether event was caused by a single touch
+   * @param {Event} event - The event
+   * @returns {boolean}
+   */
+  isSingleTouch: function(event) {
+    return event.touches && event.touches.length === 1;
+  },
+
+  /**
+   * @description Determine whether event was caused by a multi touch
+   * @param {Event} event - The event
+   * @returns {boolean}
+   */
+  isMultiTouch: function(event) {
+    return event.touches && event.touches.length > 1;
+  },
+
+  /**
+   * @description Determine whether event was caused by a left click.
+   * @param {Event} event - The event
+   * @returns {boolean}
+   */
+  isLeftClick: function(event) {
+    return (event.which && event.which === 1) || (event.button && event.button === 1);
+  },
+
+  /**
+   * @description Determine whether event was caused by a right mouse click.
+   * @param {Event} event - The event
+   * @returns {boolean}
+   */
+  isRightClick: function(event) {
+    return (event.which && event.which === 3) || (event.button && event.button === 2);
+  },
+
+  /**
+   * @description Stops an event from propagating.
+   * @param {boolean} allowDefault - If true, we stop the event chain but still allow the default browser  behaviour (text selection, radio-button clicking, etc) Default false
+   */
+  stop: function(event, allowDefault) {
+    if (!allowDefault) {
+      if (event.preventDefault) {
+        event.preventDefault();
+      } else {
+        event.returnValue = false;
+      }
+    }
+
+    if (event.stopPropagation) {
+      event.stopPropagation();
+    } else {
+      event.cancelBubble = true;
+    }
+  },
+
+  /**
+   * @param {string} tagName - html 标签名。
+   * @returns {HTMLElement} The first node with the given tagName, starting from the node the event was triggered on and traversing the DOM upwards
+   */
+  findElement: function(event, tagName) {
+    let element = Event.element(event);
+    while (element.parentNode && (!element.tagName || element.tagName.toUpperCase() !== tagName.toUpperCase())) {
+      element = element.parentNode;
+    }
+    return element;
+  },
+
+  /**
+   * @description 监听事件，注册事件处理方法。
+   * @param {(HTMLElement|string)} elementParam - 待监听的 DOM 对象或者其 ID 标识。
+   * @param {string} name - 监听事件的类别名称。
+   * @param {function} observer - 注册的事件处理方法。
+   * @param {boolean} [useCapture=false] - 是否捕获。
+   */
+  observe: function(elementParam, name, observer, useCapture) {
+    let element = Util.getElement(elementParam);
+    useCapture = useCapture || false;
+
+    if (name === 'keypress' && (navigator.appVersion.match(/Konqueror|Safari|KHTML/) || element.attachEvent)) {
+      name = 'keydown';
+    }
+
+    if (!this.observers) {
+      this.observers = {};
+    }
+
+    if (!element._eventCacheID) {
+      let idPrefix = 'eventCacheID_';
+      if (element.id) {
+        idPrefix = element.id + '_' + idPrefix;
+      }
+      element._eventCacheID = Util.createUniqueID(idPrefix);
+    }
+
+    let cacheID = element._eventCacheID;
+
+    if (!this.observers[cacheID]) {
+      this.observers[cacheID] = [];
+    }
+
+    this.observers[cacheID].push({
+      element: element,
+      name: name,
+      observer: observer,
+      useCapture: useCapture
+    });
+
+    if (element.addEventListener) {
+      if (name === 'mousewheel') {
+        // https://www.chromestatus.com/features/6662647093133312
+        element.addEventListener(name, observer, { useCapture: useCapture, passive: false });
+      } else {
+        element.addEventListener(name, observer, useCapture);
+      }
+    } else if (element.attachEvent) {
+      element.attachEvent('on' + name, observer);
+    }
+  },
+
+  /**
+   * @description Given the id of an element to stop observing, cycle through the
+   *   element's cached observers, calling stopObserving on each one,
+   *   skipping those entries which can no longer be removed.
+   *
+   * @param {(HTMLElement|string)} elementParam -
+   */
+  stopObservingElement: function(elementParam) {
+    let element = Util.getElement(elementParam);
+    let cacheID = element._eventCacheID;
+
+    this._removeElementObservers(Event.observers[cacheID]);
+  },
+
+  /**
+   * @param {Array.<Object>} elementObservers - Array of (element, name,
+   *                                         observer, usecapture) objects,
+   *                                         taken directly from hashtable
+   */
+  _removeElementObservers: function(elementObservers) {
+    if (elementObservers) {
+      for (let i = elementObservers.length - 1; i >= 0; i--) {
+        let entry = elementObservers[i];
+        let args = [entry.element, entry.name, entry.observer, entry.useCapture];
+        Event.stopObserving.apply(this, args);
+      }
+    }
+  },
+
+  /**
+   * @description 移除事件监听和注册的事件处理方法。注意：事件的移除和监听相对应，移除时的各属性信息必须监听时
+   * 保持一致才能确保事件移除成功。
+   * @param {(HTMLElement|string)} elementParam - 被监听的 DOM 元素或者其 ID。
+   * @param {string} name - 需要移除的被监听事件名称。
+   * @param {function} observer - 需要移除的事件处理方法。
+   * @param {boolean} [useCapture=false] - 是否捕获。
+   * @returns {boolean} Whether or not the event observer was removed
+   */
+  stopObserving: function(elementParam, name, observer, useCapture) {
+    useCapture = useCapture || false;
+
+    let element = Util.getElement(elementParam);
+    let cacheID = element._eventCacheID;
+
+    if (name === 'keypress') {
+      if (navigator.appVersion.match(/Konqueror|Safari|KHTML/) || element.detachEvent) {
+        name = 'keydown';
+      }
+    }
+
+    // find element's entry in this.observers cache and remove it
+    let foundEntry = false;
+    let elementObservers = Event.observers[cacheID];
+    if (elementObservers) {
+      // find the specific event type in the element's list
+      let i = 0;
+      while (!foundEntry && i < elementObservers.length) {
+        let cacheEntry = elementObservers[i];
+
+        if (cacheEntry.name === name && cacheEntry.observer === observer && cacheEntry.useCapture === useCapture) {
+          elementObservers.splice(i, 1);
+          if (elementObservers.length === 0) {
+            delete Event.observers[cacheID];
+          }
+          foundEntry = true;
+          break;
+        }
+        i++;
+      }
+    }
+
+    // actually remove the event listener from browser
+    if (foundEntry) {
+      if (element.removeEventListener) {
+        element.removeEventListener(name, observer, useCapture);
+      } else if (element && element.detachEvent) {
+        element.detachEvent('on' + name, observer);
+      }
+    }
+    return foundEntry;
+  },
+
+  /**
+   * @description Cycle through all the element entries in the events cache and call
+   *   stopObservingElement on each.
+   */
+  unloadCache: function() {
+    // created
+    if (Event && Event.observers) {
+      for (let cacheID in Event.observers) {
+        let elementObservers = Event.observers[cacheID];
+        Event._removeElementObservers.apply(this, [elementObservers]);
+      }
+      Event.observers = false;
+    }
+  },
+
+  CLASS_NAME: 'Event'
+};
+
+/* prevent memory leaks in IE */
+Event.observe(window, 'unload', Event.unloadCache, false);

package/src/common/_types/event/Events.js

@@ -0,0 +1,353 @@
+/* Copyright© 2000 - 2024 SuperMap Software Co.Ltd. All rights reserved.
+ * This program are made available under the terms of the Apache License, Version 2.0
+ * which accompanies this distribution and is available at http://www.apache.org/licenses/LICENSE-2.0.html. */
+import { Pixel } from 'vue-iclient/src/common/_types/event/Pixel';
+import { Event } from 'vue-iclient/src/common/_types/event/Event';
+import { FunctionExt } from 'vue-iclient/src/common/_types/event/BaseTypes';
+import { Util } from 'vue-iclient/src/common/_types/event/Util';
+
+/**
+ * @class Events
+ * @classdesc 事件类。
+ * @param {Object} object - 当前事件对象被添加到的 JS 对象。
+ * @param {HTMLElement} element - 响应浏览器事件的 DOM 元素。
+ * @param {Array.<string>} eventTypes - 自定义应用事件的数组。
+ * @param {boolean} [fallThrough=false] - 是否允许事件处理之后向上传递（冒泡），为 false 的时候阻止事件冒泡。
+ * @param {Object} options - 事件对象选项。
+ */
+export class Events {
+  constructor(object, element, eventTypes, fallThrough, options) {
+    /**
+     * @member {Array.<string>} Events.prototype.BROWSER_EVENTS
+     * @description 支持的事件。
+     * @constant
+     * @default [
+     "mouseover", "mouseout","mousedown", "mouseup", "mousemove",
+     "click", "dblclick", "rightclick", "dblrightclick","resize",
+     "focus", "blur","touchstart", "touchmove", "touchend","keydown",
+     "MSPointerDown", "MSPointerUp", "pointerdown", "pointerup",
+     "MSGestureStart", "MSGestureChange", "MSGestureEnd","contextmenu"
+     ]
+     */
+    this.BROWSER_EVENTS = [
+      'mouseover', 'mouseout',
+      'mousedown', 'mouseup', 'mousemove',
+      'click', 'dblclick', 'rightclick', 'dblrightclick',
+      'resize', 'focus', 'blur',
+      'touchstart', 'touchmove', 'touchend',
+      'keydown', 'MSPointerDown', 'MSPointerUp', 'pointerdown', 'pointerup',
+      'MSGestureStart', 'MSGestureChange', 'MSGestureEnd',
+      'contextmenu'
+    ];
+
+    this.listeners = {};
+
+    this.object = object;
+
+    this.element = null;
+
+    this.eventTypes = [];
+
+    this.eventHandler = null;
+
+    this.fallThrough = fallThrough;
+
+    this.includeXY = false;
+    this.extensions = {};
+
+    this.extensionCount = {};
+
+    this.clearMouseListener = null;
+
+    Util.extend(this, options);
+
+    if (eventTypes != null) {
+      for (let i = 0, len = eventTypes.length; i < len; i++) {
+        this.addEventType(eventTypes[i]);
+      }
+    }
+
+    if (element != null) {
+      this.attachToElement(element);
+    }
+
+    this.CLASS_NAME = 'Events';
+  }
+
+  /**
+   * @function Events.prototype.destroy
+   * @description 移除当前要素 element 上的所有事件监听和处理。
+   */
+  destroy() {
+    for (let e in this.extensions) {
+      if (typeof this.extensions[e] !== 'boolean') {
+        this.extensions[e].destroy();
+      }
+    }
+    this.extensions = null;
+    if (this.element) {
+      Event.stopObservingElement(this.element);
+      if (this.element.hasScrollEvent) {
+        Event.stopObserving(
+          window, 'scroll', this.clearMouseListener
+        );
+      }
+    }
+    this.element = null;
+
+    this.listeners = null;
+    this.object = null;
+    this.eventTypes = null;
+    this.fallThrough = null;
+    this.eventHandler = null;
+  }
+
+  /**
+   * @function Events.prototype.addEventType
+   * @description 在此事件对象中添加新的事件类型，如果这个事件类型已经添加过了，则不做任何事情。
+   * @param {string} eventName - 事件名。
+   */
+  addEventType(eventName) {
+    if (!this.listeners[eventName]) {
+      this.eventTypes.push(eventName);
+      this.listeners[eventName] = [];
+    }
+  }
+
+  /**
+   * @function Events.prototype.attachToElement
+   * @description 给 DOM 元素绑定浏览器事件。
+   * @param {HTMLDOMElement} element - 绑定浏览器事件的 DOM 元素。
+   */
+  attachToElement(element) {
+    if (this.element) {
+      Event.stopObservingElement(this.element);
+    } else {
+      // keep a bound copy of handleBrowserEvent() so that we can
+      // pass the same function to both Event.observe() and .stopObserving()
+      this.eventHandler = FunctionExt.bindAsEventListener(
+        this.handleBrowserEvent, this
+      );
+
+      // to be used with observe and stopObserving
+      this.clearMouseListener = FunctionExt.bind(
+        this.clearMouseCache, this
+      );
+    }
+    this.element = element;
+    for (let i = 0, len = this.BROWSER_EVENTS.length; i < len; i++) {
+      let eventType = this.BROWSER_EVENTS[i];
+
+      // every browser event has a corresponding application event
+      // (whether it's listened for or not).
+      this.addEventType(eventType);
+
+      // use Prototype to register the event cross-browser
+      Event.observe(element, eventType, this.eventHandler);
+    }
+    // disable dragstart in IE so that mousedown/move/up works normally
+    Event.observe(element, 'dragstart', Event.stop);
+  }
+
+  on(object) {
+    for (let type in object) {
+      if (type !== 'scope' && Object.prototype.hasOwnProperty.call(object, type)) {
+        this.register(type, object.scope, object[type]);
+      }
+    }
+  }
+
+  register(type, obj, func, priority) {
+    if (type in Events && !this.extensions[type]) {
+      this.extensions[type] = new Events[type](this);
+    }
+    if ((func != null) && (Util.indexOf(this.eventTypes, type) !== -1)) {
+      if (obj == null) {
+        obj = this.object;
+      }
+      let listeners = this.listeners[type];
+      if (!listeners) {
+        listeners = [];
+        this.listeners[type] = listeners;
+        this.extensionCount[type] = 0;
+      }
+      let listener = { obj: obj, func: func };
+      if (priority) {
+        listeners.splice(this.extensionCount[type], 0, listener);
+        if (typeof priority === 'object' && priority.extension) {
+          this.extensionCount[type]++;
+        }
+      } else {
+        listeners.push(listener);
+      }
+    }
+  }
+
+  registerPriority(type, obj, func) {
+    this.register(type, obj, func, true);
+  }
+
+  un(object) {
+    for (let type in object) {
+      if (type !== 'scope' && Object.prototype.hasOwnProperty.call(object, type)) {
+        this.unregister(type, object.scope, object[type]);
+      }
+    }
+  }
+
+  unregister(type, obj, func) {
+    if (obj == null) {
+      obj = this.object;
+    }
+    let listeners = this.listeners[type];
+    if (listeners != null) {
+      for (let i = 0, len = listeners.length; i < len; i++) {
+        if (listeners[i].obj === obj && listeners[i].func === func) {
+          listeners.splice(i, 1);
+          break;
+        }
+      }
+    }
+  }
+
+  /**
+   * @function Events.prototype.remove
+   * @description 删除某个事件类型的所有监听，如果该事件类型没有注册，则不做任何操作。
+   * @param {string} type - 事件类型。
+   */
+  remove(type) {
+    if (this.listeners[type] != null) {
+      this.listeners[type] = [];
+    }
+  }
+
+  triggerEvent(type, evt) {
+    let listeners = this.listeners[type];
+
+    // fast path
+    if (!listeners || listeners.length === 0) {
+      return undefined;
+    }
+
+    // prep evt object with object & div references
+    if (evt == null) {
+      evt = {};
+    }
+    evt.object = this.object;
+    evt.element = this.element;
+    if (!evt.type) {
+      evt.type = type;
+    }
+
+    // execute all callbacks registered for specified type
+    // get a clone of the listeners array to
+    // allow for splicing during callbacks
+    listeners = listeners.slice();
+    let continueChain;
+    for (let i = 0, len = listeners.length; i < len; i++) {
+      let callback = listeners[i];
+      // bind the context to callback.obj
+      continueChain = callback.func.apply(callback.obj, [evt]);
+
+      if ((continueChain !== undefined) && (continueChain === false)) {
+        // if callback returns false, execute no more callbacks.
+        break;
+      }
+    }
+    // don't fall through to other DOM elements
+    if (!this.fallThrough) {
+      Event.stop(evt, true);
+    }
+    return continueChain;
+  }
+
+  handleBrowserEvent(evt) {
+    let type = evt.type;
+    let listeners = this.listeners[type];
+    if (!listeners || listeners.length === 0) {
+      // noone's listening, bail out
+      return;
+    }
+    // add clientX & clientY to all events - corresponds to average x, y
+    let touches = evt.touches;
+    if (touches && touches[0]) {
+      let x = 0;
+      let y = 0;
+      let num = touches.length;
+      let touch;
+      for (let i = 0; i < num; ++i) {
+        touch = touches[i];
+        x += touch.clientX;
+        y += touch.clientY;
+      }
+      evt.clientX = x / num;
+      evt.clientY = y / num;
+    }
+    if (this.includeXY) {
+      evt.xy = this.getMousePosition(evt);
+    }
+    this.triggerEvent(type, evt);
+  }
+
+  /**
+   * @function Events.prototype.clearMouseCache
+   * @description 清除鼠标缓存。
+   */
+  clearMouseCache() {
+    this.element.scrolls = null;
+    this.element.lefttop = null;
+    let body = document.body;
+    if (body && !((body.scrollTop !== 0 || body.scrollLeft !== 0) &&
+      navigator.userAgent.match(/iPhone/i))) {
+      this.element.offsets = null;
+    }
+  }
+
+  /**
+   * @function Events.prototype.getMousePosition
+   * @returns {Pixel} 当前的鼠标的 xy 坐标点。
+   */
+  getMousePosition(evt) {
+    if (!this.includeXY) {
+      this.clearMouseCache();
+    } else if (!this.element.hasScrollEvent) {
+      Event.observe(window, 'scroll', this.clearMouseListener);
+      this.element.hasScrollEvent = true;
+    }
+
+    if (!this.element.scrolls) {
+      let viewportElement = Util.getViewportElement();
+      this.element.scrolls = [
+        viewportElement.scrollLeft,
+        viewportElement.scrollTop
+      ];
+    }
+
+    if (!this.element.lefttop) {
+      this.element.lefttop = [
+        (document.documentElement.clientLeft || 0),
+        (document.documentElement.clientTop || 0)
+      ];
+    }
+
+    if (!this.element.offsets) {
+      this.element.offsets = Util.pagePosition(this.element);
+    }
+
+    return new Pixel(
+      (evt.clientX + this.element.scrolls[0]) - this.element.offsets[0] - this.element.lefttop[0],
+      (evt.clientY + this.element.scrolls[1]) - this.element.offsets[1] - this.element.lefttop[1]
+    );
+  }
+}
+
+Events.prototype.BROWSER_EVENTS = [
+  'mouseover', 'mouseout',
+  'mousedown', 'mouseup', 'mousemove',
+  'click', 'dblclick', 'rightclick', 'dblrightclick',
+  'resize', 'focus', 'blur',
+  'touchstart', 'touchmove', 'touchend',
+  'keydown', 'MSPointerDown', 'MSPointerUp', 'pointerdown', 'pointerup',
+  'MSGestureStart', 'MSGestureChange', 'MSGestureEnd',
+  'contextmenu'
+];