diff --git a/public/static/images/logo_nabu_casa.png b/public/static/images/logo_nabu_casa.png new file mode 100644 index 0000000000..ea3817f2de Binary files /dev/null and b/public/static/images/logo_nabu_casa.png differ diff --git a/src/dialogs/voice-assistant-setup/styles.ts b/src/dialogs/voice-assistant-setup/styles.ts index e0357bb996..d7b12d52a6 100644 --- a/src/dialogs/voice-assistant-setup/styles.ts +++ b/src/dialogs/voice-assistant-setup/styles.ts @@ -8,7 +8,6 @@ export const AssistantSetupStyles = [ align-items: center; text-align: center; min-height: 300px; - max-width: 500px; display: flex; flex-direction: column; justify-content: space-between; @@ -21,16 +20,27 @@ export const AssistantSetupStyles = [ } .content img { width: 120px; - margin-top: 68px; - margin-bottom: 68px; + } + @media all and (max-width: 450px), all and (max-height: 500px) { + .content img { + margin-top: 68px; + margin-bottom: 68px; + } } .footer { - width: 100%; display: flex; + width: 100%; + flex-direction: row; + justify-content: flex-end; + } + .footer.full-width { flex-direction: column; } - .footer ha-button { + .footer.full-width ha-button { width: 100%; } + .footer.side-by-side { + justify-content: space-between; + } `, ]; diff --git a/src/dialogs/voice-assistant-setup/voice-assistant-setup-dialog.ts b/src/dialogs/voice-assistant-setup/voice-assistant-setup-dialog.ts index 899d72ac89..2e79b4bd49 100644 --- a/src/dialogs/voice-assistant-setup/voice-assistant-setup-dialog.ts +++ b/src/dialogs/voice-assistant-setup/voice-assistant-setup-dialog.ts @@ -1,5 +1,5 @@ import "@material/mwc-button/mwc-button"; -import { mdiChevronLeft } from "@mdi/js"; +import { mdiChevronLeft, mdiClose } from "@mdi/js"; import { css, CSSResultGroup, html, LitElement, nothing } from "lit"; import { customElement, property, state } from "lit/decorators"; import memoizeOne from "memoize-one"; @@ -50,6 +50,8 @@ export class HaVoiceAssistantSetupDialog extends LitElement { private _previousSteps: STEP[] = []; + private _nextStep?: STEP; + public async showDialog( params: VoiceAssistantSetupDialogParams ): Promise { @@ -113,19 +115,38 @@ export class HaVoiceAssistantSetupDialog extends LitElement { @closed=${this._dialogClosed} .heading=${"Voice Satellite setup"} hideActions + escapeKeyAction + scrimClickAction > ${this._previousSteps.length ? html`` + : this._step !== STEP.UPDATE + ? html`` + : nothing} + ${this._step === STEP.WAKEWORD || + this._step === STEP.AREA || + this._step === STEP.PIPELINE + ? html`Skip` : nothing} -
+
${this._step === STEP.UPDATE ? html` -

Home Assistant Cloud:

-
-
- ${!this._showFirst ? "…" : "Turn on the lights in the bedroom"} -
- ${this._showFirst - ? html`
0.2 seconds
` - : nothing} - ${this._showFirst - ? html`
- ${!this._showSecond ? "…" : "Turned on the lights"} -
` - : nothing} - ${this._showSecond - ? html`
0.4 seconds
` - : nothing} -
-

Raspberry Pi 4:

+

Raspberry Pi 4

${!this._showThird ? "…" : "Turn on the lights in the bedroom"} @@ -76,8 +59,28 @@ export class HaVoiceAssistantSetupStepAddons extends LitElement { ? html`
5 seconds
` : nothing}
+

Home Assistant Cloud

+
+
+ ${!this._showFirst ? "…" : "Turn on the lights in the bedroom"} +
+ ${this._showFirst + ? html`
0.2 seconds
` + : nothing} + ${this._showFirst + ? html`
+ ${!this._showSecond ? "…" : "Turned on the lights"} +
` + : nothing} + ${this._showSecond + ? html`
0.4 seconds
` + : nothing} +
-
+
+ Try Home Assistant Cloud Learn how to setup local assistant - I already have a local assistant + Learn more +
`; } - private _close() { - fireEvent(this, "closed"); + private _goToCloud() { + fireEvent(this, "next-step", { step: STEP.CLOUD }); } private _skip() { diff --git a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-area.ts b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-area.ts index 6552172e0d..d1db3fdd7a 100644 --- a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-area.ts +++ b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-area.ts @@ -28,7 +28,7 @@ export class HaVoiceAssistantSetupStepArea extends LitElement { >
- Next + Next
`; } diff --git a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-change-wake-word.ts b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-change-wake-word.ts index 4a229691b3..1f6e8740e2 100644 --- a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-change-wake-word.ts +++ b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-change-wake-word.ts @@ -25,8 +25,8 @@ export class HaVoiceAssistantSetupStepChangeWakeWord extends LitElement {

Change wake word

- When you voice assistant knows where it is, it can better control the - devices around it. + Some wake words are better for [your language] and voice than others. + Please try them out.

@@ -72,6 +72,7 @@ export class HaVoiceAssistantSetupStepChangeWakeWord extends LitElement { ha-md-list { width: 100%; text-align: initial; + margin-bottom: 24px; } `, ]; diff --git a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-check.ts b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-check.ts index 0d61e8bd73..0ce0fa9b86 100644 --- a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-check.ts +++ b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-check.ts @@ -22,7 +22,7 @@ export class HaVoiceAssistantSetupStepCheck extends LitElement { if ( this._status === "success" && changedProperties.has("hass") && - this.hass.states[this.assistEntityId!]?.state === "listening_wake_word" + this.hass.states[this.assistEntityId!]?.state === "idle" ) { this._nextStep(); } @@ -38,16 +38,13 @@ export class HaVoiceAssistantSetupStepCheck extends LitElement {

` : this._status === "timeout" ? html` -

Error

+

Voice assistant can not connect to Home Assistant

- Your device was unable to reach Home Assistant. Make sure you - have setup your - Home Assistant URL's - correctly. + A good explanation what is happening and what action you should + take.

+ Help me Retry
` : html` @@ -73,10 +70,6 @@ export class HaVoiceAssistantSetupStepCheck extends LitElement { fireEvent(this, "next-step", { noPrevious: true }); } - private _close() { - fireEvent(this, "closed"); - } - static styles = AssistantSetupStyles; } diff --git a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-cloud.ts b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-cloud.ts index 84a69f065e..72aec24ca2 100644 --- a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-cloud.ts +++ b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-cloud.ts @@ -10,16 +10,24 @@ export class HaVoiceAssistantSetupStepCloud extends LitElement { protected override render() { return html`
- -

Home Assistant Cloud

+ +

Supercharge your assistant with Home Assistant Cloud

- With Home Assistant Cloud, you get the best results for your voice - assistant, sign up for a free trial now. + Speed up and take the load off your system by running your + text-to-speech and speech-to-text in our private and secure cloud. + Cloud also includes secure remote access to your system while + supporting the development of Home Assistant.

-
+
+ Learn more Start your free trialTry 1 month for free
`; } diff --git a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-pipeline.ts b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-pipeline.ts index 99204a3736..0f69ce002a 100644 --- a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-pipeline.ts +++ b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-pipeline.ts @@ -92,7 +92,7 @@ export class HaVoiceAssistantSetupStepPipeline extends LitElement { )} rel="noreferrer noopenner" target="_blank" - @click=${this._close} + @click=${this._skip} > Use external system { - if (!config) { - return ""; - } - const activeId = config.active_wake_words[0]; - return config.available_wake_words.find((ww) => ww.id === activeId) - ?.wake_word; - } - ); - protected override render() { + const pipelineEntity = this.assistConfiguration + ? this.hass.states[this.assistConfiguration.pipeline_entity_id] + : undefined; + return html`

Ready to assist!

- Make your assistant more personal by customizing shizzle to the - manizzle + Your device is all ready to go! If you want to tweak some more + settings, you can change that below.

- - Change wake word - ${this._activeWakeWord(this.assistConfiguration)} - - - - ${this._ttsSettings - ? html` +
+ ` - : nothing} + fixedMenuPosition + naturalMenuWidth + .value=${this.assistConfiguration?.active_wake_words[0]} + > + ${this.assistConfiguration?.available_wake_words.map( + (wakeword) => + html` + ${wakeword.wake_word} + ` + )} + + + + Test + +
+
+ + ${pipelineEntity?.attributes.options.map( + (pipeline) => + html` + ${this.hass.formatEntityState(pipelineEntity, pipeline)} + ` + )} + + + + Edit + +
+ ${this._ttsSettings + ? html`
+ + + + Try + +
` + : nothing} +
- Change assistant settings Done
`; } @@ -160,6 +180,9 @@ export class HaVoiceAssistantSetupStepSuccess extends LitElement { ...pipeline, tts_voice: ev.detail.value, }); + } + + private _testTts() { this._announce("Hello, how can I help you?"); } @@ -170,8 +193,11 @@ export class HaVoiceAssistantSetupStepSuccess extends LitElement { await assistSatelliteAnnounce(this.hass, this.assistEntityId, message); } - private _changeWakeWord() { - fireEvent(this, "next-step", { step: STEP.CHANGE_WAKEWORD }); + private _testWakeWord() { + fireEvent(this, "next-step", { + step: STEP.WAKEWORD, + nextStep: STEP.SUCCESS, + }); } private async _openPipeline() { @@ -209,12 +235,28 @@ export class HaVoiceAssistantSetupStepSuccess extends LitElement { text-align: initial; } ha-tts-voice-picker { - margin-top: 16px; display: block; } .footer { margin-top: 24px; } + .rows { + gap: 16px; + display: flex; + flex-direction: column; + } + .row { + display: flex; + justify-content: space-between; + align-items: center; + } + .row > *:first-child { + flex: 1; + margin-right: 4px; + } + .row ha-button { + width: 82px; + } `, ]; } diff --git a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-update.ts b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-update.ts index 9cff75a475..d0ac0f298a 100644 --- a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-update.ts +++ b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-update.ts @@ -17,6 +17,11 @@ export class HaVoiceAssistantSetupStepUpdate extends LitElement { protected override willUpdate(changedProperties: PropertyValues): void { super.willUpdate(changedProperties); + if (!this.updateEntityId) { + this._nextStep(); + return; + } + if (changedProperties.has("hass") && this.updateEntityId) { const oldHass = changedProperties.get("hass") as this["hass"] | undefined; if (oldHass) { @@ -32,16 +37,9 @@ export class HaVoiceAssistantSetupStepUpdate extends LitElement { } } - if (!changedProperties.has("updateEntityId")) { - return; + if (changedProperties.has("updateEntityId")) { + this._tryUpdate(); } - - if (!this.updateEntityId) { - this._nextStep(); - return; - } - - this._tryUpdate(); } protected override render() { diff --git a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-wake-word.ts b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-wake-word.ts index 4c9b9306a0..4cd90f4ca2 100644 --- a/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-wake-word.ts +++ b/src/dialogs/voice-assistant-setup/voice-assistant-setup-step-wake-word.ts @@ -58,7 +58,7 @@ export class HaVoiceAssistantSetupStepWakeWord extends LitElement { const entityState = this.hass.states[this.assistEntityId]; - if (entityState.state !== "listening_wake_word") { + if (entityState.state !== "idle") { return html``; } @@ -80,7 +80,7 @@ export class HaVoiceAssistantSetupStepWakeWord extends LitElement { To make sure the wake word works for you.

`}
-
+
Change wake word
`; }