Delay display of init page
This commit is contained in:
parent
4b5c7021ff
commit
7f2fcc73b5
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -1,5 +1,6 @@
|
|||
import { css, CSSResultGroup, html, LitElement, PropertyValues } from "lit";
|
||||
import { property, state } from "lit/decorators";
|
||||
import "../components/ha-logo-svg";
|
||||
|
||||
class HaInitPage extends LitElement {
|
||||
@property({ type: Boolean }) public error = false;
|
||||
|
@ -13,36 +14,36 @@ class HaInitPage extends LitElement {
|
|||
private _retryInterval?: number;
|
||||
|
||||
protected render() {
|
||||
return this.error
|
||||
? html`
|
||||
<p>Unable to connect to Home Assistant.</p>
|
||||
<p class="retry-text">
|
||||
Retrying in ${this._retryInSeconds} seconds...
|
||||
</p>
|
||||
<mwc-button @click=${this._retry}>Retry now</mwc-button>
|
||||
${location.host.includes("ui.nabu.casa")
|
||||
? html`
|
||||
<p>
|
||||
It is possible that you are seeing this screen because your
|
||||
Home Assistant is not currently connected. You can ask it to
|
||||
come online from your
|
||||
<a href="https://account.nabucasa.com/"
|
||||
>Nabu Casa account page</a
|
||||
>.
|
||||
</p>
|
||||
`
|
||||
: ""}
|
||||
`
|
||||
: html`
|
||||
<div id="progress-indicator-wrapper">
|
||||
<ha-circular-progress active></ha-circular-progress>
|
||||
</div>
|
||||
<div id="loading-text">
|
||||
${this.migration
|
||||
? "Database migration in progress, please wait this might take some time"
|
||||
: "Loading data"}
|
||||
</div>
|
||||
`;
|
||||
return html`<ha-logo-svg></ha-logo-svg>${this.error
|
||||
? html`
|
||||
<p>Unable to connect to Home Assistant.</p>
|
||||
<p class="retry-text">
|
||||
Retrying in ${this._retryInSeconds} seconds...
|
||||
</p>
|
||||
<mwc-button @click=${this._retry}>Retry now</mwc-button>
|
||||
${location.host.includes("ui.nabu.casa")
|
||||
? html`
|
||||
<p>
|
||||
It is possible that you are seeing this screen because your
|
||||
Home Assistant is not currently connected. You can ask it to
|
||||
come online from your
|
||||
<a href="https://account.nabucasa.com/"
|
||||
>Nabu Casa account page</a
|
||||
>.
|
||||
</p>
|
||||
`
|
||||
: ""}
|
||||
`
|
||||
: html`
|
||||
<div id="progress-indicator-wrapper">
|
||||
<ha-circular-progress active></ha-circular-progress>
|
||||
</div>
|
||||
<div id="loading-text">
|
||||
${this.migration
|
||||
? "Database migration in progress, please wait this might take some time"
|
||||
: "Loading data"}
|
||||
</div>
|
||||
`}`;
|
||||
}
|
||||
|
||||
disconnectedCallback() {
|
||||
|
@ -63,12 +64,15 @@ class HaInitPage extends LitElement {
|
|||
|
||||
protected firstUpdated() {
|
||||
this._showProgressIndicatorTimeout = window.setTimeout(() => {
|
||||
this._showProgressIndicatorTimeout = undefined;
|
||||
import("../components/ha-circular-progress");
|
||||
}, 5000);
|
||||
|
||||
this._retryInterval = window.setInterval(() => {
|
||||
const remainingSeconds = this._retryInSeconds--;
|
||||
if (remainingSeconds <= 0) {
|
||||
clearInterval(this._retryInterval);
|
||||
this._retryInterval = undefined;
|
||||
this._retry();
|
||||
}
|
||||
}, 1000);
|
||||
|
@ -86,6 +90,11 @@ class HaInitPage extends LitElement {
|
|||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
ha-logo-svg {
|
||||
height: 170px;
|
||||
width: 170px;
|
||||
padding: 12px;
|
||||
}
|
||||
#progress-indicator-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
@ -9,15 +9,11 @@ import { HassElement } from "../state/hass-element";
|
|||
import QuickBarMixin from "../state/quick-bar-mixin";
|
||||
import { HomeAssistant, Route } from "../types";
|
||||
import { storeState } from "../util/ha-pref-storage";
|
||||
import {
|
||||
renderLaunchScreenInfoBox,
|
||||
removeLaunchScreen,
|
||||
} from "../util/launch-screen";
|
||||
import { renderLaunchScreen, removeLaunchScreen } from "../util/launch-screen";
|
||||
import {
|
||||
registerServiceWorker,
|
||||
supportsServiceWorker,
|
||||
} from "../util/register-service-worker";
|
||||
import "./ha-init-page";
|
||||
import "./home-assistant-main";
|
||||
|
||||
const useHash = __DEMO__;
|
||||
|
@ -39,8 +35,12 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
|
|||
|
||||
private _haVersion?: string;
|
||||
|
||||
private _error?: boolean;
|
||||
|
||||
private _hiddenTimeout?: number;
|
||||
|
||||
private _renderInitTimeout?: number;
|
||||
|
||||
private _visiblePromiseResolve?: () => void;
|
||||
|
||||
constructor() {
|
||||
|
@ -89,6 +89,10 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
|
|||
) {
|
||||
this.render = this.renderHass;
|
||||
this.update = super.update;
|
||||
if (this._renderInitTimeout) {
|
||||
clearTimeout(this._renderInitTimeout);
|
||||
this._renderInitTimeout = undefined;
|
||||
}
|
||||
removeLaunchScreen();
|
||||
}
|
||||
super.update(changedProps);
|
||||
|
@ -139,7 +143,9 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
|
|||
// Render launch screen info box (loading data / error message)
|
||||
// if Home Assistant is not loaded yet.
|
||||
if (this.render !== this.renderHass) {
|
||||
this._renderInitInfo(false);
|
||||
this._renderInitTimeout = window.setTimeout(() => {
|
||||
this._renderInitInfo();
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -153,7 +159,7 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
|
|||
}
|
||||
if (changedProps.has("_databaseMigration")) {
|
||||
if (this.render !== this.renderHass) {
|
||||
this._renderInitInfo(false);
|
||||
this._renderInitInfo();
|
||||
} else if (this._databaseMigration) {
|
||||
// we already removed the launch screen, so we refresh to add it again to show the migration screen
|
||||
location.reload();
|
||||
|
@ -233,7 +239,8 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
|
|||
this._haVersion = conn.haVersion;
|
||||
this.initializeHass(auth, conn);
|
||||
} catch (err: any) {
|
||||
this._renderInitInfo(true);
|
||||
this._error = true;
|
||||
this._renderInitInfo();
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -290,10 +297,15 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
|
|||
}
|
||||
}
|
||||
|
||||
private _renderInitInfo(error: boolean) {
|
||||
renderLaunchScreenInfoBox(
|
||||
private async _renderInitInfo() {
|
||||
if (this._renderInitTimeout) {
|
||||
clearTimeout(this._renderInitTimeout);
|
||||
}
|
||||
this._renderInitTimeout = undefined;
|
||||
await import("./ha-init-page");
|
||||
renderLaunchScreen(
|
||||
html`<ha-init-page
|
||||
.error=${error}
|
||||
.error=${this._error}
|
||||
.migration=${this._databaseMigration}
|
||||
></ha-init-page>`
|
||||
);
|
||||
|
|
|
@ -7,9 +7,9 @@ export const removeLaunchScreen = () => {
|
|||
}
|
||||
};
|
||||
|
||||
export const renderLaunchScreenInfoBox = (content: TemplateResult) => {
|
||||
const infoBoxElement = document.getElementById("ha-launch-screen-info-box");
|
||||
if (infoBoxElement) {
|
||||
render(content, infoBoxElement);
|
||||
export const renderLaunchScreen = (content: TemplateResult) => {
|
||||
const launchScreen = document.getElementById("ha-launch-screen");
|
||||
if (launchScreen) {
|
||||
render(content, launchScreen);
|
||||
}
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue