diff --git a/web/login/index.html b/web/login/index.html index 99ce323b..413cd793 100644 --- a/web/login/index.html +++ b/web/login/index.html @@ -49,17 +49,28 @@
| Username: | +Username: | |
| Password: | +Password: | |
| 2FA code: | ++ + | +|
|
+ + |
+ ||
|
diff --git a/web/login/index.pug b/web/login/index.pug
index 00bb61e9..712f2ee8 100644
--- a/web/login/index.pug
+++ b/web/login/index.pug
@@ -11,11 +11,17 @@ block body
div(id="login")
table
tr
- td Username:
+ td Username:
td #[input(type="text" id="user-input")]
tr
- td Password:
+ td Password:
td #[input(type="password" id="passwd-input")]
+ tr
+ td 2FA code:
+ td #[input(type="text" id="code-input" placeholder="if enabled")]
+ tr
+ td(colspan=2)
+ hr
tr
td
td #[button(id="login-button" class="key") Login]
diff --git a/web/share/css/login/login.css b/web/share/css/login/login.css
index 5a69aa30..17a5cd10 100644
--- a/web/share/css/login/login.css
+++ b/web/share/css/login/login.css
@@ -43,7 +43,8 @@ div#login {
}
input[type="text"]#user-input,
-input[type="password"]#passwd-input {
+input[type="password"]#passwd-input,
+input[type="text"]#code-input {
text-align: center;
border: thin;
}
diff --git a/web/share/js/login/main.js b/web/share/js/login/main.js
index 2b5af5e3..1fdc383b 100644
--- a/web/share/js/login/main.js
+++ b/web/share/js/login/main.js
@@ -33,7 +33,7 @@ export function main() {
initWindowManager();
tools.el.setOnClick($("login-button"), __login);
- $("user-input").onkeyup = $("passwd-input").onkeyup = function(event) {
+ $("user-input").onkeyup = $("passwd-input").onkeyup = $("code-input").onkeyup = function(event) {
if (event.code === "Enter") {
event.preventDefault();
$("login-button").click();
@@ -49,21 +49,21 @@ function __login() {
if (user.length === 0) {
$("user-input").focus();
} else {
- let passwd = $("passwd-input").value;
+ let passwd = $("passwd-input").value + $("code-input").value;
let body = `user=${encodeURIComponent(user)}&passwd=${encodeURIComponent(passwd)}`;
let http = tools.makeRequest("POST", "/api/auth/login", function() {
if (http.readyState === 4) {
if (http.status === 200) {
document.location.href = "/";
} else if (http.status === 403) {
- wm.error("Invalid username or password").then(__tryAgain);
+ wm.error("Invalid credentials").then(__tryAgain);
} else {
let error = "";
if (http.status === 400) {
try { error = JSON.parse(http.responseText)["result"]["error"]; } catch (_) { /* Nah */ }
}
if (error === "ValidatorError") {
- wm.error("Invalid username or password characters").then(__tryAgain);
+ wm.error("Invalid characters in credentials").then(__tryAgain);
} else {
wm.error("Login error: ", http.responseText).then(__tryAgain); } @@ -77,11 +77,13 @@ function __login() { function __setEnabled(enabled) { tools.el.setEnabled($("user-input"), enabled); tools.el.setEnabled($("passwd-input"), enabled); + tools.el.setEnabled($("code-input"), enabled); tools.el.setEnabled($("login-button"), enabled); } function __tryAgain() { __setEnabled(true); - $("passwd-input").focus(); - $("passwd-input").select(); + let el = ($("code-input").value.length ? $("code-input") : $("passwd-input")); + el.focus(); + el.select(); } | ||