diff options
Diffstat (limited to 'app/edit.js')
| -rw-r--r-- | app/edit.js | 56 |
1 files changed, 56 insertions, 0 deletions
diff --git a/app/edit.js b/app/edit.js new file mode 100644 index 0000000..9b2b732 --- /dev/null +++ b/app/edit.js @@ -0,0 +1,56 @@ +function editButton(id) { + const buttonElement = document.createElement('i'); + buttonElement.classList.add('edit'); + + buttonElement.classList.add('fa-solid'); + buttonElement.classList.add('fa-pen-to-square'); + buttonElement.setAttribute('title', 'Edit'); + + buttonElement.addEventListener('click', (clicked) => { + editElement(clicked.target.parentNode, id); + }); + + return buttonElement; +} + +function editElement(element, id) { + const forms = document.createElement('form'); + const put = document.createElement('input'); + + put.style.fontSize = '0.9em'; + put.autofocus = true; + put.value = element.childNodes[0].textContent; + + forms.appendChild(put); + + hide(element); + + forms.addEventListener('submit', (e) => { + e.preventDefault(); + + id = jsList.findIndex(el => el.id == id) + jsList[id].name = put.value; + localStorage.setItem('jsList', JSON.stringify(jsList)); + + unhide(element, put, forms); + }, true); + + element.appendChild(forms); +} + +function hide(element) { + element.childNodes[0].textContent = ''; + element.childNodes[1].style.display = 'none'; + element.childNodes[2].style.display = 'none'; + element.childNodes[3].style.display = 'none'; +} + +function unhide(element, put, forms) { + element.childNodes[0].textContent = put.value; + element.childNodes[1].style.display = ''; + element.childNodes[2].style.display = ''; + element.childNodes[3].style.display = ''; + + put.remove(); + forms.remove(); +}
\ No newline at end of file |