docker/landingpage/www/index.html

223 lines
6.0 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta charset="utf-8" />
<title>Preparing Home Assistant</title>
<style>
@font-face {
font-family: "Roboto";
src: local("Roboto Regular"), local("Roboto-Regular"),
url(Roboto-Regular.woff2) format("woff2");
font-weight: 400;
font-style: normal;
}
body {
font-family: Roboto, Helvetica, Arial, sans-serif;
padding-top: 10%;
}
a {
color: #03a9f4;
}
.loading {
text-align: center;
}
.loading img {
max-width: 100px;
}
h1 {
margin: 20px 0 0;
}
.read-more {
margin: 40px auto 16px;
max-width: 400px;
text-align: center;
}
.suggestion {
margin: 24px 0;
}
.app-links {
margin-top: 8px;
}
.spinner {
width: 40px;
height: 40px;
position: relative;
margin: 20px auto;
}
.double-bounce1,
.double-bounce2 {
width: 100%;
height: 100%;
border-radius: 50%;
background-color: #03a9f4;
opacity: 0.6;
position: absolute;
top: 0;
left: 0;
-webkit-animation: sk-bounce 2s infinite ease-in-out;
animation: sk-bounce 2s infinite ease-in-out;
}
.double-bounce2 {
-webkit-animation-delay: -1s;
animation-delay: -1s;
}
@-webkit-keyframes sk-bounce {
0%,
100% {
-webkit-transform: scale(0);
}
50% {
-webkit-transform: scale(1);
}
}
@keyframes sk-bounce {
0%,
100% {
transform: scale(0);
-webkit-transform: scale(0);
}
50% {
transform: scale(1);
-webkit-transform: scale(1);
}
}
</style>
</head>
<body>
<div class="loading">
<img src="logo.svg" alt="Home Assistant logo" />
<h1>Preparing Home&nbsp;Assistant</h1>
<div class="spinner">
<div class="double-bounce1"></div>
<div class="double-bounce2"></div>
</div>
(this can take up to 20 minutes)
</div>
<div class="read-more">
<h3>While waiting, some suggestions:</h3>
<div class="suggestion">
<a
href="https://www.home-assistant.io/blog/2016/01/19/perfect-home-automation/"
target="_blank"
>Read our founders vision for the
perfect&nbsp;home&nbsp;automation.</a
>
</div>
<div class="suggestion">
Install the official Home Assistant apps
<div class="app-links">
<a
target="_blank"
href="https://apps.apple.com/us/app/home-assistant/id1099568401?mt=8"
><img alt="Get it on the Apple App Store" src="apple-badge.svg"
/></a>
<a
target="_blank"
href="https://play.google.com/store/apps/details?id=io.homeassistant.companion.android&amp;pcampaignid=pcampaignidMKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1"
><img alt="Get it on Google Play" src="google-badge.png"
/></a>
</div>
</div>
<div class="suggestion">
Join our community on
<a href="https://community.home-assistant.io/" target="_blank"
>the forums</a
>
or on
<a href="https://www.home-assistant.io/join-chat/" target="_blank"
>the chat</a
>.
</div>
</div>
<script>
/* unfetch polyfill */
self.fetch ||
(self.fetch = function(e, n) {
return (
(n = n || {}),
new Promise(function(t, s) {
var r = new XMLHttpRequest(),
o = [],
u = [],
i = {},
a = function() {
return {
ok: 2 == ((r.status / 100) | 0),
statusText: r.statusText,
status: r.status,
url: r.responseURL,
text: function() {
return Promise.resolve(r.responseText);
},
json: function() {
return Promise.resolve(JSON.parse(r.responseText));
},
blob: function() {
return Promise.resolve(new Blob([r.response]));
},
clone: a,
headers: {
keys: function() {
return o;
},
entries: function() {
return u;
},
get: function(e) {
return i[e.toLowerCase()];
},
has: function(e) {
return e.toLowerCase() in i;
}
}
};
};
for (var c in (r.open(n.method || "get", e, !0),
(r.onload = function() {
r
.getAllResponseHeaders()
.replace(/^(.*?):[^\S\n]*([\s\S]*?)$/gm, function(e, n, t) {
o.push((n = n.toLowerCase())),
u.push([n, t]),
(i[n] = i[n] ? i[n] + "," + t : t);
}),
t(a());
}),
(r.onerror = s),
(r.withCredentials = "include" == n.credentials),
n.headers))
r.setRequestHeader(c, n.headers[c]);
r.send(n.body || null);
})
);
});
function testAvailable() {
fetch("./manifest.json").then(function(res) {
if (res.ok) {
location.reload();
} else {
scheduleTry();
}
}, scheduleTry);
}
function scheduleTry() {
setTimeout(testAvailable, 5000);
}
scheduleTry();
</script>
</body>
</html>