// ========== SKELETON LOADING PLACEHOLDERS ==========
(function () {
function createSkeletonCard() {
const card = document.createElement('div');
card.className = 'skeleton-card';
card.innerHTML =
'' +
'' +
'';
return card;
}
function showSkeletons(count) {
const grid = document.getElementById('cards');
if (!grid || grid.querySelector('.card')) return; // Don't show if real cards exist
count = count || 6;
for (let i = 0; i < count; i++) {
const sk = createSkeletonCard();
grid.appendChild(sk);
// Stagger fade-in
setTimeout(function () { sk.classList.add('loaded'); }, i * 60);
}
}
function hideSkeletons() {
const grid = document.getElementById('cards');
if (!grid) return;
var skeletons = grid.querySelectorAll('.skeleton-card');
if (!skeletons.length) return;
skeletons.forEach(function (sk, i) {
setTimeout(function () {
sk.style.opacity = '0';
sk.style.transform = 'translateY(-10px)';
}, i * 25);
});
// Remove after animation
setTimeout(function () {
skeletons.forEach(function (sk) { if (sk.parentNode) sk.remove(); });
}, skeletons.length * 25 + 300);
}
window.SkeletonLoader = { show: showSkeletons, hide: hideSkeletons };
})();