browser: disable search features dependent on classList
[sheet.git] / searchlocal.js
1 var filterupdate;
2 var filtertoggles = document.body.classList !== undefined;
3
4 function filtercell(el, set, action) {
5         if (set === undefined) return;
6         switch (action) {
7                 case 'focus':
8                         el.classList[set ? 'add' : 'remove'](action);
9                         break;
10                 case 'target':
11                         if (set) el.classList.toggle(action);
12                         break;
13                 case 'remove':
14                         if (set) el.style.display = 'none';
15                         break;
16                 case 'add':
17                         if (set) el.style.display = '';
18                         break;
19                 case 'toggle':
20                         if (set) el.style.display = el.style.display == 'none' ? '' : 'none';
21                         break;
22                 case 'filter':
23                         el.style.display = set ? '' : 'none';
24                         if (filtertoggles) el.classList.remove('focus');
25                         break;
26                 default: // reset
27                         el.classList.remove('focus');
28                         el.classList.remove('target');
29         }
30 }
31
32 function filtercols(table, match, action) {
33         var matchloc = [];
34         for (var y = 0; y < table.rows.length; y++) {
35                 var loc = 0;
36                 for (var x = 0; x < table.rows[y].cells.length; x++) {
37                         var cell = table.rows[y].cells[x];
38                         if (y == 0) {
39                                 var res = match(cell);
40                                 for (var i = loc; i < loc + cell.colSpan; i++) matchloc[i] = res;
41                                 filtercell(table.children.item(x), res, action); // colgroup
42                         }
43                         filtercell(cell, matchloc[loc], action);
44                         loc += cell.colSpan;
45                 }
46         }
47 }
48
49 function filterrows(table, match, action) {
50         var rows = table.tBodies[0].rows;
51         for (var i = 0; i < rows.length; i++) {
52                 filtercell(rows[i], match && match(rows[i]), action);
53         }
54 }
55
56 function filtertable(query, action) {
57         filterupdate = undefined;
58         if (query === undefined) query = document.getElementById('search').q.value;
59         var table = document.getElementsByTagName('TABLE')[0];
60
61         if (!action) {
62                 var match = /^([-+?=]?)(.*)/.exec(query);
63                 switch (match[1]) {
64                         case '+': action = 'add';    break;
65                         case '-': action = 'remove'; break;
66                         case '?': action = 'toggle'; break;
67                         case '=': action = 'filter'; break;
68                 }
69                 query = match[2];
70         }
71
72         if (query == '' && action == 'add') {
73                 // restore all columns if explicitly adding all ("+")
74                 filtercols(table, function(){return true}, 'add');
75                 // continue to restore rows
76         }
77         if (/^[a-z_]+$/.test(query) && document.querySelector('.b-a-'+query)) {
78                 // column if class b-a-* exists
79                 var match = function(th) {
80                         if (!/\bb-a-/.test(th.className)) return;
81                         return new RegExp('-'+query+'\\b').test(th.className);
82                 }
83                 return filtercols(table, match, action || 'toggle');
84         }
85
86         if (/^[A-Z0-9 ]{2,}$/.test(query)) {
87                 // category title if all uppercase
88                 var match = function(row) {
89                         return row.cells[0].title.match(query, 'i');
90                 };
91         }
92         else if (numquery = /^([<>])(\d+)$/.exec(query)) {
93                 // support percentage if numeric comparison
94                 var match = function(row) {
95                         var pct = row.cells[row.cells.length - 1].textContent;
96                         pct -= numquery[2]; // compare to query
97                         return numquery[1] == '<' ? pct < 0 : pct >= 0;
98                 };
99         }
100         else if (action == 'focus' && query.length <= 1) {
101                 // prevent superfluous highlighting
102                 var match = false;
103         }
104         else {
105                 // title text (case-insensitive unless caps in input)
106                 var match = function(row) {
107                         return row.cells[1].textContent.match(query, /[A-Z]/.test(query) ? '' : 'i');
108                 };
109         }
110         filterrows(table, match, action || 'filter');
111 }
112
113 function newelement(tagname, attrlist, childlist) {
114         if (!attrlist) return document.createTextNode(tagname);
115         var el = document.createElement(tagname);
116         for (var name in attrlist)
117                 el.setAttribute(name, attrlist[name]);
118         if (childlist) for (var i = 0; i < childlist.length; i++)
119                 if (childlist[i]) el.appendChild(childlist[i]);
120         return el;
121 }
122
123 function prependsearch(target) {
124         target.parentNode.insertBefore(newelement(
125                 'form', {
126                         id: 'search',
127                         'class': 'aside',
128                         onsubmit: "filtertable(this.q.value); this.q.value = ''; return false",
129                 },
130                 [
131                         newelement('input', {
132                                 type: 'search',
133                                 name: 'q',
134                                 onkeyup: "if (filtertoggles && !filterupdate) filterupdate = "
135                                         + "window.setTimeout(filtertable, 300, undefined, 'focus')",
136                         }),
137                         filtertoggles && newelement('input', {
138                                 type: 'button',
139                                 value: 'toggle',
140                                 onclick: "filtertable(this.form.q.value, 'target')",
141                         }),
142                         newelement('input', {type:'submit', value:'filter'}),
143                 ]
144         ), target);
145 }
146