11

mock/game.ts

@@ -10,10 +10,10 @@ export default [
         message: "message",
         data: AESEncrypt(JSON.stringify({
           recordId: "recordId",
-          countdownSeconds: 180,
+          countdownSeconds: 10,
           remainTipTimes: 3,
         }), "7A2F4B8D1E6C3905", "cDOiBC1n2QrkAY2P"),
-        data: "TtL6pvFMpXEajymGe7uOoiD0iaAnxxtuOFqvG+Vo0R4qzJQlb+eQneEkPKv+nNsXKJHVe/hfKTQAMj6FuC2Ltg=="
+        // data: "TtL6pvFMpXEajymGe7uOoiD0iaAnxxtuOFqvG+Vo0R4qzJQlb+eQneEkPKv+nNsXKJHVe/hfKTQAMj6FuC2Ltg=="
       }
     },
   },

src/pages/GamePage/Components/LevelBase.ts

@@ -6,6 +6,13 @@ export abstract class LevelBase extends Base {
   abstract level: number;
   qs: Sprite;
 
+  setPauseCd: (pause: boolean) => void;
+
+  constructor(setPauseCd) {
+    super();
+    this.setPauseCd = setPauseCd;
+  }
+
   onLoad() {
     this.qs = this.addChild(new Sprite(Assets.get(`level${this.level}/qs.png`)));
     this.qs.anchor.set(0.5);

src/pages/GamePage/Game.ts

@@ -37,6 +37,13 @@ export class Game extends Base {
 
   level: LevelBase = null;
 
+  pauseCd: boolean = false;
+
+  setPauseCd = (pause: boolean) => {
+    this.pauseCd = pause;
+  };
+
+
   onLoad() {
     const qsBg = this.addChild(new Sprite(Assets.get("问题.png")));
     qsBg.position.set(49, 316);
@@ -45,22 +52,45 @@ export class Game extends Base {
     globalEvent.on(GameEvent.NextLevel, this.nextLevel, this);
 
     this.nextLevel();
+    this.startCd();
+  }
+
 
+  gameOver() {
+    this.eventMode = "none";
+    this.interactive = this.interactiveChildren = false;
   }
 
-  nextLevel() {
+  intervalId: number = null;
 
+  startCd() {
+    this.intervalId = window.setInterval(() => {
+      if (this.pauseCd) return;
+      const newCd = gameStore.gameInfo.cd -= 1;
+      if (newCd <= 0) {
+        clearInterval(this.intervalId);
+        this.gameOver();
+        return;
+      }
+    }, 1000);
+  }
+
+  nextLevel() {
     gameStore.gameInfo.levelIndex++;
 
     const { levelIndex, levelIdxArr } = gameStore.gameInfo;
 
     if (levelIndex > 0) {
       if (levelIndex >= LevelArr.length) {
+        clearInterval(this.intervalId);
         gameStore.submit(LevelArr.length);
         return;
       } else {
+        gameStore.gameInfo.cd = gameStore.gameInfo.countdownSeconds;
         gameStore.middleSubmit(levelIndex);
       }
+    } else {
+      gameStore.gameInfo.cd = gameStore.gameInfo.countdownSeconds;
     }
 
     if (levelIndex >= levelIdxArr.length) {
@@ -76,7 +106,7 @@ export class Game extends Base {
 
     const { cls } = LevelArr[levelIdx];
 
-    this.level = this.addChild(new cls());
+    this.level = this.addChild(new cls(this.setPauseCd));
     // this.level = this.addChild(new Level25());
   }
 
@@ -89,5 +119,7 @@ export class Game extends Base {
   }
 
   onDestroy() {
+    super.onDestroy();
+    clearInterval(this.intervalId);
   }
 }

src/pages/GamePage/GamePage.tsx

@@ -22,6 +22,7 @@ import TipPanel from "@/panels/TipPanel/TipPanel.tsx";
 import { LevelArr } from "@/pages/GamePage/Level/LevelConfig.ts";
 import ExitPop from '@/components/exitPop/exitPop';
 import { _throttle } from "@/utils/utils.ts";
+import { GameEvent, globalEvent } from "@/pages/GamePage/GameEvent.ts";
 
 export function getApp(): Application {
   return window["__app"];
@@ -93,7 +94,6 @@ class GamePage extends React.Component<any, any> {
     this.app.ticker.add(this.onUpdate);
 
     this.game = app.stage.addChild(new Game());
-
   }
 
   onUpdate = (time: Ticker) => {
@@ -124,8 +124,7 @@ class GamePage extends React.Component<any, any> {
   })
 
   render() {
-    const {} = store.indexData;
-    const { levelIndex, levelIdxArr } = gameStore.gameInfo;
+    const { levelIndex, levelIdxArr, cd } = gameStore.gameInfo;
 
     const titleSrc = new URL(
       `../../assets/GamePage/title/title${(levelIndex + 1) || 1}.png?x-oss-process=image/format,webp`,
@@ -136,7 +135,7 @@ class GamePage extends React.Component<any, any> {
 
       <canvas className={styles.gameCanvas} ref={(el) => this.gameCanvas = el}/>
 
-      <div className={styles.cd}>180s</div>
+      <div className={styles.cd}>{cd}s</div>
       <img src={titleSrc} className={styles.title}/>
       <Button className={`${styles.tipBtn} md14`} onClick={this.clickTip}/>
       <Button className={`${styles.backBtn} md13`} onClick={this.clickBack}/>

src/pages/GamePage/Level/Level1.ts

@@ -52,6 +52,7 @@ export class Level1 extends LevelBase {
     const wait = 2000;
 
     if (isRight) {
+      this.setPauseCd(true);
       this.right.visible = true;
       this.right.position.set(item.x + dp, item.y + dp);
       Tween.get(this.error)

src/pages/GamePage/Level/Level10.ts

@@ -67,6 +67,7 @@ export class Level10 extends LevelBase {
       && ny >= 865
       && ny <= 940
     ) {
+      this.setPauseCd(true);
       this.setTouchEnable(false);
       Tween.get(this.B).to({ alpha: 0 }, 444, Ease.quadInOut);
       Tween.get(this.D).to({ alpha: 0 }, 444, Ease.quadInOut);

src/pages/GamePage/Level/Level11.ts

@@ -117,6 +117,7 @@ export class Level11 extends LevelBase {
     // 防止重复触发
     if (this.right.alpha > 0) return;
 
+    this.setPauseCd(true);
     this.setTouchEnable(false);
 
     Tween.get(this.right)

src/pages/GamePage/Level/Level12.ts

@@ -204,6 +204,7 @@ export class Level12 extends LevelBase {
     // 设置right的位置
     this.right.position.set(rightX, rightY);
 
+    this.setPauseCd(true);
     // 显示right图标并完成通关
     Tween.get(this.right)
       .to({ alpha: 1 }, 444, Ease.quadInOut)

src/pages/GamePage/Level/Level13.ts

@@ -73,6 +73,7 @@ export class Level13 extends LevelBase {
       cx < 10 || cx > 410
       || cy < 480 || cy > 900
     ) {
+      this.setPauseCd(true);
       this.setTouchEnable(false);
       Tween.get(this.right)
         .to({ alpha: 1 }, 444, Ease.quadInOut)

src/pages/GamePage/Level/Level14.ts

@@ -95,6 +95,7 @@ export class Level14 extends LevelBase {
       && ny >= 930
       && ny <= 1120
     ) {
+      this.setPauseCd(true);
       this.setTouchEnable(false);
       Tween.get(this.A)
         .to({ x: 484, y: 1040 }, 444, Ease.quadInOut)

src/pages/GamePage/Level/Level15.ts

@@ -117,6 +117,7 @@ export class Level15 extends LevelBase {
       .intersects(new Rectangle(180, 840, 37, 55));
 
     if (isIns) {
+      this.setPauseCd(true);
       this.setTouchEnable(false);
       this.target.eventMode = "none";
       this.target.interactive = false;

src/pages/GamePage/Level/Level16.ts

@@ -62,6 +62,7 @@ export class Level16 extends LevelBase {
       && ny >= 920
       && ny <= 1034
     ) {
+      this.setPauseCd(true);
       this.setTouchEnable(false);
       // Tween.get(this.B).to({ alpha: 0 }, 444, Ease.quadInOut);
       Tween.get(this.A)

src/pages/GamePage/Level/Level17.ts

@@ -66,7 +66,10 @@ export class Level17 extends LevelBase {
           !item.findFlag && this.findNum++;
           item.alpha = 1;
           item.findFlag = true;
-          if(this.findNum == 10) globalEvent.emit(GameEvent.NextLevel);
+          if(this.findNum == 10) {
+            this.setPauseCd(true);
+            globalEvent.emit(GameEvent.NextLevel);
+          }
         })
       }
     })

src/pages/GamePage/Level/Level18.ts

@@ -82,6 +82,7 @@ export class Level18 extends LevelBase {
       (c1x < -125 || c1x > 350 || c1y < 595 || c1y > 820)
       && (c2x < -125 || c2x > 350 || c2y < 595 || c2y > 820)
     ) {
+      this.setPauseCd(true);
       this.setTouchEnable(false);
       Tween.get(this.ice).to({ alpha: 0 }, 666, Ease.quadInOut);
       Tween.get(this.ice2).wait(444).to({ alpha: 1 }, 666, Ease.quadInOut);

src/pages/GamePage/Level/Level19.ts

@@ -117,6 +117,7 @@ export class Level19 extends LevelBase {
     // 防止重复触发
     if (this.right.alpha > 0) return;
 
+    this.setPauseCd(true);
     this.setTouchEnable(false);
 
     Tween.get(this.right)

src/pages/GamePage/Level/Level2.ts

@@ -55,6 +55,7 @@ export class Level2 extends LevelBase {
     const wait = 2000;
 
     if (isRight) {
+      this.setPauseCd(true);
       this.right.visible = true;
       this.right.position.set(item.x + dp, item.y + dp);
       Tween.get(this.error)

src/pages/GamePage/Level/Level20.ts

@@ -107,6 +107,7 @@ export class Level20 extends LevelBase {
         && !this.C.interactive
         && !this.qs.interactive
       ) {
+        this.setPauseCd(true);
         Tween.get(this.right)
           .to({ alpha: 1 }, 666, Ease.quadInOut)
           .wait(2000)

src/pages/GamePage/Level/Level21.ts

@@ -71,6 +71,7 @@ export class Level21 extends LevelBase {
       .intersects(new Rectangle(bx + edge, by + edge, bw - edge * 2, bh - edge * 2));
 
     if (isIns) {
+      this.setPauseCd(true);
       this.setTouchEnable(false);
       this.right.position.set(bx - 30, by - 30);
       Tween.get(this.B).to({ alpha: 0 }, 666, Ease.quadInOut);

src/pages/GamePage/Level/Level22.ts

@@ -78,6 +78,7 @@ export class Level22 extends LevelBase {
       (ax < 0 || ax > 425 || ay < 600 || ay > 970)
       && (bx < 80 || bx > 450 || by < 840 || by > 1200)
     ) {
+      this.setPauseCd(true);
       this.setTouchEnable(false);
       Tween.get(this.right)
         .to({ alpha: 1 }, 666, Ease.quadInOut)

src/pages/GamePage/Level/Level23.ts

@@ -48,6 +48,7 @@ export class Level23 extends LevelBase {
     const wait = 2000;
 
     if (isRight) {
+      this.setPauseCd(true);
       this.right.visible = true;
       this.right.position.set(item.x + dp, item.y + dp);
       Tween.get(this.error)

src/pages/GamePage/Level/Level24.ts

@@ -56,7 +56,7 @@ export class Level24 extends LevelBase {
   onBallPointerDown(e) {
     const ball = e.currentTarget as Sprite;
     console.log("开始拖拽球", ball);
-    
+
     this.dragData = {
       ball: ball,
       offset: {
@@ -64,7 +64,7 @@ export class Level24 extends LevelBase {
         y: e.data.global.y - ball.y
       }
     };
-    
+
     // 将当前球置于最上层
     this.setChildIndex(ball, this.children.length - 1);
   }
@@ -90,22 +90,22 @@ export class Level24 extends LevelBase {
   checkMerge(draggedBall: Sprite) {
     for (const ball of this.balls) {
       if (ball === draggedBall) continue;
-      
+
       // 计算两球中心点的距离（由于锚点为默认值，需要加上半径偏移）
       const draggedCenterX = draggedBall.x + (draggedBall.width / 2);
       const draggedCenterY = draggedBall.y + (draggedBall.height / 2);
       const ballCenterX = ball.x + (ball.width / 2);
       const ballCenterY = ball.y + (ball.height / 2);
-      
+
       const distance = this.getDistance(
         { x: draggedCenterX, y: draggedCenterY },
         { x: ballCenterX, y: ballCenterY }
       );
-      
+
       // 计算两球的半径
       const draggedRadius = draggedBall.width / 2;
       const ballRadius = ball.width / 2;
-      
+
       // 如果两球接触（距离小于两球半径之和）
       if (distance < draggedRadius + ballRadius) {
         console.log("球碰撞，开始合成");
@@ -121,53 +121,53 @@ export class Level24 extends LevelBase {
     const ball1CenterY = ball1.y + (ball1.height / 2);
     const ball2CenterX = ball2.x + (ball2.width / 2);
     const ball2CenterY = ball2.y + (ball2.height / 2);
-    
+
     const newCenterX = (ball1CenterX + ball2CenterX) / 2;
     const newCenterY = (ball1CenterY + ball2CenterY) / 2;
-    
+
     // 计算新球的大小（使用更小的增长幅度）
     const scaleIncrease = Math.min(ball1.scale.x, ball2.scale.x) * 0.4; // 增长幅度减小为较小球的30%
     const newScale = Math.min(Math.max(ball1.scale.x, ball2.scale.x) + scaleIncrease, 1.2); // 最大限制调整为1.2
-    
+
     // 移除较小的球，保留较大的球作为合成结果
     const keepBall = ball1.scale.x >= ball2.scale.x ? ball1 : ball2;
     const removeBall = ball1.scale.x >= ball2.scale.x ? ball2 : ball1;
-    
+
     // 从balls数组中移除被合成的球
     const removeIndex = this.balls.indexOf(removeBall);
     if (removeIndex > -1) {
       this.balls.splice(removeIndex, 1);
     }
-    
+
     // 移除被合成的球的事件监听
     removeBall.off("pointerdown", this.onBallPointerDown, this);
     removeBall.off("globalpointermove", this.onBallPointerMove, this);
     removeBall.off("pointerup", this.onBallPointerUp, this);
     removeBall.off("pointerupoutside", this.onBallPointerUp, this);
-    
+
     // 计算新位置（左上角坐标）
     const newSize = 378 * newScale;
     const newX = newCenterX - (newSize / 2);
     const newY = newCenterY - (newSize / 2);
-    
+
     // 播放合成动画
     Tween.get(keepBall)
       .to({ x: newX, y: newY, scaleX: newScale, scaleY: newScale }, 300, Ease.quadOut)
       .call(() => {
         // 移除被合成的球
         this.removeChild(removeBall);
-        
+
         // 检查是否通关
         this.checkWinCondition();
       });
-      
+
     Tween.get(removeBall)
       .to({ alpha: 0, scaleX: 0, scaleY: 0 }, 300, Ease.quadOut);
   }
 
   checkWinCondition() {
     console.log("检查通关条件，剩余球数:", this.balls.length);
-    
+
     // 如果只剩一个球
     if (this.balls.length === 1) {
       console.log("达到通关条件");
@@ -186,19 +186,20 @@ export class Level24 extends LevelBase {
     if (this.right.alpha > 0) return;
 
     console.log("开始通关动画");
+    this.setPauseCd(true);
     this.setTouchEnable(false);
-    
+
     // 获取最后一个球
     const lastBall = this.balls[0];
-    
+
     // 计算屏幕中间位置（假设屏幕尺寸为720x1280）
     const screenCenterX = 360;
     const screenCenterY = 940;
-    
+
     // 计算球移动到屏幕中间时的位置（左上角坐标）
     const ballTargetX = screenCenterX - (lastBall.width / 2);
     const ballTargetY = screenCenterY - (lastBall.height / 2);
-    
+
     // 球移动到屏幕中间的动画
     Tween.get(lastBall)
       .to({ x: ballTargetX, y: ballTargetY }, 600, Ease.quadInOut)
@@ -206,10 +207,10 @@ export class Level24 extends LevelBase {
         // 球到达中间后，计算right的位置（球的右下角）
         const rightX = lastBall.x + lastBall.width - this.right.width + 20; // 稍微偏移一点
         const rightY = lastBall.y + lastBall.height - this.right.height + 20;
-        
+
         // 设置right的位置
         this.right.position.set(rightX, rightY);
-        
+
         // 显示right图标并完成通关
         Tween.get(this.right)
           .to({ alpha: 1 }, 444, Ease.quadInOut)
@@ -222,7 +223,7 @@ export class Level24 extends LevelBase {
 
   onDestroy() {
     super.onDestroy();
-    
+
     // 移除所有球的tween动画
     this.balls.forEach(ball => {
       Tween.removeTweens(ball);
@@ -231,7 +232,7 @@ export class Level24 extends LevelBase {
       ball.off("pointerup", this.onBallPointerUp, this);
       ball.off("pointerupoutside", this.onBallPointerUp, this);
     });
-    
+
     Tween.removeTweens(this.right);
   }
 }

src/pages/GamePage/Level/Level25.ts

@@ -74,19 +74,20 @@ export class Level25 extends LevelBase {
     .to({ alpha: 1 }, 3000)
     .call(() => {
       this.gameOver = true;
-      
+
 
       this.mad.alpha = 0;
       this.redFace.alpha = 0;
       this.wake.alpha = 1;
       this.hideMark.alpha = 0;
+      this.setPauseCd(true);
       Tween.get(this.right)
       .to({ alpha: 1 }, 444, Ease.quadInOut)
       .wait(2000)
       .call(() => {
         globalEvent.emit(GameEvent.NextLevel);
       });
-      
+
     })
 
   }

src/pages/GamePage/Level/Level3.ts

@@ -52,6 +52,7 @@ export class Level3 extends LevelBase {
     const wait = 2000;
 
     if (isRight) {
+      this.setPauseCd(true);
       this.right.visible = true;
       this.right.position.set(item.x + dp, item.y + dp);
       Tween.get(this.error)

src/pages/GamePage/Level/Level4.ts

@@ -53,6 +53,7 @@ export class Level4 extends LevelBase {
     const wait = 2000;
 
     if (isRight) {
+      this.setPauseCd(true);
       this.right.visible = true;
       Tween.get(this.error)
         .wait(wait)

src/pages/GamePage/Level/Level5.ts

@@ -99,6 +99,7 @@ export class Level5 extends LevelBase {
       && ny >= 1000
       && ny <= 1120
     ) {
+      this.setPauseCd(true);
       this.setTouchEnable(false);
       Tween.get(this.A)
         .to({ x: 439, y: 1073 }, 444, Ease.quadInOut)

src/pages/GamePage/Level/Level6.ts

@@ -74,6 +74,7 @@ export class Level6 extends LevelBase {
 
     const { x, y } = this.C;
     if (x >= 80 && x <= 230 && y >= 1030 && y <= 1100) {
+      this.setPauseCd(true);
       this.setTouchEnable(false);
       Tween.get(this.C)
         .to({ x: 129, y: 1049 }, 666, Ease.quadInOut);

src/pages/GamePage/Level/Level7.ts

@@ -33,6 +33,7 @@ export class Level7 extends LevelBase {
   }
 
   passLevel() {
+    this.setPauseCd(true);
     this.setTouchEnable(false);
     getApp().stage.off("pointerdown", this.onPointerDown, this);
     getApp().stage.off("pointerup", this.onPointerUp, this);

src/pages/GamePage/Level/Level8.ts

@@ -53,6 +53,7 @@ export class Level8 extends LevelBase {
     const wait = 2000;
 
     if (isRight) {
+      this.setPauseCd(true);
       this.right.visible = true;
       Tween.get(this.error)
         .wait(wait)

src/pages/GamePage/Level/Level9.ts

@@ -59,6 +59,7 @@ export class Level9 extends LevelBase {
       && ny >= 980
       && ny <= 1100
     ) {
+      this.setPauseCd(true);
       this.setTouchEnable(false);
       Tween.get(this.A)
         .to({ x: 380, y: 975 }, 444, Ease.quadInOut)

src/store/gameStore.ts

@@ -20,6 +20,7 @@ class GameStore {
     levelIdxArr: [],
     countdownSeconds: 180,
     remainTipTimes: 0,
+    cd: 180,
   }
 
   async start() {