|
|
|
|
|
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"; |
|
|
} |
|
|
|
|
|
|
|
|
function toggleMenu() { |
|
|
const navLinks = document.getElementById("navLinks"); |
|
|
navLinks.classList.toggle("active"); |
|
|
} |
|
|
|
|
|
|
|
|
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"; |
|
|
}); |
|
|
|
|
|
|
|
|
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", |
|
|
}); |
|
|
|
|
|
document.getElementById("navLinks").classList.remove("active"); |
|
|
} |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
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); |
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
const socialLinks = { |
|
|
scholar: "https://scholar.google.com/citations?user=h126goIAAAAJ", |
|
|
github: "https://github.com/ntphuc149", |
|
|
linkedin: "https://www.linkedin.com/in/ntphuc149/", |
|
|
}; |
|
|
|
|
|
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"); |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
function switchTab(tabName) { |
|
|
|
|
|
const tabButtons = document.querySelectorAll(".tab-btn"); |
|
|
const tabContents = document.querySelectorAll(".tab-content"); |
|
|
|
|
|
|
|
|
tabButtons.forEach((btn) => btn.classList.remove("active")); |
|
|
tabContents.forEach((content) => content.classList.remove("active")); |
|
|
|
|
|
|
|
|
const clickedButton = event.target.closest(".tab-btn"); |
|
|
if (clickedButton) { |
|
|
clickedButton.classList.add("active"); |
|
|
} |
|
|
|
|
|
|
|
|
const targetTab = document.getElementById(tabName + "-tab"); |
|
|
if (targetTab) { |
|
|
targetTab.classList.add("active"); |
|
|
} |
|
|
} |
|
|
|