Update actionHandler options in case they change.
This commit is contained in:
@@ -15,7 +15,7 @@ interface ActionHandler extends HTMLElement {
|
|||||||
bind(element: Element, options): void;
|
bind(element: Element, options): void;
|
||||||
}
|
}
|
||||||
interface ActionHandlerElement extends HTMLElement {
|
interface ActionHandlerElement extends HTMLElement {
|
||||||
actionHandler?: boolean;
|
actionHandlerOptions?: ActionHandlerOptions;
|
||||||
}
|
}
|
||||||
|
|
||||||
declare global {
|
declare global {
|
||||||
@@ -25,7 +25,7 @@ declare global {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class ActionHandler extends HTMLElement implements ActionHandler {
|
class ActionHandler extends HTMLElement implements ActionHandler {
|
||||||
public holdTime = 500;
|
public holdTime = 400;
|
||||||
|
|
||||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||||
public ripple: any;
|
public ripple: any;
|
||||||
@@ -78,10 +78,12 @@ class ActionHandler extends HTMLElement implements ActionHandler {
|
|||||||
}
|
}
|
||||||
|
|
||||||
public bind(element: ActionHandlerElement, options): void {
|
public bind(element: ActionHandlerElement, options): void {
|
||||||
if (element.actionHandler) {
|
if (element.actionHandlerOptions) {
|
||||||
|
// Reset the options on an existing actionHandler.
|
||||||
|
element.actionHandlerOptions = options;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
element.actionHandler = true;
|
element.actionHandlerOptions = options;
|
||||||
|
|
||||||
element.addEventListener('contextmenu', (ev: Event) => {
|
element.addEventListener('contextmenu', (ev: Event) => {
|
||||||
const e = ev || window.event;
|
const e = ev || window.event;
|
||||||
@@ -97,6 +99,7 @@ class ActionHandler extends HTMLElement implements ActionHandler {
|
|||||||
});
|
});
|
||||||
|
|
||||||
const start = (ev: Event): void => {
|
const start = (ev: Event): void => {
|
||||||
|
const options = element.actionHandlerOptions;
|
||||||
let x;
|
let x;
|
||||||
let y;
|
let y;
|
||||||
if ((ev as TouchEvent).touches) {
|
if ((ev as TouchEvent).touches) {
|
||||||
@@ -107,7 +110,7 @@ class ActionHandler extends HTMLElement implements ActionHandler {
|
|||||||
y = (ev as MouseEvent).pageY;
|
y = (ev as MouseEvent).pageY;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (options.hasHold) {
|
if (options?.hasHold) {
|
||||||
this.held = false;
|
this.held = false;
|
||||||
this.timer = window.setTimeout(() => {
|
this.timer = window.setTimeout(() => {
|
||||||
this.startAnimation(x, y);
|
this.startAnimation(x, y);
|
||||||
@@ -117,21 +120,22 @@ class ActionHandler extends HTMLElement implements ActionHandler {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const end = (ev: Event): void => {
|
const end = (ev: Event): void => {
|
||||||
|
const options = element.actionHandlerOptions;
|
||||||
if (['touchend', 'touchcancel'].includes(ev.type)
|
if (['touchend', 'touchcancel'].includes(ev.type)
|
||||||
// This action handler by default relies on synthetic click events for
|
// This action handler by default relies on synthetic click events for
|
||||||
// touch devices, in order to ensure that embedded cards (e.g. WebRTC)
|
// touch devices, in order to ensure that embedded cards (e.g. WebRTC)
|
||||||
// can use stock click handlers. The exception is for hold events.
|
// can use stock click handlers. The exception is for hold events.
|
||||||
&& !(options.hasHold && this.held)) {
|
&& !(options?.hasHold && this.held)) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (options.hasHold) {
|
if (options?.hasHold) {
|
||||||
clearTimeout(this.timer);
|
clearTimeout(this.timer);
|
||||||
this.stopAnimation();
|
this.stopAnimation();
|
||||||
this.timer = undefined;
|
this.timer = undefined;
|
||||||
}
|
}
|
||||||
if (options.hasHold && this.held) {
|
if (options?.hasHold && this.held) {
|
||||||
fireEvent(element, 'action', { action: 'hold' });
|
fireEvent(element, 'action', { action: 'hold' });
|
||||||
} else if (options.hasDoubleClick) {
|
} else if (options?.hasDoubleClick) {
|
||||||
if (
|
if (
|
||||||
(ev.type === 'click' && (ev as MouseEvent).detail < 2) ||
|
(ev.type === 'click' && (ev as MouseEvent).detail < 2) ||
|
||||||
!this.dblClickTimeout
|
!this.dblClickTimeout
|
||||||
|
|||||||
Reference in New Issue
Block a user