add u

pages/index/index.js

@@ -1,11 +1,118 @@
 Page({
   data: {
     playbackRate: 5.0,  // 默认1倍速
-    animationFrame: null // 用于保存定时器ID
+    animationFrame: null, // 用于保存定时器ID
+    activeConstellation: '', // 当前激活的星座
+    tapTimer: null // 用于处理点击延迟
   },
   
   onReady() {
     
   },
-  
+
+  // 处理星座点击事件
+  handleConstellationTap(e) {
+    const { constellation, title, page } = e.currentTarget.dataset;
+    
+    // 如果已经有激活的星座，直接跳转页面
+    if (this.data.activeConstellation === constellation) {
+      if (page) {
+        // 添加跳转前的渐出效果
+        wx.vibrateShort({ type: 'medium' });
+        
+        setTimeout(() => {
+          wx.navigateTo({
+            url: page,
+            fail: () => {
+              wx.showToast({
+                title: `${title}功能开发中`,
+                icon: 'none',
+                duration: 2000
+              });
+            }
+          });
+          this.hideMask();
+        }, 200);
+      } else {
+        wx.showToast({
+          title: `${title}功能开发中`,
+          icon: 'none',
+          duration: 2000
+        });
+        this.hideMask();
+      }
+      return;
+    }
+
+    // 如果有其他激活的星座，先重置
+    if (this.data.activeConstellation) {
+      this.hideMask();
+    }
+
+    // 轻微的震动反馈（点击瞬间）
+    wx.vibrateShort({
+      type: 'light'
+    });
+
+    // 延迟50ms后开始动画，制造"弹起"的感觉
+    setTimeout(() => {
+      // 激活当前星座（放大并居中）
+      this.setData({
+        activeConstellation: constellation
+      });
+
+      // 动画进行到一半时给予第二次震动反馈
+      setTimeout(() => {
+        wx.vibrateShort({
+          type: 'light'
+        });
+      }, 400);
+    }, 50);
+
+    // 2秒后自动跳转（给用户更多时间欣赏动画）
+    if (this.data.tapTimer) {
+      clearTimeout(this.data.tapTimer);
+    }
+    
+    const timer = setTimeout(() => {
+      if (page) {
+        wx.navigateTo({
+          url: page,
+          success: () => {
+            this.hideMask();
+          },
+          fail: () => {
+            wx.showToast({
+              title: `${title}功能开发中`,
+              icon: 'none',
+              duration: 2000
+            });
+            this.hideMask();
+          }
+        });
+      }
+    }, 2000);
+
+    this.setData({
+      tapTimer: timer
+    });
+  },
+
+  // 隐藏遮罩和重置状态
+  hideMask() {
+    if (this.data.tapTimer) {
+      clearTimeout(this.data.tapTimer);
+    }
+    this.setData({
+      activeConstellation: '',
+      tapTimer: null
+    });
+  },
+
+  onUnload() {
+    // 页面卸载时清除定时器
+    if (this.data.tapTimer) {
+      clearTimeout(this.data.tapTimer);
+    }
+  }
 })