// Theme Toggle Functionality const themeToggle = document.querySelector('.theme-toggle'); const icon = themeToggle.querySelector('i'); // Check for saved theme preference const savedTheme = localStorage.getItem('theme'); if (savedTheme) { document.documentElement.setAttribute('data-theme', savedTheme); updateIcon(savedTheme); } // Theme toggle click handler themeToggle.addEventListener('click', () => { const currentTheme = document.documentElement.getAttribute('data-theme'); const newTheme = currentTheme === 'dark' ? 'light' : 'dark'; document.documentElement.setAttribute('data-theme', newTheme); localStorage.setItem('theme', newTheme); updateIcon(newTheme); }); // Update icon based on theme function updateIcon(theme) { icon.className = theme === 'dark' ? 'fas fa-sun' : 'fas fa-moon'; } // Mobile Navigation Toggle const burger = document.querySelector('.burger'); const nav = document.querySelector('.nav-links'); const navLinks = document.querySelectorAll('.nav-links li'); burger.addEventListener('click', () => { // Toggle Navigation nav.classList.toggle('active'); // Animate Links navLinks.forEach((link, index) => { if (link.style.animation) { link.style.animation = ''; } else { link.style.animation = `navLinkFade 0.5s ease forwards ${index / 7 + 0.3}s`; } }); // Burger Animation burger.classList.toggle('toggle'); }); // Smooth Scrolling for Navigation Links document.querySelectorAll('a[href^="#"]').forEach(anchor => { anchor.addEventListener('click', function (e) { e.preventDefault(); document.querySelector(this.getAttribute('href')).scrollIntoView({ behavior: 'smooth' }); }); }); // Typing Animation const typingText = document.querySelector('.typing-text'); const words = ['Software Developer', 'Cloud Developer', 'Problem Solver']; let wordIndex = 0; let charIndex = 0; let isDeleting = false; function type() { const currentWord = words[wordIndex]; if (isDeleting) { typingText.textContent = currentWord.substring(0, charIndex - 1); charIndex--; } else { typingText.textContent = currentWord.substring(0, charIndex + 1); charIndex++; } if (!isDeleting && charIndex === currentWord.length) { isDeleting = true; setTimeout(type, 2000); } else if (isDeleting && charIndex === 0) { isDeleting = false; wordIndex = (wordIndex + 1) % words.length; setTimeout(type, 500); } else { setTimeout(type, isDeleting ? 100 : 200); } } // Start typing animation type(); // Scroll Animation const observerOptions = { threshold: 0.1 }; const observer = new IntersectionObserver((entries) => { entries.forEach(entry => { if (entry.isIntersecting) { entry.target.classList.add('fade-in'); } }); }, observerOptions); // Observe all sections document.querySelectorAll('section').forEach(section => { observer.observe(section); }); // Form Submission const contactForm = document.querySelector('.contact-form'); contactForm.addEventListener('submit', (e) => { e.preventDefault(); // Get form data const formData = new FormData(contactForm); const data = Object.fromEntries(formData); // Here you would typically send the data to a server console.log('Form submitted:', data); // Show success message alert('Thank you for your message! I will get back to you soon.'); contactForm.reset(); }); // Add active class to navigation links on scroll const sections = document.querySelectorAll('section'); const navItems = document.querySelectorAll('.nav-links a'); window.addEventListener('scroll', () => { let current = ''; sections.forEach(section => { const sectionTop = section.offsetTop; const sectionHeight = section.clientHeight; if (pageYOffset >= sectionTop - sectionHeight / 3) { current = section.getAttribute('id'); } }); navItems.forEach(item => { item.classList.remove('active'); if (item.getAttribute('href').slice(1) === current) { item.classList.add('active'); } }); }); // Add CSS for active navigation link const style = document.createElement('style'); style.textContent = ` .nav-links a.active { color: #3498db; font-weight: bold; } `; document.head.appendChild(style); // Initialize Tilt.js for hero image and skill cards VanillaTilt.init(document.querySelectorAll(".image-container, .skill-category"), { max: 5, speed: 400, glare: true, "max-glare": 0.2 }); // Stats Counter Animation function animateValue(element, start, end, duration) { let startTimestamp = null; const step = (timestamp) => { if (!startTimestamp) startTimestamp = timestamp; const progress = Math.min((timestamp - startTimestamp) / duration, 1); const currentValue = Math.floor(progress * (end - start) + start); element.textContent = currentValue + (element.dataset.suffix || ''); if (progress < 1) { window.requestAnimationFrame(step); } }; window.requestAnimationFrame(step); } // Stats Observer const statsObserver = new IntersectionObserver((entries) => { entries.forEach(entry => { if (entry.isIntersecting) { const stats = entry.target.querySelectorAll('.stat-item h3'); stats.forEach(stat => { const finalValue = parseInt(stat.dataset.value); stat.textContent = '0'; animateValue(stat, 0, finalValue, 2000); }); statsObserver.unobserve(entry.target); } }); }, { threshold: 0.5 }); // Observe the stats section const statsSection = document.querySelector('.stats'); if (statsSection) { statsObserver.observe(statsSection); } // Scroll to Top Functionality const scrollToTopButton = document.getElementById('scrollToTop'); // Show button when scrolling down window.addEventListener('scroll', () => { if (window.pageYOffset > 300) { scrollToTopButton.classList.add('visible'); } else { scrollToTopButton.classList.remove('visible'); } }); // Smooth scroll to top when clicked scrollToTopButton.addEventListener('click', () => { window.scrollTo({ top: 0, behavior: 'smooth' }); });