diff --git a/www/index.css b/www/index.css index 9e39ebcb..3ebcc590 100644 --- a/www/index.css +++ b/www/index.css @@ -233,3 +233,7 @@ table td.esoteric::after { content: '\2002\1f984\fe0f'; } text-shadow: 0px 0px 3px var(--main-fg); } } + +.filtered-out { + display: none; +} diff --git a/www/index.html b/www/index.html index 30096764..cb8a51d7 100644 --- a/www/index.html +++ b/www/index.html @@ -34,6 +34,7 @@

[website source]

+ diff --git a/www/index.js b/www/index.js index 0cb20ea9..3cf9dd98 100644 --- a/www/index.js +++ b/www/index.js @@ -10,6 +10,7 @@ const systrackVersEl = document.getElementById('systrack-version') const configLinkEl = document.getElementById('config-link') const stderrLinkEl = document.getElementById('stderr-link') const jsonLinkEl = document.getElementById('json-link') +const filterNameEl = document.getElementById("filter-name") let db = null let currentSyscallTable = null @@ -148,6 +149,7 @@ function afterUpdate() { archSelectEl.disabled = false tagSelectEl.disabled = false updateInProgress = false + filterTable(filterNameEl.value) } function clearOptions(selectEl) { @@ -303,6 +305,31 @@ function sortTable(e) { header.classList.add(desc ? 'descending' : 'ascending') } +function filterTable(text) { + if (updateInProgress) + return + + const rows = Array.from(tableEl.querySelectorAll('tr')).slice(2) + let filteredIn = 0 + + for (const el of rows) { + const value = el.children[2].textContent + + if (value.includes(text)) { + el.classList.remove('filtered-out') + filteredIn += 1 + } else { + el.classList.add('filtered-out') + } + } + + sumamryEl.textContent = `${filteredIn} syscalls` +} + +function handleFilterTableEvent(e) { + filterTable(e.target.value) +} + function toggleCollapseColumn(e) { if (updateInProgress) return @@ -516,6 +543,7 @@ function toggleCompactSignature() { localStorage.setItem('compactSignature', compactSignature) // Could be optimized... but I could also not care less for now fillTable(currentSyscallTable, realTag(arch, bits, abi, tag)) + filterTable(filterNameEl.value) } async function update(pushHistoryState) { @@ -677,6 +705,7 @@ async function setup() { compactSigToggleEl.addEventListener('click', toggleCompactSignature) tableEl.querySelectorAll('th.sortable').forEach(el => el.addEventListener('click', sortTable)) tableEl.querySelectorAll('th > .collapse-toggle').forEach(el => el.addEventListener('click', toggleCollapseColumn)) + filterNameEl.addEventListener('input', handleFilterTableEvent) window.addEventListener('popstate', historyPopStateHandler) }