diff --git a/client/index.html b/client/index.html index 71b061d3..77257141 100644 --- a/client/index.html +++ b/client/index.html @@ -43,7 +43,22 @@
-
+
+
+
+
+
+

The Lounge is loading…

+
+
+

Loading the app… Make sure to have JavaScript enabled.

+ + +
+
+
+
+
diff --git a/client/js/loading-slow-alert.js b/client/js/loading-slow-alert.js new file mode 100644 index 00000000..b86b6409 --- /dev/null +++ b/client/js/loading-slow-alert.js @@ -0,0 +1,14 @@ +/* + * This is a separate file for two reasons: + * 1. CSP policy does not allow inline javascript + * 2. It has to be a small javascript executed before all other scripts, + * so that the timeout can be triggered while slow JS is loading + */ + +setTimeout(function() { + var element = document.getElementById("loading-slow"); + + if (element) { + element.style.display = "block"; + } +}, 5000); diff --git a/client/js/lounge.js b/client/js/lounge.js index fa101fd4..97abd25e 100644 --- a/client/js/lounge.js +++ b/client/js/lounge.js @@ -1,4 +1,6 @@ $(function() { + $("#loading-page-message").text("Connecting…"); + var path = window.location.pathname + "socket.io/"; var socket = io({path: path}); var commands = [ @@ -77,10 +79,6 @@ $(function() { socket.on("auth", function(data) { var body = $("body"); var login = $("#sign-in"); - if (!login.length) { - refresh(); - return; - } login.find(".btn").prop("disabled", false); @@ -96,6 +94,7 @@ $(function() { } else { var token = window.localStorage.getItem("token"); if (token) { + $("#loading-page-message").text("Authorizing…"); socket.emit("auth", {token: token}); } } diff --git a/client/themes/morning.css b/client/themes/morning.css index fa99303c..600f364e 100644 --- a/client/themes/morning.css +++ b/client/themes/morning.css @@ -18,6 +18,10 @@ BORDERS #2a323d QUIT #d0907d */ +body { + color: #ccc; +} + #main, #chat .sidebar, #windows .chan, @@ -34,12 +38,6 @@ QUIT #d0907d font-size: 13px; } -#settings, -#sign-in, -#connect { - color: #ccc; -} - #chat .count { background-color: #2e3642; } diff --git a/client/themes/zenburn.css b/client/themes/zenburn.css index 018ac6d0..494d25a8 100644 --- a/client/themes/zenburn.css +++ b/client/themes/zenburn.css @@ -20,6 +20,7 @@ QUIT #bc6c4c body { background: #2b2b2b; + color: #dcdccc; } #main, @@ -38,12 +39,6 @@ body { font-size: 13px; } -#settings, -#sign-in, -#connect { - color: #dcdccc; -} - #settings, #sign-in, #connect .title {