implemented recommendations and made appropriate changes

Author: mshayriyesaricicek

debugging/book-library/script.js

@@ -1,4 +1,4 @@
-let myLibrary = JSON.parse(localStorage.getItem("myLibrary")) || [];
+const myLibrary = [];
 
 function isValidAuthor(text) {
   for (let char of text) {
@@ -29,7 +29,6 @@ function isValidTitle(text) {
   }
   return true;
 }
-// 2. then your other functions (populateStorage, render, etc)
 
 function saveLibrary() {
   localStorage.setItem("myLibrary", JSON.stringify(myLibrary));
@@ -53,22 +52,29 @@ document.getElementById("bookForm").addEventListener("submit", function (e) {
     return;
   }
 
-  populateStorage(title, author, pages, read);
+  const success = populateStorage(title, author, pages, read);
+
+  if (!success) return; // ❗ STOP if invalid
 
   render();
+  saveLibrary();
 
   this.reset();
-
   $("#demo").collapse("hide");
 });
 
 //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 populateStorage(title, author, pages, check) {
+  if (!/^\d+$/.test(pages) || Number(pages) < 1 || Number(pages) > 5000) {
+    alert("Pages must be a whole number between 1 and 5000");
+    return false;
+  }
+
   let newBook = new Book(title, author, pages, check);
   myLibrary.push(newBook);
-  saveLibrary();
+  return true;
 }
 
 function Book(title, author, pages, check) {
@@ -79,21 +85,21 @@ function Book(title, author, pages, check) {
 }
 
 function render() {
-  const table = document.querySelector("#display tbody");
-  table.innerHTML = "";
+  const tableBody = document.querySelector("#display tbody");
+  tableBody.innerHTML = "";
 
   //insert updated row and cells
   let length = myLibrary.length;
   for (let i = 0; i < length; i++) {
-    let row = table.insertRow();
+    let row = tableBody.insertRow();
     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;
-    authorCell.innerHTML = myLibrary[i].author;
-    pagesCell.innerHTML = myLibrary[i].pages;
+    titleCell.innerText = myLibrary[i].title;
+    authorCell.innerText = myLibrary[i].author;
+    pagesCell.innerText = myLibrary[i].pages;
 
     //add and wait for action for read/unread button
     let changeBut = document.createElement("button");
@@ -121,6 +127,7 @@ function render() {
     deleteCell.appendChild(delBut);
 
     delBut.addEventListener("click", function () {
+      alert(`You've deleted title: ${myLibrary[i].title}`);
       myLibrary.splice(i, 1);
 
       saveLibrary();
@@ -131,17 +138,21 @@ function render() {
 }
 
 function loadDefaultBooks() {
-  if (myLibrary.length === 0) {
-    populateStorage("Robinson Crusoe", "Daniel Defoe", "252", true);
-    populateStorage(
-      "The Old Man and the Sea",
-      "Ernest Hemingway",
-      "127",
-      false
-    );
-  }
+  myLibrary.push(
+    new Book("Robinson Crusoe", "Daniel Defoe", "252", true),
+    new Book("The Old Man and the Sea", "Ernest Hemingway", "127", false)
+  );
 }
-window.addEventListener("load", function () {
-  loadDefaultBooks();
+
+window.onload = () => {
+  myLibrary.length = 0;
+
+  const saved = localStorage.getItem("myLibrary");
+
+  if (saved && saved !== "[]") {
+    myLibrary.push(...JSON.parse(saved));
+  } else {
+    loadDefaultBooks();
+  }
   render();
-});
+};