63 lines
2.1 KiB
JavaScript
63 lines
2.1 KiB
JavaScript
const HIDDEN_CLASS = 'is-sort-hidden';
|
|
|
|
// Injecte la règle CSS pour masquer les cards filtrées
|
|
const style = document.createElement('style');
|
|
style.textContent = `.${HIDDEN_CLASS} { display: none !important; }`;
|
|
document.head.appendChild(style);
|
|
|
|
export function initSort(onLayoutChange) {
|
|
const pageSort = document.querySelector('.page__sort');
|
|
if (!pageSort) return;
|
|
|
|
const container = document.querySelector('[data-sort-container]');
|
|
if (!container) return;
|
|
|
|
const getCards = () => Array.from(container.querySelectorAll('[data-date]'));
|
|
|
|
// — Sort by date —
|
|
const sortBtn = pageSort.querySelector('[data-sort-type]');
|
|
if (sortBtn) {
|
|
sortBtn.addEventListener('click', () => {
|
|
const dir = sortBtn.getAttribute('data-sort-type') === 'down' ? 'up' : 'down';
|
|
sortBtn.setAttribute('data-sort-type', dir);
|
|
|
|
const cards = getCards();
|
|
cards.sort((a, b) => {
|
|
const da = new Date(a.dataset.date || 0);
|
|
const db = new Date(b.dataset.date || 0);
|
|
return dir === 'up' ? da - db : db - da;
|
|
});
|
|
cards.forEach(c => container.appendChild(c));
|
|
|
|
onLayoutChange?.();
|
|
});
|
|
}
|
|
|
|
// — Filter by category / location —
|
|
const filterBtns = Array.from(pageSort.querySelectorAll('[data-filter]'));
|
|
filterBtns.forEach(btn => {
|
|
btn.addEventListener('click', () => {
|
|
const wasSelected = btn.classList.contains('is-selected');
|
|
|
|
// Ferme le dropdown parent
|
|
btn.closest('.dropdown')?.classList.remove('is-open');
|
|
|
|
// Bascule la sélection
|
|
filterBtns.forEach(b => b.classList.remove('is-selected'));
|
|
const value = wasSelected ? null : btn.getAttribute('data-filter');
|
|
if (!wasSelected) btn.classList.add('is-selected');
|
|
|
|
// Affiche / cache les cards
|
|
getCards().forEach(card => {
|
|
if (!value) {
|
|
card.classList.remove(HIDDEN_CLASS);
|
|
} else {
|
|
const cardFilters = (card.dataset.filter || '').split(' ').filter(Boolean);
|
|
card.classList.toggle(HIDDEN_CLASS, !cardFilters.includes(value));
|
|
}
|
|
});
|
|
|
|
onLayoutChange?.();
|
|
});
|
|
});
|
|
}
|