diff --git a/backend/web/templates/login.html b/backend/web/templates/login.html index bc95a5b61083aeda8d1865cb808c60e43159a2be..11d9f8a5315dfb97662604ad906c3022e2729971 100644 --- a/backend/web/templates/login.html +++ b/backend/web/templates/login.html @@ -31,12 +31,25 @@ let result = document.querySelector('#signup-result'); let email = document.querySelector('#signup-email'); let xhr = new XMLHttpRequest(); + xhr.responseType = 'json'; let url = "/web/demo-user"; xhr.open("POST", url, true); xhr.setRequestHeader("Content-Type", "application/json"); xhr.onreadystatechange = function () { if (xhr.readyState === 4) { - result.innerHTML = this.responseText; + // In the success case, we get a plain (json) string; in the error + // case, we get an object with `errorMessage` property. + if (typeof(this.response) == 'object' && 'errorMessage' in this.response) { + window.console.log("Error in sign-up request."); + result.classList.remove('alert-success'); + result.classList.add('alert-danger'); + result.innerHTML = this.response.errorMessage; + } else { + result.classList.add('alert-success'); + result.classList.remove('alert-danger'); + result.innerHTML = this.response; + } + result.style.visibility = 'visible'; } }; // Converting JSON data to string @@ -45,22 +58,29 @@ xhr.send(data); } </script> - <h2>Sign up for this demo instance</h2> + <h4>Sign up for this demo instance</h4> Enter your email address here to create an account on this Stackspin instance. - <div class="alert alert-warning">Warning: this is a demo instance! That means that: - <ul> - <li>Anyone can create an account on this same instance, like yourself, - and will share the same set of users and data. So any data you create - or upload, including the email address you enter here, becomes - essentially public information.</li> - <li>Every night (Europe/Amsterdam time), this instance gets automatically - reset to an empty state, so any data you create or upload will be - destroyed.</li> - </ul> + <div class="alert alert-warning" style="margin-top: 1em;"> + Warning: this is a demo instance! That means that: + <ul> + <li>Anyone can create an account on this same instance, like yourself, + and will share the same set of users and data. So any data you create + or upload, including the email address you enter here, becomes + essentially public information.</li> + <li>Every night (Europe/Amsterdam time), this instance gets automatically + reset to an empty state, so any data you create or upload will be + destroyed.</li> + </ul> + </div> + <div class="form-group"> + <label for="signup-email">Email address</label> + <input type="email" class="form-control" id="signup-email" name="signup-email" placeholder="Your email address to sign up with."> + </div> + <div class="form-group"> + <button class="btn btn-primary" onclick="submitSignup()">Sign up</button> + <div id="signup-result" class="alert" style="visibility: hidden; margin-top: 1em;"></div> </div> - <div class="form-group"><label for="signup-email">Email address</label><input type="email" class="form-control" id="signup-email" name="signup-email" placeholder="Your email address to sign up with."></div> - <div class="form-group"><button class="btn btn-primary" onclick="submitSignup()">Sign up</button><p id="signup-result"></p></div> {% endif %} {% endblock %}