This commit is contained in:
Djeex
2025-08-18 13:01:51 +02:00
parent a02da47e73
commit 643a729f94

View File

@ -69,7 +69,8 @@ const setupTagFilter = () => {
const allSections = document.querySelectorAll('.section[data-tags]'); const allSections = document.querySelectorAll('.section[data-tags]');
const allTags = document.querySelectorAll('.tag'); const allTags = document.querySelectorAll('.tag');
let activeTags = []; let activeTags = [];
let lastClickedTag = null; // mémorise le dernier tag cliqué let lastClickedTag = null; // remembers the last clicked tag
let lastClickedSection = null; // remembers the last clicked section (photo)
const applyFilter = () => { const applyFilter = () => {
let filteredSections = []; let filteredSections = [];
@ -81,30 +82,41 @@ const setupTagFilter = () => {
section.style.display = hasAllTags ? '' : 'none'; section.style.display = hasAllTags ? '' : 'none';
if (hasAllTags) { if (hasAllTags) {
filteredSections.push(section); if (lastClickedSection === section) {
if (lastClickedTag && sectionTags.includes(lastClickedTag) && !matchingSection) {
matchingSection = section; matchingSection = section;
} else {
filteredSections.push(section);
} }
} }
}); });
// Réorganise : la photo correspondante au dernier tag cliqué en premier // Remove all filtered sections from DOM before reordering
if (matchingSection && galleryContainer.contains(matchingSection)) { if (galleryContainer) {
galleryContainer.prepend(matchingSection); [matchingSection, ...filteredSections].forEach(section => {
if (section && galleryContainer.contains(section)) {
galleryContainer.removeChild(section);
}
});
if (matchingSection) {
galleryContainer.prepend(matchingSection);
}
filteredSections.forEach(section => {
galleryContainer.appendChild(section);
});
} }
// Met à jour le style des tags // Update tag styles
allTags.forEach((tagEl) => { allTags.forEach((tagEl) => {
const tagText = tagEl.textContent.replace('#', '').toLowerCase(); const tagText = tagEl.textContent.replace('#', '').toLowerCase();
tagEl.classList.toggle('active', activeTags.includes(tagText)); tagEl.classList.toggle('active', activeTags.includes(tagText));
}); });
// Met à jour l'URL // Update the URL
const base = window.location.pathname; const base = window.location.pathname;
const query = activeTags.length > 0 ? `?tag=${activeTags.join(',')}` : ''; const query = activeTags.length > 0 ? `?tag=${activeTags.join(',')}` : '';
window.history.pushState({}, '', base + query); window.history.pushState({}, '', base + query);
// Scroll jusqu'à la galerie // Scroll to the gallery
if (galleryContainer) { if (galleryContainer) {
galleryContainer.scrollIntoView({ behavior: 'smooth', block: 'start' }); galleryContainer.scrollIntoView({ behavior: 'smooth', block: 'start' });
} }
@ -113,7 +125,8 @@ const setupTagFilter = () => {
allTags.forEach((tagEl) => { allTags.forEach((tagEl) => {
tagEl.addEventListener('click', () => { tagEl.addEventListener('click', () => {
const tagText = tagEl.textContent.replace('#', '').toLowerCase(); const tagText = tagEl.textContent.replace('#', '').toLowerCase();
lastClickedTag = tagText; // mémorise le dernier tag cliqué lastClickedTag = tagText; // remembers the last clicked tag
lastClickedSection = tagEl.closest('.section'); // remembers the last clicked section
if (activeTags.includes(tagText)) { if (activeTags.includes(tagText)) {
activeTags = activeTags.filter((t) => t !== tagText); activeTags = activeTags.filter((t) => t !== tagText);
@ -130,6 +143,7 @@ const setupTagFilter = () => {
if (urlTags) { if (urlTags) {
activeTags = urlTags.split(',').map((t) => t.toLowerCase()); activeTags = urlTags.split(',').map((t) => t.toLowerCase());
lastClickedTag = activeTags[activeTags.length - 1] || null; lastClickedTag = activeTags[activeTags.length - 1] || null;
lastClickedSection = null; // No section selected from URL
applyFilter(); applyFilter();
} }
}); });
@ -141,9 +155,9 @@ const disableRightClickAndDrag = () => {
document.addEventListener('dragstart', (e) => e.preventDefault()); document.addEventListener('dragstart', (e) => e.preventDefault());
}; };
// Scroll to top button // Scroll-to-top button functionality
const setupScrollToTopButton = () => { const setupScrollToTopButton = () => {
const scrollBtn = document.getElementById("scrollToTop"); const scrollBtn = document.getElementById("scrollToTop");
window.addEventListener("scroll", () => { window.addEventListener("scroll", () => {
scrollBtn.style.display = window.scrollY > 300 ? "block" : "none"; scrollBtn.style.display = window.scrollY > 300 ? "block" : "none";
}); });