23 lines
1.1 KiB
JavaScript
23 lines
1.1 KiB
JavaScript
const search = document.querySelector('#search');
|
|
let category = 'all';
|
|
function filter() {
|
|
const term = search.value.trim().toLowerCase();
|
|
let count = 0;
|
|
document.querySelectorAll('.latest .story').forEach(card => {
|
|
card.hidden = !(category === 'all' || card.dataset.category === category) || !card.dataset.search.includes(term);
|
|
if (!card.hidden) count++;
|
|
});
|
|
document.querySelector('#count').textContent = `${count} ${count === 1 ? 'story' : 'stories'}`;
|
|
document.querySelector('#results-status').textContent = `${count} stories found`;
|
|
document.querySelector('#no-results').hidden = count !== 0;
|
|
}
|
|
if (search) {
|
|
search.addEventListener('input', filter);
|
|
document.querySelectorAll('[data-filter]').forEach(button => button.addEventListener('click', () => {
|
|
category = button.dataset.filter;
|
|
document.querySelectorAll('[data-filter]').forEach(b => {b.classList.toggle('selected', b === button);b.setAttribute('aria-pressed',String(b === button));});
|
|
filter();
|
|
}));
|
|
document.addEventListener('keydown', e => {if(e.key === '/' && !['INPUT','TEXTAREA'].includes(document.activeElement.tagName)){e.preventDefault();search.focus();}});
|
|
}
|