kosh/unnamed-password-manager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add Form Logic

Browse Source
This commit is contained in:
Modo 2023-10-21 22:22:49 +05:30
parent 106888c7f4
commit 69bfc652aa
3 changed files with 50 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
frontend/html/dashboard.html
View File

@ -44,7 +44,6 @@
</div>
</div>
<div id="entrycontainer" class="hidden">
<div class="addentrydiv">
@ -53,29 +52,29 @@
</div>
<div class="fieldcontainer">
<form>
<form id="formdata">
<div>
<input type="text" name="sitename" placeholder="Site Name">
<input type="text" name="url" placeholder="Site URL">
<button type="button"></button>
<button type="button" onclick="submitForm()"></button>
</div>
<div class="inputfieldpanel">
<div>
<input type="checkbox" id="checkbox">
<input type="text" name="Username" placeholder="Username"><br>
<input type="checkbox" id="u_checkbox">
<input type="text" name="Username" placeholder="Username" id="u_input" disabled><br>
</div>
<div>
<input type="checkbox" id="checkbox">
<input type="text" name="Password" placeholder="Password"><br>
<input type="checkbox" id="p_checkbox">
<input type="text" name="Password" placeholder="Password" id="p_input" disabled><br>
</div>
<div>
<input type="checkbox" id="checkbox">
<input type="text" name="Email" placeholder="Email Address"><br>
<input type="checkbox" id="e_checkbox">
<input type="text" name="Email" placeholder="Email Address" id="e_input" disabled><br>
</div>
<div>
<input type="checkbox" id="checkbox">
<input type="text" name="PhNumber" placeholder="Phone Number"><br>
<input type="checkbox" id="n_checkbox">
<input type="text" name="PhNumber" placeholder="Phone Number" id="n_input" disabled><br>
</div>
</div>
</form>

47
frontend/scripts/dashboard.js
View File

@ -54,7 +54,7 @@ function updateListGui(field) {
}
//----------------------------------------------------------------------------------------- Search Bar and Content Formatting
// const data = {
@ -100,7 +100,7 @@ function getDisplayList(fieldnames,userdata){
}
}
//-----------------------------------------------------------------------------------------
//----------------------------------------------------------------------------------------- Filter Search
const search = document.getElementById('search');
@ -127,7 +127,7 @@ function getFilterList(keyword,data) { //Gets Filtered Fie
//console.log(filterarray)
}
//-----------------------------------------------------------------------------------------
//----------------------------------------------------------------------------------------- "Add Data" Window Logic
const addentry = document.getElementById('addentry')
const entrywindow = document.querySelector('#entrycontainer')
@ -135,6 +135,7 @@ const entrywindow = document.querySelector('#entrycontainer')
addentry.addEventListener('click', function() {
entrywindow.classList.toggle("hidden");
entrywindow.style.display = "flex";
addFieldLogic()
})
const exitentrywin = document.getElementById('backbtn')
@ -143,13 +144,44 @@ exitentrywin.addEventListener('click', function() {
entrywindow.style.display = "none"
})
//-----------------------------------------------------------------------------------------
//----------------------------------------------------------------------------------------- Form Behaviour Logic
function addFieldLogic() {
const forminputs = document.querySelectorAll('.inputfieldpanel div input[type="text"]')
const formcheckbox = document.querySelectorAll('.inputfieldpanel div input[type="checkbox"]')
formcheckbox.forEach((checkbox, index) => {
forminputs[index].disabled = true
forminputs[index].value = ''
checkbox.checked = false;
})
formcheckbox.forEach((checkbox, index) =>
checkbox.addEventListener('change', function(){
forminputs[index].disabled = !checkbox.checked;
if(forminputs[index].disabled){
forminputs[index].value = ''
}
})
)
}
//----------------------------------------------------------------------------------------- Form Data Logic
function submitForm() {
const form = document.getElementById('formdata')
const formdata = new FormData(form)
console.log(formdata)
}
//----------------------------------------------------------------------------------------- Display User Information
function updateInfoGui(call) {
console.log(call)
}
//----------------------------------------------------------------------------------------- Welcome Message
const greettext = document.querySelector('#greetname')
const masterusername = localStorage.getItem("username");
console.log(masterusername)
@ -158,7 +190,7 @@ function greet(){
greettext.textContent = masterusername;
}
//-----------------------------------------------------------------------------------------
//----------------------------------------------------------------------------------------- Logout
async function logOut() {
try{
@ -193,7 +225,6 @@ logoutbtn.addEventListener('click', () => {
window.onload = function() {
getData();
greet()
entrywindow.classList.toggle("hidden");
entrywindow.style.display = "flex";
// entrywindow.classList.toggle("hidden");
// entrywindow.style.display = "flex";
};

2
frontend/styles/dashboard.css
View File

@ -394,7 +394,7 @@ footer p{
width: 100%;
height: 100%;
background-color: hsl(0, 0%, 100%, 10%);
display: flex;
display: none;
justify-content: center;
align-items: center;
backdrop-filter: blur(20px);