| 
					
				 | 
			
			
				@@ -1,4 +1,5 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 import global_model from "./global_model"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 const { ccclass, property } = cc._decorator; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 @ccclass 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -8,66 +9,53 @@ export default class how_to_play_game extends cc.Component { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     @property([cc.Node]) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     showTiles: cc.Node[] = []; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    oldPos: any[] = []; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    oldPos: any = []; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     @property(cc.Node) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     node_ui: cc.Node = null; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     start() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        // 初始化节点相关属性 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.initializeNodeAttributes(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        // 根据全局模型中所选关卡等级决定是否展示帮助界面并进行相应操作 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.handleLevelBasedUI(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.initializeUI(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.initializeTiles(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.checkLevelAndPlayHelp(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 初始化节点的属性,如缩放、透明度等,并记录初始位置 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    private initializeNodeAttributes(): void { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    initializeUI() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.node_ui.scale = 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.node.opacity = 255; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.node_ui.opacity = 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    initializeTiles() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.oldPos[0] = this.showTiles[0].position; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.oldPos[1] = this.showTiles[1].position; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.oldPos[2] = this.showTiles[2].position; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 根据全局模型中所选关卡等级来处理UI的显示与相关操作 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    private handleLevelBasedUI(): void { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        if (global_model.game.selectedLevel === 1) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            // 展示帮助界面相关节点并执行帮助动画 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            this.showHelpUIAndAnimate(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    checkLevelAndPlayHelp() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        if (global_model.game.selectedLevel == 1) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            this.showHelpUI(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             this.playHelp(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         } else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            // 隐藏当前节点 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            this.hideNode(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            this.deactivateNode(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 展示帮助界面相关节点,设置其属性并启动动画 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    private showHelpUIAndAnimate(): void { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        cc.tween(this.node_ui) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .to(0.25, { scale: 1, opacity: 255 }, { easing: 'sineOut' }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    showHelpUI() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        cc.tween(this.node_ui).to(0.25, { scale: 1, opacity: 255 }, { easing: 'sineOut' }).start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 隐藏当前节点 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    private hideNode(): void { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    deactivateNode() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.node.active = false; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     playHelp() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        // 重置展示瓦片的缩放和位置 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.resetShowTilesAttributes(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        // 对每个展示瓦片分别设置动画延迟和移动目标位置并启动动画 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.animateShowTiles(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        // 在最后一个展示瓦片动画完成后执行后续操作 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.handleShowTilesFinalAnimation(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.resetTiles(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.animateTiles(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 重置展示瓦片的缩放为1,并设置回初始位置 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    private resetShowTilesAttributes(): void { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    resetTiles() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.showTiles[0].scale = 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.showTiles[1].scale = 1; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.showTiles[2].scale = 1; 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -77,44 +65,28 @@ export default class how_to_play_game extends cc.Component { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         this.showTiles[2].position = this.oldPos[2]; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 对每个展示瓦片分别设置动画延迟和移动目标位置并启动动画 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    private animateShowTiles(): void { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        cc.tween(this.showTiles[0]) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .delay(0.9) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .to(0.5, { x: -173.907, y: -231 }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        cc.tween(this.showTiles[1]) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .delay(1.3) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .to(0.5, { x: -86.697, y: -231 }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        cc.tween(this.showTiles[2]) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .delay(1.7) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .to(0.5, { x: 1.942, y: -231 }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    animateTiles() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        cc.tween(this.showTiles[0]).delay(0.9).to(0.5, { x: -173.907, y: -231 }).start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        cc.tween(this.showTiles[1]).delay(1.3).to(0.5, { x: -86.697, y: -231 }).start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        cc.tween(this.showTiles[2]).delay(1.7).to(0.5, { x: 1.942, y: -231 }).delay(0.1).call(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            this.shrinkTiles(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            this.repeatHelpAnimation(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }).start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    // 在最后一个展示瓦片动画完成后执行后续操作,如隐藏展示瓦片并再次执行相关逻辑(非递归) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    private handleShowTilesFinalAnimation(): void { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        cc.tween(this.showTiles[0]) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .to(0.2, { scale: 0 }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        cc.tween(this.showTiles[1]) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .to(0.2, { scale: 0 }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        cc.tween(this.showTiles[2]) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .to(0.2, { scale: 0 }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .delay(0.8) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .call(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-                // 这里不再递归调用playHelp,而是执行其他逻辑,比如重新展示UI等(这里暂未添加具体逻辑) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            .start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    shrinkTiles() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        cc.tween(this.showTiles[0]).to(0.2, { scale: 0 }).start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        cc.tween(this.showTiles[1]).to(0.2, { scale: 0 }).start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        cc.tween(this.showTiles[2]).to(0.2, { scale: 0 }).start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    repeatHelpAnimation() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        cc.tween(this.showTiles[2]).delay(0.8).call(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            this.playHelp(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }).start(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     close(): void { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.hideNode(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.node.active = false; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 |