睿能科技
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

129 lines
3.7 KiB

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 initMemberLogos() {
const root = document.querySelector(".ab-members");
if (!root) return;
const nameEl = root.querySelector("#ab-members-name");
const descEl = root.querySelector("#ab-members-desc");
const contentEl = root.querySelector(".ab-members__content > div");
const logos = root.querySelectorAll(".ab-members__logo");
if (!nameEl || !descEl || !logos.length) return;
const applyMember = (btn) => {
const name = btn.getAttribute("data-name") || "";
const desc = btn.getAttribute("data-desc") || "";
if (!name && !desc) return;
const update = () => {
nameEl.textContent = name;
descEl.textContent = desc;
};
if (!contentEl || !contentEl.animate) {
update();
return;
}
contentEl.animate([{ opacity: 1 }, { opacity: 0 }], {
duration: 160,
fill: "forwards",
easing: "ease"
}).finished.then(() => {
update();
contentEl.animate([{ opacity: 0 }, { opacity: 1 }], {
duration: 220,
fill: "forwards",
easing: "ease"
});
});
};
logos.forEach((btn) => {
btn.addEventListener("click", () => {
if (btn.classList.contains("is-active")) return;
logos.forEach((item) => {
const active = item === btn;
item.classList.toggle("is-active", active);
item.setAttribute("aria-selected", active ? "true" : "false");
});
applyMember(btn);
});
});
}
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 ? "收起" : "展开更多";
});
}
$(function() {
setActiveNav();
initHistorySwiper();
initMemberLogos();
counterUpInit();
initHonorsToggle();
});
//#endregion