From 542c0c1011c977986ce6bd972e0a99408246cfa7 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Thu, 11 Dec 2025 15:28:10 +0000 Subject: [PATCH 01/16] fix: correct typo in delete button logic --- debugging/book-library/script.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 75ce6c1d..bb8b9ff3 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -90,11 +90,11 @@ function 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 () { + delButton.id = i + 5; + deleteCell.appendChild(delButton); + delButton.className = "btn btn-warning"; + delButton.innerHTML = "Delete"; + delButton.addEventListener("click", function () { alert(`You've deleted title: ${myLibrary[i].title}`); myLibrary.splice(i, 1); render(); From bb7e8744841502c46c04c9515bd302adc8004684 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Thu, 11 Dec 2025 15:28:40 +0000 Subject: [PATCH 02/16] fix: update condition for read status --- debugging/book-library/script.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index bb8b9ff3..72f1e5e5 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -76,7 +76,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"; From 556cd3e789172e80d18efcc378cc5723848620f6 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Thu, 11 Dec 2025 15:28:58 +0000 Subject: [PATCH 03/16] fix: correct syntax error in render function loop --- debugging/book-library/script.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 72f1e5e5..2d4f221a 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -54,7 +54,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 From 43b06b01ebea531a32a0d6e2d392f7d085b151a1 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Thu, 11 Dec 2025 15:29:21 +0000 Subject: [PATCH 04/16] fix: correct book object creation in submit function --- debugging/book-library/script.js | 11 +++-------- 1 file changed, 3 insertions(+), 8 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 2d4f221a..3e2368f5 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -28,17 +28,12 @@ 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() { - if ( - title.value == null || - title.value == "" || - pages.value == null || - pages.value == "" - ) { + if (!title.value || !author.value || pages.value <= 0) { alert("Please fill all fields!"); return false; } else { - let book = new Book(title.value, title.value, pages.value, check.checked); - library.push(book); + let book = new Book(title.value, author.value, pages.value, check.checked); + myLibrary.push(book); render(); } } From 13abce6ad062c0c705c6cb5e3765918c4c6531c7 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Thu, 11 Dec 2025 15:29:42 +0000 Subject: [PATCH 05/16] fix: use strict equality in populateStorage function --- debugging/book-library/script.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 3e2368f5..2442689e 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -6,7 +6,7 @@ window.addEventListener("load", function (e) { }); function populateStorage() { - if (myLibrary.length == 0) { + if (myLibrary.length === 0) { let book1 = new Book("Robison Crusoe", "Daniel Defoe", "252", true); let book2 = new Book( "The Old Man and the Sea", From 606b90fb000f42cb36a89e25d976696a7f2147d5 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Thu, 11 Dec 2025 15:30:19 +0000 Subject: [PATCH 06/16] fix: correct input types and formatting in index.html --- debugging/book-library/index.html | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 23acfa71..d7a143f1 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -1,7 +1,7 @@ - + - + Book Library Library
Library /> Library type="submit" value="Submit" class="btn btn-primary" - onclick="submit();" + onclick="submit()" />
From d0ce382c3faaf2fb48819140212a28e8aa9c80c5 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Fri, 12 Dec 2025 00:20:24 +0000 Subject: [PATCH 07/16] fix: update HTML structure using w3 validator --- debugging/book-library/index.html | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index d7a143f1..29a5d9b2 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -1,12 +1,8 @@ - + - Book Library - + + @@ -15,6 +11,7 @@ href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" /> + Book Library From 24572571c42a892c9bd2dcf67c3101f8f60c45a1 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Fri, 12 Dec 2025 00:24:50 +0000 Subject: [PATCH 08/16] fix: load script as an ES module --- debugging/book-library/index.html | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/debugging/book-library/index.html b/debugging/book-library/index.html index 29a5d9b2..30e5ce1d 100644 --- a/debugging/book-library/index.html +++ b/debugging/book-library/index.html @@ -11,6 +11,7 @@ href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" /> + Book Library @@ -87,7 +88,5 @@

Library

- - From 7dc7f7a38790f665f5f88c821825a23f03a05669 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Fri, 12 Dec 2025 00:28:33 +0000 Subject: [PATCH 09/16] fix: remove unnecessary render call in populateStorage function --- 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 2442689e..818de13c 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -16,7 +16,6 @@ function populateStorage() { ); myLibrary.push(book1); myLibrary.push(book2); - render(); } } From e1270577521c628c7839abde5be061290bf23a2d Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Fri, 12 Dec 2025 15:42:38 +0000 Subject: [PATCH 10/16] fix: standardize variable names for book properties --- debugging/book-library/script.js | 43 +++++++++++++++++--------------- 1 file changed, 23 insertions(+), 20 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 818de13c..39550db1 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -19,29 +19,32 @@ function populateStorage() { } } -const title = document.getElementById("title"); -const author = document.getElementById("author"); -const pages = document.getElementById("pages"); -const check = document.getElementById("check"); +const titleInput = document.getElementById("title"); +const authorInput = document.getElementById("author"); +const pagesInput = document.getElementById("pages"); +const checkInput = 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() { - if (!title.value || !author.value || pages.value <= 0) { + if (!titleInput.value || !authorInput.value || pagesInput.value <= 0) { alert("Please fill all fields!"); return false; } else { - let book = new Book(title.value, author.value, pages.value, check.checked); + let book = new Book( + titleInput.value, + authorInput.value, + pagesInput.value, + checkInput.checkInputed + ); myLibrary.push(book); render(); } } -function Book(title, author, pages, check) { - this.title = title; - this.author = author; - this.pages = pages; - this.check = check; +function Book(titleInput, authorInput, pagesInput, checkInput) { + this.titleInput = titleInput; + this.authorInput = authorInput; + this.pagesInput = pagesInput; + this.checkInput = checkInput; } function render() { @@ -57,12 +60,12 @@ function render() { let row = table.insertRow(1); let titleCell = row.insertCell(0); let authorCell = row.insertCell(1); - let pagesCell = row.insertCell(2); + let pagesInputCell = 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.innerHTML = myLibrary[i].titleInput; + authorCell.innerHTML = myLibrary[i].authorInput; + pagesInputCell.innerHTML = myLibrary[i].pagesInput; //add and wait for action for read/unread button let changeBut = document.createElement("button"); @@ -70,7 +73,7 @@ function render() { changeBut.className = "btn btn-success"; wasReadCell.appendChild(changeBut); let readStatus = ""; - if (myLibrary[i].check === true) { + if (myLibrary[i].checkInput === true) { readStatus = "Yes"; } else { readStatus = "No"; @@ -78,7 +81,7 @@ function render() { changeBut.innerText = readStatus; changeBut.addEventListener("click", function () { - myLibrary[i].check = !myLibrary[i].check; + myLibrary[i].checkInput = !myLibrary[i].checkInput; render(); }); @@ -89,7 +92,7 @@ function render() { delButton.className = "btn btn-warning"; delButton.innerHTML = "Delete"; delButton.addEventListener("click", function () { - alert(`You've deleted title: ${myLibrary[i].title}`); + alert(`You've deleted titleInput: ${myLibrary[i].titleInput}`); myLibrary.splice(i, 1); render(); }); From 3a51927e7744ea17769434e6b975d71d4f86dddd Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Fri, 12 Dec 2025 15:44:24 +0000 Subject: [PATCH 11/16] fix: correct variable name for table element in render function --- debugging/book-library/script.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 39550db1..0e0d5925 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -48,16 +48,16 @@ function Book(titleInput, authorInput, pagesInput, checkInput) { } function render() { - let table = document.getElementById("display"); - let rowsNumber = table.rows.length; - //delete old table + let tableEl = document.getElementById("display"); + let rowsNumber = tableEl.rows.length; + //delete old tableEl for (let n = rowsNumber - 1; n > 0; n--) { - table.deleteRow(n); + tableEl.deleteRow(n); } //insert updated row and cells let length = myLibrary.length; for (let i = 0; i < length; i++) { - let row = table.insertRow(1); + let row = tableEl.insertRow(1); let titleCell = row.insertCell(0); let authorCell = row.insertCell(1); let pagesInputCell = row.insertCell(2); From 0d05722f49606263b13edb7e7e31cf3c82679f04 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Thu, 18 Dec 2025 21:45:23 +0000 Subject: [PATCH 12/16] fix: refactor Book constructor to use class syntax --- debugging/book-library/script.js | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 0e0d5925..27865818 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -40,11 +40,13 @@ function submit() { } } -function Book(titleInput, authorInput, pagesInput, checkInput) { - this.titleInput = titleInput; - this.authorInput = authorInput; - this.pagesInput = pagesInput; - this.checkInput = checkInput; +class Book { + constructor(title, author, pages, isRead) { + this.title = title; + this.author = author; + this.pages = pages; + this.isRead = isRead; + } } function render() { From 2a6ec9f01e1743a2143a1638afafdcba529cfc05 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Thu, 18 Dec 2025 21:46:30 +0000 Subject: [PATCH 13/16] fix: improve input validation and refactor book creation --- debugging/book-library/script.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 27865818..8be50b25 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -25,16 +25,16 @@ const pagesInput = document.getElementById("pages"); const checkInput = document.getElementById("check"); function submit() { - if (!titleInput.value || !authorInput.value || pagesInput.value <= 0) { - alert("Please fill all fields!"); + const title = titleInput.value.trim(); + const author = authorInput.value.trim(); + const pages = parseInt(pagesInput.value); + const isRead = checkInput.checked; + + if (!title || !author || isNaN(pages) || pages <= 0) { + alert("Please fill all fields correctly!"); return false; } else { - let book = new Book( - titleInput.value, - authorInput.value, - pagesInput.value, - checkInput.checkInputed - ); + let book = new Book(title, author, pages, isRead); myLibrary.push(book); render(); } From eecd7da6f6b4ff6ddc05fa81caa7f8ee445aad33 Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Thu, 18 Dec 2025 21:49:16 +0000 Subject: [PATCH 14/16] fix: correct data type for pages --- debugging/book-library/script.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 8be50b25..552cb1fd 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -7,11 +7,11 @@ 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); From 2e28e34205bb60d48abc154c474386e6d714190c Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Thu, 18 Dec 2025 21:49:53 +0000 Subject: [PATCH 15/16] fix: expose submit function to global scope --- debugging/book-library/script.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 552cb1fd..98646619 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -100,3 +100,5 @@ function render() { }); } } + +window.submit = submit; From 77aca3919349ceb2aae37b31078477b13efb4f7c Mon Sep 17 00:00:00 2001 From: Jak R-S <176810031+jakr-s@users.noreply.github.com> Date: Thu, 18 Dec 2025 21:52:11 +0000 Subject: [PATCH 16/16] fix: refactor render function --- debugging/book-library/script.js | 65 ++++++++++++++------------------ 1 file changed, 28 insertions(+), 37 deletions(-) diff --git a/debugging/book-library/script.js b/debugging/book-library/script.js index 98646619..36e00661 100644 --- a/debugging/book-library/script.js +++ b/debugging/book-library/script.js @@ -50,53 +50,44 @@ class Book { } function render() { - let tableEl = document.getElementById("display"); - let rowsNumber = tableEl.rows.length; - //delete old tableEl - for (let n = rowsNumber - 1; n > 0; n--) { - tableEl.deleteRow(n); - } - //insert updated row and cells - let length = myLibrary.length; - for (let i = 0; i < length; i++) { - let row = tableEl.insertRow(1); + let tableBody = document.querySelector("#display tbody"); + tableBody.innerHTML = ""; + + for (let i = 0; i < myLibrary.length; i++) { + let row = tableBody.insertRow(); let titleCell = row.insertCell(0); let authorCell = row.insertCell(1); - let pagesInputCell = row.insertCell(2); - let wasReadCell = row.insertCell(3); + let pagesCell = row.insertCell(2); + let readCell = row.insertCell(3); let deleteCell = row.insertCell(4); - titleCell.innerHTML = myLibrary[i].titleInput; - authorCell.innerHTML = myLibrary[i].authorInput; - pagesInputCell.innerHTML = myLibrary[i].pagesInput; - //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 readStatus = ""; - if (myLibrary[i].checkInput === true) { - readStatus = "Yes"; - } else { - readStatus = "No"; - } - changeBut.innerText = readStatus; + titleCell.textContent = myLibrary[i].title; + authorCell.textContent = myLibrary[i].author; + pagesCell.textContent = myLibrary[i].pages; + + // Read status button + let readBtn = document.createElement("button"); + readBtn.className = "btn btn-success"; + readCell.appendChild(readBtn); - changeBut.addEventListener("click", function () { - myLibrary[i].checkInput = !myLibrary[i].checkInput; + readBtn.textContent = myLibrary[i].isRead ? "Yes" : "No"; + + readBtn.addEventListener("click", function () { + myLibrary[i].isRead = !myLibrary[i].isRead; render(); }); - //add delete button to every row and render again - let delButton = document.createElement("button"); - delButton.id = i + 5; - deleteCell.appendChild(delButton); - delButton.className = "btn btn-warning"; - delButton.innerHTML = "Delete"; - delButton.addEventListener("click", function () { - alert(`You've deleted titleInput: ${myLibrary[i].titleInput}`); + // Delete button + let deleteBtn = document.createElement("button"); + deleteCell.appendChild(deleteBtn); + deleteBtn.className = "btn btn-warning"; + deleteBtn.textContent = "Delete"; + + deleteBtn.addEventListener("click", function () { + const deletedTitle = myLibrary[i].title; myLibrary.splice(i, 1); render(); + alert(`You've deleted: ${deletedTitle}`); }); } }