in src/maps_planner/index.ts [827:855]
function highlightCard(index: number) {
activeCardIndex = index;
const cards = cardContainer?.querySelectorAll('.location-card');
if (!cards) return;
cards.forEach((card) => card.classList.remove('card-active'));
if (cards[index]) {
cards[index].classList.add('card-active');
const cardWidth = cards[index].offsetWidth;
const containerWidth = cardContainer.offsetWidth;
const scrollPosition =
cards[index].offsetLeft - containerWidth / 2 + cardWidth / 2;
cardContainer.scrollTo({left: scrollPosition, behavior: 'smooth'});
}
const dots = carouselIndicators?.querySelectorAll('.carousel-dot');
if (dots) {
dots.forEach((dot, i) => dot.classList.toggle('active', i === index));
}
popUps.forEach((popup, i) => {
popup.popup.setMap(isPlannerMode ? (i === index ? map : null) : map);
if (popup.content) {
popup.content.classList.toggle('popup-active', i === index);
}
});
if (isPlannerMode) highlightTimelineItem(index);
}