Success Panel Effect!

mock/miniTb/babycare.getGameInfo.json

 {
     "code": "000000",
     "data": {
-        "currentLevel": 11,
+        "currentLevel": 1,
         "visitors": [
             {
                 "activityId": "5f08084ec3ad3494b9201c0e",

src/SkinJson.ts

@@ -55,7 +55,7 @@ export const SkinJson = {
                 {
                     "name": "继续闯关小",
                     "x": 381,
-                    "y": 955,
+                    "y": 935,
                     "alpha": 1,
                     "type": "button",
                     "props": {
@@ -66,7 +66,7 @@ export const SkinJson = {
                 {
                     "name": "闯关成功不满星按钮",
                     "x": 91,
-                    "y": 955,
+                    "y": 935,
                     "alpha": 1,
                     "type": "button",
                     "props": {

src/Tools.ts

@@ -5,6 +5,10 @@ import DisplayObject = FYGE.DisplayObject;
 import Ease = FYGE.Ease;
 import { sendTbNet, TbNetName } from "./TaoBaoNet";
 import { PropType } from "./something/enum/PropType";
+import { showPanel } from "../module/ctrls";
+import { FailedPanel } from "./panels/FailedPanel";
+import { SuccessPrizePanel } from "./panels/SuccessPrizePanel";
+import { SuccessNoPrizePanel } from "./panels/SuccessNoPrizePanel";
 
 /**
  * 定制，记录一些全局量和方法
@@ -89,7 +93,7 @@ export class Tools {
      */
     public static getGameInfo() {
         return new Promise((r) => {
-            sendTbNet(TbNetName.getGameInfo, (s, res) => {
+            sendTbNet(TbNetName.getGameInfo, {},(s, res) => {
                 if (s) this.gameData = res.data;
                 r(s);
             })
@@ -114,6 +118,16 @@ export class Tools {
         })
     }
 
+    public static gameOver(data) {
+        if (!data.isVisitSuccess) {   // 闯关失败
+            showPanel(FailedPanel, data);
+        } else if (data.prize || data.tool) {  // 闯关成功，奖励关卡
+            showPanel(SuccessPrizePanel, data);
+        } else {    // 闯关成功，不是奖励关卡
+            showPanel(SuccessNoPrizePanel, data);
+        }
+    }
+
     /**
      * 兑换道具，根据返回参数判断
      */

src/panels/FailedPanel.ts

 import { Panel } from "../../module/views/Panel";
+import { Tools } from "../Tools";
+import TEXT_ALIGN = FYGE.TEXT_ALIGN;
+import MouseEvent = FYGE.MouseEvent;
+import { changeScene } from "../../module/ctrls";
+import { MapScene } from "../scene/map/MapScene";
+
 export class FailedPanel extends Panel {
-	get groupNames() { return ["FailedPanel"] }
-	get skinName() { return "FailedPanel" }
-	againBtn:FYGE.Button;
-	closeBtn:FYGE.Button;
-	tipsTex:FYGE.TextField;
-	checkTex:FYGE.TextField;
+    get groupNames() {
+        return ["FailedPanel"]
+    }
+
+    get skinName() {
+        return "FailedPanel"
+    }
+
+    againBtn: FYGE.Button;
+    closeBtn: FYGE.Button;
+    tipsTex: FYGE.TextField;
+    checkTex: FYGE.TextField;
 
     initUi() {
+        this.checkTex.text = `第 ${this.data.level} 关`;
+        this.checkTex.textAlign = TEXT_ALIGN.CENTER;
+        this.checkTex.x = 2;
+        this.checkTex.textWidth = 750;
 
+        const curLevel: number = Tools.gameData.currentLevel;
+        let upLevel: number = 120;
+        let dLevel: number = 120;
+        Tools.baseInfo.prizeLevels.forEach((value, index) => {
+            const d: number = value - curLevel;
+            if (curLevel <= value && d >= 0 && d <= dLevel) {
+                upLevel = value;
+                dLevel = d + 1;
+            }
+        });
+        this.tipsTex.text = `   再接再厉！\n再解锁${dLevel}关可参与抽奖`;
+        this.tipsTex.textAlign = TEXT_ALIGN.CENTER;
+        this.tipsTex.textWidth = 750;
+        this.tipsTex.x = 0;
     }
+
     start(data) {
         super.start();
     }
+
+    public hidePanel() {
+        changeScene(MapScene, {level: this.data.level + 1});
+        super.hidePanel();
+    }
+
     initEvents() {
         super.initEvents();
+        this.againBtn.addEventListener(MouseEvent.CLICK, this.hidePanel, this);
     }
+
     removeEvents() {
         super.removeEvents();
+        this.againBtn.removeEventListener(MouseEvent.CLICK, this.hidePanel, this);
     }
 }

src/panels/RulePanel.ts

@@ -24,7 +24,7 @@ export class RulePanel extends Panel {
     start(data) {
         super.start();
 
-        const rule = '1、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。\\n\\r2、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。\\r\\r3、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。\\r\\r4、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。1、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。\\n\\r2、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。\\r\\r3、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。\\r\\r4、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。1、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。\\n\\r2、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。\\r\\r3、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。\\r\\r4、这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案，这里是活动规则文案。'
+        const rule = Tools.baseInfo.rule;
         this.ruleTex = this.addChild(Tools.getText(
             rule, 26, '#892a1a',
             FYGE.TEXT_ALIGN.LEFT, 570

src/panels/StartPanel.ts

@@ -9,6 +9,7 @@ import { changeScene } from "../../module/ctrls";
 import { PlayScene } from "../scene/PlayScene";
 import Tween = FYGE.Tween;
 import Ease = FYGE.Ease;
+import { sendTbNet, TbNetName } from "../TaoBaoNet";
 
 export class StartPanel extends Panel {
     get groupNames() {
@@ -43,13 +44,12 @@ export class StartPanel extends Panel {
         this.checkTex.x = 0;
         this.checkTex.text = `第 ${this.data.level} 关`;
 
-        this.startBtn.visible = !this.data.isPlayed;
-        this.startBtn2.visible = this.data.isPlayed;
+        this.startBtn.visible = (this.data.stars < 3);
+        this.startBtn2.visible = (this.data.stars >= 3);
+        this.tipsTex.visible = (this.data.stars < 3);
 
         this.addChild(new StartTarget(this.data.level))
             .position.set(0, 682);
-
-        this.tipsTex.visible = this.data.stars < 3;
     }
 
     start(data) {
@@ -57,7 +57,13 @@ export class StartPanel extends Panel {
     }
 
     private startGame() {
+        sendTbNet(TbNetName.dojoin, {level: this.data.level},
+            (success, res) => {
+                if (!success) return;
+                Tools.gameData.power = res.data.power;
                 changeScene(PlayScene, {chapter: this.data.level});
+            }
+        );
         this.hidePanel();
     }
 

src/panels/StartPanelPrize.ts

@@ -8,8 +8,8 @@ import Tween = FYGE.Tween;
 import Ease = FYGE.Ease;
 import Sprite = FYGE.Sprite;
 import Texture = FYGE.Texture;
-import { Tool } from "../something/Tool";
 import { Tools } from "../Tools";
+import { sendTbNet, TbNetName } from "../TaoBaoNet";
 
 export class StartPanelPrize extends Panel {
     get groupNames() {
@@ -45,8 +45,8 @@ export class StartPanelPrize extends Panel {
         this.checkTex.x = 0;
         this.checkTex.text = `第 ${this.data.level} 关`;
 
-        this.startBtn.visible = !this.data.isPlayed;
-        this.startBtn2.visible = this.data.isPlayed;
+        this.startBtn.visible = (this.data.stars < 3);
+        this.startBtn2.visible = (this.data.stars >= 3);
 
         this.addChild(new StartTarget(this.data.level))
             .position.set(0, 682);
@@ -61,7 +61,13 @@ export class StartPanelPrize extends Panel {
     }
 
     private startGame() {
+        sendTbNet(TbNetName.dojoin, {level: this.data.level},
+            (success, res) => {
+                if (!success) return;
+                Tools.gameData.power = res.data.power;
                 changeScene(PlayScene, {chapter: this.data.level});
+            }
+        );
         this.hidePanel();
     }
 

src/panels/SuccessNoPrizePanel.ts

@@ -8,6 +8,7 @@ import Ease = FYGE.Ease;
 import FrameAni = FYGE.FrameAni;
 import Texture = FYGE.Texture;
 import { RES } from "../../module/RES";
+import MouseEvent = FYGE.MouseEvent;
 
 export class SuccessNoPrizePanel extends Panel {
     get groupNames() {
@@ -42,6 +43,7 @@ export class SuccessNoPrizePanel extends Panel {
     private starGroup: SuccessStarGroup = null;
 
     initUi() {
+        this.checkTex.text = `第 ${this.data.level} 关`;
         this.checkTex.textWidth = 750;
         this.checkTex.x = 0;
         this.checkTex.textAlign = TEXT_ALIGN.CENTER;
@@ -53,7 +55,14 @@ export class SuccessNoPrizePanel extends Panel {
 
         this.lightEffect();
 
-        this.starGroup.play(3);
+        this.starGroup.play(this.data.stars);
+
+        if (this.data.stars >= 3) {
+            this.againBtn.visible = false;
+            this.continueBtn.visible = false;
+        } else {
+            this.totalContinueBtn.visible = false;
+        }
     }
 
     private lightEffect() {
@@ -71,10 +80,30 @@ export class SuccessNoPrizePanel extends Panel {
 
     initEvents() {
         super.initEvents();
+        this.againBtn.addEventListener(MouseEvent.CLICK, this.again, this);
+        this.continueBtn.addEventListener(MouseEvent.CLICK, this.continue, this);
+        this.totalContinueBtn.addEventListener(MouseEvent.CLICK, this.continue, this);
+    }
+
+    /**
+     * 挑战满星
+     */
+    private again() {
+
+    }
+
+    /**
+     * 继续闯关
+     */
+    private continue() {
+
     }
 
     removeEvents() {
         super.removeEvents();
+        this.againBtn.removeEventListener(MouseEvent.CLICK, this.again, this);
+        this.continueBtn.removeEventListener(MouseEvent.CLICK, this.continue, this);
+        this.totalContinueBtn.removeEventListener(MouseEvent.CLICK, this.continue, this);
     }
 }
 

src/panels/SuccessPrizePanel.ts

@@ -38,6 +38,7 @@ export class SuccessPrizePanel extends Panel {
     private starGroup: SuccessStarGroup = null;
 
     initUi() {
+        this.checkTex.text = `第 ${this.data.level} 关`;
         this.checkTex.textWidth = 750;
         this.checkTex.x = 0;
         this.checkTex.textAlign = TEXT_ALIGN.CENTER;
@@ -56,6 +57,7 @@ export class SuccessPrizePanel extends Panel {
         Tween.get(this.light1, {loop: true})
             .set({anchorX: 219.5, anchorY: 219.5})
             .to({rotation: 360}, 12000);
+
         Tween.get(this.light2, {loop: true})
             .set({anchorX: 219.5, anchorY: 219.5})
             .to({rotation: -360}, 12000);

src/scene/map/MapScene.ts

@@ -6,12 +6,13 @@ import MapMid from "./MapMid";
 import CheckBtn, { CHECK_TYPE } from "./CheckBtn";
 import { layers } from "../../../module/views/layers";
 import { Tools } from "../../Tools";
-import { getTbData, sendTbNet, TbNetName } from "../../TaoBaoNet";
 import ScrollPage = FYGE.ScrollPage;
 import Container = FYGE.Container;
 import Graphics = FYGE.Graphics;
 import Sprite = FYGE.Sprite;
 import Texture = FYGE.Texture;
+import Tween = FYGE.Tween;
+import Ease = FYGE.Ease;
 
 export class MapScene extends Scene {
     private mapContainer: Container = null;
@@ -21,7 +22,7 @@ export class MapScene extends Scene {
 
     public destroy() {
         super.destroy();
-        MapScene.checkArr = [];
+        // MapScene.checkArr = [];
     }
 
     private uiLayer: MapUI = null;
@@ -53,10 +54,13 @@ export class MapScene extends Scene {
     }
 
     private updateMapCheck() {
-        if (this.data.from == 'loading') {
+        if (this.data && this.data.from == 'loading') {
             this.initMapByData(Tools.gameData);
+            if (Tools.gameData.isFristLogin) {
+                this.initGuide();
+            }
         } else {
-            Tools.getIndex().then((success) => {
+            Tools.getGameInfo().then((success) => {
                 if (success) {
                     this.initMapByData(Tools.gameData);
                 }
@@ -64,6 +68,54 @@ export class MapScene extends Scene {
         }
     }
 
+    private initGuide() {
+        Tools.gameData.isFristLogin = false;
+
+        const guide = this.addChild(new Container());
+        const g = guide.addChild(new Graphics());
+        g.beginFill(0, 0.6);
+        g.drawRect(0, 0, layers.stageWidth, layers.stageHeight);
+        g.endFill();
+        const guide_check = guide.addChild(new CheckBtn({check: 1}));
+        guide_check.enabled = true;
+        guide_check.type = CHECK_TYPE.CUR;
+        guide_check.position.set(MapScene.checkArr[1].x, layers.stageHeight - 162);
+        guide_check.addChild(new MapAvatar());
+
+        const guide_hand = guide.addChild(Tools.getSprite('guide_hand.png'));
+        guide_hand.position.set(guide_check.x + 90, guide_check.y + 40);
+        guide_hand.mouseEnable = guide_hand.mouseChildren = false;
+
+        const guide_light = guide.addChild(Tools.getSprite('guide_light.png'));
+        guide_light.anchorTexture.set(0.5, 0.5);
+        guide_light.position.set(guide_check.x + 95, guide_check.y + 45);
+        guide_light.mouseEnable = guide_light.mouseChildren = false;
+
+        const guide_fox = guide.addChild(Tools.getSprite('guide_fox.png'));
+        guide_fox.position.set(45, guide_check.y - 200);
+        guide_fox.alpha = 0;
+
+        const guide_tip = guide.addChild(Tools.getSprite('guide_tip.png'));
+        guide_tip.anchorTexture.set(0, 0.3);
+        guide_tip.position.set(guide_fox.x + 215, guide_fox.y - 70);
+        guide_tip.scale.set(0, 0);
+
+        guide.alpha = 0;
+
+        Tween.get(guide)
+            .to({alpha: 1}, 600, Ease.quadInOut);
+
+        Tween.get(guide_fox)
+            .wait(300)
+            .to({y: guide_check.y - 345, alpha: 1}, 300, Ease.quadInOut)
+            .wait(100)
+            .call(() => {
+                Tween.get(guide_tip)
+                    .to({scaleX: 1, scaleY: 1}, 300, Ease.quadInOut);
+            });
+
+    }
+
     private initMapByData(data) {
         this.uiLayer.energyBox.count = data.power;
 
@@ -100,7 +152,10 @@ export class MapScene extends Scene {
             MapScene.checkArr[v.level].isPrize = true;
         });
 
-        this.scrollToCheck(currentLevel);
+        this.scrollToCheck(this.data.level
+            ? this.data.level
+            : currentLevel
+        );
     }
 
     public initMap() {
@@ -152,6 +207,14 @@ export class MapScene extends Scene {
 
     public start(data?: any) {
         super.start(data);
+
+        // Tools.gameOver({
+        //     level: 1,
+        //     score: 666,
+        //     stars: 0,
+        //     isVisitSuccess: false,
+        //     isPrizeLevel: false,
+        // });
     }
 
     public initEvents() {

src/scene/map/MapUI.ts

@@ -118,7 +118,6 @@ class EnergyBox extends Container {
     }
 
     private clickAdd() {
-        /// TODO 增加按钮
         console.log('增加按钮');
         showPanel(BuyPowerPanel);
     }