-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathscript.js
129 lines (113 loc) · 3.43 KB
/
script.js
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
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
console.log('hello');
Show();
//Constructor book
function Book(name, authour, type) {
this.name = name;
this.authour = authour;
this.type = type;
}
//show function
function Show() {
let books = localStorage.getItem('books');
if (books == null) {
booksObj = [];
} else {
booksObj = JSON.parse(books);
}
let elementData = "";
booksObj.forEach((element, index) => {
// console.log(element)
elementData += `<tr>
<td>${index}</td>
<td>${element.name}</td>
<td>${element.authour}</td>
<td>${element.type}</td>
<td><button onclick="deleteBook(${index})" class="btn btn-danger">Delete</button></td>
</tr>`
});
let tableBody = document.getElementById('tablebody')
if (tableBody != 0) {
tableBody.innerHTML = elementData;
} else {
tableBody.innerHTML = `Type your Notes`
}
}
//Adding action to delete button
let deleteBook = (index) => {
let books = localStorage.getItem('books');
if (books == null) {
booksObj = [];
} else {
booksObj = JSON.parse(books);
}
console.log(booksObj)
booksObj.splice(index, 1);
localStorage.setItem("books", JSON.stringify(booksObj));
Show();
}
//Constructor display
function Display() {
}
//Prototypes
//Implementing clear function
Display.prototype.clear = function () {
let libraryform = document.getElementById('libraryform');
libraryform.reset();
}
//Implementing validate function
Display.prototype.validate = function (book) {
if (book.name.length < 2 || book.authour.length < 2) {
return false;
} else {
return true;
}
}
//Implementing error function
Display.prototype.error = (type, msg) => {
let message = document.getElementById('message');
message.innerHTML += `<div class="alert alert-${type}" role="alert">
This is a ${msg} alert with <a href="#" class="alert-link">an example link</a>. Give it a click if you like.
</div>`;
setTimeout(() => {
message.innerHTML = '';
}, 2000);
}
let libraryform = document.getElementById('libraryform');
let libraryformSubmit = (e) => {
let name = document.getElementById('name').value;
let authour = document.getElementById('authour').value;
let type;
let scifi = document.getElementById('scifi');
let fantasy = document.getElementById('fantasy');
let thriller = document.getElementById('thirller');
let books = localStorage.getItem('books');
//To check which checkbox is clicked
if (scifi.checked) {
type = scifi.value;
} else if (fantasy.checked) {
type = fantasy.value;
} else if (thriller.checked) {
type = thriller.value;
}
//Creating an array of bookObj
if (books == null) {
booksObj = [];
} else {
booksObj = JSON.parse(books);
}
//Creating an object of constructor book
let book = new Book(name, authour, type);
let display = new Display();
//Checking the validation
if (display.validate(book)) {
booksObj.push(book);
localStorage.setItem("books", JSON.stringify(booksObj));
Show();
display.clear();
display.error('success', 'Sucessfully');
} else {
display.error('danger', 'Error');
}
e.preventDefault();
}
libraryform.addEventListener('submit', libraryformSubmit);