<body class="w3-light-grey">
+<!-- Modal dialog (when needed) -->
+<div id="ctdl_big_modal" class="w3-modal" style="display:none; z-index:5">
+ <div class="w3-modal-content">
+ <div id="ctdl_big_modal_content" class="w3-container">
+ <p>Loading...</p>
+ </div>
+ </div>
+</div>
+
<!-- Top container -->
<div id="navbar" class="w3-bar w3-top w3-black w3-large" style="z-index:4">
<button class="w3-bar-item w3-button w3-hide-large w3-hover-none w3-hover-text-light-grey" onclick="w3_open();"><i class="fa fa-bars"></i> Menu</button>
}
fetchm();
}
+
+
+// Activate the "Loading..." modal
+function activate_loading_modal() {
+ document.getElementById("ctdl_big_modal_content").innerHTML =
+ "<i class=\"fas fa-spinner fa-spin\"></i> "
+ + _("Loading messages from server, please wait");
+ document.getElementById("ctdl_big_modal").style.display = "block";
+}
+
+
+// Disappear the "Loading..." modal
+function deactivate_loading_modal() {
+ document.getElementById("ctdl_big_modal").style.display = "none";
+}
function forum_readmessages(target_div_name, gt_msg, lt_msg) {
target_div = document.getElementById(target_div_name);
original_text = target_div.innerHTML; // in case we need to replace it after an error
- target_div.innerHTML =
- "<div class=\"ctdl-forum-nav\"><i class=\"fas fa-spinner fa-spin\"></i> "
- + _("Loading messages from server, please wait") + "</div>";
+ target_div.innerHTML = ""
if (lt_msg < 9999999999) {
url = "/ctdl/r/" + escapeHTMLURI(current_room) + "/msgs.lt|" + lt_msg;
// Here is the async function that waits for all the messages to be loaded, and then renders them.
fetch_msg_list = async() => {
document.body.style.cursor = "wait";
+ activate_loading_modal();
await Promise.all(msg_promises);
+ deactivate_loading_modal();
document.body.style.cursor = "default";
// At this point all of the Promises are resolved and we can render.