1
0
mirror of https://github.com/hrfee/jfa-go.git synced 2024-12-22 17:10:10 +00:00

provide error message on login and display it nicely

server now provides a reason for login fail to the web ui, and displays
it inside the login button, which looks a lot nicer than the previously
used error box.
This commit is contained in:
Harvey Tindall 2020-08-19 14:50:16 +01:00
parent daf190f68b
commit 6781316474
Signed by: hrfee
GPG Key ID: BBC65952848FB1A2
3 changed files with 24 additions and 11 deletions

View File

@ -97,7 +97,7 @@ func (app *appContext) GetToken(gc *gin.Context) {
if status != 200 || err != nil {
if status == 401 || status == 400 {
app.info.Println("Auth failed: Invalid username and/or password")
respond(401, "Unauthorized", gc)
respond(401, "Invalid username/password", gc)
return
}
app.err.Printf("Auth failed: Couldn't authenticate with Jellyfin: Code %d", status)

View File

@ -527,9 +527,13 @@ document.getElementById('inviteForm').onsubmit = function() {
document.getElementById('loginForm').onsubmit = function() {
window.token = "";
let details = serializeForm('loginForm');
let errorArea = document.getElementById('loginErrorArea');
errorArea.textContent = '';
// let errorArea = document.getElementById('loginErrorArea');
// errorArea.textContent = '';
let button = document.getElementById('loginSubmit');
if (button.classList.contains('btn-danger')) {
button.classList.add('btn-primary');
button.classList.remove('btn-danger');
}
button.disabled = true;
button.innerHTML =
'<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true" style="margin-right: 0.5rem;"></span>' +
@ -538,14 +542,24 @@ document.getElementById('loginForm').onsubmit = function() {
req.responseType = 'json';
req.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 401) {
if (this.status != 200) {
let errormsg = req.response["error"];
if (errormsg == "") {
errormsg = "Unknown error"
}
button.disabled = false;
button.textContent = errormsg;
if (!button.classList.contains('btn-danger')) {
button.classList.add('btn-danger');
button.classList.remove('btn-primary');
}
setTimeout(function () {
if (button.classList.contains('btn-danger')) {
button.classList.add('btn-primary');
button.classList.remove('btn-danger');
button.textContent = 'Login';
let wrongPassword = document.createElement('div');
wrongPassword.classList.add('alert', 'alert-danger');
wrongPassword.setAttribute('role', 'alert');
wrongPassword.textContent = "Incorrect username or password.";
errorArea.appendChild(wrongPassword);
}
}, 4000)
} else {
const data = this.response;
window.token = data['token'];

View File

@ -136,7 +136,6 @@
<input type="password" class="form-control" id="password" name="password" placeholder="Password" required>
</div>
</form>
<div id="loginErrorArea"></div>
</div>
<div class="modal-footer">
<button type="submit" id="loginSubmit" class="btn btn-primary" form="loginForm">Login</button>