@minix-iot/ui/dist/utils/touch.js

基于Vue的移动端轻量级UI组件库

import { Direction } from './direction';

export class Touch {
  static MIN_DISTANCE = 10;

  static get IsTouchable() {
    return 'ontouchstart' in window;
  }

  static Create() {
    return new Touch();
  }

  constructor() {
    this.startX = 0;
    this.startY = 0;
    this.deltaX = 0;
    this.deltaY = 0;

    this.direction = Direction.NONE;
  }

  get offsetX() {
    return Math.abs(this.deltaX);
  }

  get offsetY() {
    return Math.abs(this.deltaY);
  }

  get isHorizental() {
    return this.direction === Direction.HOR;
  }

  get isVertical() {
    return this.direction === Direction.VER;
  }

  get isUndetermined() {
    return this.direction === Direction.NONE;
  }

  resolveDirection(x, y) {
    if (x > y && x > Touch.MIN_DISTANCE) {
      return Direction.HOR;
    }
    if (y > x && y > Touch.MIN_DISTANCE) {
      return Direction.VER;
    }
    return Direction.NONE;
  }

  reset() {
    this.startX = 0;
    this.startY = 0;
    this.deltaX = 0;
    this.deltaY = 0;
    this.direction = Direction.NONE;
  }

  getTouchByEvent(e){
    return e.clientX ? e : e.touches[0]
  }

  start(evt) {
    const e = this.getTouchByEvent(evt)
    this.reset();
    this.startX = e.clientX;
    this.startY = e.clientY;
  }

  move(evt) {
    const e = this.getTouchByEvent(evt)
    this.deltaX = e.clientX - this.startX;
    this.deltaY = e.clientY - this.startY;
    if (this.isUndetermined) {
      this.direction = this.resolveDirection(this.offsetX, this.offsetY);
    }
  }
}