add an indicator when login fails
authorRobert Kaiser <kairo@kairo.at>
Fri, 22 Dec 2017 20:42:59 +0000 (21:42 +0100)
committerRobert Kaiser <kairo@kairo.at>
Fri, 22 Dec 2017 20:42:59 +0000 (21:42 +0100)
index.html
js/ui.js
style/lantea.css

index 8bb8240..d1ea156 100644 (file)
@@ -80,6 +80,7 @@ operator to any other services, e.g. OpenStreetMap.</p>
 </div>
 <p class="loginbox">
 <button type="button" id="loginbtn" class="hidden">Sign in</button>
+<span id="loginerror" class="hidden">!</span>
 <span id="logindesc" class="hidden">to enable uploads</span>
 <span id="username" class="hidden"></span>
 <button type="button" id="logoutbtn" class="hidden">Log out</button>
index e20a4ae..92dd488 100644 (file)
--- a/js/ui.js
+++ b/js/ui.js
@@ -14,7 +14,7 @@ var gWaitCounter = 0;
 var gTrackUpdateInterval;
 var gAction, gActionLabel;
 var authData = null, userData = null;
-var gBackendURL = "https://backend.lantea.kairo.at";
+var gBackendURL = "https://backend.lantea.kairo.at/";
 var gAuthClientID = "lantea";
 
 window.onload = function() {
@@ -112,6 +112,9 @@ window.onresize = function() {
 }
 
 function startLogin() {
+  var logerr = document.getElementById("loginerror");
+  logerr.classList.add("hidden");
+  logerr.title = "";
   if (!authData || !authData["state"]) {
     // We have no oAuth state, try to fetch it and call ourselves again if it worked.
     prepareLoginButton(function() {
@@ -121,6 +124,8 @@ function startLogin() {
       else if (!userData) {
         // Only warn if we didn't actually end up being logged in.
         console.log("No OAuth state and fetching fails, client or server may be offline.");
+        logerr.classList.remove("hidden");
+        logerr.title = "Client or server may be offline.";
       }
     });
     return;
@@ -132,6 +137,8 @@ function startLogin() {
   }
   else {
     console.log("Opening Sign In window failed.");
+    logerr.classList.remove("hidden");
+    logerr.title = "Opening Sign-In window failed.";
   }
 }
 
index 64ee62f..dbc28b0 100644 (file)
@@ -410,6 +410,12 @@ h1 {
   color: #FFFFFF;
 }
 
+#loginerror {
+  color: red;
+  font-weight: bold;
+  padding: .5em;
+}
+
 /* dialog area - for loading error and welcome messages */
 #dialogArea {
   position: absolute;