diff --git a/setup.py b/setup.py index 32fae0f514..184ea304d9 100644 --- a/setup.py +++ b/setup.py @@ -2,7 +2,7 @@ from setuptools import setup, find_packages setup( name="home-assistant-frontend", - version="20190630.0", + version="20190702.0", description="The Home Assistant frontend", url="https://github.com/home-assistant/home-assistant-polymer", author="The Home Assistant Authors", diff --git a/src/components/ha-sidebar.ts b/src/components/ha-sidebar.ts index 3a9a1ed348..fddaa2b958 100644 --- a/src/components/ha-sidebar.ts +++ b/src/components/ha-sidebar.ts @@ -116,10 +116,13 @@ class HaSidebar extends LitElement { @property({ type: Boolean }) public alwaysExpand = false; @property({ type: Boolean, reflect: true }) public expanded = false; + @property({ type: Boolean, reflect: true }) public expandedWidth = false; @property() public _defaultPage?: string = localStorage.defaultPage || DEFAULT_PANEL; @property() private _externalConfig?: ExternalConfig; @property() private _notifications?: PersistentNotification[]; + private _expandTimeout?: number; + private _contractTimeout?: number; protected render() { const hass = this.hass; @@ -239,6 +242,7 @@ class HaSidebar extends LitElement { protected shouldUpdate(changedProps: PropertyValues): boolean { if ( changedProps.has("expanded") || + changedProps.has("expandedWidth") || changedProps.has("narrow") || changedProps.has("alwaysExpand") || changedProps.has("_externalConfig") || @@ -271,8 +275,17 @@ class HaSidebar extends LitElement { this._externalConfig = conf; }); } + // On tablets, there is no hover. So we receive click and mouseenter at the + // same time. In that case, we're going to cancel expanding, because it is + // going to require another tap outside the sidebar to trigger mouseleave + this.addEventListener("click", () => { + if (this._expandTimeout) { + clearTimeout(this._expandTimeout); + this._expandTimeout = undefined; + } + }); this.addEventListener("mouseenter", () => { - this.expanded = true; + this._expand(); }); this.addEventListener("mouseleave", () => { this._contract(); @@ -284,23 +297,48 @@ class HaSidebar extends LitElement { protected updated(changedProps) { super.updated(changedProps); - if (changedProps.has("alwaysExpand")) { - this.expanded = this.alwaysExpand; + if (changedProps.has("alwaysExpand") && this.alwaysExpand) { + this.expanded = true; + this.expandedWidth = true; } - if (SUPPORT_SCROLL_IF_NEEDED || !changedProps.has("hass")) { + if (!SUPPORT_SCROLL_IF_NEEDED || !changedProps.has("hass")) { return; } const oldHass = changedProps.get("hass") as HomeAssistant | undefined; if (!oldHass || oldHass.panelUrl !== this.hass.panelUrl) { - this.shadowRoot!.querySelector( - ".iron-selected" + const selectedEl = this.shadowRoot!.querySelector(".iron-selected"); + if (selectedEl) { // @ts-ignore - )!.scrollIntoViewIfNeeded(); + selectedEl.scrollIntoViewIfNeeded(); + } + } + } + + private _expand() { + // We debounce it one frame, because on tablets, the mouse-enter and + // click event fire at the same time. + this._expandTimeout = window.setTimeout(() => { + this.expanded = true; + this.expandedWidth = true; + }, 0); + if (this._contractTimeout) { + clearTimeout(this._contractTimeout); + this._contractTimeout = undefined; } } private _contract() { - this.expanded = this.alwaysExpand || false; + if (this._expandTimeout) { + clearTimeout(this._expandTimeout); + this._expandTimeout = undefined; + } + if (this.alwaysExpand) { + return; + } + this.expandedWidth = false; + this._contractTimeout = window.setTimeout(() => { + this.expanded = this.alwaysExpand || false; + }, 400); } private _handleShowNotificationDrawer() { @@ -338,7 +376,7 @@ class HaSidebar extends LitElement { contain: strict; transition-delay: 0.2s; } - :host([expanded]) { + :host([expandedwidth]) { width: 256px; } diff --git a/src/data/zha.ts b/src/data/zha.ts index 105bd93503..9c10944f8b 100644 --- a/src/data/zha.ts +++ b/src/data/zha.ts @@ -9,6 +9,9 @@ export interface ZHADevice { name: string; ieee: string; nwk: string; + lqi: string; + rssi: string; + last_seen: string; manufacturer: string; model: string; quirk_applied: boolean; diff --git a/src/dialogs/notifications/notification-drawer.js b/src/dialogs/notifications/notification-drawer.js index f86ce08a4e..0b1255a762 100644 --- a/src/dialogs/notifications/notification-drawer.js +++ b/src/dialogs/notifications/notification-drawer.js @@ -1,3 +1,4 @@ +import "@polymer/app-layout/app-drawer/app-drawer"; import "@material/mwc-button"; import "@polymer/paper-icon-button/paper-icon-button"; import "@polymer/app-layout/app-toolbar/app-toolbar"; @@ -6,11 +7,10 @@ import { html } from "@polymer/polymer/lib/utils/html-tag"; import { PolymerElement } from "@polymer/polymer/polymer-element"; import "./notification-item"; -import "../../components/ha-paper-icon-button-next"; +import "../../components/ha-paper-icon-button-prev"; import { EventsMixin } from "../../mixins/events-mixin"; import LocalizeMixin from "../../mixins/localize-mixin"; -import { computeRTL } from "../../common/util/compute_rtl"; import { subscribeNotifications } from "../../data/persistent_notification"; import computeDomain from "../../common/entity/compute_domain"; /* @@ -23,86 +23,12 @@ export class HuiNotificationDrawer extends EventsMixin( static get template() { return html` -
-
+
[[localize('ui.notification_drawer.title')]]
- +
-
+ `; } static get properties() { return { hass: Object, - narrow: { - type: Boolean, - reflectToAttribute: true, - }, open: { type: Boolean, - notify: true, observer: "_openChanged", }, - hidden: { - type: Boolean, - value: true, - reflectToAttribute: true, - }, notifications: { type: Array, computed: "_computeNotifications(open, hass, _notificationsBackend)", @@ -168,11 +83,6 @@ export class HuiNotificationDrawer extends EventsMixin( type: Array, value: [], }, - rtl: { - type: Boolean, - reflectToAttribute: true, - computed: "_computeRTL(hass)", - }, }; } @@ -196,36 +106,20 @@ export class HuiNotificationDrawer extends EventsMixin( } _openChanged(open) { - clearTimeout(this._openTimer); if (open) { // Render closed then animate open - this.hidden = false; - this._openTimer = setTimeout(() => { - this.classList.add("open"); - }, 50); this._unsubNotifications = subscribeNotifications( this.hass.connection, (notifications) => { this._notificationsBackend = notifications; } ); - } else { - // Animate closed then hide - this.classList.remove("open"); - this._openTimer = setTimeout(() => { - this.hidden = true; - }, 250); - if (this._unsubNotifications) { - this._unsubNotifications(); - this._unsubNotifications = undefined; - } + } else if (this._unsubNotifications) { + this._unsubNotifications(); + this._unsubNotifications = undefined; } } - _computeRTL(hass) { - return computeRTL(hass); - } - _computeNotifications(open, hass, notificationsBackend) { if (!open) { return []; @@ -239,8 +133,11 @@ export class HuiNotificationDrawer extends EventsMixin( } showDialog({ narrow }) { - this.open = true; - this.narrow = narrow; + this.style.setProperty( + "--app-drawer-width", + narrow ? window.innerWidth + "px" : "500px" + ); + this.$.drawer.open(); } } customElements.define("notification-drawer", HuiNotificationDrawer); diff --git a/src/panels/config/automation/ha-automation-picker.ts b/src/panels/config/automation/ha-automation-picker.ts index b0ef0ba577..d8c6259bfb 100644 --- a/src/panels/config/automation/ha-automation-picker.ts +++ b/src/panels/config/automation/ha-automation-picker.ts @@ -26,7 +26,6 @@ import { HomeAssistant } from "../../../types"; import { AutomationEntity } from "../../../data/automation"; import format_date_time from "../../../common/datetime/format_date_time"; import { fireEvent } from "../../../common/dom/fire_event"; -import { repeat } from "lit-html/directives/repeat"; @customElement("ha-automation-picker") class HaAutomationPicker extends LitElement { @@ -74,9 +73,7 @@ class HaAutomationPicker extends LitElement {

` - : repeat( - this.automations, - (automation) => automation.entity_id, + : this.automations.map( (automation) => html`
diff --git a/src/panels/config/script/ha-script-picker.ts b/src/panels/config/script/ha-script-picker.ts index 570cc2faa1..bdba5f7621 100644 --- a/src/panels/config/script/ha-script-picker.ts +++ b/src/panels/config/script/ha-script-picker.ts @@ -25,7 +25,6 @@ import { haStyle } from "../../../resources/styles"; import { HomeAssistant } from "../../../types"; import { triggerScript } from "../../../data/script"; import { showToast } from "../../../util/toast"; -import { repeat } from "lit-html/directives/repeat"; @customElement("ha-script-picker") class HaScriptPicker extends LitElement { @@ -57,9 +56,7 @@ class HaScriptPicker extends LitElement {

We couldn't find any scripts.

` - : repeat( - this.scripts, - (script) => script.entity_id, + : this.scripts.map( (script) => html`
${this.device!.ieee}
Nwk:
${formatAsPaddedHex(this.device!.nwk)}
+
LQI:
+
${this.device!.lqi || "Unknown"}
+
RSSI:
+
${this.device!.rssi || "Unknown"}
+
Last Seen:
+
${this.device!.last_seen || "Unknown"}
+
Power Source:
+
${this.device!.power_source || "Unknown"}
${ this.device!.quirk_applied ? html` @@ -360,7 +368,7 @@ class ZHADeviceCard extends LitElement { dl dt { padding-left: 12px; float: left; - width: 50px; + width: 100px; text-align: left; } dt dd { diff --git a/translations/fi.json b/translations/fi.json index 882ea594b8..da0849ac5d 100644 --- a/translations/fi.json +++ b/translations/fi.json @@ -401,7 +401,7 @@ "alias": "Nimi", "triggers": { "header": "Laukaisuehdot", - "introduction": "Laukaisuehdot määrittelevät, milloin automaatiota aletaan suorittaa. Samassa säännössä voi olla useita laukaisuehtoja. Kun laukaisuehto täyttyy, Home Assistant varmistaa ehdot. Jos ehdot täyttyvät, toiminto suoritetaan.\n\n[Lue lisää laukaisuehdoista (englanniksi).](https:\/\/home-assistant.io\/docs\/automation\/trigger\/)", + "introduction": "Laukaisuehdot määrittelevät, milloin automaatiota aletaan suorittaa. Samassa säännössä voi olla useita laukaisuehtoja. Kun laukaisuehto täyttyy, Home Assistant varmistaa ehdot. Jos ehdot täyttyvät, toiminto suoritetaan.", "add": "Laukaisuehto", "duplicate": "Kopioi", "delete": "Poista", @@ -483,7 +483,7 @@ }, "conditions": { "header": "Ehdot", - "introduction": "Ehdot ovat vapaaehtoinen osa automaatiosääntöä. Niillä voidaan estää toimintoa tapahtumasta, vaikka se olisi laukaistu. Ehdot näyttävät hyvin samanlaisilta kuin laukaisimet, mutta ne ovat eri asia. Laukaisimen tehtävä on tarkkailla järjestelmän tapahtumia. Ehto kuitenkin katsoo systeemin tilaa vain ja ainoastaan yhdellä hetkellä. Laukaisin voi esimerkiksi huomata, jos jokin vipu käännetään päälle. Ehto voi nähdä vain onko vipu päällä vai pois päältä.\n\n[Lue lisää ehdoista (englanniksi).](https:\/\/home-assistant.io\/docs\/scripts\/conditions\/)", + "introduction": "Ehdot ovat vapaaehtoinen osa automaatiosääntöä. Niillä voidaan estää toimintoa tapahtumasta, vaikka se olisi laukaistu. Ehdot näyttävät hyvin samanlaisilta kuin laukaisimet, mutta ne ovat eri asia. Laukaisimen tehtävä on tarkkailla järjestelmän tapahtumia. Ehto kuitenkin katsoo systeemin tilaa vain ja ainoastaan yhdellä hetkellä. Laukaisin voi esimerkiksi huomata, jos jokin vipu käännetään päälle. Ehto voi nähdä vain onko vipu päällä vai pois päältä.", "add": "Lisää ehto", "duplicate": "Kopioi", "delete": "Poista", @@ -529,7 +529,7 @@ }, "actions": { "header": "Toiminnot", - "introduction": "Home Assistant suorittaa toiminnot, kun automaatio laukaistaan.\n\n[Opi lisää toiminnoista (englanniksi).](https:\/\/home-assistant.io\/docs\/automation\/action\/)", + "introduction": "Home Assistant suorittaa toiminnot, kun automaatio laukaistaan.", "add": "Lisää toiminto", "duplicate": "Kopioi", "delete": "Poista",