-
-
Notifications
You must be signed in to change notification settings - Fork 239
London | 26-ITP-Jan | Abdul Moiz | Sprint 2 | Book Library #385
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,3 +1,42 @@ | ||
| // Book class | ||
| class Book { | ||
| constructor(title, author, pages, check) { | ||
| const validated = constructorValidation(title, author, pages, check); | ||
|
|
||
| this.title = validated.title; | ||
| this.author = validated.author; | ||
| this.pages = validated.pages; | ||
| this.check = validated.check; | ||
| } | ||
| } | ||
|
|
||
| // Checking if constructor arguments are valid | ||
| function constructorValidation(title, author, pages, check) { | ||
| if (typeof title !== "string" || title.trim() === "") { | ||
| throw new Error("Title must be a non-empty string"); | ||
| } | ||
|
|
||
| if (typeof author !== "string" || author.trim() === "") { | ||
| throw new Error("Author must be a non-empty string"); | ||
| } | ||
|
|
||
| const pagesNum = Number(pages); | ||
| if (isNaN(pagesNum) || pagesNum <= 0) { | ||
| throw new Error("Pages must be a positive number"); | ||
| } | ||
|
|
||
| if (typeof check !== "boolean") { | ||
| throw new Error("Check must be a boolean"); | ||
| } | ||
|
|
||
| return { | ||
| title: title.trim(), | ||
| author: author.trim(), | ||
| pages: pagesNum, | ||
| check, | ||
| }; | ||
| } | ||
|
|
||
| let myLibrary = []; | ||
|
|
||
| window.addEventListener("load", function (e) { | ||
|
|
@@ -6,17 +45,16 @@ window.addEventListener("load", function (e) { | |
| }); | ||
|
|
||
| function populateStorage() { | ||
| if (myLibrary.length == 0) { | ||
| let book1 = new Book("Robison Crusoe", "Daniel Defoe", "252", true); | ||
| let book2 = new Book( | ||
| if (myLibrary.length === 0) { | ||
| const book1 = new Book("Robison Crusoe", "Daniel Defoe", "252", true); | ||
| const book2 = new Book( | ||
| "The Old Man and the Sea", | ||
| "Ernest Hemingway", | ||
| "127", | ||
| true | ||
| ); | ||
| myLibrary.push(book1); | ||
| myLibrary.push(book2); | ||
| render(); | ||
| } | ||
| } | ||
|
|
||
|
|
@@ -29,32 +67,28 @@ const check = document.getElementById("check"); | |
| //via Book function and start render function | ||
| function submit() { | ||
| if ( | ||
| title.value == null || | ||
| title.value == "" || | ||
| pages.value == null || | ||
| pages.value == "" | ||
| title.value.trim() === "" || | ||
| author.value.trim() === "" || | ||
| pages.value.trim() === "" | ||
| ) { | ||
| 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(); | ||
| title.value = ""; | ||
| author.value = ""; | ||
| pages.value = ""; | ||
| check.checked = false; | ||
| } | ||
| } | ||
|
|
||
| function Book(title, author, pages, check) { | ||
| this.title = title; | ||
| this.author = author; | ||
| this.pages = pages; | ||
| this.check = check; | ||
| } | ||
|
|
||
| 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,11 +110,7 @@ function render() { | |
| changeBut.className = "btn btn-success"; | ||
| wasReadCell.appendChild(changeBut); | ||
| let readStatus = ""; | ||
| if (myLibrary[i].check == false) { | ||
| readStatus = "Yes"; | ||
| } else { | ||
| readStatus = "No"; | ||
| } | ||
| readStatus = myLibrary[i].check ? "Yes" : "No"; | ||
| changeBut.innerText = readStatus; | ||
|
|
||
| changeBut.addEventListener("click", function () { | ||
|
|
@@ -90,13 +120,17 @@ 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 () { | ||
| alert(`You've deleted title: ${myLibrary[i].title}`); | ||
| myLibrary.splice(i, 1); | ||
| //delButton.id = i + 5; | ||
| delButton.id = `delButton_${i}`; | ||
| deleteCell.appendChild(delButton); | ||
| delButton.className = "btn btn-warning"; | ||
| delButton.textContent = "Delete"; | ||
| delButton.dataset.index = i; | ||
| delButton.addEventListener("click", function (e) { | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. a better way to do this would be using There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This is much more appropriate as this isn't dealing with stale data inside a closure |
||
| const index = e.target.dataset.index; | ||
|
|
||
| alert(`You've deleted title: ${myLibrary[index].title}`); | ||
| myLibrary.splice(index, 1); | ||
| render(); | ||
| }); | ||
| } | ||
|
|
||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Have you come across Ternary Operator? Could make the code cleaner:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_operator
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@A-Moiz there's an easier way to do this: