// ===== THEME TOGGLE ===== function toggleTheme() { const html = document.documentElement; const currentTheme = html.getAttribute("data-theme"); const newTheme = currentTheme === "dark" ? "light" : "dark"; const themeIcon = document.getElementById("themeIcon"); html.setAttribute("data-theme", newTheme); localStorage.setItem("theme", newTheme); themeIcon.className = newTheme === "dark" ? "ri-sun-fill" : "ri-moon-fill"; } // ===== MOBILE MENU TOGGLE ===== function toggleMenu() { const navLinks = document.getElementById("navLinks"); navLinks.classList.toggle("active"); } // ===== LOAD SAVED THEME ===== window.addEventListener("DOMContentLoaded", () => { const savedTheme = localStorage.getItem("theme") || "light"; const themeIcon = document.getElementById("themeIcon"); document.documentElement.setAttribute("data-theme", savedTheme); themeIcon.className = savedTheme === "dark" ? "ri-sun-fill" : "ri-moon-fill"; }); // ===== SMOOTH SCROLL WITH OFFSET ===== document.querySelectorAll('a[href^="#"]').forEach((anchor) => { anchor.addEventListener("click", function (e) { e.preventDefault(); const target = document.querySelector(this.getAttribute("href")); if (target) { const offset = 80; const targetPosition = target.offsetTop - offset; window.scrollTo({ top: targetPosition, behavior: "smooth", }); // Close mobile menu if open document.getElementById("navLinks").classList.remove("active"); } }); }); // ===== SCROLL ANIMATION ===== const observerOptions = { threshold: 0.1, rootMargin: "0px 0px -100px 0px", }; const observer = new IntersectionObserver((entries) => { entries.forEach((entry) => { if (entry.isIntersecting) { entry.target.style.opacity = "1"; entry.target.style.transform = "translateY(0)"; } }); }, observerOptions); document.querySelectorAll(".glass-card, .timeline-item").forEach((el) => { el.style.opacity = "0"; el.style.transform = "translateY(20px)"; el.style.transition = "all 0.6s ease"; observer.observe(el); }); // ===== SOCIAL LINKS PLACEHOLDERS ===== // Update these with your actual links const socialLinks = { scholar: "https://scholar.google.com/citations?user=h126goIAAAAJ", // Add your Google Scholar URL here github: "https://github.com/ntphuc149", // Add your GitHub URL here linkedin: "https://www.linkedin.com/in/ntphuc149/", // Add your LinkedIn URL here }; document.getElementById("scholarLink").addEventListener("click", (e) => { if (!socialLinks.scholar) { e.preventDefault(); alert("Please update your Google Scholar link in the script.js file"); } else { window.open(socialLinks.scholar, "_blank"); } }); document.getElementById("githubLink").addEventListener("click", (e) => { if (!socialLinks.github) { e.preventDefault(); alert("Please update your GitHub link in the script.js file"); } else { window.open(socialLinks.github, "_blank"); } }); document.getElementById("linkedinLink").addEventListener("click", (e) => { if (!socialLinks.linkedin) { e.preventDefault(); alert("Please update your LinkedIn link in the script.js file"); } else { window.open(socialLinks.linkedin, "_blank"); } }); // ===== EXPERIENCE TABS SWITCHING ===== function switchTab(tabName) { // Get all tab buttons and contents const tabButtons = document.querySelectorAll(".tab-btn"); const tabContents = document.querySelectorAll(".tab-content"); // Remove active class from all buttons and contents tabButtons.forEach((btn) => btn.classList.remove("active")); tabContents.forEach((content) => content.classList.remove("active")); // Add active class to clicked button const clickedButton = event.target.closest(".tab-btn"); if (clickedButton) { clickedButton.classList.add("active"); } // Show corresponding tab content const targetTab = document.getElementById(tabName + "-tab"); if (targetTab) { targetTab.classList.add("active"); } }