loading: Show error when spectator fails to register.

Fixes #25683.
This commit is contained in:
evykassirer 2023-06-25 16:24:01 -07:00 committed by Tim Abbott
parent cb5441a6b0
commit 24a2ff5016
2 changed files with 34 additions and 24 deletions

View File

@ -47,6 +47,13 @@
animation-fill-mode: forwards;
visibility: hidden;
}
#app-loading-error {
display: flex;
height: 100vh;
justify-content: center;
align-items: center;
visibility: hidden;
}
:root.dark-theme #app-loading {
background-color: hsl(0, 0%, 11%);
color: hsl(236, 33%, 90%);
@ -118,16 +125,19 @@
</div>
</div>
<div id="app-loading-bottom-content">
<p>{% trans %}If this message does not go away, try <a id="reload-lnk">reloading</a> the page.{% endtrans %}</p>
<script nonce="{{ csp_nonce }}">
document.addEventListener('DOMContentLoaded', function () {
function reload() {
location.reload(true);
}
document.getElementById('reload-lnk').addEventListener('click', reload);
});
</script>
<p>{% trans %}If this message does not go away, try <a class="reload-lnk">reloading</a> the page.{% endtrans %}</p>
</div>
<div id="app-loading-error">
<p>{% trans %}Error loading Zulip. Try <a class="reload-lnk">reloading</a> the page.{% endtrans %}</p>
</div>
<script nonce="{{ csp_nonce }}">
document.addEventListener('DOMContentLoaded', function () {
function reload() {
location.reload(true);
}
document.querySelectorAll('.reload-lnk').forEach(lnk => lnk.addEventListener('click', reload));
});
</script>
</div>
<div id="tooltip-templates-container"></div>

View File

@ -783,21 +783,21 @@ $(async () => {
}),
client_gravatar: false,
};
const {result, msg, ...state} = await new Promise((resolve, reject) => {
channel.post({
url: "/json/register",
data,
success: resolve,
error(xhr) {
blueslip.error("Spectator failed to register", {
status: xhr.status,
body: xhr.responseText,
});
reject(new Error("Spectator failed to register"));
},
});
channel.post({
url: "/json/register",
data,
success(response_data) {
Object.assign(page_params, response_data);
initialize_everything();
},
error() {
$("#app-loading-middle-content").hide();
$("#app-loading-bottom-content").hide();
$(".app").hide();
$("#app-loading-error").css({visibility: "visible"});
},
});
Object.assign(page_params, state);
} else {
initialize_everything();
}
initialize_everything();
});