58 lines
1.6 KiB
JavaScript
58 lines
1.6 KiB
JavaScript
|
function initRegistry(list, input) {
|
||
|
|
const registryType = input ? input.getAttribute('data-registry') : null;
|
||
|
|
|
||
|
|
const registry = registryType
|
||
|
|
? fetch(`/registry/${registryType}.json`)
|
||
|
|
.then(res => res.json())
|
||
|
|
.then(registry => registry.sections)
|
||
|
|
: Promise.all([
|
||
|
|
fetch('/registry/internal.json').then(res => res.json()),
|
||
|
|
fetch('/registry/external.json').then(res => res.json()),
|
||
|
|
])
|
||
|
|
.then(([internal, external]) => ([
|
||
|
|
...internal.sections,
|
||
|
|
...external.sections
|
||
|
|
]));
|
||
|
|
|
||
|
|
registry.then(sections => {
|
||
|
|
list.innerHTML = sections
|
||
|
|
.sort((a, b) => a.name.localeCompare(b.name))
|
||
|
|
.map(item => `
|
||
|
|
<a href="${item.url}">
|
||
|
|
<li>
|
||
|
|
<strong>
|
||
|
|
${item.name}
|
||
|
|
${item.internal ? '<em>internal</em>' : ''}
|
||
|
|
</strong>
|
||
|
|
${item.description}
|
||
|
|
</li>
|
||
|
|
</a>
|
||
|
|
`)
|
||
|
|
.join('');
|
||
|
|
});
|
||
|
|
|
||
|
|
input.addEventListener('keyup', _.debounce(e => {
|
||
|
|
console.log(e.target.value);
|
||
|
|
const query = e.target.value.toLowerCase().trim();
|
||
|
|
|
||
|
|
Array.from(list.children).forEach(item => {
|
||
|
|
if (item.innerText.toLowerCase().includes(query)) {
|
||
|
|
item.style.display = '';
|
||
|
|
} else {
|
||
|
|
item.style.display = 'none';
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}, 300));
|
||
|
|
}
|
||
|
|
|
||
|
|
const observer = new MutationObserver(mutations => {
|
||
|
|
const list = document.querySelector('#sections-list');
|
||
|
|
const input = document.querySelector('#sections-search');
|
||
|
|
|
||
|
|
if (list && input) {
|
||
|
|
initRegistry(list, input);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
observer.observe(document.body, {childList: true});
|