From 7af1a0915ec6fd8b125188682627788dd77b2c77 Mon Sep 17 00:00:00 2001 From: Mohammed Abdoon Date: Sat, 6 Dec 2025 16:38:08 +0000 Subject: [PATCH 1/3] finished library book --- debugging/book-library/index.html | 38 +++++------ debugging/book-library/script.js | 101 ++++++++++++++++-------------- 2 files changed, 70 insertions(+), 69 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 23acfa71..b9f72549 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -1,20 +1,20 @@ - + - + My Book Library + + > - + > + @@ -31,20 +31,20 @@

Library

+ > + > Library id="pages" name="pages" required - /> + > + id = "submitBtn" + >
@@ -80,14 +80,8 @@

Library

- - - - - - - - + + diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 75ce6c1d..8eb7656f 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -2,16 +2,15 @@ let myLibrary = []; window.addEventListener("load", function (e) { populateStorage(); - render(); }); function populateStorage() { if (myLibrary.length == 0) { - let book1 = new Book("Robison Crusoe", "Daniel Defoe", "252", true); + let book1 = new Book("Robison Crusoe", "Daniel Defoe", 252, true); let book2 = new Book( "The Old Man and the Sea", "Ernest Hemingway", - "127", + 127, true ); myLibrary.push(book1); @@ -19,29 +18,37 @@ function populateStorage() { render(); } } - -const title = document.getElementById("title"); -const author = document.getElementById("author"); -const pages = document.getElementById("pages"); -const check = document.getElementById("check"); +const submitBtn = document.getElementById("submitBtn"); +submitBtn.addEventListener("click", () => { + submit(); +}) //check the right input from forms and if its ok -> add the new book (object in array) //via Book function and start render function -function submit() { - if ( - title.value == null || - title.value == "" || - pages.value == null || - pages.value == "" - ) { +function submit() { + let titleInput = document.getElementById("title").value; + let authorInput = document.getElementById("author").value.trim(); + const pagesInput = Number(document.getElementById("pages").value.trim()); + const checkBtn = document.getElementById("check"); + + titleInput = titleInput.replace(/ 0; n-- { - table.deleteRow(n); - } + tableBody.innerHTML = ""; + //insert updated row and cells let length = myLibrary.length; for (let i = 0; i < length; i++) { - let row = table.insertRow(1); - let titleCell = row.insertCell(0); - let authorCell = row.insertCell(1); - let pagesCell = row.insertCell(2); + let row = tableBody.insertRow(0); + let titleCell = row.insertCell(0); + let authorCell = row.insertCell(1); + let pagesCell = row.insertCell(2); let wasReadCell = row.insertCell(3); - let deleteCell = row.insertCell(4); - titleCell.innerHTML = myLibrary[i].title; + let deleteCell = row.insertCell(4); + titleCell.innerHTML = myLibrary[i].title; authorCell.innerHTML = myLibrary[i].author; - pagesCell.innerHTML = myLibrary[i].pages; + pagesCell.innerHTML = myLibrary[i].pages; //add and wait for action for read/unread button - let changeBut = document.createElement("button"); - changeBut.id = i; - changeBut.className = "btn btn-success"; - wasReadCell.appendChild(changeBut); + let changeButton = document.createElement("button"); + changeButton.className = "btn btn-success"; + wasReadCell.appendChild(changeButton); let readStatus = ""; - if (myLibrary[i].check == false) { + if (myLibrary[i].check == true) { readStatus = "Yes"; } else { readStatus = "No"; } - changeBut.innerText = readStatus; + changeButton.innerText = readStatus; - changeBut.addEventListener("click", function () { + changeButton.addEventListener("click", function () { myLibrary[i].check = !myLibrary[i].check; render(); }); //add delete button to every row and render again - let delButton = document.createElement("button"); - delBut.id = i + 5; - deleteCell.appendChild(delBut); - delBut.className = "btn btn-warning"; - delBut.innerHTML = "Delete"; - delBut.addEventListener("clicks", function () { - alert(`You've deleted title: ${myLibrary[i].title}`); - myLibrary.splice(i, 1); + let deleteButtton = document.createElement("button"); + deleteButtton.id = i + deleteCell.appendChild(deleteButtton); + deleteButtton.className = "btn btn-warning"; + deleteButtton.innerHTML = "Delete"; + deleteButtton.addEventListener("click", function () { + const currentBookTitle = myLibrary[i].title; + if (myLibrary.splice(i, 1)) { + alert(`You've deleted title: ${currentBookTitle}`); + } render(); }); } From 0201147afc02fb22ce58ee85b0a795188156ed86 Mon Sep 17 00:00:00 2001 From: Mohammed Abdoon Date: Sun, 7 Dec 2025 15:11:59 +0000 Subject: [PATCH 2/3] removed debugging code --- debugging/book-library/script.js | 1 - 1 file changed, 1 deletion(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 8eb7656f..98462555 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -34,7 +34,6 @@ function submit() { titleInput = titleInput.replace(/ Date: Sun, 7 Dec 2025 15:56:59 +0000 Subject: [PATCH 3/3] improved the code --- debugging/book-library/script.js | 19 +++++++------------ 1 file changed, 7 insertions(+), 12 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 98462555..3d63e563 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -26,9 +26,9 @@ submitBtn.addEventListener("click", () => { //check the right input from forms and if its ok -> add the new book (object in array) //via Book function and start render function function submit() { - let titleInput = document.getElementById("title").value; + let titleInput = document.getElementById("title").value.trim(); let authorInput = document.getElementById("author").value.trim(); - const pagesInput = Number(document.getElementById("pages").value.trim()); + const pagesInput = Number(document.getElementById("pages").value); const checkBtn = document.getElementById("check"); titleInput = titleInput.replace(/