fix bug + add tabindex

This commit is contained in:
Mystikfluu 2023-01-15 12:20:21 +01:00
parent ddf53e5908
commit 9d3a272193
2 changed files with 69 additions and 60 deletions

View File

@ -17,19 +17,19 @@
<div id="table_div"> <div id="table_div">
<div id="table_entries"> <div id="table_entries">
<div>Entry name</div> <div>Entry name</div>
<div class="entry_name" id="createEntry_name"><input type="text" placeholder="New Entry Name"></div> <div class="entry_name" id="createEntry_name"><input type="text" placeholder="New Entry Name" tabindex="1"></div>
</div> </div>
<div id="table_users"> <div id="table_users">
<div>Username</div> <div>Username</div>
<div class="entry_user" id="createEntry_user"><input type="text" placeholder="New Username"></div> <div class="entry_user" id="createEntry_user"><input type="text" placeholder="New Username" tabindex="1"></div>
</div> </div>
<div id="table_pwds"> <div id="table_pwds">
<div>Password</div> <div>Password</div>
<div class="entry_pass" id="createEntry_pass"><input type="password" placeholder="New Password"></div> <div class="entry_pass" id="createEntry_pass"><input type="password" placeholder="New Password" tabindex="1"></div>
</div> </div>
<div id="table_actions"> <div id="table_actions">
<div>Action</div> <div>Action</div>
<div class="button" id="createEntry_actions"><button>Create</button></div> <div class="button" id="createEntry_actions"><button tabindex="1">Create</button></div>
</div> </div>
</div> </div>

View File

@ -18,7 +18,7 @@ async function startup() {
document.querySelector("#createEntry_actions > button").addEventListener("click",createEntry); document.querySelector("#createEntry_actions > button").addEventListener("click",createEntry);
let entries = await invoke("get_entries"); let entries = await invoke("get_entries");
console.log(entries);
for(let i = 0; i < entries.length; i++) { for(let i = 0; i < entries.length; i++) {
buildEntry(entries[i]); buildEntry(entries[i]);
} }
@ -74,63 +74,72 @@ async function startup() {
} }
} }
let entry_priority = 1
function buildEntry(entry) { function buildEntry(entry) {
let nameDiv = document.createElement("div");
nameDiv.setAttribute("class", "entry_name");
nameDiv.setAttribute("id",`${entry.replaceAll(" ","-")}_name`)
let nameInput = document.createElement("input");
nameInput.setAttribute("type", "text");
nameInput.setAttribute("placeholder", "New Entry Name");
nameInput.setAttribute("value", entry);
nameInput.setAttribute("readonly", true);
nameInput.setAttribute("unselectable", "on")
nameDiv.appendChild(nameInput);
let userDiv = document.createElement("div");
userDiv.setAttribute("class", "entry_user");
userDiv.setAttribute("id",`${entry.replaceAll(" ","-")}_user`)
let userInput = document.createElement("input");
userInput.setAttribute("type", "password");
userInput.setAttribute("placeholder", "New Username");
userInput.setAttribute("value", "PLACEHOLDER");
userInput.setAttribute("readonly", true);
userInput.setAttribute("unselectable", "on")
userDiv.appendChild(userInput);
let passDiv = document.createElement("div");
passDiv.setAttribute("class", "entry_pass");
passDiv.setAttribute("id",`${entry.replaceAll(" ","-")}_pass`)
let passInput = document.createElement("input");
passInput.setAttribute("type", "password");
passInput.setAttribute("placeholder", "New Password");
passInput.setAttribute("value", "PLACEHOLDER!");
passInput.setAttribute("readonly", true);
passInput.setAttribute("unselectable", "on")
passDiv.appendChild(passInput);
let showButton = document.createElement("button");
showButton.innerText = "Show";
showButton.addEventListener("click",showEntry.bind(showButton, entry),false);
showButton.setAttribute("class", "showbutton");
let editButton = document.createElement("button"); entry_priority++;
editButton.innerText = "Edit";
editButton.addEventListener("click", editEntry.bind(editButton, entry), false); let nameDiv = document.createElement("div");
editButton.setAttribute("class", "editbutton"); nameDiv.setAttribute("class", "entry_name");
nameDiv.setAttribute("id",`${entry.replaceAll(" ","-")}_name`)
let nameInput = document.createElement("input");
nameInput.setAttribute("type", "text");
nameInput.setAttribute("placeholder", "New Entry Name");
nameInput.setAttribute("value", entry);
nameInput.setAttribute("readonly", true);
nameInput.setAttribute("unselectable", "on")
nameInput.setAttribute("tabindex",entry_priority)
nameDiv.appendChild(nameInput);
let userDiv = document.createElement("div");
userDiv.setAttribute("class", "entry_user");
userDiv.setAttribute("id",`${entry.replaceAll(" ","-")}_user`)
let userInput = document.createElement("input");
userInput.setAttribute("type", "password");
userInput.setAttribute("placeholder", "New Username");
userInput.setAttribute("value", "PLACEHOLDER");
userInput.setAttribute("readonly", true);
userInput.setAttribute("unselectable", "on")
userInput.setAttribute("tabindex",entry_priority)
userDiv.appendChild(userInput);
let passDiv = document.createElement("div");
passDiv.setAttribute("class", "entry_pass");
passDiv.setAttribute("id",`${entry.replaceAll(" ","-")}_pass`)
let passInput = document.createElement("input");
passInput.setAttribute("type", "password");
passInput.setAttribute("placeholder", "New Password");
passInput.setAttribute("value", "PLACEHOLDER!");
passInput.setAttribute("readonly", true);
passInput.setAttribute("unselectable", "on")
userInput.setAttribute("tabindex",entry_priority)
passDiv.appendChild(passInput);
let showButton = document.createElement("button");
showButton.innerText = "Show";
showButton.addEventListener("click",showEntry.bind(showButton, entry),false);
showButton.setAttribute("class", "showbutton");
showButton.setAttribute("tabindex",entry_priority)
let actionDiv = document.createElement("div") let editButton = document.createElement("button");
actionDiv.appendChild(showButton) editButton.innerText = "Edit";
actionDiv.appendChild(editButton) editButton.addEventListener("click", editEntry.bind(editButton, entry), false);
actionDiv.setAttribute("id",`${entry.replaceAll(" ","-")}_actions`) editButton.setAttribute("class", "editbutton");
editButton.setAttribute("tabindex",entry_priority)
document.getElementById("table_entries").appendChild(nameDiv)
document.getElementById("table_users").appendChild(userDiv) let actionDiv = document.createElement("div")
document.getElementById("table_pwds").appendChild(passDiv) actionDiv.appendChild(showButton)
document.getElementById("table_actions").appendChild(actionDiv) actionDiv.appendChild(editButton)
actionDiv.setAttribute("id",`${entry.replaceAll(" ","-")}_actions`)
document.getElementById("table_entries").appendChild(nameDiv)
document.getElementById("table_users").appendChild(userDiv)
document.getElementById("table_pwds").appendChild(passDiv)
document.getElementById("table_actions").appendChild(actionDiv)
} }
@ -252,7 +261,7 @@ async function createEntry() {
let mpw = await get_pw() let mpw = await get_pw()
let success = await invoke("create_entry", {name: entryNameField.value, username: entryNameField.value, pw: entryPassField.value, mpw: mpw}); let success = await invoke("create_entry", {name: entryNameField.value, username: entryUserField.value, pw: entryPassField.value, mpw: mpw});
if(success) { if(success) {
alert("Successfully created entry!"); alert("Successfully created entry!");