Integrated simple-keyboard from hodged as a on-screen keyboard #14

This commit is contained in:
ChaoticByte 2023-02-13 19:31:21 +01:00
parent 6c72b5059f
commit 0ab45c6e68
9 changed files with 145 additions and 92 deletions

View file

@ -1,7 +1,6 @@
(() => {
// Define variables
let usernameInputElement;
let passwordInputElement;
let submitButton;
@ -11,77 +10,43 @@
let pinpadButtons;
let userlistContainerElement;
// Add event listeners after DOM Content loaded
document.addEventListener("DOMContentLoaded", () => {
// elements
usernameInputElement = document.getElementById("id_username");
passwordInputElement = document.getElementById("id_password");
submitButton = document.getElementById("submit_login");
passwordOverlayElement = document.getElementById("passwordoverlaycontainer");
pwOverlayCancelButton = document.getElementById("pwocancel");
userlistContainerElement = document.getElementById("userlistcontainer");
userlistButtons = document.getElementsByClassName("userlistbutton");
pinpadButtons = document.getElementsByClassName("pinpadbtn");
// event listeners
// [...<html-collection>] converts an html collection to an array
[...userlistButtons].forEach(element => {
element.addEventListener("click", () => {
set_username(element.dataset.username);
show_password_overlay();
})
});
[...pinpadButtons].forEach(element => {
element.addEventListener("click", () => {
pinpad_press(element.dataset.btn);
})
})
pwOverlayCancelButton.addEventListener("click", () => {
hide_password_overlay();
});
})
function set_username(username) {
usernameInputElement.value = username;
}
function show_password_overlay() {
window.scrollTo(0, 0);
passwordOverlayElement.classList.remove("nodisplay");
userlistContainerElement.classList.add("nodisplay");
}
function hide_password_overlay() {
passwordOverlayElement.classList.add("nodisplay");
userlistContainerElement.classList.remove("nodisplay");
passwordInputElement.value = "";
}
function pinpad_press(key) {
if (key == "enter") {
submitButton.click();
}
else if (key == "x") {
passwordInputElement.value = "";
}
else {
passwordInputElement.value += key;
}
}
})()