-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
98 lines (88 loc) · 3.17 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
let selectedTags = [];
renderAllTags();
filterElements();
function filterElements() {
const input = document.getElementById("searchInput").value.toLowerCase();
const results = document.getElementById("results");
// Clear existing results
results.innerHTML = '';
elements.forEach(element => {
const isFuzzySearchEnabled = document.getElementById("fuzzySearch").checked;
const matchFunction = isFuzzySearchEnabled ? fuzzyMatch : (a, b) => b.includes(a);
console.log(input);
console.log(element.name.toLowerCase());
console.log(matchFunction(input, element.name.toLowerCase()));
if ((matchFunction(input, element.name.toLowerCase()) ||
matchFunction(input, element.description.toLowerCase()) ||
element.tags.some(tag => matchFunction(input, tag.toLowerCase()))) &&
(selectedTags.length === 0 || selectedTags.every(tag => element.tags.includes(tag)))) {
const li = document.createElement("li");
li.innerHTML = `
<strong>${element.name}</strong><br>
${element.description}<br>
<a href="${element.url}" target="_blank">${element.url}</a><br>
Tags: ${element.tags.map(tag => `<span class="tag" data-tag="${tag}">${tag}</span>`).join(", ")}
`;
results.appendChild(li);
}
});
// Add event listeners to tags for filtering
document.querySelectorAll(".tag").forEach(tagEl => {
tagEl.addEventListener("click", function() {
const tag = this.getAttribute("data-tag");
if (!selectedTags.includes(tag)) {
selectedTags.push(tag);
renderSelectedTags();
filterElements();
}
});
});
}
function renderSelectedTags() {
const container = document.getElementById("selectedTags");
container.innerHTML = '';
selectedTags.forEach(tag => {
const tagEl = document.createElement("div");
tagEl.className = "selected-tag";
tagEl.innerHTML = `
<span>${tag}</span><span class="remove-tag" data-tag="${tag}">×</span>
`;
container.appendChild(tagEl);
});
// Add event listeners to the remove buttons
document.querySelectorAll(".remove-tag").forEach(removeEl => {
removeEl.addEventListener("click", function() {
const tag = this.getAttribute("data-tag");
selectedTags = selectedTags.filter(t => t !== tag);
renderSelectedTags();
filterElements();
});
});
}
function renderAllTags() {
const allTags = getAllUniqueTags();
const tagsContainer = document.getElementById('allTags');
tagsContainer.innerHTML = '';
allTags.forEach(tag => {
const tagEl = document.createElement("span");
tagEl.className = 'tag';
tagEl.setAttribute('data-tag', tag);
tagEl.textContent = tag;
tagsContainer.appendChild(tagEl);
});
// Add event listeners to these tags for filtering
document.querySelectorAll("#allTags .tag").forEach(tagEl => {
tagEl.addEventListener("click", function() {
const tag = this.getAttribute("data-tag");
if (!selectedTags.includes(tag)) {
selectedTags.push(tag);
renderSelectedTags();
filterElements();
}
});
});
}
function fuzzyMatch(pattern, str) {
pattern = '.*' + pattern.split('').join('.*') + '.*';
return new RegExp(pattern).test(str);
}