From 510136191f0efedf88558ee9ee4017a57e839baa Mon Sep 17 00:00:00 2001 From: Fithi Teklom Date: Tue, 16 Dec 2025 22:18:37 +0000 Subject: [PATCH 01/11] debugged the issue on the javascript file and modified html file. --- debugging/book-library/index.html | 4 ++-- debugging/book-library/script.js | 16 +++++++++------- 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 23acfa71..8e4cffce 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -62,10 +62,10 @@

Library

/>Read diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 75ce6c1d..7bcafc33 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -27,18 +27,20 @@ const check = document.getElementById("check"); //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() { +function addBook() { if ( title.value == null || title.value == "" || pages.value == null || - pages.value == "" + pages.value == "" || + author.value == null || + author.value == "" ) { alert("Please fill all fields!"); return false; } else { let book = new Book(title.value, title.value, pages.value, check.checked); - library.push(book); + myLibrary.push(book); render(); } } @@ -54,7 +56,7 @@ function render() { let table = document.getElementById("display"); let rowsNumber = table.rows.length; //delete old table - for (let n = rowsNumber - 1; n > 0; n-- { + for (let n = rowsNumber - 1; n > 0; n-- ) { table.deleteRow(n); } //insert updated row and cells @@ -76,7 +78,7 @@ function render() { changeBut.className = "btn btn-success"; wasReadCell.appendChild(changeBut); let readStatus = ""; - if (myLibrary[i].check == false) { + if (myLibrary[i].check == true) { readStatus = "Yes"; } else { readStatus = "No"; @@ -89,12 +91,12 @@ function render() { }); //add delete button to every row and render again - let delButton = document.createElement("button"); + let delBut = document.createElement("button"); delBut.id = i + 5; deleteCell.appendChild(delBut); delBut.className = "btn btn-warning"; delBut.innerHTML = "Delete"; - delBut.addEventListener("clicks", function () { + delBut.addEventListener("click", function () { alert(`You've deleted title: ${myLibrary[i].title}`); myLibrary.splice(i, 1); render(); From 8be6584f5fc566ade68be67feba424041ebd96e7 Mon Sep 17 00:00:00 2001 From: Fithi Teklom Date: Thu, 18 Dec 2025 13:09:04 +0000 Subject: [PATCH 02/11] formatted it in the first place --- debugging/book-library/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 8e4cffce..5cd7dc52 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -93,4 +93,4 @@

Library

- + From 69ea84e541036566e8722a28566740c2b81a099d Mon Sep 17 00:00:00 2001 From: Fithi Teklom Date: Thu, 18 Dec 2025 13:15:53 +0000 Subject: [PATCH 03/11] removed unnecessary slashes --- debugging/book-library/index.html | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 5cd7dc52..f5f5d6de 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -6,15 +6,15 @@ charset="utf-8" name="viewport" content="width=device-width, initial-scale=1.0" - /> + > - + > + @@ -44,7 +44,7 @@

Library

id="author" name="author" required - /> + > Library id="pages" name="pages" required - /> + > + > From c719ec1f40c64743448ddf8573850e05556ba953 Mon Sep 17 00:00:00 2001 From: Fithi Teklom Date: Thu, 18 Dec 2025 13:23:28 +0000 Subject: [PATCH 04/11] some adjustments --- debugging/book-library/index.html | 29 +++++------------------------ 1 file changed, 5 insertions(+), 24 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index f5f5d6de..4f38ea1b 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -2,19 +2,12 @@ - + - - + + @@ -30,21 +23,9 @@

Library

- + - + Date: Thu, 18 Dec 2025 13:38:45 +0000 Subject: [PATCH 05/11] used html validator and there is no error --- debugging/book-library/index.html | 22 +++++++++++++++++----- 1 file changed, 17 insertions(+), 5 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 4f38ea1b..26084c70 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -1,8 +1,8 @@ - + - - + Book Library + @@ -23,9 +23,21 @@

Library

- + - + Date: Thu, 18 Dec 2025 14:27:58 +0000 Subject: [PATCH 06/11] made some modifications in the js file --- debugging/book-library/index.html | 2 +- debugging/book-library/script.js | 65 +++++++++++++++---------------- 2 files changed, 33 insertions(+), 34 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 26084c70..daf791d1 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -58,7 +58,7 @@

Library

type="button" value="Submit" class="btn btn-primary" - onclick="addButton();" + onclick="addBook();" >
diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 7bcafc33..cdb72abc 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -7,16 +7,15 @@ window.addEventListener("load", function (e) { 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); - myLibrary.push(book2); - render(); + myLibrary.push(book1,book2); + } } @@ -28,21 +27,20 @@ const check = document.getElementById("check"); //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 addBook() { - if ( - title.value == null || - title.value == "" || - pages.value == null || - pages.value == "" || - author.value == null || - author.value == "" - ) { - alert("Please fill all fields!"); + if (!title.value.trim() || !author.value.trim() || !pages.value.trim()) { + alert("Please fill all fields!"); + return false; + } + + let pagesNumber = parseInt(pages.value, 10); + if (isNaN(pagesNumber)) { + alert("Page count must be a number!"); return false; - } else { - let book = new Book(title.value, title.value, pages.value, check.checked); - myLibrary.push(book); - render(); } + let book = new Book(title.value.trim(), author.value.trim(), pagesNumber, check.checked); + myLibrary.push(book); + render(); + } function Book(title, author, pages, check) { @@ -68,35 +66,36 @@ function render() { let pagesCell = row.insertCell(2); let wasReadCell = row.insertCell(3); let deleteCell = row.insertCell(4); - titleCell.innerHTML = myLibrary[i].title; - authorCell.innerHTML = myLibrary[i].author; - pagesCell.innerHTML = myLibrary[i].pages; + titleCell.textContent = myLibrary[i].title; + authorCell.textContent = myLibrary[i].author; + pagesCell.textContent = 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 toggleReadBtn = document.createElement("button"); + toggleReadBtn.dataset.index = i; + toggleReadBtn.className = "btn btn-success"; + wasReadCell.appendChild(toggleReadBtn); let readStatus = ""; if (myLibrary[i].check == true) { readStatus = "Yes"; } else { readStatus = "No"; } - changeBut.innerText = readStatus; + toggleReadBtn.innerText = readStatus; - changeBut.addEventListener("click", function () { + toggleReadBtn.addEventListener("click", function () { myLibrary[i].check = !myLibrary[i].check; render(); }); //add delete button to every row and render again - let delBut = document.createElement("button"); - delBut.id = i + 5; - deleteCell.appendChild(delBut); - delBut.className = "btn btn-warning"; - delBut.innerHTML = "Delete"; - delBut.addEventListener("click", function () { + let deleteBtn = document.createElement("button"); + deleteBtn.dataset.index = i; + deleteCell.appendChild(deleteBtn); + deleteBtn.className = "btn btn-warning"; + deleteBtn.innerHTML = "Delete"; + deleteBtn.addEventListener("click", function () { alert(`You've deleted title: ${myLibrary[i].title}`); myLibrary.splice(i, 1); render(); From db2bff78b606421e5b206a76da93db2a46a3a485 Mon Sep 17 00:00:00 2001 From: Fithi Teklom Date: Fri, 19 Dec 2025 00:29:33 +0000 Subject: [PATCH 07/11] wrote a conditional statement in a single statement --- debugging/book-library/script.js | 40 +++++++++++++++++++------------- 1 file changed, 24 insertions(+), 16 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index cdb72abc..16dd428c 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -27,20 +27,30 @@ const check = document.getElementById("check"); //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 addBook() { - if (!title.value.trim() || !author.value.trim() || !pages.value.trim()) { - alert("Please fill all fields!"); - return false; + const sanitizedTitle = title.value.trim(); + const sanitizedAuthor = author.value.trim(); + const sanitizedPages = Number(pages.value); + const isRead = check.checked; + + if (!sanitizedTitle || !sanitizedAuthor) { + alert("Title and author cannot be empty."); + return; } - - let pagesNumber = parseInt(pages.value, 10); - if (isNaN(pagesNumber)) { - alert("Page count must be a number!"); - return false; + + if (!Number.isInteger(sanitizedPages) || sanitizedPages <= 0) { + alert("Pages must be a positive whole number."); + return; } - let book = new Book(title.value.trim(), author.value.trim(), pagesNumber, check.checked); + + const book = new Book( + sanitizedTitle, + sanitizedAuthor, + sanitizedPages, + isRead + ); + myLibrary.push(book); render(); - } function Book(title, author, pages, check) { @@ -76,13 +86,11 @@ function render() { toggleReadBtn.dataset.index = i; toggleReadBtn.className = "btn btn-success"; wasReadCell.appendChild(toggleReadBtn); - let readStatus = ""; - if (myLibrary[i].check == true) { - readStatus = "Yes"; - } else { - readStatus = "No"; - } + + let readStatus = myLibrary[i].check ? "Yes" : "No"; toggleReadBtn.innerText = readStatus; + changeBut.innerText = readStatus; + toggleReadBtn.addEventListener("click", function () { myLibrary[i].check = !myLibrary[i].check; From 536e55ac3c1a6cf0c5db4fb2743c7b23bec353c8 Mon Sep 17 00:00:00 2001 From: Fithi Teklom Date: Fri, 19 Dec 2025 00:32:28 +0000 Subject: [PATCH 08/11] assign the DOM via textContent --- debugging/book-library/script.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 16dd428c..f543693c 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -88,8 +88,8 @@ function render() { wasReadCell.appendChild(toggleReadBtn); let readStatus = myLibrary[i].check ? "Yes" : "No"; - toggleReadBtn.innerText = readStatus; - changeBut.innerText = readStatus; + toggleReadBtn.textContent = readStatus; + changeBut.textContent = readStatus; toggleReadBtn.addEventListener("click", function () { @@ -102,7 +102,7 @@ function render() { deleteBtn.dataset.index = i; deleteCell.appendChild(deleteBtn); deleteBtn.className = "btn btn-warning"; - deleteBtn.innerHTML = "Delete"; + deleteBtn.textContent = "Delete"; deleteBtn.addEventListener("click", function () { alert(`You've deleted title: ${myLibrary[i].title}`); myLibrary.splice(i, 1); From cfe265098246acd8aca6c05e7ba1b300813b6b4c Mon Sep 17 00:00:00 2001 From: Fithi Teklom Date: Fri, 19 Dec 2025 00:40:45 +0000 Subject: [PATCH 09/11] removed unnecessary variables --- debugging/book-library/script.js | 21 ++++++++------------- 1 file changed, 8 insertions(+), 13 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index f543693c..29584132 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -82,20 +82,15 @@ function render() { //add and wait for action for read/unread button - let toggleReadBtn = document.createElement("button"); - toggleReadBtn.dataset.index = i; - toggleReadBtn.className = "btn btn-success"; - wasReadCell.appendChild(toggleReadBtn); - - let readStatus = myLibrary[i].check ? "Yes" : "No"; - toggleReadBtn.textContent = readStatus; - changeBut.textContent = readStatus; - + let toggleReadBtn = document.createElement("button"); + toggleReadBtn.className = "btn btn-success"; + toggleReadBtn.innerText = myLibrary[i].check ? "Yes" : "No"; // ternary operator + wasReadCell.appendChild(toggleReadBtn); - toggleReadBtn.addEventListener("click", function () { - myLibrary[i].check = !myLibrary[i].check; - render(); - }); + toggleReadBtn.addEventListener("click", function () { + myLibrary[i].check = !myLibrary[i].check; + render(); +}); //add delete button to every row and render again let deleteBtn = document.createElement("button"); From bee984d2b6f10f119caa1147625fa179053102e9 Mon Sep 17 00:00:00 2001 From: Fithi Teklom Date: Fri, 19 Dec 2025 00:44:29 +0000 Subject: [PATCH 10/11] made some changes --- debugging/book-library/script.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 29584132..63b51c63 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -64,9 +64,9 @@ function render() { let table = document.getElementById("display"); let rowsNumber = table.rows.length; //delete old table - for (let n = rowsNumber - 1; n > 0; n-- ) { - table.deleteRow(n); - } + const tbody = table.querySelector("tbody"); + tbody.innerHTML = ""; + //insert updated row and cells let length = myLibrary.length; for (let i = 0; i < length; i++) { From ff8a6ea294c6cf2f0c9ffe57deede1fdb5a2c37c Mon Sep 17 00:00:00 2001 From: Fithi Teklom Date: Fri, 19 Dec 2025 21:38:51 +0000 Subject: [PATCH 11/11] fixed the bug --- debugging/book-library/script.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 63b51c63..d728a934 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -70,7 +70,7 @@ function render() { //insert updated row and cells let length = myLibrary.length; for (let i = 0; i < length; i++) { - let row = table.insertRow(1); + let row = tbody.insertRow(); let titleCell = row.insertCell(0); let authorCell = row.insertCell(1); let pagesCell = row.insertCell(2); @@ -81,7 +81,6 @@ function render() { pagesCell.textContent = myLibrary[i].pages; - //add and wait for action for read/unread button let toggleReadBtn = document.createElement("button"); toggleReadBtn.className = "btn btn-success"; toggleReadBtn.innerText = myLibrary[i].check ? "Yes" : "No"; // ternary operator @@ -89,9 +88,10 @@ function render() { toggleReadBtn.addEventListener("click", function () { myLibrary[i].check = !myLibrary[i].check; - render(); + render(); }); + //add delete button to every row and render again let deleteBtn = document.createElement("button"); deleteBtn.dataset.index = i;