feat: logic completed.

This commit is contained in:
Smigz 2023-11-21 20:18:18 -05:00
parent 104849154f
commit 72997086cc
3 changed files with 84 additions and 24 deletions

View file

@ -23,8 +23,12 @@ function Book(title, author, read) {
};
}
Book.prototype.toggleBookReadStatus = function(){
this.read = !this.read;
}
function addBookToLibrary(book) {
let newBook = new Book(book.title, book.author, book.pages, book.read);
let newBook = new Book(book.title, book.author, book.read);
myLibrary.push(newBook);
}
@ -35,25 +39,57 @@ function displayBooks(books) {
books.forEach((element, i) => {
const card = document.createElement('div');
card.classList.add('card');
card.classList.add(`data-card${i}`)
card.setAttribute("data-card", i);
const title = document.createElement('p');
title.classList.add('card-title');
const author = document.createElement('p');
author.classList.add('card-author');
const readBtn = document.createElement('button');
readBtn.classList.add('btn','read-btn');
readBtn.textContent = element.read ? "read" : "not read";
const deleteBtn = document.createElement('button');
deleteBtn.classList.add('btn', 'delete-btn')
deleteBtn.textContent = 'delete book';
title.textContent = element.title;
title.textContent = `"${element.title}"`;
author.textContent = element.author;
card.appendChild(title);
card.appendChild(author)
card.appendChild(author);
card.appendChild(readBtn);
card.appendChild(deleteBtn);
booksDiv.appendChild(card);
});
}
booksDiv.addEventListener('click', event => {
let target = event.target.className;
if (target.includes('read-btn')){
let cardIndex = event.target.parentElement.dataset.card;
myLibrary[cardIndex].toggleBookReadStatus();
displayBooks(myLibrary);
};
});
booksDiv.addEventListener('click', event => {
let target = event.target.className;
if (target.includes('delete-btn')){
let cardIndex = event.target.parentElement.dataset.card;
myLibrary.splice(cardIndex, 1);
displayBooks(myLibrary);
};
});
submitButton.addEventListener('click', event => {
const author = document.querySelector('#author').value;
const title = document.querySelector('#title').value;
const newBook = new Book(title, author, false);
const readBtn = document.querySelector('#read-button').value;
const bookIsRead = readBtn === 'on' ? true : false;
// create book object
const newBook = new Book(title, author, bookIsRead);
addBookToLibrary(newBook);
displayBooks(myLibrary);
@ -68,13 +104,6 @@ closeDialogButton.addEventListener('click', () => {
dialog.close();
});
// document.addEventListener('click', e => {
// if (!e.target.closest("dialog")) {
// dialog.showModal();
// }
// });
// default data
myLibrary.push(defaultData)