抽奖动画

pages/luckDraw/detail.js

@@ -14,6 +14,7 @@ Page({
      */
     data: {
         pointerPos: 0,
+        hitPos: null,
         activityId: 0,
         forbidTurn: false,
         giftList: DEFAULT_GIFTS,
@@ -117,9 +118,26 @@ Page({
         }
         this.isLock = false
         // 开始动画，开始是快阶段
+        this.data.duration = 80
+        this.data.hitPos = -1
+        this.data.hitTime = 0
+        this.data.isExcetion = false
         this.startTurnAnimationFast();
         // 开始调用后台
-        
+
+        setTimeout(_ => {
+            this.data.hitTime = new Date().getTime()
+            this.data.hitPos = 4
+             //this.requestDrawPrize()
+        }, 2000)
+    },
+
+    requestDrawPrize() {
+        LuckDraw.drawPrize(this.data.activityId, getMobileCache()).then(res => {
+            console.log(res)
+        }).catch(_ => {
+            this.data.isExcetion = true
+        })
     },
 
     // 授权手机号
@@ -129,23 +147,93 @@ Page({
         })
     },
 
+    nextPos() {
+        let pos = 0
+        switch(this.data.pointerPos) {
+            case 0:
+                pos = 1
+                break
+            case 1:
+                pos = 2
+                break
+            case 2:
+                pos = 4
+                break
+            case 4:
+                pos = 7
+                break
+            case 7:
+                pos = 6
+                break  
+            case 6:
+                pos = 5
+                break
+            case 5:
+                pos = 3
+                break
+            case 3:
+                pos = 0
+                break                 
+        }
+        this.data.pointerPos = pos
+    },
+
     startTurnAnimationFast: function() {
-        const timer = setInterval(_ => {
-            if (this.data.pointerPos > 7) {
-                this.data.pointerPos = 0
-            }
-            this.data.giftList.forEach((v, i) => {
-                if (i == this.data.pointerPos) {
-                    v.active = true
+        if (this.data.isExcetion) {
+            // 异常停止转动
+            this.setActiveGift(-1)
+            this.timer&&clearTimeout(this.timer)
+            return
+        }
+        const endTime = new Date().getTime()
+        const step = 10
+        this.timer = setTimeout(_ => {
+            this.setActiveGift(this.data.pointerPos)
+            if (this.data.hitPos == -1) {
+                this.nextPos()
+                this.startTurnAnimationFast()
+            } else {
+                // 收到抽中信号了，依然需要跑一段时间
+                if (endTime - this.data.hitTime < 3000) {
+                    this.data.duration += step
+                    this.nextPos()
+                    this.startTurnAnimationFast()
                 } else {
-                    v.active = false
+                    // 可以定位了
+                    if (this.data.hitPos == this.data.pointerPos) {
+                        // 删除定时器，抽奖动作结束，开始回调
+                        this.timer && clearTimeout(this.timer)
+                        this.setActiveGift(this.data.pointerPos)
+                        this.dealHitResult()
+                    } else {
+                        this.data.duration += (step * 2)
+                        this.nextPos()
+                        this.startTurnAnimationFast()
+                    }
                 }
-            })
-            this.data.pointerPos++
+            }
+        }, this.data.duration)
+    },
+
+    setActiveGift(pos) {
+        this.data.giftList.forEach((v, i) => {
+            if (i == pos) {
+                v.active = true
+            } else {
+                v.active = false
+            }
+        })
+        this.setData({
+            giftList: this.data.giftList
+        })
+    },
+
+    dealHitResult: function() {
+        setTimeout(_ => {
             this.setData({
-                giftList: this.data.giftList
+                showHitPrizeDlg: true
             })
-        }, 120)
+        }, 300)
     },
 
     /**