init

2026-08-25 12:01:09 +08:00
commit 944005507f
252 changed files with 145378 additions and 0 deletions
@@ -0,0 +1,103 @@
+const navToggle = document.querySelector('.nav-toggle');
+const mainNav = document.querySelector('.main-nav');
+const dropdown = document.querySelector('.nav-dropdown');
+const dropdownTrigger = document.querySelector('.dropdown-trigger');
+
+navToggle?.addEventListener('click', () => {
+  const open = mainNav.classList.toggle('open');
+  document.body.classList.toggle('nav-open', open);
+  navToggle.setAttribute('aria-expanded', String(open));
+});
+
+dropdownTrigger?.addEventListener('click', () => {
+  const open = dropdown.classList.toggle('open');
+  dropdownTrigger.setAttribute('aria-expanded', String(open));
+});
+
+document.querySelectorAll('.flow-tab').forEach((tab, index) => {
+  tab.addEventListener('click', () => {
+    document.querySelectorAll('.flow-tab').forEach(item => item.classList.remove('active'));
+    document.querySelectorAll('.flow-list').forEach(item => item.classList.remove('active'));
+    tab.classList.add('active');
+    document.querySelectorAll('.flow-list')[index]?.classList.add('active');
+  });
+});
+
+document.querySelectorAll('.feature-tab').forEach((tab, index) => {
+  tab.setAttribute('role', 'tab');
+  tab.setAttribute('aria-selected', String(tab.classList.contains('active')));
+  tab.addEventListener('click', () => {
+    document.querySelectorAll('.feature-tab').forEach(item => {
+      item.classList.remove('active');
+      item.setAttribute('aria-selected', 'false');
+    });
+    document.querySelectorAll('.feature-detail').forEach(item => item.classList.remove('active'));
+    document.querySelectorAll('.device-state').forEach(item => {
+      item.classList.remove('active');
+      item.setAttribute('aria-hidden', 'true');
+    });
+    tab.classList.add('active');
+    tab.setAttribute('aria-selected', 'true');
+    document.querySelectorAll('.feature-detail')[index]?.classList.add('active');
+    const deviceState = document.querySelectorAll('.device-state')[index];
+    deviceState?.classList.add('active');
+    deviceState?.removeAttribute('aria-hidden');
+  });
+  tab.addEventListener('mouseenter', () => {
+    if (!tab.classList.contains('active')) tab.click();
+  });
+});
+
+const observer = new IntersectionObserver(entries => {
+  entries.forEach(entry => {
+    if (entry.isIntersecting) {
+      entry.target.classList.add('visible');
+      observer.unobserve(entry.target);
+    }
+  });
+}, { threshold: 0.08 });
+document.querySelectorAll('.reveal').forEach(item => observer.observe(item));
+
+document.querySelector('.phone-form')?.addEventListener('submit', event => {
+  event.preventDefault();
+  const input = event.currentTarget.querySelector('input');
+  const button = event.currentTarget.querySelector('button');
+  if (!input.value.trim()) {
+    input.focus();
+    return;
+  }
+  button.textContent = '提交成功';
+  button.disabled = true;
+});
+
+const qrModal = document.querySelector('#qr-modal');
+const qrModalClose = qrModal?.querySelector('.qr-modal-close');
+let qrModalLastFocus = null;
+
+const openQrModal = event => {
+  event.preventDefault();
+  if (!qrModal) return;
+  qrModalLastFocus = event.currentTarget;
+  qrModal.hidden = false;
+  document.body.classList.add('modal-open');
+  qrModalClose?.focus();
+};
+
+const closeQrModal = () => {
+  if (!qrModal || qrModal.hidden) return;
+  qrModal.hidden = true;
+  document.body.classList.remove('modal-open');
+  qrModalLastFocus?.focus();
+};
+
+document.querySelectorAll('.qr-trigger').forEach(trigger => {
+  trigger.addEventListener('click', openQrModal);
+});
+qrModalClose?.addEventListener('click', closeQrModal);
+qrModal?.querySelector('[data-modal-close]')?.addEventListener('click', closeQrModal);
+document.addEventListener('keydown', event => {
+  if (event.key === 'Escape') closeQrModal();
+});
+document.querySelectorAll('[data-link-placeholder]').forEach(link => {
+  link.addEventListener('click', event => event.preventDefault());
+});