Lewati ke konten
document.addEventListener('DOMContentLoaded', function(){
var navLinks = document.querySelectorAll('.timeline-nav a');
var details = document.querySelectorAll('details.timeline-year');
function clearActive() {
navLinks.forEach(function(a){ a.classList.remove('active'); });
}
function setActiveByHref(href) {
clearActive();
var link = document.querySelector('.timeline-nav a[href="'+href+'"]');
if (link) link.classList.add('active');
}
// Click nav item
navLinks.forEach(function(a){
a.addEventListener('click', function(){
setActiveByHref(a.getAttribute('href'));
});
});
// Toggle details section
details.forEach(function(d){
d.addEventListener('toggle', function(){
if (d.open) {
setActiveByHref('#' + d.id);
}
});
});
// Scroll observer
if ('IntersectionObserver' in window) {
var io = new IntersectionObserver(function(entries){
entries.forEach(function(entry){
if (entry.isIntersecting) {
setActiveByHref('#' + entry.target.id);
}
});
}, { root: null, rootMargin: '-120px 0px -60% 0px', threshold: 0 });
details.forEach(function(d){ io.observe(d); });
}
// Hash on page load
if (location.hash) {
setTimeout(function(){ setActiveByHref(location.hash); }, 100);
}
});