Improve handling of code input in TOTP page
This commit is contained in:
parent
1a1b31e8a0
commit
834ba1987e
@ -38,19 +38,23 @@ function OTPInput() {
|
||||
for (let i = 0; i < inputs.length; i++) {
|
||||
// Reset form on init
|
||||
inputs[i].value = "";
|
||||
}
|
||||
|
||||
inputs[i].addEventListener('keydown', (event) => {
|
||||
let currIndex = 0;
|
||||
|
||||
document.addEventListener('keydown', (event) => {
|
||||
if (event.key === "Backspace") {
|
||||
if (inputs[i].value != "") {
|
||||
inputs[i].value = '';
|
||||
} else if (i > 0) {
|
||||
inputs[i - 1].value = "";
|
||||
inputs[i - 1].focus();
|
||||
if (inputs[currIndex].value != "") {
|
||||
inputs[currIndex].value = '';
|
||||
} else if (currIndex > 0) {
|
||||
inputs[currIndex - 1].value = "";
|
||||
inputs[currIndex - 1].focus();
|
||||
currIndex--;
|
||||
}
|
||||
}
|
||||
|
||||
// Code has already been typed entirely
|
||||
else if (i === inputs.length - 1 && inputs[i].value !== '')
|
||||
else if (currIndex === inputs.length - 1 && inputs[currIndex].value !== '')
|
||||
{
|
||||
return;
|
||||
}
|
||||
@ -58,9 +62,11 @@ function OTPInput() {
|
||||
// Add new digit
|
||||
else if ((event.keyCode >= 48 && event.keyCode <= 57)
|
||||
|| (event.keyCode >= 96 && event.keyCode <= 105)){
|
||||
inputs[i].value = event.key;
|
||||
if (i !== inputs.length - 1)
|
||||
inputs[i + 1].focus();
|
||||
inputs[currIndex].value = event.key;
|
||||
if (currIndex < inputs.length - 1) {
|
||||
inputs[currIndex + 1].focus();
|
||||
currIndex++;
|
||||
}
|
||||
else
|
||||
submitCode();
|
||||
}
|
||||
@ -68,7 +74,6 @@ function OTPInput() {
|
||||
event.preventDefault();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function submitCode() {
|
||||
const code = [...document.querySelectorAll('#otp > *[id]')]
|
||||
|
Loading…
Reference in New Issue
Block a user