236 lines
5.6 KiB
JavaScript
236 lines
5.6 KiB
JavaScript
import extend from "../utils/extend.js";
|
|
import getOriginXY from "../utils/getOriginXY.js";
|
|
import hypot from "../utils/hypot.js";
|
|
import { BaseEvent } from "./BaseEvent.js";
|
|
import { defaults } from "./defaultOptions.js";
|
|
export class InteractEvent extends BaseEvent {
|
|
// resize
|
|
|
|
/** */
|
|
constructor(interaction, event, actionName, phase, element, preEnd, type) {
|
|
super(interaction);
|
|
this.target = void 0;
|
|
this.currentTarget = void 0;
|
|
this.relatedTarget = null;
|
|
this.screenX = void 0;
|
|
this.screenY = void 0;
|
|
this.button = void 0;
|
|
this.buttons = void 0;
|
|
this.ctrlKey = void 0;
|
|
this.shiftKey = void 0;
|
|
this.altKey = void 0;
|
|
this.metaKey = void 0;
|
|
this.page = void 0;
|
|
this.client = void 0;
|
|
this.delta = void 0;
|
|
this.rect = void 0;
|
|
this.x0 = void 0;
|
|
this.y0 = void 0;
|
|
this.t0 = void 0;
|
|
this.dt = void 0;
|
|
this.duration = void 0;
|
|
this.clientX0 = void 0;
|
|
this.clientY0 = void 0;
|
|
this.velocity = void 0;
|
|
this.speed = void 0;
|
|
this.swipe = void 0;
|
|
this.timeStamp = void 0;
|
|
this.axes = void 0;
|
|
this.preEnd = void 0;
|
|
element = element || interaction.element;
|
|
const target = interaction.interactable;
|
|
const deltaSource = (target && target.options || defaults).deltaSource;
|
|
const origin = getOriginXY(target, element, actionName);
|
|
const starting = phase === 'start';
|
|
const ending = phase === 'end';
|
|
const prevEvent = starting ? this : interaction.prevEvent;
|
|
const coords = starting ? interaction.coords.start : ending ? {
|
|
page: prevEvent.page,
|
|
client: prevEvent.client,
|
|
timeStamp: interaction.coords.cur.timeStamp
|
|
} : interaction.coords.cur;
|
|
this.page = extend({}, coords.page);
|
|
this.client = extend({}, coords.client);
|
|
this.rect = extend({}, interaction.rect);
|
|
this.timeStamp = coords.timeStamp;
|
|
|
|
if (!ending) {
|
|
this.page.x -= origin.x;
|
|
this.page.y -= origin.y;
|
|
this.client.x -= origin.x;
|
|
this.client.y -= origin.y;
|
|
}
|
|
|
|
this.ctrlKey = event.ctrlKey;
|
|
this.altKey = event.altKey;
|
|
this.shiftKey = event.shiftKey;
|
|
this.metaKey = event.metaKey;
|
|
this.button = event.button;
|
|
this.buttons = event.buttons;
|
|
this.target = element;
|
|
this.currentTarget = element;
|
|
this.preEnd = preEnd;
|
|
this.type = type || actionName + (phase || '');
|
|
this.interactable = target;
|
|
this.t0 = starting ? interaction.pointers[interaction.pointers.length - 1].downTime : prevEvent.t0;
|
|
this.x0 = interaction.coords.start.page.x - origin.x;
|
|
this.y0 = interaction.coords.start.page.y - origin.y;
|
|
this.clientX0 = interaction.coords.start.client.x - origin.x;
|
|
this.clientY0 = interaction.coords.start.client.y - origin.y;
|
|
|
|
if (starting || ending) {
|
|
this.delta = {
|
|
x: 0,
|
|
y: 0
|
|
};
|
|
} else {
|
|
this.delta = {
|
|
x: this[deltaSource].x - prevEvent[deltaSource].x,
|
|
y: this[deltaSource].y - prevEvent[deltaSource].y
|
|
};
|
|
}
|
|
|
|
this.dt = interaction.coords.delta.timeStamp;
|
|
this.duration = this.timeStamp - this.t0; // velocity and speed in pixels per second
|
|
|
|
this.velocity = extend({}, interaction.coords.velocity[deltaSource]);
|
|
this.speed = hypot(this.velocity.x, this.velocity.y);
|
|
this.swipe = ending || phase === 'inertiastart' ? this.getSwipe() : null;
|
|
}
|
|
|
|
getSwipe() {
|
|
const interaction = this._interaction;
|
|
|
|
if (interaction.prevEvent.speed < 600 || this.timeStamp - interaction.prevEvent.timeStamp > 150) {
|
|
return null;
|
|
}
|
|
|
|
let angle = 180 * Math.atan2(interaction.prevEvent.velocityY, interaction.prevEvent.velocityX) / Math.PI;
|
|
const overlap = 22.5;
|
|
|
|
if (angle < 0) {
|
|
angle += 360;
|
|
}
|
|
|
|
const left = 135 - overlap <= angle && angle < 225 + overlap;
|
|
const up = 225 - overlap <= angle && angle < 315 + overlap;
|
|
const right = !left && (315 - overlap <= angle || angle < 45 + overlap);
|
|
const down = !up && 45 - overlap <= angle && angle < 135 + overlap;
|
|
return {
|
|
up,
|
|
down,
|
|
left,
|
|
right,
|
|
angle,
|
|
speed: interaction.prevEvent.speed,
|
|
velocity: {
|
|
x: interaction.prevEvent.velocityX,
|
|
y: interaction.prevEvent.velocityY
|
|
}
|
|
};
|
|
}
|
|
|
|
preventDefault() {}
|
|
/**
|
|
* Don't call listeners on the remaining targets
|
|
*/
|
|
|
|
|
|
stopImmediatePropagation() {
|
|
this.immediatePropagationStopped = this.propagationStopped = true;
|
|
}
|
|
/**
|
|
* Don't call any other listeners (even on the current target)
|
|
*/
|
|
|
|
|
|
stopPropagation() {
|
|
this.propagationStopped = true;
|
|
}
|
|
|
|
} // getters and setters defined here to support typescript 3.6 and below which
|
|
// don't support getter and setters in .d.ts files
|
|
|
|
Object.defineProperties(InteractEvent.prototype, {
|
|
pageX: {
|
|
get() {
|
|
return this.page.x;
|
|
},
|
|
|
|
set(value) {
|
|
this.page.x = value;
|
|
}
|
|
|
|
},
|
|
pageY: {
|
|
get() {
|
|
return this.page.y;
|
|
},
|
|
|
|
set(value) {
|
|
this.page.y = value;
|
|
}
|
|
|
|
},
|
|
clientX: {
|
|
get() {
|
|
return this.client.x;
|
|
},
|
|
|
|
set(value) {
|
|
this.client.x = value;
|
|
}
|
|
|
|
},
|
|
clientY: {
|
|
get() {
|
|
return this.client.y;
|
|
},
|
|
|
|
set(value) {
|
|
this.client.y = value;
|
|
}
|
|
|
|
},
|
|
dx: {
|
|
get() {
|
|
return this.delta.x;
|
|
},
|
|
|
|
set(value) {
|
|
this.delta.x = value;
|
|
}
|
|
|
|
},
|
|
dy: {
|
|
get() {
|
|
return this.delta.y;
|
|
},
|
|
|
|
set(value) {
|
|
this.delta.y = value;
|
|
}
|
|
|
|
},
|
|
velocityX: {
|
|
get() {
|
|
return this.velocity.x;
|
|
},
|
|
|
|
set(value) {
|
|
this.velocity.x = value;
|
|
}
|
|
|
|
},
|
|
velocityY: {
|
|
get() {
|
|
return this.velocity.y;
|
|
},
|
|
|
|
set(value) {
|
|
this.velocity.y = value;
|
|
}
|
|
|
|
}
|
|
});
|
|
//# sourceMappingURL=InteractEvent.js.map
|