script.js

// Main JavaScript for CodeBloom Rose Petals

document.addEventListener('DOMContentLoaded', function() {
    // Initialize feather icons
    if (typeof feather !== 'undefined') {
        feather.replace();
    }

    // Smooth scroll for anchor links
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', function (e) {
            e.preventDefault();
            const targetId = this.getAttribute('href');
            if (targetId === '#') return;
            
            const targetElement = document.querySelector(targetId);
            if (targetElement) {
                window.scrollTo({
                    top: targetElement.offsetTop - 80,
                    behavior: 'smooth'
                });
            }
        });
    });

    // Project card interactions
    const projectCards = document.querySelectorAll('.project-card');
    projectCards.forEach(card => {
        card.addEventListener('mouseenter', () => {
            card.classList.add('hover-card');
        });
        
        card.addEventListener('mouseleave', () => {
            card.classList.remove('hover-card');
        });
    });

    // Search functionality (would connect to API)
    const searchInput = document.querySelector('#navSearch');
    if (searchInput) {
        searchInput.addEventListener('input', debounce(function() {
            const query = this.value.trim();
            if (query.length > 2) {
                performSearch(query);
            }
        }, 300));
    }

    // Theme toggle (light/dark - placeholder for future implementation)
    const themeToggle = document.querySelector('#themeToggle');
    if (themeToggle) {
        themeToggle.addEventListener('click', function() {
            document.documentElement.classList.toggle('dark');
            // Save preference to localStorage
            const isDark = document.documentElement.classList.contains('dark');
            localStorage.setItem('theme', isDark ? 'dark' : 'light');
            
            // Show notification
            showNotification('Theme switched to ' + (isDark ? 'dark' : 'light') + ' mode');
        });
    }

    // Initialize dark mode from localStorage
    const savedTheme = localStorage.getItem('theme');
    if (savedTheme === 'dark') {
        document.documentElement.classList.add('dark');
    }
});

// Utility function for debouncing
function debounce(func, wait) {
    let timeout;
    return function executedFunction(...args) {
        const later = () => {
            clearTimeout(timeout);
            func.apply(this, args);
        };
        clearTimeout(timeout);
        timeout = setTimeout(later, wait);
    };
}

// Search function (placeholder - would connect to your backend/API)
async function performSearch(query) {
    console.log('Searching for:', query);
    // Here you would typically fetch from an API
    // Example:
    // const response = await fetch(`/api/search?q=${encodeURIComponent(query)}`);
    // const results = await response.json();
    // displayResults(results);
}

// Notification system
function showNotification(message, type = 'info') {
    // Create notification element
    const notification = document.createElement('div');
    notification.className = `fixed top-24 right-6 px-6 py-3 rounded-xl shadow-xl z-50 transform translate-x-full transition-transform duration-300 ${type === 'info' ? 'bg-rose-600' : 'bg-red-600'} text-white`;
    notification.textContent = message;
    
    // Append to body
    document.body.appendChild(notification);
    
    // Animate in
    setTimeout(() => {
        notification.style.transform = 'translateX(0)';
    }, 10);
    
    // Remove after 3 seconds
    setTimeout(() => {
        notification.style.transform = 'translateX(100%)';
        setTimeout(() => {
            document.body.removeChild(notification);
        }, 300);
    }, 3000);
}

// API integration for project data
async function fetchProjects() {
    try {
        // Example using public API - would replace with your actual API
        const response = await fetch('https://api.github.com/search/repositories?q=topic:frontend&sort=stars&order=desc&per_page=6');
        const data = await response.json();
        return data.items || [];
    } catch (error) {
        console.error('Error fetching projects:', error);
        return [];
    }
}

// Form submission handler
document.addEventListener('submit', function(e) {
    if (e.target.matches('form')) {
        e.preventDefault();
        const formData = new FormData(e.target);
        const data = Object.fromEntries(formData);
        
        // Show loading state
        const submitBtn = e.target.querySelector('button[type="submit"]');
        const originalText = submitBtn.textContent;
        submitBtn.textContent = 'Processing...';
        submitBtn.disabled = true;
        
        // Simulate API call
        setTimeout(() => {
            // Reset button
            submitBtn.textContent = originalText;
            submitBtn.disabled = false;
            
            // Show success notification
            showNotification('Action completed successfully!', 'info');
        }, 1000);
    }
});

// Window resize handling for responsive adjustments
let resizeTimer;
window.addEventListener('resize', function() {
    clearTimeout(resizeTimer);
    resizeTimer = setTimeout(function() {
        // Handle responsive adjustments here
        console.log('Window resized - handling responsive adjustments');
    }, 250);
});