mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-10 02:46:38 +00:00
parent
1ca242405b
commit
e5fe2950af
83
src/panels/config/cloud/cloud-alexa-pref.ts
Normal file
83
src/panels/config/cloud/cloud-alexa-pref.ts
Normal file
@ -0,0 +1,83 @@
|
||||
import { html, LitElement, PropertyDeclarations } from "@polymer/lit-element";
|
||||
import { TemplateResult } from "lit-html";
|
||||
import "@polymer/paper-button/paper-button";
|
||||
import "@polymer/paper-card/paper-card";
|
||||
import "@polymer/paper-toggle-button/paper-toggle-button";
|
||||
// tslint:disable-next-line
|
||||
import { PaperToggleButtonElement } from "@polymer/paper-toggle-button/paper-toggle-button";
|
||||
|
||||
import { fireEvent } from "../../../common/dom/fire_event";
|
||||
import { HomeAssistant } from "../../../types";
|
||||
import { updatePref } from "./data";
|
||||
import { CloudStatusLoggedIn } from "./types";
|
||||
|
||||
export class CloudAlexaPref extends LitElement {
|
||||
public hass?: HomeAssistant;
|
||||
public cloudStatus?: CloudStatusLoggedIn;
|
||||
|
||||
static get properties(): PropertyDeclarations {
|
||||
return {
|
||||
hass: {},
|
||||
cloudStatus: {},
|
||||
};
|
||||
}
|
||||
|
||||
protected render(): TemplateResult {
|
||||
return html`
|
||||
${this.renderStyle()}
|
||||
<paper-card heading="Alexa">
|
||||
<paper-toggle-button
|
||||
.checked="${this.cloudStatus!.alexa_enabled}"
|
||||
@change="${this._toggleChanged}"
|
||||
></paper-toggle-button>
|
||||
<div class="card-content">
|
||||
With the Alexa integration for Home Assistant Cloud you'll be able to control all your Home Assistant devices via any Alexa-enabled device.
|
||||
<ul>
|
||||
<li>
|
||||
To activate, search in the Alexa app for the Home Assistant Smart Home skill.
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.home-assistant.io/cloud/alexa/" target="_blank">
|
||||
Config documentation
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<em>This integration requires an Alexa-enabled device like the Amazon Echo.</em>
|
||||
</div>
|
||||
</paper-card>
|
||||
`;
|
||||
}
|
||||
|
||||
private async _toggleChanged(ev) {
|
||||
const toggle = ev.target as PaperToggleButtonElement;
|
||||
try {
|
||||
await updatePref(this.hass!, { alexa_enabled: toggle.checked! });
|
||||
fireEvent(this, "ha-refresh-cloud-status");
|
||||
} catch (err) {
|
||||
toggle.checked = !toggle.checked;
|
||||
}
|
||||
}
|
||||
|
||||
private renderStyle(): TemplateResult {
|
||||
return html`
|
||||
<style>
|
||||
a {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
paper-card > paper-toggle-button {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 16px;
|
||||
}
|
||||
</style>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
"cloud-alexa-pref": CloudAlexaPref;
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define("cloud-alexa-pref", CloudAlexaPref);
|
97
src/panels/config/cloud/cloud-google-pref.ts
Normal file
97
src/panels/config/cloud/cloud-google-pref.ts
Normal file
@ -0,0 +1,97 @@
|
||||
import { html, LitElement, PropertyDeclarations } from "@polymer/lit-element";
|
||||
import { TemplateResult } from "lit-html";
|
||||
import "@polymer/paper-button/paper-button";
|
||||
import "@polymer/paper-card/paper-card";
|
||||
import "@polymer/paper-toggle-button/paper-toggle-button";
|
||||
// tslint:disable-next-line
|
||||
import { PaperToggleButtonElement } from "@polymer/paper-toggle-button/paper-toggle-button";
|
||||
import "../../../components/buttons/ha-call-api-button";
|
||||
|
||||
import { fireEvent } from "../../../common/dom/fire_event";
|
||||
import { HomeAssistant } from "../../../types";
|
||||
import { updatePref } from "./data";
|
||||
import { CloudStatusLoggedIn } from "./types";
|
||||
|
||||
export class CloudGooglePref extends LitElement {
|
||||
public hass?: HomeAssistant;
|
||||
public cloudStatus?: CloudStatusLoggedIn;
|
||||
|
||||
static get properties(): PropertyDeclarations {
|
||||
return {
|
||||
hass: {},
|
||||
cloudStatus: {},
|
||||
};
|
||||
}
|
||||
|
||||
protected render(): TemplateResult {
|
||||
return html`
|
||||
${this.renderStyle()}
|
||||
<paper-card heading="Google Assistant">
|
||||
<paper-toggle-button
|
||||
.checked="${this.cloudStatus!.google_enabled}"
|
||||
@change="${this._toggleChanged}"
|
||||
></paper-toggle-button>
|
||||
<div class="card-content">
|
||||
With the Google Assistant integration for Home Assistant Cloud you'll be able to control all your Home Assistant devices via any Google Assistant-enabled device.
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://assistant.google.com/services/a/uid/00000091fd5fb875" target="_blank">
|
||||
Activate the Home Assistant skill for Google Assistant
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.home-assistant.io/cloud/google_assistant/" target="_blank">
|
||||
Config documentation
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<em>This integration requires a Google Assistant-enabled device like the Google Home or Android phone.</em>
|
||||
</div>
|
||||
<div class="card-actions">
|
||||
<ha-call-api-button
|
||||
.hass="${this.hass}"
|
||||
.disabled="${!this.cloudStatus!.google_enabled}"
|
||||
path="cloud/google_actions/sync"
|
||||
>Sync devices</ha-call-api-button>
|
||||
</div>
|
||||
</paper-card>
|
||||
`;
|
||||
}
|
||||
|
||||
private async _toggleChanged(ev) {
|
||||
const toggle = ev.target as PaperToggleButtonElement;
|
||||
try {
|
||||
await updatePref(this.hass!, { google_enabled: toggle.checked! });
|
||||
fireEvent(this, "ha-refresh-cloud-status");
|
||||
} catch (err) {
|
||||
toggle.checked = !toggle.checked;
|
||||
}
|
||||
}
|
||||
|
||||
private renderStyle(): TemplateResult {
|
||||
return html`
|
||||
<style>
|
||||
a {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
paper-card > paper-toggle-button {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 16px;
|
||||
}
|
||||
ha-call-api-button {
|
||||
color: var(--primary-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
</style>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
"cloud-google-pref": CloudGooglePref;
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define("cloud-google-pref", CloudGooglePref);
|
17
src/panels/config/cloud/data.ts
Normal file
17
src/panels/config/cloud/data.ts
Normal file
@ -0,0 +1,17 @@
|
||||
import { HomeAssistant } from "../../../types";
|
||||
import { SubscriptionInfo } from "./types";
|
||||
|
||||
export const fetchSubscriptionInfo = (hass: HomeAssistant) =>
|
||||
hass.callWS<SubscriptionInfo>({ type: "cloud/subscription" });
|
||||
|
||||
export const updatePref = (
|
||||
hass: HomeAssistant,
|
||||
prefs: {
|
||||
google_enabled?: boolean;
|
||||
alexa_enabled?: boolean;
|
||||
}
|
||||
) =>
|
||||
hass.callWS({
|
||||
type: "cloud/update_prefs",
|
||||
...prefs,
|
||||
});
|
@ -15,6 +15,10 @@ import formatDateTime from "../../../common/datetime/format_date_time";
|
||||
import EventsMixin from "../../../mixins/events-mixin";
|
||||
import LocalizeMixin from "../../../mixins/localize-mixin";
|
||||
|
||||
import { fetchSubscriptionInfo } from "./data";
|
||||
import "./cloud-alexa-pref";
|
||||
import "./cloud-google-pref";
|
||||
|
||||
/*
|
||||
* @appliesMixin EventsMixin
|
||||
* @appliesMixin LocalizeMixin
|
||||
@ -61,14 +65,6 @@ class HaConfigCloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
|
||||
color: var(--primary-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
a {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
paper-card > paper-toggle-button {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 16px;
|
||||
}
|
||||
</style>
|
||||
<hass-subpage header="Home Assistant Cloud">
|
||||
<div class="content">
|
||||
@ -115,56 +111,15 @@ class HaConfigCloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<paper-card heading="Alexa">
|
||||
<paper-toggle-button
|
||||
checked='[[cloudStatus.alexa_enabled]]'
|
||||
on-change='_alexaChanged'
|
||||
></paper-toggle-button>
|
||||
<div class="card-content">
|
||||
With the Alexa integration for Home Assistant Cloud you'll be able to control all your Home Assistant devices via any Alexa-enabled device.
|
||||
<ul>
|
||||
<li>
|
||||
To activate, search in the Alexa app for the Home Assistant Smart Home skill.
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.home-assistant.io/cloud/alexa/" target="_blank">
|
||||
Config documentation
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<p><em>This integration requires an Alexa-enabled device like the Amazon Echo.</em></p>
|
||||
</div>
|
||||
</paper-card>
|
||||
<cloud-alexa-pref
|
||||
hass="[[hass]]"
|
||||
cloud-status="[[cloudStatus]]"
|
||||
></cloud-alexa-pref>
|
||||
|
||||
<paper-card heading="Google Assistant">
|
||||
<paper-toggle-button
|
||||
checked='[[cloudStatus.google_enabled]]'
|
||||
on-change='_googleChanged'
|
||||
></paper-toggle-button>
|
||||
<div class="card-content">
|
||||
With the Google Assistant integration for Home Assistant Cloud you'll be able to control all your Home Assistant devices via any Google Assistant-enabled device.
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://assistant.google.com/services/a/uid/00000091fd5fb875" target="_blank">
|
||||
Activate the Home Assistant skill for Google Assistant
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.home-assistant.io/cloud/google_assistant/" target="_blank">
|
||||
Config documentation
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<p><em>This integration requires a Google Assistant-enabled device like the Google Home or Android phone.</em></p>
|
||||
</div>
|
||||
<div class="card-actions">
|
||||
<ha-call-api-button
|
||||
hass="[[hass]]"
|
||||
disabled='[[!cloudStatus.google_enabled]]'
|
||||
path="cloud/google_actions/sync"
|
||||
>Sync devices</ha-call-api-button>
|
||||
</div>
|
||||
</paper-card>
|
||||
<cloud-google-pref
|
||||
hass="[[hass]]"
|
||||
cloud-status="[[cloudStatus]]"
|
||||
></cloud-google-pref>
|
||||
</ha-config-section>
|
||||
</div>
|
||||
</hass-subpage>
|
||||
@ -189,7 +144,7 @@ class HaConfigCloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
|
||||
}
|
||||
|
||||
async _fetchSubscriptionInfo() {
|
||||
this._subscription = await this.hass.callWS({ type: "cloud/subscription" });
|
||||
this._subscription = await fetchSubscriptionInfo;
|
||||
if (this._subscription.provider && this.cloudStatus.cloud !== "connected") {
|
||||
this.fire("ha-refresh-cloud-status");
|
||||
}
|
||||
@ -220,26 +175,6 @@ class HaConfigCloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
|
||||
|
||||
return description;
|
||||
}
|
||||
|
||||
_alexaChanged(ev) {
|
||||
this._handleToggleChange("alexa_enabled", ev.target);
|
||||
}
|
||||
|
||||
_googleChanged(ev) {
|
||||
this._handleToggleChange("google_enabled", ev.target);
|
||||
}
|
||||
|
||||
async _handleToggleChange(property, element) {
|
||||
try {
|
||||
await this.hass.callWS({
|
||||
type: "cloud/update_prefs",
|
||||
[property]: element.checked,
|
||||
});
|
||||
this.fire("ha-refresh-cloud-status");
|
||||
} catch (err) {
|
||||
element.checked = !element.checked;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define("ha-config-cloud-account", HaConfigCloudAccount);
|
||||
|
24
src/panels/config/cloud/types.ts
Normal file
24
src/panels/config/cloud/types.ts
Normal file
@ -0,0 +1,24 @@
|
||||
interface EntityFilter {
|
||||
include_domains: string[];
|
||||
include_entities: string[];
|
||||
exclude_domains: string[];
|
||||
exclude_entities: string[];
|
||||
}
|
||||
interface CloudStatusBase {
|
||||
logged_in: boolean;
|
||||
cloud: "disconnected" | "connecting" | "connected";
|
||||
}
|
||||
|
||||
export type CloudStatusLoggedIn = CloudStatusBase & {
|
||||
email: string;
|
||||
google_enabled: boolean;
|
||||
google_entities: EntityFilter;
|
||||
alexa_enabled: boolean;
|
||||
alexa_entities: EntityFilter;
|
||||
};
|
||||
|
||||
export type CloudStatus = CloudStatusBase | CloudStatusLoggedIn;
|
||||
|
||||
export interface SubscriptionInfo {
|
||||
human_description: string;
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user