squidGame/tgx-games-client/assets/module_arean/level2/Script/CircularButton.ts

import { _decorator, Component, ProgressBar, Sprite, Vec3, tween, Color, Animation, Label, Node, UITransform, director, assetManager, instantiate, Prefab, TweenSystem } from 'cc';
import { resLoader } from 'db://assets/core_tgx/base/utils/ResLoader';
import { tgxUIAlert } from 'db://assets/core_tgx/tgx';
import { ModuleDef } from 'db://assets/scripts/ModuleDef';
import { AreanNetMgr } from '../../scripts/AreanNetMgr';
const { ccclass, property } = _decorator;

@ccclass('CircularButton')
export class CircularButton extends Component {
    @property({ type: ProgressBar })
    progressBar: ProgressBar = null!; // 圆形进度条

    @property({ type: Sprite })
    buttonSprite: Sprite = null!; // 按钮精灵


    @property({ type: Label })
    text: Label = null!;

    @property({ type: Node })
    ropeNode: Node = null!;

    @property({ type: Node })
    bubble1: Node = null!;
    @property({ type: Node })
    bubble2: Node = null!;
    @property({ type: Node })
    winorlose: Node = null!;

    @property({ type: Sprite })
    red: Sprite = null!;
    @property({ type: Sprite })
    blue: Sprite = null!;

    @property({ type: Label })
    redScoreLabel: Label = null!;
    @property({ type: Label })
    blueScoreLabel: Label = null!;

    hasClick: boolean = false;
    canClick: boolean = false;

    progressTime: number = 3; // 进度增长时长
    resetDelay: number = 0.5; // 进度条归零延迟时间
    turn: number = 0; // 

    redScore: number = 0;
    blueScore: number = 0;

    gameover: boolean = false;

    private score: number = 0; // 积分



    @property(Node)
    guiNode: Node = null;

    start() {
        // 初始化按钮状态
        this.setButtonDark();

        // 开始进度条增长动画
        this.startProgressAnimation();
    }

    onButtonClick() {
        if (this.canClick && !this.hasClick) {

            this.redScore += 2;
            this.hasClick = true;
            this.getComponent(Animation)?.play("redSuccess");


        } else {
            this.text.string = "Don't worry";
            this.redScore -= 1;
        }
    }

    changeGameScene() {
        director.loadScene("BallScene");
    }




    setButtonDark() {
        // 将按钮设为变暗状态
        this.buttonSprite.node.getComponent(Sprite)!.color = new Color(35, 35, 35);
        this.text.string = "Hode on";
    }

    setButtonLight() {
        // 将按钮设为变亮状态
        this.buttonSprite.node.getComponent(Sprite)!.color = new Color(255, 66, 66);
        this.text.string = "Click it";

    }

    refreshScore() {


        tween(this.red.node.getComponent(UITransform))
            .to(0.5, { width: this.redScore * 3 })
            .start();


        tween(this.blue.node.getComponent(UITransform))
            .to(0.5, { width: this.blueScore * 3 })
            .start();

        this.redScoreLabel.string = this.redScore + "";
        this.blueScoreLabel.string = this.blueScore + "";


        const newPosition = new Vec3(this.ropeNode.position.x - this.score / 10, this.ropeNode.position.y, this.ropeNode.position.z);
        tween(this.ropeNode)
            .to(0.3, { position: newPosition })
            .start();


        if (this.ropeNode.position.x < -3.5) {
            // this.winorlose.active = true;
            // this.winorlose.getChildByName("Label")!.getComponent(Label)!.string = "己方获胜";

            resLoader.load(ModuleDef.Arean, 'common/prefabs/settlement', (err: Error | null, prefab: Prefab) => {
                if (!err && prefab) {
                    const n = instantiate(prefab);
                    this.guiNode.addChild(n);
                    n.getComponent(Animation).play("showWin");

                }
            });

            this.showGameOver(true);
        }
        else if (this.ropeNode.position.x > 3.5) {
            // this.winorlose.active = true;
            // this.winorlose.getChildByName("Label")!.getComponent(Label)!.string = "对手获胜";

            resLoader.load(ModuleDef.Arean, 'common/prefabs/settlement', (err: Error | null, prefab: Prefab) => {
                if (!err && prefab) {
                    const n = instantiate(prefab);
                    this.guiNode.addChild(n);
                    n.getComponent(Animation).play("showLose");

                }
            });
            this.showGameOver(false);
        }
    }

    showGameOver(isWin: boolean) {
        this.gameover = true;
        this.scheduleOnce(() => {
            resLoader.load(ModuleDef.Arean, 'common/prefabs/settlement', (err: Error | null, prefab: Prefab) => {
                if (!err && prefab) {
                    const n = instantiate(prefab);
                    this.guiNode.addChild(n);
                    n.getComponent(Animation).play("showSettlement");

                    // Lives从16滚动到8
                    const livesLabel = n.getChildByPath("settlementNode/Node/lives").getComponent(Label);
                    let lives = { value: 10 };
                    tween(lives)
                        .to(1, { value: 5 })
                        .call(() => {
                            livesLabel.string = Math.floor(lives.value).toString();
                        })
                        .start();

                    // Money从400w滚动到480w 
                    const moneyLabel = n.getChildByPath("settlementNode/Node/money").getComponent(Label);
                    let money = { value: 446 };
                    tween(money)
                        .to(1, { value: 451 }, {
                            easing: 'linear',
                            onUpdate: () => {
                                moneyLabel.string = Math.floor(money.value) + "w";
                            }
                        })
                        .start();

                    n.getChildByPath("settlementNode/btnOK/label").getComponent(Label).string = isWin ? "NEXT" : "QUIT";
                    n.getChildByPath("settlementNode/btnOK").on(Node.EventType.TOUCH_START, () => {

                        if (isWin) {
                            director.loadScene("level3/scene/BallScene");

                        }
                        else {
                            director.loadScene("lobby_arean");
                        }

                    });
                }
            });
        }, 3);
    }




    switchScene() {
        console.log("switchScene");
        tween(this.node).delay(5).call(() => {
            var bundle = assetManager.getBundle('level3');
            if (bundle) {
                director.loadScene("scene/BallScene");
            } else {
                assetManager.loadBundle("level3", () => {
                    director.loadScene("scene/BallScene");
                })
            }
        }).start();
    }

    onClickBtnQuit() {
        tgxUIAlert.show(`是否确认退出 ? `, true).onClick(async b => {
            if (b) {
                AreanNetMgr.inst.sendMsg_exit();
            }
        });
    }


    startProgressAnimation() {


        if (this.gameover) return;
        this.setButtonDark();
        this.progressBar.progress = 0;
        this.newTurn();
        // 开始新的动画
        tween(this.progressBar)
            .to(this.progressTime, { progress: 1 }) // 设置进度条的目标进度
            .call(() => {
                // 如果按钮变亮，重新设为变暗状态
                this.setButtonLight();

                this.hasClick = false;
                this.progressBar.progress = 0;
                this.canClick = true;

                this.AiScoreChange();
                // 等待一段时间后归零进度条
                tween(this.progressBar)
                    .to(this.resetDelay, { progress: 1 }) // 设置进度条的目标进度
                    .call(() => {
                        this.canClick = false;
                        this.progressBar.progress = 0;
                        this.refreshScore();
                        this.startProgressAnimation();
                    })
                    .start();
            })
            .start();
    }

    newTurn() {
        this.turn++;
        this.progressTime = Math.max(1.5, 3 - this.turn * 0.1); // 进度增长时长
        this.resetDelay = Math.max(0.2, 1 - this.turn * 0.03); // 进度条归零延迟时间
    }




    AiScoreChange() {
        const textArray1 = [
            "I'm out of strength, I can't go on...",
            "It's hopeless, we're...",
            "It's over, really over...",
            "No hope, it's irreparable...",
            "I don't want to die yet!"
        ];

        const textArray2 = [
            "We still have a glimmer of hope",
            "We must persevere to the end",
            "There's still a chance to turn things around",
            "Think of your family! Don't give up so easily!",
            "Don't give up hope!"
        ];

        const textArray3 = [
            "Can you feel it? They're trembling",
            "The opponents are already sending signals of surrender",
            "Looks like we need to start preparing to celebrate our victory",
        ];

        let rndText1 = [""];
        let rndText2 = [""];


        let randomIndex = 0;

        let rnd1 = getRandomNumber(Math.max(-2, 4 - this.turn * 0.5), 4)
        this.redScore += rnd1;
        let rnd2 = getRandomNumber(Math.max(-2, 5 - this.turn * 0.5), 5)
        this.blueScore += rnd2;
        this.score = this.redScore - this.blueScore;


        let rndString = "";

        let rnd = getRandomNumber(0, 1);
        if (this.ropeNode.position.x < -2) {
            if (rnd == 0) {
                rndText1 = textArray3;
                this.redScore += 1;
            }
            else {
                rndText2 = textArray1;
                this.blueScore -= 1;
            }

        } else if (this.ropeNode.position.x > 2) {
            if (rnd == 0) {
                rndText2 = textArray3;
                this.blueScore += 1;
            }
            else {
                rndText1 = textArray1;
                this.redScore -= 1;
            }
        }
        else if (this.ropeNode.position.x <= -0.5) {
            rndText2 = textArray2;
            this.blueScore += 1;
        }
        else if (this.ropeNode.position.x >= 0.5) {
            rndText1 = textArray2;
            this.redScore += 1;
        }




        randomIndex = Math.floor(Math.random() * rndText1.length);
        rndString = rndText1[randomIndex];
        this.bubble1.getComponent(Animation)?.play("bubble");
        this.bubble1.getChildByName("Label")!.getComponent(Label)!.string = rndString;



        randomIndex = Math.floor(Math.random() * rndText2.length);
        rndString = rndText2[randomIndex];
        this.bubble2.getComponent(Animation)?.play("bubble");
        this.bubble2.getChildByName("Label")!.getComponent(Label)!.string = rndString;


    }


}

function getRandomNumber(min: number, max: number) {
    // 使用 Math.random() 生成0到1之间的随机数，并将其映射到指定范围
    return Math.floor(Math.random() * (max - min + 1)) + min;
}