-
Notifications
You must be signed in to change notification settings - Fork 0
/
search.js
54 lines (47 loc) · 1.42 KB
/
search.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
const searchInput = document.getElementById("search-input");
const items = Array.from(document.getElementById("list-items").children, function(li){
return {
text: li.textContent,
style: li.style,
pre: li.firstChild,
match: li.appendChild(document.createElement('span'))
.appendChild(document.createTextNode("")),
post: li.appendChild(document.createTextNode(""))
}
});
function show (style) {
style.height = '19px';
style.opacity = 1;
style.overflow = 'visible';
}
function hide (style) {
style.height = 0;
style.opacity = 0;
style.overflow = 'hidden';
}
function searchAction () {
const term = searchInput.value;
var regx = new RegExp(term, 'i');
for (var {text, style, pre, match, post} of items) {
var matched = text.match(regx);
if (matched) {
pre.nodeValue = text.slice(0, matched.index);
match.nodeValue = matched[0];
post.nodeValue = text.slice(matched.index + matched[0].length);
show(style);
} else {
hide(style);
}
}
}
var timeoutThings = {
id : null,
restart : function(thingsToDo) {
cancelAnimationFrame(this.id);
this.id = requestAnimationFrame(thingsToDo);
}
}
var searchActivateEvent = function () {
timeoutThings.restart(searchAction);
}
searchInput.addEventListener('keyup', searchActivateEvent, false);