diff --git a/js/main.js b/js/main.js index 566d7ed..ac942f3 100644 --- a/js/main.js +++ b/js/main.js @@ -11,6 +11,7 @@ const COMMUNITY_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/community' const SCHEDULE_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/schedule'; let currentLang = 'de'; +let revealObserver = null; document.addEventListener('DOMContentLoaded', () => { currentLang = document.body.dataset.lang || 'de'; @@ -158,6 +159,9 @@ function initScrollReveal() { }); }, observerOptions); + // Keep a handle so dynamically rendered cards (members, wiki, dates) can be observed too + revealObserver = observer; + // Observe all sections for reveal animation document.querySelectorAll('.section, .telegram-banner, #newsletter-section').forEach(section => { section.style.opacity = '0'; @@ -208,6 +212,21 @@ function initScrollReveal() { } } +// ======================================== +// REVEAL OBSERVER FOR DYNAMICALLY RENDERED CARDS +// Cards loaded via webhooks (members, wiki, dates) are created AFTER +// initScrollReveal() ran, so they were never observed -> stuck at opacity 0. +// ======================================== +function observeRevealCards(container) { + const els = (container || document).querySelectorAll('.wiki-card-new, .member-card, .date-card, .newsletter-card'); + if (!revealObserver) { + // Reduced-motion (observer never created) or init missed: show immediately + els.forEach(el => el.classList.add('visible')); + return; + } + els.forEach(el => revealObserver.observe(el)); +} + // ======================================== // RIPPLE EFFECT ON BUTTONS // ======================================== @@ -588,6 +607,7 @@ async function loadUsers() { const card = createMemberCard(user); container.appendChild(card); }); + observeRevealCards(container); // Update stats will be handled by loadCommunityStats } else { @@ -766,6 +786,7 @@ function renderWikiCards(data) { grid.appendChild(card); }); + observeRevealCards(grid); } function formatDate(date) { @@ -949,6 +970,7 @@ function renderDates(events) { container.appendChild(card); }); + observeRevealCards(container); } function setCookie(name, value, days) {