31 lines
1.3 KiB
JavaScript
31 lines
1.3 KiB
JavaScript
const tools = document.querySelector('.app-tools');
|
|
if (tools) {
|
|
tools.hidden = false;
|
|
let category = 'all';
|
|
const input = tools.querySelector('input');
|
|
const cards = [...document.querySelectorAll('#app-grid .app-card')];
|
|
const filter = () => {
|
|
const q = input.value.trim().toLocaleLowerCase();
|
|
let count = 0;
|
|
for (const card of cards) {
|
|
const visible = (category === 'all' || card.dataset.category === category) && card.dataset.search.toLocaleLowerCase().includes(q);
|
|
card.hidden = !visible;
|
|
if (visible) count++;
|
|
}
|
|
document.querySelector('#empty').hidden = count !== 0;
|
|
};
|
|
tools.querySelectorAll('[data-filter]').forEach(button => button.addEventListener('click', () => {
|
|
category = button.dataset.filter;
|
|
tools.querySelectorAll('[data-filter]').forEach(b => b.setAttribute('aria-pressed', String(b === button)));
|
|
filter();
|
|
}));
|
|
input.addEventListener('input', filter);
|
|
}
|
|
// Only articles containing diagrams load the pinned renderer. Text remains readable without it.
|
|
if (document.querySelector('.mermaid')) {
|
|
import('https://cdn.jsdelivr.net/npm/mermaid@10.9.3/dist/mermaid.esm.min.mjs').then(({default: mermaid}) => {
|
|
mermaid.initialize({startOnLoad:false, securityLevel:'strict', theme:'neutral', fontFamily:'system-ui'});
|
|
return mermaid.run({querySelector:'.mermaid'});
|
|
}).catch(() => {});
|
|
}
|