jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-17 14:26:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix action handler bugs (#6811)

Browse Source
This commit is contained in:
Bram Kragten 2020-09-07 13:41:59 +02:00 committed by GitHub
parent 979b7ae651
commit d5bc498373
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/ha-sidebar.ts
View File

@ -31,6 +31,7 @@ import memoizeOne from "memoize-one";
import { LocalStorage } from "../common/decorators/local-storage"; import { LocalStorage } from "../common/decorators/local-storage";
import { fireEvent } from "../common/dom/fire_event"; import { fireEvent } from "../common/dom/fire_event";
import { computeDomain } from "../common/entity/compute_domain"; import { computeDomain } from "../common/entity/compute_domain";
import { navigate } from "../common/navigate";
import { compare } from "../common/string/compare"; import { compare } from "../common/string/compare";
import { computeRTL } from "../common/util/compute_rtl"; import { computeRTL } from "../common/util/compute_rtl";
import { ActionHandlerDetail } from "../data/lovelace"; import { ActionHandlerDetail } from "../data/lovelace";
@ -649,6 +650,10 @@ class HaSidebar extends LitElement {
); );
} }
private _handlePanelTap(ev: Event) {
navigate(this, (ev.currentTarget as HTMLAnchorElement).href);
}
private _renderPanel( private _renderPanel(
urlPath: string, urlPath: string,
title: string | null, title: string | null,
@ -661,6 +666,7 @@ class HaSidebar extends LitElement {
href="${`/${urlPath}`}" href="${`/${urlPath}`}"
data-panel="${urlPath}" data-panel="${urlPath}"
tabindex="-1" tabindex="-1"
@tap=${this._handlePanelTap}
@mouseenter=${this._itemMouseEnter} @mouseenter=${this._itemMouseEnter}
@mouseleave=${this._itemMouseLeave} @mouseleave=${this._itemMouseLeave}
> >

32
src/panels/lovelace/common/directives/action-handler-directive.ts
View File

@ -44,6 +44,8 @@ class ActionHandler extends HTMLElement implements ActionHandler {
protected held = false; protected held = false;
private cancelled = false;
private dblClickTimeout?: number; private dblClickTimeout?: number;
constructor() { constructor() {
@ -76,9 +78,12 @@ class ActionHandler extends HTMLElement implements ActionHandler {
document.addEventListener( document.addEventListener(
ev, ev,
() => { () => {
clearTimeout(this.timer); this.cancelled = true;
this.stopAnimation(); if (this.timer) {
this.timer = undefined; this.stopAnimation();
clearTimeout(this.timer);
this.timer = undefined;
}
}, },
{ passive: true } { passive: true }
); );
@ -124,7 +129,7 @@ class ActionHandler extends HTMLElement implements ActionHandler {
} }
element.actionHandler.start = (ev: Event) => { element.actionHandler.start = (ev: Event) => {
this.held = false; this.cancelled = false;
let x; let x;
let y; let y;
if ((ev as TouchEvent).touches) { if ((ev as TouchEvent).touches) {
@ -136,6 +141,7 @@ class ActionHandler extends HTMLElement implements ActionHandler {
} }
if (options.hasHold) { if (options.hasHold) {
this.held = false;
this.timer = window.setTimeout(() => { this.timer = window.setTimeout(() => {
this.startAnimation(x, y); this.startAnimation(x, y);
this.held = true; this.held = true;
@ -144,24 +150,20 @@ class ActionHandler extends HTMLElement implements ActionHandler {
}; };
element.actionHandler.end = (ev: Event) => { element.actionHandler.end = (ev: Event) => {
// Don't respond on our own generated click // Don't respond when moved or scrolled while touch
if (!ev.isTrusted) { if (["touchend", "touchcancel"].includes(ev.type) && this.cancelled) {
return; return;
} }
// Prevent mouse event if touch event // Prevent mouse event if touch event
ev.preventDefault(); if (ev.cancelable) {
ev.preventDefault();
}
if (options.hasHold) { if (options.hasHold) {
if (
["touchend", "touchcancel"].includes(ev.type) &&
this.timer === undefined
) {
return;
}
clearTimeout(this.timer); clearTimeout(this.timer);
this.stopAnimation(); this.stopAnimation();
this.timer = undefined; this.timer = undefined;
} }
if (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 (
@ -179,8 +181,6 @@ class ActionHandler extends HTMLElement implements ActionHandler {
} }
} else { } else {
fireEvent(element, "action", { action: "tap" }); fireEvent(element, "action", { action: "tap" });
// Fire the click we prevented the action for
(ev.target as HTMLElement)?.click();
} }
}; };