@opensig/opendesign
Version:
<p align="center"><img src="../docs/public/opendesign-logo-light.png"/></p> <h1 align="center">opendesign</h1> <p align="center">一个 Vue 3 组件库</p> <p align="center"><b>皮肤可定制,使用 TypeScript</b></p>
83 lines (82 loc) • 2.12 kB
JavaScript
var __defProp = Object.defineProperty;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
function noop() {
}
class OPointer {
constructor(el, options) {
__publicField(this, "el");
__publicField(this, "x1");
__publicField(this, "y1");
__publicField(this, "onStart");
__publicField(this, "onMove");
__publicField(this, "onEnd");
__publicField(this, "removeListener");
this.el = el;
this.x1 = 0;
this.y1 = 0;
this.bind();
this.onStart = options.onStart || noop;
this.onMove = options.onMove || noop;
this.onEnd = options.onEnd || noop;
this.removeListener = null;
}
bind() {
this.el.addEventListener("touchstart", (e) => {
const { pageX: x, pageY: y } = e.touches[0];
this.x1 = x;
this.y1 = y;
const moveFn = this.onPointerMove.bind(this);
const upFn = this.onPointerUp.bind(this);
window.addEventListener("touchmove", moveFn, { passive: false });
window.addEventListener("touchend", upFn);
window.addEventListener("touchcancel", upFn);
this.removeListener = () => {
window.removeEventListener("touchmove", moveFn);
window.removeEventListener("touchend", upFn);
window.removeEventListener("touchcancel", upFn);
};
this.onStart(
{
x,
y
},
e
);
});
}
onPointerMove(e) {
const { pageX: x, pageY: y } = e.touches[0];
let dx = x - this.x1;
let dy = y - this.y1;
this.onMove(
{
x,
y,
dx,
dy
},
e
);
}
onPointerUp(e) {
const { pageX: x, pageY: y } = e.changedTouches[0];
let dx = x - this.x1;
let dy = y - this.y1;
this.onEnd(
{
x,
y,
dx,
dy
},
e
);
if (this.removeListener) {
this.removeListener();
}
}
}
export {
OPointer
};