jcloude/press/www/prepare-site.html
2025-12-23 20:48:07 +08:00

123 lines
2.4 KiB
HTML

{%- extends "templates/base.html" -%}
{%- block navbar -%}
{%- endblock -%}
{%- block content -%}
<section>
<div class="mx-auto mt-20 mb-24 col-xl-4 col-lg-6 col-md-7 col-sm-9">
<div class="card">
<div class="text-center card-body">
{%- if jingrow.form_dict.key -%}
<h1>Your site is being prepared</h1>
<p class="setup-message"></p>
<svg class="spinner animate-spin" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
<circle style="color: var(--primary-light)" cx="12" cy="12" r="10" stroke="currentColor"
stroke-width="4"></circle>
<path style="opacity: 0.8; color: var(--primary)" fill="currentColor"
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z">
</path>
</svg>
{%- else -%}
<div>
Invalid or expired key
</div>
{%- endif -%}
</div>
</div>
</div>
</section>
{%- endblock -%}
{%- block footer -%}
{%- endblock -%}
{%- block script -%}
<script>
let key = jingrow.utils.get_url_arg('key');
let app = jingrow.utils.get_url_arg('app');
jingrow.ready(() => {
if (!key) {
return;
}
poll_site_status();
});
function poll_site_status() {
get_site_status()
.then(site => {
if (site.status != 'Active') {
setTimeout(poll_site_status, 1000)
} else {
get_site_url_and_sid().then(url => {
window.open(url, '_self');
});
}
});
}
function get_site_status() {
return jingrow.call('jcloude.api.saas.get_site_status', {
key,
app
})
.then(r => r.message);
}
function get_site_url_and_sid() {
return jingrow.call('jcloude.api.saas.get_site_url_and_sid', {
key,
app
})
.then(r => r.message);
}
</script>
{%- endblock -%}
{%- block style -%}
<style>
body {
background-color: #F3F5F8;
}
h1 {
font-size: var(--font-size-lg);
text-align: center;
}
.card {
box-shadow: 0px 1px 42px rgba(97, 97, 97, 0.07), 0px 1px 4px rgba(255, 255, 255, 1);
border-radius: 10px;
border-color: transparent;
padding: 0px 80px 60px 80px;
}
.card-body {
padding: 0px;
}
.spinner {
text-align: center;
margin: 0 auto;
color: var(--gray-600);
width: 1.5rem;
height: 1.5rem;
}
.animate-spin {
animation: spin 1s linear infinite;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
</style>
{%- endblock -%}