-
Notifications
You must be signed in to change notification settings - Fork 0
/
app.js
108 lines (88 loc) · 3.58 KB
/
app.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
const probleminput = document.querySelector('.problem-input');
const problembtn = document.querySelector('.problem-button');
const problemlist = document.querySelector('.problem-list');
const filteroption = document.querySelector('.filter-problems');
problembtn.addEventListener('click', addproblem);
problemlist.addEventListener('click', deletecheck);
filteroption.addEventListener('click', filterit);
function addproblem(event) {
event.preventDefault();
if (probleminput.value === "") probleminput.value = "Abhinav";
//Div
const problemdiv = document.createElement('div');
problemdiv.classList.add('problem');
const logoimg = document.createElement('img');
logoimg.classList.add('logoimg');
//li
const newproblem = document.createElement('li');
let textval = probleminput.value;
if (textval.indexOf("codeforces") != -1) {
logoimg.src = "./codeforces.png";
problemdiv.classList.add('codeforces');
probleminput.value="Codeforces";
}
else if (textval.indexOf("leetcode") != -1) {
logoimg.src = "./leetcode.png";
problemdiv.classList.add('leetcode');
probleminput.value="Leetcode";
}
else if (textval.indexOf("codechef") != -1) {
logoimg.src = "./codechef.png";
problemdiv.classList.add('codechef');
probleminput.value="Codechef";
}
else {
logoimg.src = "./others.png";
problemdiv.classList.add('others');
probleminput.value="Problem";
}
newproblem.innerText = probleminput.value;
newproblem.classList.add('problem');
problemdiv.append(logoimg);
problemdiv.append(newproblem);
//Button Tick
const checkicon = document.createElement('button');
checkicon.innerHTML = '<a href="' + probleminput.value + '" target="_blank"><i class="fa fa-link"></i></a>';
checkicon.classList.add('btncheck');
checkicon.classList.add('btnadd');
const trashicon = document.createElement('button');
trashicon.innerHTML = '<i class=" fa fa-solid fa-trash"></i>';
trashicon.classList.add('btntrash');
trashicon.classList.add('btnadd');
problemdiv.appendChild(checkicon);
problemdiv.appendChild(trashicon);
//Append Final
problemlist.append(problemdiv);
probleminput.value = "";
}
function deletecheck(event) {
const tar = event.target;
if (tar.classList[0] === 'btntrash') {
const item = tar.parentElement;
item.remove();
}
else if (tar.classList[0] === 'btncheck') {
// const item=tar.parentElement;
// if(item.classList.contains('checkk')){
// item.classList.remove('checkk');
// }else
// item.classList.add('checkk');
return;
}
}
function filterit(event) {
const problems = problemlist.childNodes;
problems.forEach(function (problem1) {
switch (event.target.value) {
case "all": problem1.style.display = 'flex'; break;
case "codeforces":
if (problem1.classList.contains('codeforces')) problem1.style.display = 'flex'; else problem1.style.display = "none"; break;
case "codechef":
if (problem1.classList.contains('codechef')) problem1.style.display = 'flex'; else problem1.style.display = "none"; break;
case "leetcode":
if (problem1.classList.contains('leetcode')) problem1.style.display = 'flex'; else problem1.style.display = "none"; break;
case "others":
if (problem1.classList.contains('others')) problem1.style.display = 'flex'; else problem1.style.display = "none"; break;
}
})
}