Changed around line 1
+ document.addEventListener('DOMContentLoaded', function() {
+ // Platform filter functionality
+ const platformButtons = document.querySelectorAll('.platform-filters button');
+ platformButtons.forEach(button => {
+ button.addEventListener('click', () => {
+ platformButtons.forEach(btn => btn.classList.remove('active'));
+ button.classList.add('active');
+ filterCreators(button.dataset.platform);
+ });
+ });
+
+ // Search functionality
+ const searchInput = document.querySelector('.search-bar input');
+ const searchButton = document.querySelector('.search-bar button');
+
+ searchButton.addEventListener('click', () => {
+ performSearch(searchInput.value);
+ });
+
+ searchInput.addEventListener('keypress', (e) => {
+ if (e.key === 'Enter') {
+ performSearch(searchInput.value);
+ }
+ });
+
+ // Login/Signup modal handlers
+ const loginBtn = document.querySelector('.login-btn');
+ const signupBtn = document.querySelector('.signup-btn');
+
+ loginBtn.addEventListener('click', showLoginModal);
+ signupBtn.addEventListener('click', showSignupModal);
+
+ // Initialize trends chart
+ initializeTrendsChart();
+ });
+
+ function filterCreators(platform) {
+ console.log(`Filtering creators for platform: ${platform}`);
+ // Implementation would fetch and display creators based on platform
+ }
+
+ function performSearch(query) {
+ console.log(`Searching for: ${query}`);
+ // Implementation would perform search and update results
+ }
+
+ function showLoginModal() {
+ console.log('Show login modal');
+ // Implementation would show login modal
+ }
+
+ function showSignupModal() {
+ console.log('Show signup modal');
+ // Implementation would show signup modal
+ }
+
+ function initializeTrendsChart() {
+ const ctx = document.getElementById('trendsChart');
+ if (!ctx) return;
+
+ // Chart implementation would go here
+ // This would typically use a charting library, but since we're using vanilla JS,
+ // we'd need to implement a simple chart visualization
+ }
+
+ // Implement infinite scroll for creator cards
+ let isLoading = false;
+ window.addEventListener('scroll', () => {
+ if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight - 1000) {
+ if (!isLoading) {
+ loadMoreCreators();
+ }
+ }
+ });
+
+ function loadMoreCreators() {
+ isLoading = true;
+ // Simulate loading more creators
+ setTimeout(() => {
+ // Implementation would fetch and append more creator cards
+ isLoading = false;
+ }, 1000);
+ }