|
|
|
|
|
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
|
|
|
const downloadButtons = document.querySelectorAll('.download-btn'); |
|
|
|
|
|
downloadButtons.forEach(button => { |
|
|
button.addEventListener('mouseenter', function() { |
|
|
const tooltip = document.createElement('div'); |
|
|
tooltip.className = 'tooltip absolute -top-10 left-1/2 transform -translate-x-1/2 bg-dark text-white px-3 py-1 rounded-lg text-sm whitespace-nowrap z-50 border border-gray-700'; |
|
|
tooltip.textContent = '보안 다운로드 • 검증됨'; |
|
|
this.appendChild(tooltip); |
|
|
}); |
|
|
|
|
|
button.addEventListener('mouseleave', function() { |
|
|
const tooltip = this.querySelector('.tooltip'); |
|
|
if (tooltip) { |
|
|
tooltip.remove(); |
|
|
} |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
const observerOptions = { |
|
|
threshold: 0.1, |
|
|
rootMargin: '0px 0px -50px 0px' |
|
|
}; |
|
|
|
|
|
const observer = new IntersectionObserver((entries) => { |
|
|
entries.forEach(entry => { |
|
|
if (entry.isIntersecting) { |
|
|
entry.target.classList.add('animate-slide-in'); |
|
|
} |
|
|
}); |
|
|
}, observerOptions); |
|
|
|
|
|
|
|
|
document.querySelectorAll('software-card, .stat-card').forEach(card => { |
|
|
observer.observe(card); |
|
|
}); |
|
|
|
|
|
|
|
|
const searchInput = document.getElementById('search-input'); |
|
|
if (searchInput) { |
|
|
searchInput.addEventListener('input', function(e) { |
|
|
const searchTerm = e.target.value.toLowerCase(); |
|
|
const softwareCards = document.querySelectorAll('software-card'); |
|
|
|
|
|
softwareCards.forEach(card => { |
|
|
const name = card.getAttribute('name').toLowerCase(); |
|
|
const category = card.getAttribute('category').toLowerCase(); |
|
|
|
|
|
if (name.includes(searchTerm) || category.includes(searchTerm)) { |
|
|
card.style.display = 'block'; |
|
|
setTimeout(() => { |
|
|
card.style.opacity = '1'; |
|
|
card.style.transform = 'scale(1)'; |
|
|
}, 10); |
|
|
} else { |
|
|
card.style.opacity = '0'; |
|
|
card.style.transform = 'scale(0.9)'; |
|
|
setTimeout(() => { |
|
|
card.style.display = 'none'; |
|
|
}, 300); |
|
|
} |
|
|
}); |
|
|
}); |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
function filterByCategory(category) { |
|
|
const softwareCards = document.querySelectorAll('software-card'); |
|
|
const filterButtons = document.querySelectorAll('.filter-btn'); |
|
|
|
|
|
|
|
|
filterButtons.forEach(btn => { |
|
|
if (btn.dataset.category === category) { |
|
|
btn.classList.add('bg-primary', 'text-white'); |
|
|
btn.classList.remove('bg-dark', 'text-gray-400'); |
|
|
} else { |
|
|
btn.classList.remove('bg-primary', 'text-white'); |
|
|
btn.classList.add('bg-dark', 'text-gray-400'); |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
softwareCards.forEach(card => { |
|
|
const cardCategory = card.getAttribute('category'); |
|
|
|
|
|
if (category === 'all' || cardCategory === category) { |
|
|
card.style.display = 'block'; |
|
|
setTimeout(() => { |
|
|
card.style.opacity = '1'; |
|
|
card.style.transform = 'scale(1)'; |
|
|
}, 10); |
|
|
} else { |
|
|
card.style.opacity = '0'; |
|
|
card.style.transform = 'scale(0.9)'; |
|
|
setTimeout(() => { |
|
|
card.style.display = 'none'; |
|
|
}, 300); |
|
|
} |
|
|
}); |
|
|
} |
|
|
|
|
|
|
|
|
let downloadCount = 14287; |
|
|
const downloadCounter = document.getElementById('download-counter'); |
|
|
if (downloadCounter) { |
|
|
setInterval(() => { |
|
|
downloadCount += Math.floor(Math.random() * 5) + 1; |
|
|
downloadCounter.textContent = downloadCount.toLocaleString(); |
|
|
}, 3000); |
|
|
} |