@@ -271,6 +273,10 @@ class HaWeatherCard extends LocalizeMixin(EventsMixin(PolymerElement)) {
return localize(`state.weather.${state}`) || state;
}
+ computeName(stateObj) {
+ return this.config.name || computeStateName(stateObj);
+ }
+
showWeatherIcon(condition) {
return condition in this.weatherIcons;
}
diff --git a/src/common/datetime/relative_time.ts b/src/common/datetime/relative_time.ts
index 7daabdc657..ef5a895df0 100644
--- a/src/common/datetime/relative_time.ts
+++ b/src/common/datetime/relative_time.ts
@@ -10,31 +10,43 @@ const langKey = ["second", "minute", "hour", "day"];
export default function relativeTime(
dateObj: Date,
- localize: LocalizeFunc
+ localize: LocalizeFunc,
+ options: {
+ compareTime?: Date;
+ includeTense?: boolean;
+ } = {}
): string {
- let delta = (new Date().getTime() - dateObj.getTime()) / 1000;
+ const compareTime = options.compareTime || new Date();
+ let delta = (compareTime.getTime() - dateObj.getTime()) / 1000;
const tense = delta >= 0 ? "past" : "future";
delta = Math.abs(delta);
+ let timeDesc;
+
for (let i = 0; i < tests.length; i++) {
if (delta < tests[i]) {
delta = Math.floor(delta);
- const timeDesc = localize(
+ timeDesc = localize(
`ui.components.relative_time.duration.${langKey[i]}`,
"count",
delta
);
- return localize(`ui.components.relative_time.${tense}`, "time", timeDesc);
+ break;
}
delta /= tests[i];
}
- delta = Math.floor(delta);
- const time = localize(
- "ui.components.relative_time.duration.week",
- "count",
- delta
- );
- return localize(`ui.components.relative_time.${tense}`, "time", time);
+ if (timeDesc === undefined) {
+ delta = Math.floor(delta);
+ timeDesc = localize(
+ "ui.components.relative_time.duration.week",
+ "count",
+ delta
+ );
+ }
+
+ return options.includeTense === false
+ ? timeDesc
+ : localize(`ui.components.relative_time.${tense}`, "time", timeDesc);
}
diff --git a/src/common/dom/fire_event.js b/src/common/dom/fire_event.ts
similarity index 72%
rename from src/common/dom/fire_event.js
rename to src/common/dom/fire_event.ts
index c9e6785b2a..57ecbd02c3 100644
--- a/src/common/dom/fire_event.js
+++ b/src/common/dom/fire_event.ts
@@ -28,6 +28,17 @@
// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+declare global {
+ // tslint:disable-next-line
+ interface HASSDomEvents {}
+}
+
+export type ValidHassDomEvent = keyof HASSDomEvents;
+
+export interface HASSDomEvent extends Event {
+ detail: T;
+}
+
/**
* Dispatches a custom event with an optional detail value.
*
@@ -35,23 +46,33 @@
* @param {*=} detail Detail value containing event-specific
* payload.
* @param {{ bubbles: (boolean|undefined),
- cancelable: (boolean|undefined),
- composed: (boolean|undefined) }=}
- * options Object specifying options. These may include:
- * `bubbles` (boolean, defaults to `true`),
- * `cancelable` (boolean, defaults to false), and
- * `node` on which to fire the event (HTMLElement, defaults to `this`).
- * @return {Event} The new event that was fired.
- */
-export const fireEvent = (node, type, detail, options) => {
+ * cancelable: (boolean|undefined),
+ * composed: (boolean|undefined) }=}
+ * options Object specifying options. These may include:
+ * `bubbles` (boolean, defaults to `true`),
+ * `cancelable` (boolean, defaults to false), and
+ * `node` on which to fire the event (HTMLElement, defaults to `this`).
+ * @return {Event} The new event that was fired.
+ */
+export const fireEvent = (
+ node: HTMLElement,
+ type: HassEvent,
+ detail?: HASSDomEvents[HassEvent],
+ options?: {
+ bubbles?: boolean;
+ cancelable?: boolean;
+ composed?: boolean;
+ }
+) => {
options = options || {};
+ // @ts-ignore
detail = detail === null || detail === undefined ? {} : detail;
const event = new Event(type, {
bubbles: options.bubbles === undefined ? true : options.bubbles,
cancelable: Boolean(options.cancelable),
composed: options.composed === undefined ? true : options.composed,
});
- event.detail = detail;
+ (event as any).detail = detail;
node.dispatchEvent(event);
return event;
};
diff --git a/src/common/entity/can_toggle_state.ts b/src/common/entity/can_toggle_state.ts
index 71a1b5d6c8..d990f363cb 100644
--- a/src/common/entity/can_toggle_state.ts
+++ b/src/common/entity/can_toggle_state.ts
@@ -2,6 +2,7 @@ import { HassEntity } from "home-assistant-js-websocket";
import canToggleDomain from "./can_toggle_domain";
import computeStateDomain from "./compute_state_domain";
import { HomeAssistant } from "../../types";
+import { supportsFeature } from "./supports-feature";
export default function canToggleState(
hass: HomeAssistant,
@@ -12,8 +13,7 @@ export default function canToggleState(
return stateObj.state === "on" || stateObj.state === "off";
}
if (domain === "climate") {
- // tslint:disable-next-line
- return (stateObj.attributes.supported_features! & 4096) !== 0;
+ return supportsFeature(stateObj, 4096);
}
return canToggleDomain(hass, domain);
diff --git a/src/common/entity/extract_views.ts b/src/common/entity/extract_views.ts
index bcc7084646..d5679e5518 100644
--- a/src/common/entity/extract_views.ts
+++ b/src/common/entity/extract_views.ts
@@ -1,14 +1,15 @@
-import { HassEntities, HassEntity } from "home-assistant-js-websocket";
+import { HassEntities } from "home-assistant-js-websocket";
import { DEFAULT_VIEW_ENTITY_ID } from "../const";
+import { GroupEntity } from "../../types";
// Return an ordered array of available views
-export default function extractViews(entities: HassEntities): HassEntity[] {
- const views: HassEntity[] = [];
+export default function extractViews(entities: HassEntities): GroupEntity[] {
+ const views: GroupEntity[] = [];
Object.keys(entities).forEach((entityId) => {
const entity = entities[entityId];
if (entity.attributes.view) {
- views.push(entity);
+ views.push(entity as GroupEntity);
}
});
diff --git a/src/common/entity/feature_class_names.ts b/src/common/entity/feature_class_names.ts
index d2d0cac26e..768e025a93 100644
--- a/src/common/entity/feature_class_names.ts
+++ b/src/common/entity/feature_class_names.ts
@@ -1,4 +1,5 @@
import { HassEntity } from "home-assistant-js-websocket";
+import { supportsFeature } from "./supports-feature";
// Expects classNames to be an object mapping feature-bit -> className
export default function featureClassNames(
@@ -9,12 +10,9 @@ export default function featureClassNames(
return "";
}
- const features = stateObj.attributes.supported_features;
-
return Object.keys(classNames)
.map((feature) =>
- // tslint:disable-next-line
- (features & Number(feature)) !== 0 ? classNames[feature] : ""
+ supportsFeature(stateObj, Number(feature)) ? classNames[feature] : ""
)
.filter((attr) => attr !== "")
.join(" ");
diff --git a/src/common/entity/get_view_entities.ts b/src/common/entity/get_view_entities.ts
index 62aa7e5d89..c3d249cfcd 100644
--- a/src/common/entity/get_view_entities.ts
+++ b/src/common/entity/get_view_entities.ts
@@ -8,7 +8,7 @@ import { GroupEntity } from "../../types";
export default function getViewEntities(
entities: HassEntities,
view: GroupEntity
-) {
+): HassEntities {
const viewEntities = {};
view.attributes.entity_id.forEach((entityId) => {
diff --git a/src/common/entity/split_by_groups.ts b/src/common/entity/split_by_groups.ts
index a894472d8c..aed1ab7f0e 100644
--- a/src/common/entity/split_by_groups.ts
+++ b/src/common/entity/split_by_groups.ts
@@ -1,18 +1,19 @@
import computeDomain from "./compute_domain";
-import { HassEntity, HassEntities } from "home-assistant-js-websocket";
+import { HassEntities } from "home-assistant-js-websocket";
+import { GroupEntity } from "../../types";
// Split a collection into a list of groups and a 'rest' list of ungrouped
// entities.
// Returns { groups: [], ungrouped: {} }
export default function splitByGroups(entities: HassEntities) {
- const groups: HassEntity[] = [];
+ const groups: GroupEntity[] = [];
const ungrouped: HassEntities = {};
Object.keys(entities).forEach((entityId) => {
const entity = entities[entityId];
if (computeDomain(entityId) === "group") {
- groups.push(entity);
+ groups.push(entity as GroupEntity);
} else {
ungrouped[entityId] = entity;
}
diff --git a/src/common/entity/supports-feature.ts b/src/common/entity/supports-feature.ts
new file mode 100644
index 0000000000..9aa833c035
--- /dev/null
+++ b/src/common/entity/supports-feature.ts
@@ -0,0 +1,9 @@
+import { HassEntity } from "home-assistant-js-websocket";
+
+export const supportsFeature = (
+ stateObj: HassEntity,
+ feature: number
+): boolean => {
+ // tslint:disable-next-line:no-bitwise
+ return (stateObj.attributes.supported_features! & feature) !== 0;
+};
diff --git a/src/common/util/compute_rtl.ts b/src/common/util/compute_rtl.ts
new file mode 100644
index 0000000000..62be0a1c7e
--- /dev/null
+++ b/src/common/util/compute_rtl.ts
@@ -0,0 +1,9 @@
+import { HomeAssistant } from "../../types";
+
+export function computeRTL(hass: HomeAssistant) {
+ const lang = hass.language || "en";
+ if (hass.translationMetadata.translations[lang]) {
+ return hass.translationMetadata.translations[lang].isRTL || false;
+ }
+ return false;
+}
diff --git a/src/common/util/uid.ts b/src/common/util/uid.ts
new file mode 100644
index 0000000000..f52a03e0cd
--- /dev/null
+++ b/src/common/util/uid.ts
@@ -0,0 +1,9 @@
+function s4() {
+ return Math.floor((1 + Math.random()) * 0x10000)
+ .toString(16)
+ .substring(1);
+}
+
+export function uid() {
+ return s4() + s4() + s4() + s4() + s4();
+}
diff --git a/src/components/entity/state-info.js b/src/components/entity/state-info.js
index 64b67da2e5..d2859d15d5 100644
--- a/src/components/entity/state-info.js
+++ b/src/components/entity/state-info.js
@@ -4,6 +4,7 @@ import { PolymerElement } from "@polymer/polymer/polymer-element";
import "../ha-relative-time";
import "./state-badge";
import computeStateName from "../../common/entity/compute_state_name";
+import { computeRTL } from "../../common/util/compute_rtl";
class StateInfo extends PolymerElement {
static get template() {
@@ -25,10 +26,20 @@ class StateInfo extends PolymerElement {
float: left;
}
+ :host([rtl]) state-badge {
+ float: right;
+ }
+
.info {
margin-left: 56px;
}
+ :host([rtl]) .info {
+ margin-right: 56px;
+ margin-left: 0;
+ text-align: right;
+ }
+
.name {
@apply --paper-font-common-nowrap;
color: var(--primary-text-color);
@@ -87,12 +98,21 @@ class StateInfo extends PolymerElement {
hass: Object,
stateObj: Object,
inDialog: Boolean,
+ rtl: {
+ type: Boolean,
+ reflectToAttribute: true,
+ computed: "computeRTL(hass)",
+ },
};
}
computeStateName(stateObj) {
return computeStateName(stateObj);
}
+
+ computeRTL(hass) {
+ return computeRTL(hass);
+ }
}
customElements.define("state-info", StateInfo);
diff --git a/src/components/ha-card.js b/src/components/ha-card.js
index 36cd9f760f..f497d69d02 100644
--- a/src/components/ha-card.js
+++ b/src/components/ha-card.js
@@ -12,6 +12,7 @@ class HaCard extends PolymerElement {
border-radius: 2px;
transition: all 0.3s ease-out;
background-color: var(--paper-card-background-color, white);
+ color: var(--primary-text-color);
}
.header {
@apply --paper-font-headline;
diff --git a/src/components/ha-cards.js b/src/components/ha-cards.js
index 587b41a0d7..c5ecbac486 100644
--- a/src/components/ha-cards.js
+++ b/src/components/ha-cards.js
@@ -123,7 +123,7 @@ class HaCards extends PolymerElement {
;
+}
+
+interface HassDialog extends HTMLElement {
+ showDialog(params: T);
+}
+
+declare global {
+ // for fire event
+ interface HASSDomEvents {
+ "register-dialog": RegisterDialogParams;
+ }
+ // for add event listener
+ interface HTMLElementEventMap {
+ "register-dialog": HASSDomEvent;
+ }
+}
+
+export const dialogManagerMixin = (superClass: Constructor) =>
+ class extends superClass {
+ public ready() {
+ super.ready();
+ this.addEventListener("register-dialog", (e) =>
+ this.registerDialog(e.detail)
+ );
+ }
+
+ private registerDialog({
+ dialogShowEvent,
+ dialogTag,
+ dialogImport,
+ }: RegisterDialogParams) {
+ let loaded: Promise>;
+
+ this.addEventListener(dialogShowEvent, (showEv) => {
+ if (!loaded) {
+ loaded = dialogImport().then(() => {
+ const dialogEl = document.createElement(dialogTag) as HassDialog;
+ this.shadowRoot!.appendChild(dialogEl);
+ (this as any).provideHass(dialogEl);
+ return dialogEl;
+ });
+ }
+ loaded.then((dialogEl) =>
+ dialogEl.showDialog((showEv as HASSDomEvent).detail)
+ );
+ });
+ }
+ };
diff --git a/src/layouts/app/home-assistant.js b/src/layouts/app/home-assistant.js
index 1d05e2bd1a..75f0722d49 100644
--- a/src/layouts/app/home-assistant.js
+++ b/src/layouts/app/home-assistant.js
@@ -4,6 +4,7 @@ import "@polymer/iron-flex-layout/iron-flex-layout-classes";
import { html } from "@polymer/polymer/lib/utils/html-tag";
import { PolymerElement } from "@polymer/polymer/polymer-element";
import { afterNextRender } from "@polymer/polymer/lib/utils/render-status";
+import { html as litHtml, LitElement } from "@polymer/lit-element";
import "../home-assistant-main";
import "../ha-init-page";
@@ -16,11 +17,13 @@ import TranslationsMixin from "./translations-mixin";
import ThemesMixin from "./themes-mixin";
import MoreInfoMixin from "./more-info-mixin";
import SidebarMixin from "./sidebar-mixin";
-import DialogManagerMixin from "./dialog-manager-mixin";
+import { dialogManagerMixin } from "./dialog-manager-mixin";
import ConnectionMixin from "./connection-mixin";
import NotificationMixin from "./notification-mixin";
import DisconnectToastMixin from "./disconnect-toast-mixin";
+LitElement.prototype.html = litHtml;
+
const ext = (baseClass, mixins) =>
mixins.reduceRight((base, mixin) => mixin(base), baseClass);
@@ -33,7 +36,7 @@ class HomeAssistant extends ext(PolymerElement, [
DisconnectToastMixin,
ConnectionMixin,
NotificationMixin,
- DialogManagerMixin,
+ dialogManagerMixin,
HassBaseMixin,
]) {
static get template() {
@@ -91,7 +94,7 @@ class HomeAssistant extends ext(PolymerElement, [
}
computePanelUrl(routeData) {
- return (routeData && routeData.panel) || "states";
+ return (routeData && routeData.panel) || "lovelace";
}
panelUrlChanged(newPanelUrl) {
diff --git a/src/layouts/home-assistant-main.js b/src/layouts/home-assistant-main.js
index 61a38b7bdc..06eeaf113c 100644
--- a/src/layouts/home-assistant-main.js
+++ b/src/layouts/home-assistant-main.js
@@ -2,16 +2,15 @@ import "@polymer/app-layout/app-drawer-layout/app-drawer-layout";
import "@polymer/app-layout/app-drawer/app-drawer";
import "@polymer/app-route/app-route";
import "@polymer/iron-media-query/iron-media-query";
-import "@polymer/iron-pages/iron-pages";
import { html } from "@polymer/polymer/lib/utils/html-tag";
import { PolymerElement } from "@polymer/polymer/polymer-element";
import "../util/ha-url-sync";
-import "./partial-cards";
import "./partial-panel-resolver";
import EventsMixin from "../mixins/events-mixin";
import NavigateMixin from "../mixins/navigate-mixin";
+import { computeRTL } from "../common/util/compute_rtl";
import(/* webpackChunkName: "ha-sidebar" */ "../components/ha-sidebar");
import(/* webpackChunkName: "voice-command-dialog" */ "../dialogs/ha-voice-command-dialog");
@@ -30,21 +29,16 @@ class HomeAssistantMain extends NavigateMixin(EventsMixin(PolymerElement)) {
:host([rtl]) {
direction: rtl;
}
- iron-pages,
+ partial-panel-resolver,
ha-sidebar {
/* allow a light tap highlight on the actual interface elements */
-webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
}
- iron-pages {
+ partial-panel-resolver {
height: 100%;
}
-
-
+
+
+ `;
+ }
+
+ private get _dialog(): PaperDialogElement {
+ return this.shadowRoot!.querySelector("paper-dialog")!;
+ }
+
+ private get _paperInput(): PaperInputElement {
+ return this.shadowRoot!.querySelector("paper-input")!;
+ }
+
+ private _closeDialog() {
+ this._dialog.close();
+ }
+
+ private async _disableWebhook() {
+ if (!confirm("Are you sure you want to disable this webhook?")) {
+ return;
+ }
+
+ this._params!.disableHook();
+ this._closeDialog();
+ }
+
+ private _copyClipboard(ev: FocusEvent) {
+ // paper-input -> iron-input -> input
+ const paperInput = ev.currentTarget as PaperInputElement;
+ const input = (paperInput.inputElement as any)
+ .inputElement as HTMLInputElement;
+ input.setSelectionRange(0, input.value.length);
+ try {
+ document.execCommand("copy");
+ paperInput.label = "COPIED TO CLIPBOARD";
+ } catch (err) {
+ // Copying failed. Oh no
+ }
+ }
+
+ private _restoreLabel() {
+ this._paperInput.label = inputLabel;
+ }
+
+ private _renderStyle() {
+ return html`
+
+ `;
+ }
+}
+
+declare global {
+ interface HTMLElementTagNameMap {
+ "cloud-webhook-manage-dialog": CloudWebhookManageDialog;
+ }
+}
+
+customElements.define("cloud-webhook-manage-dialog", CloudWebhookManageDialog);
diff --git a/src/panels/config/cloud/cloud-webhooks.ts b/src/panels/config/cloud/cloud-webhooks.ts
new file mode 100644
index 0000000000..bec6948ab3
--- /dev/null
+++ b/src/panels/config/cloud/cloud-webhooks.ts
@@ -0,0 +1,234 @@
+import {
+ html,
+ LitElement,
+ PropertyDeclarations,
+ PropertyValues,
+} from "@polymer/lit-element";
+import "@polymer/paper-toggle-button/paper-toggle-button";
+import "@polymer/paper-item/paper-item";
+import "@polymer/paper-item/paper-item-body";
+import "@polymer/paper-spinner/paper-spinner";
+import "../../../components/ha-card";
+
+import { fireEvent } from "../../../common/dom/fire_event";
+
+import { HomeAssistant, WebhookError } from "../../../types";
+import { WebhookDialogParams, CloudStatusLoggedIn } from "./types";
+import { Webhook, fetchWebhooks } from "../../../data/webhook";
+import {
+ createCloudhook,
+ deleteCloudhook,
+ CloudWebhook,
+} from "../../../data/cloud";
+
+declare global {
+ // for fire event
+ interface HASSDomEvents {
+ "manage-cloud-webhook": WebhookDialogParams;
+ }
+}
+
+export class CloudWebhooks extends LitElement {
+ public hass?: HomeAssistant;
+ public cloudStatus?: CloudStatusLoggedIn;
+ private _cloudHooks?: { [webhookId: string]: CloudWebhook };
+ private _localHooks?: Webhook[];
+ private _progress: string[];
+
+ static get properties(): PropertyDeclarations {
+ return {
+ hass: {},
+ cloudStatus: {},
+ _cloudHooks: {},
+ _localHooks: {},
+ _progress: {},
+ };
+ }
+
+ constructor() {
+ super();
+ this._progress = [];
+ }
+
+ public connectedCallback() {
+ super.connectedCallback();
+ this._fetchData();
+ }
+
+ protected render() {
+ return html`
+ ${this.renderStyle()}
+
+
+ `;
+ }
+
+ protected updated(changedProps: PropertyValues) {
+ if (changedProps.has("cloudStatus") && this.cloudStatus) {
+ this._cloudHooks = this.cloudStatus.prefs.cloudhooks || {};
+ }
+ }
+
+ private _renderBody() {
+ if (!this.cloudStatus || !this._localHooks || !this._cloudHooks) {
+ return html`
+
@@ -152,9 +161,26 @@ class HaConfigCloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
this._fetchSubscriptionInfo();
}
+ connectedCallback() {
+ super.connectedCallback();
+
+ if (!registeredWebhookDialog) {
+ registeredWebhookDialog = true;
+ fireEvent(this, "register-dialog", {
+ dialogShowEvent: "manage-cloud-webhook",
+ dialogTag: "cloud-webhook-manage-dialog",
+ dialogImport: () => import("./cloud-webhook-manage-dialog"),
+ });
+ }
+ }
+
async _fetchSubscriptionInfo() {
this._subscription = await fetchSubscriptionInfo(this.hass);
- if (this._subscription.provider && this.cloudStatus.cloud !== "connected") {
+ if (
+ this._subscription.provider &&
+ this.cloudStatus &&
+ this.cloudStatus.cloud !== "connected"
+ ) {
this.fire("ha-refresh-cloud-status");
}
}
diff --git a/src/panels/config/cloud/types.ts b/src/panels/config/cloud/types.ts
index a42ab724b0..80affe7d3f 100644
--- a/src/panels/config/cloud/types.ts
+++ b/src/panels/config/cloud/types.ts
@@ -1,3 +1,6 @@
+import { CloudWebhook } from "../../../data/cloud";
+import { Webhook } from "../../../data/webhook";
+
export interface EntityFilter {
include_domains: string[];
include_entities: string[];
@@ -19,6 +22,7 @@ export type CloudStatusLoggedIn = CloudStatusBase & {
google_enabled: boolean;
alexa_enabled: boolean;
google_allow_unlock: boolean;
+ cloudhooks: { [webhookId: string]: CloudWebhook };
};
};
@@ -27,3 +31,9 @@ export type CloudStatus = CloudStatusBase | CloudStatusLoggedIn;
export interface SubscriptionInfo {
human_description: string;
}
+
+export interface WebhookDialogParams {
+ webhook: Webhook;
+ cloudhook: CloudWebhook;
+ disableHook: () => void;
+}
diff --git a/src/panels/config/js/trigger/numeric_state.js b/src/panels/config/js/trigger/numeric_state.js
index 41cf07838d..cfa9ead60f 100644
--- a/src/panels/config/js/trigger/numeric_state.js
+++ b/src/panels/config/js/trigger/numeric_state.js
@@ -24,7 +24,18 @@ export default class NumericStateTrigger extends Component {
/* eslint-disable camelcase */
render({ trigger, hass, localize }) {
const { value_template, entity_id, below, above } = trigger;
+ let trgFor = trigger.for;
+ if (trgFor && (trgFor.hours || trgFor.minutes || trgFor.seconds)) {
+ // If the trigger was defined using the yaml dict syntax, convert it to
+ // the equivalent string format
+ let { hours = 0, minutes = 0, seconds = 0 } = trgFor;
+ hours = hours.toString();
+ minutes = minutes.toString().padStart(2, "0");
+ seconds = seconds.toString().padStart(2, "0");
+
+ trgFor = `${hours}:${minutes}:${seconds}`;
+ }
return (
-
+
({
+ type: "cloud/cloudhook/create",
+ webhook_id: webhookId,
+ });
+
+export const deleteCloudhook = (hass: HomeAssistant, webhookId: string) =>
+ hass.callWS({
+ type: "cloud/cloudhook/delete",
+ webhook_id: webhookId,
+ });
diff --git a/src/data/entity.ts b/src/data/entity.ts
new file mode 100644
index 0000000000..69028008b9
--- /dev/null
+++ b/src/data/entity.ts
@@ -0,0 +1 @@
+export const UNAVAILABLE = "unavailable";
diff --git a/src/data/light.ts b/src/data/light.ts
new file mode 100644
index 0000000000..8d0a701d29
--- /dev/null
+++ b/src/data/light.ts
@@ -0,0 +1,7 @@
+export const SUPPORT_BRIGHTNESS = 1;
+export const SUPPORT_COLOR_TEMP = 2;
+export const SUPPORT_EFFECT = 4;
+export const SUPPORT_FLASH = 8;
+export const SUPPORT_COLOR = 16;
+export const SUPPORT_TRANSITION = 32;
+export const SUPPORT_WHITE_VALUE = 128;
diff --git a/src/data/lovelace.ts b/src/data/lovelace.ts
new file mode 100644
index 0000000000..cd806b682b
--- /dev/null
+++ b/src/data/lovelace.ts
@@ -0,0 +1,150 @@
+import { HomeAssistant } from "../types";
+
+export interface LovelaceConfig {
+ _frontendAuto: boolean;
+ title?: string;
+ views: LovelaceViewConfig[];
+}
+
+export interface LovelaceViewConfig {
+ title?: string;
+ badges?: string[];
+ cards?: LovelaceCardConfig[];
+ id?: string;
+ icon?: string;
+ theme?: string;
+}
+
+export interface LovelaceCardConfig {
+ id?: string;
+ type: string;
+ [key: string]: any;
+}
+
+export interface ToggleActionConfig {
+ action: "toggle";
+}
+
+export interface CallServiceActionConfig {
+ action: "call-service";
+ service: string;
+ service_data?: { [key: string]: any };
+}
+
+export interface NavigateActionConfig {
+ action: "navigate";
+ navigation_path: string;
+}
+
+export interface MoreInfoActionConfig {
+ action: "more-info";
+}
+
+export interface NoActionConfig {
+ action: "none";
+}
+
+export type ActionConfig =
+ | ToggleActionConfig
+ | CallServiceActionConfig
+ | NavigateActionConfig
+ | MoreInfoActionConfig
+ | NoActionConfig;
+
+export const fetchConfig = (hass: HomeAssistant): Promise =>
+ hass.callWS({
+ type: "lovelace/config",
+ });
+
+export const migrateConfig = (hass: HomeAssistant): Promise =>
+ hass.callWS({
+ type: "lovelace/config/migrate",
+ });
+
+export const saveConfig = (
+ hass: HomeAssistant,
+ config: LovelaceConfig | string,
+ format: "json" | "yaml"
+): Promise =>
+ hass.callWS({
+ type: "lovelace/config/save",
+ config,
+ format,
+ });
+
+export const getCardConfig = (
+ hass: HomeAssistant,
+ cardId: string
+): Promise =>
+ hass.callWS({
+ type: "lovelace/config/card/get",
+ card_id: cardId,
+ });
+
+export const updateCardConfig = (
+ hass: HomeAssistant,
+ cardId: string,
+ config: LovelaceCardConfig | string,
+ format: "json" | "yaml"
+): Promise =>
+ hass.callWS({
+ type: "lovelace/config/card/update",
+ card_id: cardId,
+ card_config: config,
+ format,
+ });
+
+export const deleteCard = (
+ hass: HomeAssistant,
+ cardId: string
+): Promise =>
+ hass.callWS({
+ type: "lovelace/config/card/delete",
+ card_id: cardId,
+ });
+
+export const addCard = (
+ hass: HomeAssistant,
+ viewId: string,
+ config: LovelaceCardConfig | string,
+ format: "json" | "yaml"
+): Promise =>
+ hass.callWS({
+ type: "lovelace/config/card/add",
+ view_id: viewId,
+ card_config: config,
+ format,
+ });
+
+export const updateViewConfig = (
+ hass: HomeAssistant,
+ viewId: string,
+ config: LovelaceViewConfig | string,
+ format: "json" | "yaml"
+): Promise =>
+ hass.callWS({
+ type: "lovelace/config/view/update",
+ view_id: viewId,
+ view_config: config,
+ format,
+ });
+
+export const deleteView = (
+ hass: HomeAssistant,
+ viewId: string
+): Promise =>
+ hass.callWS({
+ type: "lovelace/config/view/delete",
+ view_id: viewId,
+ });
+
+export const addView = (
+ hass: HomeAssistant,
+ config: LovelaceViewConfig | string,
+ format: "json" | "yaml"
+): Promise =>
+ hass.callWS({
+ type: "lovelace/config/view/add",
+ view_config: config,
+ format,
+ });
diff --git a/src/data/media-player.ts b/src/data/media-player.ts
new file mode 100644
index 0000000000..7d89d4d544
--- /dev/null
+++ b/src/data/media-player.ts
@@ -0,0 +1,4 @@
+export const SUPPORT_PAUSE = 1;
+export const SUPPORT_NEXT_TRACK = 32;
+export const SUPPORTS_PLAY = 16384;
+export const OFF_STATES = ["off", "idle"];
diff --git a/src/data/shopping-list.ts b/src/data/shopping-list.ts
index 14ff992abd..d3dbdd8327 100644
--- a/src/data/shopping-list.ts
+++ b/src/data/shopping-list.ts
@@ -11,31 +11,30 @@ export const fetchItems = (hass: HomeAssistant): Promise =>
type: "shopping_list/items",
});
-export const saveEdit = (
+export const updateItem = (
hass: HomeAssistant,
itemId: number,
- name: string
+ item: {
+ name?: string;
+ complete?: boolean;
+ }
): Promise =>
- hass.callApi("POST", "shopping_list/item/" + itemId, {
- name,
- });
-
-export const completeItem = (
- hass: HomeAssistant,
- itemId: number,
- complete: boolean
-): Promise =>
- hass.callApi("POST", "shopping_list/item/" + itemId, {
- complete,
+ hass.callWS({
+ type: "shopping_list/items/update",
+ item_id: itemId,
+ ...item,
});
export const clearItems = (hass: HomeAssistant): Promise =>
- hass.callApi("POST", "shopping_list/clear_completed");
+ hass.callWS({
+ type: "shopping_list/items/clear",
+ });
export const addItem = (
hass: HomeAssistant,
name: string
): Promise =>
- hass.callApi("POST", "shopping_list/item", {
+ hass.callWS({
+ type: "shopping_list/items/add",
name,
});
diff --git a/src/data/webhook.ts b/src/data/webhook.ts
new file mode 100644
index 0000000000..98ae07495a
--- /dev/null
+++ b/src/data/webhook.ts
@@ -0,0 +1,12 @@
+import { HomeAssistant } from "../types";
+
+export interface Webhook {
+ webhook_id: string;
+ domain: string;
+ name: string;
+}
+
+export const fetchWebhooks = (hass: HomeAssistant): Promise =>
+ hass.callWS({
+ type: "webhook/list",
+ });
diff --git a/src/dialogs/more-info/controls/more-info-climate.js b/src/dialogs/more-info/controls/more-info-climate.js
index bde53875c2..27d29d228b 100644
--- a/src/dialogs/more-info/controls/more-info-climate.js
+++ b/src/dialogs/more-info/controls/more-info-climate.js
@@ -13,6 +13,7 @@ import "../../../components/ha-paper-slider";
import attributeClassNames from "../../../common/entity/attribute_class_names";
import featureClassNames from "../../../common/entity/feature_class_names";
+import { supportsFeature } from "../../../common/entity/supports-feature";
import EventsMixin from "../../../mixins/events-mixin";
import LocalizeMixin from "../../../mixins/localize-mixin";
@@ -385,45 +386,45 @@ class MoreInfoClimate extends LocalizeMixin(EventsMixin(PolymerElement)) {
supportsTemperature(stateObj) {
return (
- (stateObj.attributes.supported_features & 1) !== 0 &&
+ supportsFeature(stateObj, 1) &&
typeof stateObj.attributes.temperature === "number"
);
}
supportsTemperatureRange(stateObj) {
return (
- (stateObj.attributes.supported_features & 6) !== 0 &&
+ supportsFeature(stateObj, 6) &&
(typeof stateObj.attributes.target_temp_low === "number" ||
typeof stateObj.attributes.target_temp_high === "number")
);
}
supportsHumidity(stateObj) {
- return (stateObj.attributes.supported_features & 8) !== 0;
+ return supportsFeature(stateObj, 8);
}
supportsFanMode(stateObj) {
- return (stateObj.attributes.supported_features & 64) !== 0;
+ return supportsFeature(stateObj, 64);
}
supportsOperationMode(stateObj) {
- return (stateObj.attributes.supported_features & 128) !== 0;
+ return supportsFeature(stateObj, 128);
}
supportsSwingMode(stateObj) {
- return (stateObj.attributes.supported_features & 512) !== 0;
+ return supportsFeature(stateObj, 512);
}
supportsAwayMode(stateObj) {
- return (stateObj.attributes.supported_features & 1024) !== 0;
+ return supportsFeature(stateObj, 1024);
}
supportsAuxHeat(stateObj) {
- return (stateObj.attributes.supported_features & 2048) !== 0;
+ return supportsFeature(stateObj, 2048);
}
supportsOn(stateObj) {
- return (stateObj.attributes.supported_features & 4096) !== 0;
+ return supportsFeature(stateObj, 4096);
}
computeClassNames(stateObj) {
diff --git a/src/dialogs/more-info/controls/more-info-vacuum.js b/src/dialogs/more-info/controls/more-info-vacuum.js
index e822a53b14..d46a699788 100644
--- a/src/dialogs/more-info/controls/more-info-vacuum.js
+++ b/src/dialogs/more-info/controls/more-info-vacuum.js
@@ -8,6 +8,7 @@ import { html } from "@polymer/polymer/lib/utils/html-tag";
import { PolymerElement } from "@polymer/polymer/polymer-element";
import "../../../components/ha-attributes";
+import { supportsFeature } from "../../../common/entity/supports-feature";
class MoreInfoVacuum extends PolymerElement {
static get template() {
@@ -158,57 +159,53 @@ class MoreInfoVacuum extends PolymerElement {
};
}
- /* eslint-disable no-bitwise */
-
supportsPause(stateObj) {
- return (stateObj.attributes.supported_features & 4) !== 0;
+ return supportsFeature(stateObj, 4);
}
supportsStop(stateObj) {
- return (stateObj.attributes.supported_features & 8) !== 0;
+ return supportsFeature(stateObj, 8);
}
supportsReturnHome(stateObj) {
- return (stateObj.attributes.supported_features & 16) !== 0;
+ return supportsFeature(stateObj, 16);
}
supportsFanSpeed(stateObj) {
- return (stateObj.attributes.supported_features & 32) !== 0;
+ return supportsFeature(stateObj, 32);
}
supportsBattery(stateObj) {
- return (stateObj.attributes.supported_features & 64) !== 0;
+ return supportsFeature(stateObj, 64);
}
supportsStatus(stateObj) {
- return (stateObj.attributes.supported_features & 128) !== 0;
+ return supportsFeature(stateObj, 128);
}
supportsLocate(stateObj) {
- return (stateObj.attributes.supported_features & 512) !== 0;
+ return supportsFeature(stateObj, 512);
}
supportsCleanSpot(stateObj) {
- return (stateObj.attributes.supported_features & 1024) !== 0;
+ return supportsFeature(stateObj, 1024);
}
supportsStart(stateObj) {
- return (stateObj.attributes.supported_features & 8192) !== 0;
+ return supportsFeature(stateObj, 8192);
}
supportsCommandBar(stateObj) {
return (
- ((stateObj.attributes.supported_features & 4) !== 0) |
- ((stateObj.attributes.supported_features & 8) !== 0) |
- ((stateObj.attributes.supported_features & 16) !== 0) |
- ((stateObj.attributes.supported_features & 512) !== 0) |
- ((stateObj.attributes.supported_features & 1024) !== 0) |
- ((stateObj.attributes.supported_features & 8192) !== 0)
+ supportsFeature(stateObj, 4) |
+ supportsFeature(stateObj, 8) |
+ supportsFeature(stateObj, 16) |
+ supportsFeature(stateObj, 512) |
+ supportsFeature(stateObj, 1024) |
+ supportsFeature(stateObj, 8192)
);
}
- /* eslint-enable no-bitwise */
-
fanSpeedChanged(fanSpeedIndex) {
var fanSpeedInput;
// Selected Option will transition to '' before transitioning to new value
diff --git a/src/dialogs/more-info/controls/more-info-water_heater.js b/src/dialogs/more-info/controls/more-info-water_heater.js
index e74fb7a1e6..475d338c62 100644
--- a/src/dialogs/more-info/controls/more-info-water_heater.js
+++ b/src/dialogs/more-info/controls/more-info-water_heater.js
@@ -12,6 +12,7 @@ import "../../../components/ha-water_heater-control";
import "../../../components/ha-paper-slider";
import featureClassNames from "../../../common/entity/feature_class_names";
+import { supportsFeature } from "../../../common/entity/supports-feature";
import EventsMixin from "../../../mixins/events-mixin";
import LocalizeMixin from "../../../mixins/localize-mixin";
@@ -198,17 +199,17 @@ class MoreInfoWaterHeater extends LocalizeMixin(EventsMixin(PolymerElement)) {
supportsTemperature(stateObj) {
return (
- (stateObj.attributes.supported_features & 1) !== 0 &&
+ supportsFeature(stateObj, 1) &&
typeof stateObj.attributes.temperature === "number"
);
}
supportsOperationMode(stateObj) {
- return (stateObj.attributes.supported_features & 2) !== 0;
+ return supportsFeature(stateObj, 2);
}
supportsAwayMode(stateObj) {
- return (stateObj.attributes.supported_features & 4) !== 0;
+ return supportsFeature(stateObj, 4);
}
computeClassNames(stateObj) {
diff --git a/src/dialogs/more-info/more-info-controls.js b/src/dialogs/more-info/more-info-controls.js
index fc639af560..e608b5e9dd 100644
--- a/src/dialogs/more-info/more-info-controls.js
+++ b/src/dialogs/more-info/more-info-controls.js
@@ -16,6 +16,7 @@ import computeStateDomain from "../../common/entity/compute_state_domain";
import isComponentLoaded from "../../common/config/is_component_loaded";
import { DOMAINS_MORE_INFO_NO_HISTORY } from "../../common/const";
import EventsMixin from "../../mixins/events-mixin";
+import { computeRTL } from "../../common/util/compute_rtl";
const DOMAINS_NO_INFO = ["camera", "configurator", "history_graph"];
/*
@@ -58,6 +59,11 @@ class MoreInfoControls extends EventsMixin(PolymerElement) {
:host([domain="camera"]) paper-dialog-scrollable {
margin: 0 -24px -21px;
}
+
+ :host([rtl]) app-toolbar {
+ direction: rtl;
+ text-align: right;
+ }
@@ -147,6 +153,11 @@ class MoreInfoControls extends EventsMixin(PolymerElement) {
hoursToShow: 24,
},
},
+ rtl: {
+ type: Boolean,
+ reflectToAttribute: true,
+ computed: "_computeRTL(hass)",
+ },
};
}
@@ -190,5 +201,9 @@ class MoreInfoControls extends EventsMixin(PolymerElement) {
_gotoSettings() {
this.fire("more-info-page", { page: "settings" });
}
+
+ _computeRTL(hass) {
+ return computeRTL(hass);
+ }
}
customElements.define("more-info-controls", MoreInfoControls);
diff --git a/src/html/onboarding.html.template b/src/html/onboarding.html.template
index 78b76f3a44..cb3587d302 100644
--- a/src/html/onboarding.html.template
+++ b/src/html/onboarding.html.template
@@ -33,7 +33,7 @@
Home Assistant
- Initializing…
+ Initializing
<% if (!latestBuild) { %>
diff --git a/src/layouts/app/dialog-manager-mixin.js b/src/layouts/app/dialog-manager-mixin.js
deleted file mode 100644
index 7deeaa2fd0..0000000000
--- a/src/layouts/app/dialog-manager-mixin.js
+++ /dev/null
@@ -1,25 +0,0 @@
-export default (superClass) =>
- class extends superClass {
- ready() {
- super.ready();
- this.addEventListener("register-dialog", (e) =>
- this.registerDialog(e.detail)
- );
- }
-
- registerDialog({ dialogShowEvent, dialogTag, dialogImport }) {
- let loaded = null;
-
- this.addEventListener(dialogShowEvent, (showEv) => {
- if (!loaded) {
- loaded = dialogImport().then(() => {
- const dialogEl = document.createElement(dialogTag);
- this.shadowRoot.appendChild(dialogEl);
- this.provideHass(dialogEl);
- return dialogEl;
- });
- }
- loaded.then((dialogEl) => dialogEl.showDialog(showEv.detail));
- });
- }
- };
diff --git a/src/layouts/app/dialog-manager-mixin.ts b/src/layouts/app/dialog-manager-mixin.ts
new file mode 100644
index 0000000000..90295c3866
--- /dev/null
+++ b/src/layouts/app/dialog-manager-mixin.ts
@@ -0,0 +1,56 @@
+import { PolymerElement } from "@polymer/polymer";
+import { Constructor } from "@polymer/lit-element";
+import { HASSDomEvent, ValidHassDomEvent } from "../../common/dom/fire_event";
+
+interface RegisterDialogParams {
+ dialogShowEvent: keyof HASSDomEvents;
+ dialogTag: keyof HTMLElementTagNameMap;
+ dialogImport: () => PromiseWebhook for ${webhook.name}
+
+
+
+
+ The webhook is available at the following url:
++ If you no longer want to use this webhook, you can + . +
+
+ Anything that is configured to be triggered by a webhook can be given
+ a publicly accessible URL to allow you to send data back to Home
+ Assistant from anywhere, without exposing your instance to the
+ internet.
+
+
+ ${this._renderBody()}
+
+
+ Loading…
+ `;
+ }
+
+ return this._localHooks.map(
+ (entry) => html`
+
+
+
+ ${
+ this._progress.includes(entry.webhook_id)
+ ? html`
+ Manage
+ `
+ : html`
+
+ `
+ );
+ }
+
+ private _showDialog(webhookId: string) {
+ const webhook = this._localHooks!.find(
+ (ent) => ent.webhook_id === webhookId
+ );
+ const cloudhook = this._cloudHooks![webhookId];
+ const params: WebhookDialogParams = {
+ webhook: webhook!,
+ cloudhook,
+ disableHook: () => this._disableWebhook(webhookId),
+ };
+ fireEvent(this, "manage-cloud-webhook", params);
+ }
+
+ private _handleManageButton(ev: MouseEvent) {
+ const entry = (ev.currentTarget as any).parentElement.entry as Webhook;
+ this._showDialog(entry.webhook_id);
+ }
+
+ private async _enableWebhook(ev: MouseEvent) {
+ const entry = (ev.currentTarget as any).parentElement.entry;
+ this._progress = [...this._progress, entry.webhook_id];
+ let updatedWebhook;
+
+ try {
+ updatedWebhook = await createCloudhook(this.hass!, entry.webhook_id);
+ } catch (err) {
+ alert((err as WebhookError).message);
+ return;
+ } finally {
+ this._progress = this._progress.filter((wid) => wid !== entry.webhook_id);
+ }
+
+ this._cloudHooks = {
+ ...this._cloudHooks,
+ [entry.webhook_id]: updatedWebhook,
+ };
+
+ // Only open dialog if we're not also enabling others, otherwise it's confusing
+ if (this._progress.length === 0) {
+ this._showDialog(entry.webhook_id);
+ }
+ }
+
+ private async _disableWebhook(webhookId: string) {
+ this._progress = [...this._progress, webhookId];
+ try {
+ await deleteCloudhook(this.hass!, webhookId!);
+ } catch (err) {
+ alert(`Failed to disable webhook: ${(err as WebhookError).message}`);
+ return;
+ } finally {
+ this._progress = this._progress.filter((wid) => wid !== webhookId);
+ }
+
+ // Remove cloud related parts from entry.
+ const { [webhookId]: disabledHook, ...newHooks } = this._cloudHooks!;
+ this._cloudHooks = newHooks;
+ }
+
+ private async _fetchData() {
+ this._localHooks = await fetchWebhooks(this.hass!);
+ }
+
+ private renderStyle() {
+ return html`
+
+ `;
+ }
+}
+
+declare global {
+ interface HTMLElementTagNameMap {
+ "cloud-webhooks": CloudWebhooks;
+ }
+}
+
+customElements.define("cloud-webhooks", CloudWebhooks);
diff --git a/src/panels/config/cloud/ha-config-cloud-account.js b/src/panels/config/cloud/ha-config-cloud-account.js
index 516bc0f3d1..b5305af2c7 100644
--- a/src/panels/config/cloud/ha-config-cloud-account.js
+++ b/src/panels/config/cloud/ha-config-cloud-account.js
@@ -10,15 +10,19 @@ import "../../../layouts/hass-subpage";
import "../../../resources/ha-style";
import "../ha-config-section";
+import "./cloud-webhooks";
import formatDateTime from "../../../common/datetime/format_date_time";
import EventsMixin from "../../../mixins/events-mixin";
import LocalizeMixin from "../../../mixins/localize-mixin";
+import { fireEvent } from "../../../common/dom/fire_event";
import { fetchSubscriptionInfo } from "./data";
import "./cloud-alexa-pref";
import "./cloud-google-pref";
+let registeredWebhookDialog = false;
+
/*
* @appliesMixin EventsMixin
* @appliesMixin LocalizeMixin
@@ -129,6 +133,11 @@ class HaConfigCloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
hass="[[hass]]"
cloud-status="[[cloudStatus]]"
>
+
+
+ ${entry.name}
+ ${
+ entry.domain === entry.name.toLowerCase()
+ ? ""
+ : ` (${entry.domain})`
+ }
+
+ ${entry.webhook_id}
+
+
+ `
+ : this._cloudHooks![entry.webhook_id]
+ ? html`
+ - Try out the new Lovelace UI (experimental) + Go back to the old states page
[[_defaultPageText()]]