rui-neng/public/themes/dist_static/static/js/about.js

import "./common.js";
import "./earth.js";
//#region js/about.js
function counterUpInit() {
	if (!window.counterUp) return;
	const counterUp = window.counterUp.default;
	const callback = (entries) => {
		entries.forEach((entry) => {
			const el = entry.target;
			if (entry.isIntersecting && !el.classList.contains("is-visible")) {
				counterUp(el, {
					duration: 1e3,
					delay: 16
				});
				el.classList.add("is-visible");
			}
		});
	};
	const IO = new IntersectionObserver(callback, { threshold: .5 });
	document.querySelectorAll(".counter").forEach((el) => {
		IO.observe(el);
	});
}
function setActiveNav() {
	const pageNav = document.querySelector("[data-nav]")?.getAttribute("data-nav");
	if (!pageNav) return;
	document.querySelectorAll(".site-header__nav a").forEach((link) => {
		const active = link.textContent.trim().startsWith(pageNav);
		link.classList.toggle("is-active", active);
	});
}
function initHistorySwiper() {
	const root = document.querySelector(".ab-history");
	const el = root?.querySelector(".ab-history__swiper");
	if (!root || !el || !window.Swiper) return;
	function updateFarClass(swiper) {
		const active = swiper.activeIndex;
		swiper.slides.forEach((slide, i) => {
			slide.classList.toggle("is-far", i > active + 2);
		});
	}
	updateFarClass(new window.Swiper(el, {
		slidesPerView: "auto",
		spaceBetween: 100,
		navigation: {
			prevEl: root.querySelector(".ab-history__head .s-arrows__prev"),
			nextEl: root.querySelector(".ab-history__head .s-arrows__next")
		},
		breakpoints: {
			0: {
				spaceBetween: 32,
				navigation: {
					prevEl: root.querySelector(".ab-history__arrows-mobile .s-arrows__prev"),
					nextEl: root.querySelector(".ab-history__arrows-mobile .s-arrows__next")
				}
			},
			993: { spaceBetween: 100 }
		},
		on: { slideChange: updateFarClass }
	}));
}
function initHonorsToggle() {
	const list = document.querySelector(".ab-honors__list");
	const btn = document.querySelector(".ab-honors__more");
	if (!list || !btn) return;
	const items = list.querySelectorAll(".ab-honors__item");
	if (items.length <= 5) {
		btn.style.display = "none";
		return;
	}
	btn.addEventListener("click", () => {
		const expanded = list.classList.toggle("is-expanded");
		btn.classList.toggle("is-expanded", expanded);
		btn.querySelector("span").textContent = expanded ? t("about.collapse") : t("about.expand_more");
		if (expanded) list.setAttribute("data-lenis-prevent", "");
		else list.removeAttribute("data-lenis-prevent");
	});
}
function initMembersCarousel() {
	const root = document.querySelector(".ab-members");
	const SwiperCtor = window.Swiper;
	if (!root || !SwiperCtor) return;
	const el = root.querySelector(".ab-members__panels-swiper");
	const buttons = [...root.querySelectorAll(".ab-members__logo")];
	if (!el || !buttons.length) return;
	const reduceMotion = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
	const canLoop = buttons.length > 1;
	const swiper = new SwiperCtor(el, {
		initialSlide: Math.max(0, buttons.findIndex((btn) => btn.classList.contains("is-active"))),
		loop: canLoop,
		grabCursor: true,
		speed: 600,
		autoplay: canLoop && !reduceMotion ? {
			delay: 3e3,
			disableOnInteraction: false,
			pauseOnMouseEnter: true
		} : false
	});
	const logos = root.querySelector(".ab-members__logos");
	const syncNav = (index) => {
		buttons.forEach((btn, i) => {
			const on = i === index;
			btn.classList.toggle("is-active", on);
			btn.setAttribute("aria-selected", on ? "true" : "false");
		});
		const btn = buttons[index];
		if (logos && btn) {
			const left = btn.offsetLeft - (logos.clientWidth - btn.offsetWidth) / 2;
			logos.scrollTo({ left: Math.max(0, left), behavior: "smooth" });
		}
	};
	buttons.forEach((btn, i) => {
		btn.addEventListener("click", () => {
			if (canLoop) swiper.slideToLoop(i);
			else swiper.slideTo(i);
		});
	});
	swiper.on("slideChange", () => syncNav(swiper.realIndex));
	syncNav(swiper.realIndex);
}
$(function() {
	setActiveNav();
	initHistorySwiper();
	counterUpInit();
	initHonorsToggle();
	initMembersCarousel();
});
//#endregion