Listen both mouse and touch event. With Typescript definition files. Support Typescript. 

phphe

drag-event-service

 * (c) phphe <phphe@outlook.com> (https://github.com/phphe)

Object.defineProperty(exports, '__esModule', { value: true });

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var _toConsumableArray = _interopDefault(require('@babel/runtime/helpers/toConsumableArray'));

    return e.type && e.type.startsWith('touch');

  on: function on(el, name, handler, options) {

    var _resolveOptions = resolveOptions(options),

        mouseArgs = _resolveOptions.mouseArgs,

        touchArgs = _resolveOptions.touchArgs;

          pageX: e.changedTouches[0].pageX,

          pageY: e.changedTouches[0].pageY,

          clientX: e.changedTouches[0].clientX,

          clientY: e.changedTouches[0].clientY,

          screenX: e.changedTouches[0].screenX,

          screenY: e.changedTouches[0].screenY

        if (name === 'start' && e.which !== 1) {

      return handler.call(this, e, mouse);

    }); // follow format will cause big bundle size

    // 以下写法将会使打包工具认为hp是上下文, 导致打包整个hp

    // hp.onDOM(el, events[name][0], wrapper, ...args)

    (_hp$onDOM = hp.onDOM).call.apply(_hp$onDOM, [null, el, events[name][0], wrapper].concat([].concat(_toConsumableArray(args), _toConsumableArray(mouseArgs))));

    (_hp$onDOM2 = hp.onDOM).call.apply(_hp$onDOM2, [null, el, events[name][1], wrapper].concat([].concat(_toConsumableArray(args), _toConsumableArray(touchArgs))));

  off: function off(el, name, handler, options) {

    var _resolveOptions2 = resolveOptions(options),

        mouseArgs = _resolveOptions2.mouseArgs;

    for (var i = store.length - 1; i >= 0; i--) {

import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';

import { onDOM, offDOM } from 'helper-js';

    (_hp$onDOM = onDOM).call.apply(_hp$onDOM, [null, el, events[name][0], wrapper].concat([].concat(_toConsumableArray(args), _toConsumableArray(mouseArgs))));

    (_hp$onDOM2 = onDOM).call.apply(_hp$onDOM2, [null, el, events[name][1], wrapper].concat([].concat(_toConsumableArray(args), _toConsumableArray(touchArgs))));

        (_hp$offDOM = offDOM).call.apply(_hp$offDOM, [null, el, events[name][0], wrapper].concat([].concat(_toConsumableArray(args), _toConsumableArray(mouseArgs))));

  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :

  typeof define === 'function' && define.amd ? define(['exports'], factory) :

  (global = global || self, factory(global.dragEventService = {}));

}(this, (function (exports) { 'use strict';

    if (len == null || len > arr.length) len = arr.length;

    for (var i = 0, arr2 = new Array(len); i < len; i++) {

  var arrayLikeToArray = _arrayLikeToArray;

    if (Array.isArray(arr)) return arrayLikeToArray(arr);

  var arrayWithoutHoles = _arrayWithoutHoles;

    if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);

  var iterableToArray = _iterableToArray;

  function _unsupportedIterableToArray(o, minLen) {

    if (typeof o === "string") return arrayLikeToArray(o, minLen);

    var n = Object.prototype.toString.call(o).slice(8, -1);

    if (n === "Object" && o.constructor) n = o.constructor.name;

    if (n === "Map" || n === "Set") return Array.from(n);

    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return arrayLikeToArray(o, minLen);

  var unsupportedIterableToArray = _unsupportedIterableToArray;

    throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");

  var nonIterableSpread = _nonIterableSpread;

    return arrayWithoutHoles(arr) || iterableToArray(arr) || unsupportedIterableToArray(arr) || nonIterableSpread();

  var toConsumableArray = _toConsumableArray;

  function createCommonjsModule(fn, module) {

  	return module = { exports: {} }, fn(module, module.exports), module.exports;

  var getPrototypeOf = createCommonjsModule(function (module) {

    module.exports = _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {

      return o.__proto__ || Object.getPrototypeOf(o);

  function _superPropBase(object, property) {

    while (!Object.prototype.hasOwnProperty.call(object, property)) {

  var get = createCommonjsModule(function (module) {

  function _get(target, property, receiver) {

    if (typeof Reflect !== "undefined" && Reflect.get) {

      module.exports = _get = Reflect.get;

      module.exports = _get = function _get(target, property, receiver) {

        var base = superPropBase(target, property);

        var desc = Object.getOwnPropertyDescriptor(base, property);

          return desc.get.call(receiver);

   * (c) phphe <phphe@outlook.com> (https://github.com/phphe)

  "main": "dist/drag-event-service.cjs.js",

  "module": "dist/drag-event-service.esm.js",

    "compile-scripts": "tsc --target ES6 --module CommonJS scripts/build.ts",

    "build": "rollup -c scripts/build.js & node scripts/build.js --report"

  "author": "phphe <phphe@outlook.com> (https://github.com/phphe)",

    "url": "https://github.com/phphe/drag-event-service/issues"

    "url": "https://github.com/phphe/drag-event-service.git"

export default interface DragEventService{

export const DragEventService:Type_DragEventService

export function trackMouseOrTouchPosition(options: Options_trackMouseOrTouchPosition): {

  isTouch: (e: MouseOrTouchEvent) => Boolean

  on: (el: HTMLElement, name: EventType, handler: Handler, options: Options) => void

  off: (el: HTMLElement, name: EventType, handler: Handler, options: Options) => void

		/*!
		* drag-event-service v1.1.0
		* drag-event-service v1.1.1
		* (c) phphe <phphe@outlook.com> (https://github.com/phphe)
		@@ -4,0 +4,0 @@ * Homepage: undefined

		/*!
		* drag-event-service v1.1.0
		* drag-event-service v1.1.1
		* (c) phphe <phphe@outlook.com> (https://github.com/phphe)
		@@ -4,0 +4,0 @@ * Homepage: undefined

		/*!
		* drag-event-service v1.1.0
		* drag-event-service v1.1.1
		* (c) phphe <phphe@outlook.com> (https://github.com/phphe)
		@@ -4,0 +4,0 @@ * Homepage: undefined

		/*!
		* drag-event-service v1.1.0
		* drag-event-service v1.1.1
		* (c) phphe <phphe@outlook.com> (https://github.com/phphe)
		@@ -4,0 +4,0 @@ * Homepage: undefined

		{
		"name": "drag-event-service",
		"version": "1.1.0",
		"version": "1.1.1",
		"description": "",
		@@ -5,0 +5,0 @@ "main": "dist/drag-event-service.cjs.js",

Improved metrics

Worsened metrics

		@@ -1,2 +0,11 @@
		export default interface DragEventService{
		export const DragEventService:Type_DragEventService

		export function trackMouseOrTouchPosition(options: Options_trackMouseOrTouchPosition): {
		info: TrackedInfo
		start: () => void
		stop: () => void
		}

		// types
		export interface Type_DragEventService{
		isTouch: (e: MouseOrTouchEvent) => Boolean
		@@ -6,12 +15,2 @@ on: (el: HTMLElement, name: EventType, handler: Handler, options: Options) => void
		}

		export interface trackMouseOrTouchPosition{
		(options: Options_trackMouseOrTouchPosition): {
		info: TrackedInfo
		start: () => void
		stop: () => void
		}
		}

		// types
		export type EventType = 'start'\|'move'\|'end'
		@@ -18,0 +17,0 @@ export type MouseOrTouchEvent = MouseEvent\|TouchEvent