-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
104 lines (86 loc) · 3.03 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
console.log("Hello world! This is notes taking app, and javscript file is loaded properly.");
displayAllNotes();
//add event listener to add Notes class
function addNoteListener(e){
//get previous notes from local storage
let notes = localStorage.getItem('notes');
//parse to get array
let notesObj;
if(notes == null) notesObj = [];
else notesObj = JSON.parse(notes);
let currNote = {
'title' : document.getElementById('titleInput').value,
'content' : document.getElementById('notesTextarea').value
}
//reset the input fields
document.getElementById('titleInput').value = "";
document.getElementById('notesTextarea').value = "";
//push curr note to array
notesObj.push(currNote);
//update in localstorage
localStorage.setItem('notes',JSON.stringify(notesObj));
//display the current note
displayNote(currNote,notesObj.length-1);
}
//display all notes on the card
function displayAllNotes(){
document.getElementById('notesPanel').innerHTML = '';
let notes = localStorage.getItem('notes');
let notesObj;
if(notes == null) notesObj = [];
else notesObj = JSON.parse(notes);
let i = 0;
notesObj.forEach(element => {
displayNote(element,i++);
});
}
//display notes with search query
function displaySearchNotes(query){
if(query.length==0){
displayAllNotes();
return;
}
document.getElementById('notesPanel').innerHTML = '';
let notes = localStorage.getItem('notes');
let notesObj;
if(notes == null) notesObj = [];
else notesObj = JSON.parse(notes);
let i = 0;
let noresult = true;
notesObj.forEach(element => {
if(element.title.includes(query) || element.content.includes(query)){
displayNote(element,i++);
noresult = false;
}
});
if(noresult) alert("No reults were found for the given search query.");
}
//function to display one node
function displayNote(note,index){
let noteCard = document.createElement('div');
let nid = 'removeNoteBtn'+index;
noteCard.className = 'col-sm-6';
noteCard.innerHTML = `<div class="card m-1">
<div class="card-body">
<h5 class="card-title">${note.title}</h5>
<p class="card-text">${note.content}</p>
<button class="btn btn-danger" id="${nid}" onClick="removeNote(${index})">Remove</button>
</div>
</div>`;
document.getElementById('notesPanel').appendChild(noteCard);
}
//function to remove a note
function removeNote(index){
let notes = localStorage.getItem('notes');
let notesObj;
if(notes == null) notesObj = [];
else notesObj = JSON.parse(notes);
notesObj.splice(index,1);
localStorage.setItem('notes',JSON.stringify(notesObj));
displayAllNotes();
}
//search listener
function searchListener(){
let query = document.getElementById('searchBox').value;
displaySearchNotes(query);
}