-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathappes6.js
More file actions
98 lines (90 loc) · 2.74 KB
/
appes6.js
File metadata and controls
98 lines (90 loc) · 2.74 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
class Book {
constructor(title, author, isbn) {
this.title = title;
this.author = author;
this.isbn = isbn;
}
}
class UI {
addBookToList(book) {
const row = document.createElement("tr");
row.innerHTML = `<td>${book.title}</td><td>${book.author}</td><td>${book.isbn}</td><td><a href="#" class="delete">X</a></td>`;
document.querySelector("#book-list").appendChild(row);
}
showAlert(msg, className) {
const div = document.createElement("div");
div.appendChild(document.createTextNode(msg));
div.className = className;
const form = document.querySelector("#book-form"),
container = document.querySelector(".container");
container.insertBefore(div, form);
setTimeout(function () {
document.querySelector(`.${className}`).remove();
}, 3000);
}
clearField() {
document.querySelector("#title").value = "";
document.querySelector("#author").value = "";
document.querySelector("#isbn").value = "";
}
clearBook(target) {
if (target.className === "delete") {
target.parentElement.parentElement.remove();
this.showAlert("Book Deleted!", "success");
}
}
}
class Store {
static getBooks() {
let books;
if (localStorage.getItem("books") === null) {
books = [];
} else {
books = JSON.parse(localStorage.getItem("books"));
}
return books;
}
static displayBooks() {
const books = Store.getBooks();
books.forEach(function (book) {
const ui = new UI();
ui.addBookToList(book);
});
}
static addBook(book) {
const books = Store.getBooks();
books.push(book);
localStorage.setItem("books", JSON.stringify(books));
}
static deleteBook(isbn) {
let books = Store.getBooks();
books.forEach(function (book, index) {
if (book.isbn === isbn) {
books.splice(index, 1);
localStorage.setItem("books", JSON.stringify(books));
}
});
}
}
document.addEventListener("DOMContentLoaded", Store.displayBooks);
document.querySelector("#book-form").addEventListener("submit", function (e) {
e.preventDefault();
const title = document.querySelector("#title").value,
author = document.querySelector("#author").value,
isbn = document.querySelector("#isbn").value;
const book = new Book(title, author, isbn);
const ui = new UI();
if (title === "" || author === "" || isbn === "") {
ui.showAlert("Please fill in all fields", "error");
} else {
ui.addBookToList(book);
Store.addBook(book);
ui.showAlert("Book Added!", "success");
ui.clearField();
}
});
document.querySelector("#book-list").addEventListener("click", function (e) {
const ui = new UI();
ui.clearBook(e.target);
Store.deleteBook(e.target.parentElement.previousElementSibling.textContent);
});