slot_selfdev_client/assets/SubGame/slotMousebundle/script/MouseAutoView.ts

import { MouseConst } from "./MouseConst";

namespace DFortuneAutoNSpace {
    export const Rounds = [10, 30, 50, 80, 100];
    export const LostArea = [0.5, 1];
    export const WinMuls = 5000;
    export const WinMaxMuls = 500;
    export const Colors = {
        MainNormal: '#FFC824', //主色调 亮色 hand、okbtn、数字选择中等
        MainDisable: '#937835',

        SliderLineBg: '#30303B', //滑动条线的底色
        SliderAreaNormal: '#878787',
        SliderAreaDisable: '#58585D',

        SliderHanderNormal: '#EAB82A',
        SliderHanderDisable: '#947935',

        RoundNormalLab: '#6F6F78',
        RoundHoverLab: '#66583D',

        OkBtnDisable: '#66573D',
        OkBtnLabelDisable: '#837762',
        OkBtnLabelNormal: '#FFF4D8',
    };
}

/**@description 自动界面 */
const { ccclass, property } = cc._decorator;
@ccclass
export default class DFortuneAutoView extends cc.Component {
    @property(cc.Node)
    maskBg: cc.Node = null;
    @property(cc.Node)
    root: cc.Node = null;
    @property(cc.Node)
    content: cc.Node = null;
    @property(cc.Node)
    showCover: cc.Node = null; //弹出时的遮盖

    @property(cc.Button)
    btnClose: cc.Button = null;
    @property(cc.Button)
    btnMore: cc.Button = null;
    @property(cc.Button)
    btnOK: cc.Button = null;

    @property(cc.Node)
    userNode: cc.Node = null;
    @property(cc.Node)
    betNode: cc.Node = null;
    @property(cc.Node)
    winNode: cc.Node = null;

    @property(cc.Node)
    roundNode: cc.Node = null;
    @property(cc.Node)
    loseLimitNode: cc.Node = null;
    @property(cc.Node)
    winLimitNode: cc.Node = null;
    @property(cc.Node)
    maxWinLimitNode: cc.Node = null;

    roundBtns: cc.Button[] = [];
    loseSlider: cc.Slider = null;
    winSlider: cc.Slider = null;
    maxSlider: cc.Slider = null;

    autoData: NSlots.IAutoData = {
        round: 0,
        loseLimit: 0,
        bet: 0
    };

    private _isDisplay: boolean = false;
    private _isCanSlider: boolean = false; //选了局数才行
    private _isCanOk: boolean = false; //选了loselimit才行
    private callback: Function = null;

    /**@description 读取十六进制颜色值 */
    private getColor(hex: string) {
        return (new cc.Color()).fromHEX(hex);
    }

    loseArea: number[] = [0, 0];
    winArea: number[] = [0, 0];
    maxArea: number[] = [0, 0];

    protected onLoad() {
        this.root.opacity = 0;

        this.init();
        this.initColor();
        this.updateMoreUI();
        this.updateOkUI();
        this.updateSlidersNode();

        this.root.height = this.content.height;
        this.root.getComponent(cc.Widget).updateAlignment();

        let dstY = this.root.y;
        this.root.getComponent(cc.Widget).enabled = false;
        this.root.y = this.root.y - this.root.height;

        this.scheduleOnce(() => {
            cc.tween(this.root).set({ opacity: 255 })
                .to(0.25, { y: dstY }, { easing: 'quintOut' })
                .call(() => this.show()).start();

            this.showCover.height = this.content.height;
            this.showCover.active = true;
            this.showCover.opacity = 255;
        }, 0.05);

        this.maskBg.getComponent(cc.Button).interactable = false;
    }

    show() {
        this.maskBg.getComponent(cc.Button).interactable = true;
        cc.tween(this.showCover).to(0.15, { opacity: 0 }).call(() => {
            this.showCover.active = false;
            this.showCover.opacity = 0;
        }).start();
    }

    protected start(): void {
        this.btnClose.node.on('click', this.onBtnClose, this);
        this.maskBg.on('click', this.onBtnClose, this);

        this.btnMore.node.on('click', this.onBtnMore, this);
        this.btnOK.node.on('click', this.onBtnOk, this);

        this.loseSlider.node.on('slide', this.onLoseSlider, this);
        this.winSlider.node.on('slide', this.onWinSlider, this);
        this.maxSlider.node.on('slide', this.onMaxSlider, this);
    }

    protected init() {
        //round
        for (let index = 0; index < 5; index++) {
            let btn = this.roundNode.getChildByName('btnsNode').getChildByName('btn_' + index).getComponent(cc.Button);
            btn.node.getComponentInChildren(cc.Label).string = DFortuneAutoNSpace.Rounds[index] + '';
            this.roundBtns[index] = btn;

            btn.node.on('click', () => this.onBtnRound(btn, index), this);
            btn.node.on(cc.Node.EventType.MOUSE_ENTER, () => this.onMouseRoundBtn(btn, true), this);
            btn.node.on(cc.Node.EventType.MOUSE_LEAVE, () => this.onMouseRoundBtn(btn, false), this);
        }

        this.loseSlider = this.loseLimitNode.getComponentInChildren(cc.Slider);
        this.winSlider = this.winLimitNode.getComponentInChildren(cc.Slider);
        this.maxSlider = this.maxWinLimitNode.getComponentInChildren(cc.Slider);
    }


    //点击局数
    onBtnRound(btn: cc.Button, index: number) {
        this._isCanSlider = true;

        btn.interactable = false;
        this.autoData.round = DFortuneAutoNSpace.Rounds[index];

        this.loseArea[0] = this.autoData.round * DFortuneAutoNSpace.LostArea[0] * this.autoData.bet;
        this.loseArea[1] = this.autoData.round * DFortuneAutoNSpace.LostArea[1] * this.autoData.bet;

        this.roundBtns.forEach((b, idx) => {
            b.interactable = idx != index;
            let cstr = idx == index ? DFortuneAutoNSpace.Colors.MainNormal : DFortuneAutoNSpace.Colors.RoundNormalLab;
            b.node.getChildByName('desc').color = this.getColor(cstr);
        });

        this.updateSlidersNode();
        this._isCanOk && this.onLoseSlider(this.loseSlider);
    }

    //鼠标触摸局数按钮
    onMouseRoundBtn(btn: cc.Button, enter: boolean) {
        if (!btn.interactable) return;
        let cstr = enter ? DFortuneAutoNSpace.Colors.RoundHoverLab : DFortuneAutoNSpace.Colors.RoundNormalLab;
        btn.node.getChildByName('desc').color = this.getColor(cstr);
    }


    protected initColor() {
        this.userNode.getComponentInChildren(cc.Sprite).node.color = this.getColor(DFortuneAutoNSpace.Colors.MainNormal);
        this.betNode.getComponentInChildren(cc.Sprite).node.color = this.getColor(DFortuneAutoNSpace.Colors.MainNormal);
        this.winNode.getComponentInChildren(cc.Sprite).node.color = this.getColor(DFortuneAutoNSpace.Colors.MainNormal);

        this.loseSlider.node.getComponent(cc.ProgressBar).barSprite.node.color = this.getColor(DFortuneAutoNSpace.Colors.MainNormal);
        this.winSlider.node.getComponent(cc.ProgressBar).barSprite.node.color = this.getColor(DFortuneAutoNSpace.Colors.MainNormal);
        this.maxSlider.node.getComponent(cc.ProgressBar).barSprite.node.color = this.getColor(DFortuneAutoNSpace.Colors.MainNormal);

        this.loseSlider.node.getChildByName('Background').color = this.getColor(DFortuneAutoNSpace.Colors.SliderLineBg);
        this.winSlider.node.getChildByName('Background').color = this.getColor(DFortuneAutoNSpace.Colors.SliderLineBg);
        this.maxSlider.node.getChildByName('Background').color = this.getColor(DFortuneAutoNSpace.Colors.SliderLineBg);

        this.loseSlider.node.getComponent(cc.ProgressBar).progress = 0;
        this.winSlider.node.getComponent(cc.ProgressBar).progress = 0;
        this.maxSlider.node.getComponent(cc.ProgressBar).progress = 0;

        this.loseSlider.progress = 0;
        this.winSlider.progress = 0;
        this.maxSlider.progress = 0;

        let btns: cc.Button[] = [];
        btns.push(this.loseSlider.handle);
        btns.push(this.winSlider.handle);
        btns.push(this.maxSlider.handle);

        btns.forEach(b => {
            b.interactable = false;
            b.transition = cc.Button.Transition.COLOR;
            b.normalColor = b.hoverColor = b.pressedColor = this.getColor(DFortuneAutoNSpace.Colors.SliderHanderNormal);
            b.disabledColor = this.getColor(DFortuneAutoNSpace.Colors.SliderHanderDisable);
        });

        this.btnOK.interactable = false;
        this.btnOK.transition = cc.Button.Transition.COLOR;
        this.btnOK.normalColor = this.btnOK.hoverColor = this.btnOK.pressedColor = this.getColor(DFortuneAutoNSpace.Colors.MainNormal);
        this.btnOK.disabledColor = this.getColor(DFortuneAutoNSpace.Colors.OkBtnDisable);

        this.roundBtns.forEach((b, idx) => {
            b.node.getChildByName('desc').color = this.getColor(DFortuneAutoNSpace.Colors.RoundNormalLab);
        });
    }

    /**
     * @description
     * 初始化数据
     */
    public initData(uCoin: number, bet: number, win: number, cb?: Function) {
        this.autoData.bet = bet;
        this.callback = cb;

        this.userNode.getComponentInChildren(cc.Label).string = MouseConst.formatAmount(uCoin);
        this.betNode.getComponentInChildren(cc.Label).string = MouseConst.formatAmount(bet);
        this.winNode.getComponentInChildren(cc.Label).string = MouseConst.formatAmount(win);

        this.winArea[0] = 0;
        this.winArea[1] = DFortuneAutoNSpace.WinMuls * bet;

        this.maxArea[0] = 0;
        this.maxArea[1] = DFortuneAutoNSpace.WinMaxMuls * bet;
    }


    //滑动区域UI
    updateSlidersNode() {
        this.loseSlider.handle.interactable = this._isCanSlider;
        this.winSlider.handle.interactable = this._isCanSlider;
        this.maxSlider.handle.interactable = this._isCanSlider;

        this.loseSlider.enabled = this._isCanSlider;
        this.winSlider.enabled = this._isCanSlider;
        this.maxSlider.enabled = this._isCanSlider;

        let labs: cc.Label[] = [];
        labs.push(...this.loseLimitNode.getComponentsInChildren(cc.Label));
        labs.push(...this.winLimitNode.getComponentsInChildren(cc.Label));
        labs.push(...this.maxWinLimitNode.getComponentsInChildren(cc.Label));

        labs.forEach(l => {
            let cstr = this._isCanSlider ? DFortuneAutoNSpace.Colors.SliderAreaNormal : DFortuneAutoNSpace.Colors.SliderAreaDisable;
            l.node.color = this.getColor(cstr);
        });
        //一个特殊颜色
        this.loseLimitNode.getChildByName('desc_1').color = this.getColor(this._isCanSlider ? DFortuneAutoNSpace.Colors.MainNormal : DFortuneAutoNSpace.Colors.MainDisable);
    }

    //点击更多按钮的UI
    updateMoreUI() {
        this.btnMore.node.getComponentInChildren(cc.Label).string = this._isDisplay ? 'Oculto' : 'Mais';

        this.winLimitNode.opacity = 0;
        this.maxWinLimitNode.opacity = 0;

        this.winLimitNode.active = this._isDisplay;
        this.maxWinLimitNode.active = this._isDisplay;

        this.scheduleOnce(() => {
            this.winLimitNode.opacity = 255;
            this.maxWinLimitNode.opacity = 255;
        }, 0.01);
    }

    //ok按钮
    updateOkUI() {
        if (this.btnOK.interactable) return;
        this.btnOK.interactable = this._isCanOk;
        let cstr = this._isCanOk ? DFortuneAutoNSpace.Colors.OkBtnLabelNormal : DFortuneAutoNSpace.Colors.OkBtnLabelDisable;
        this.btnOK.node.getChildByName('desc').color = this.getColor(cstr);
    }


    onBtnMore() {
        this._isDisplay = !this._isDisplay;
        this.updateMoreUI();
    }

    onBtnOk() {
        this.close();
    }

    onBtnClose() {
        this.autoData = null;
        this.close();
    }

    onLoseSlider(slider: cc.Slider) {
        this._isCanOk = true;
        this.updateOkUI();

        let porocess = Math.round(slider.progress * 100);
        porocess = getNearestEven(porocess) / 100;
        slider.node.getComponent(cc.ProgressBar).progress = slider.progress = porocess;

        let coin = this.loseArea[0] + (this.loseArea[1] - this.loseArea[0]) * porocess;
        let desc = this.loseLimitNode.getChildByName('limit_coin').getComponent(cc.Label);
        desc.string = coin == 0 ? 'Nenhum' : MouseConst.formatAmount(coin);

        this.autoData.loseLimit = coin;
    }
    onWinSlider(slider: cc.Slider) {
        let porocess = Math.round(slider.progress * 100);
        porocess = getNearestEven(porocess) / 100;
        slider.node.getComponent(cc.ProgressBar).progress = slider.progress = porocess;

        let coin = (this.winArea[1] - this.winArea[0]) * porocess;
        let desc = this.winLimitNode.getChildByName('limit_coin').getComponent(cc.Label);
        desc.string = porocess == 0 ? 'Nenhum' : MouseConst.formatAmount(coin);

        this.autoData.winLimit = coin;
    }
    onMaxSlider(slider: cc.Slider) {
        let porocess = Math.round(slider.progress * 100);
        porocess = getNearestEven(porocess) / 100;
        slider.node.getComponent(cc.ProgressBar).progress = slider.progress = porocess;

        let coin = (this.maxArea[1] - this.maxArea[0]) * porocess;
        let desc = this.maxWinLimitNode.getChildByName('limit_coin').getComponent(cc.Label);
        desc.string = porocess == 0 ? 'Nenhum' : MouseConst.formatAmount(coin);

        this.autoData.maxLimit = coin;
    }

    close() {
        cc.tween(this.root)
            .by(0.25, { y: -cc.winSize.height }, { easing: 'quintIn' })
            .call(() => {
                this.node.destroy();
                this?.callback(this.autoData);
                this.callback = null;
            }).start();
    }
}


function getNearestEven(num: number) {
    if (num % 2 === 0) {  // 如果num已经是偶数  
        return num;
    } else {  // 否则，找到更接近的偶数  
        if ((num + 1) % 2 === 0) {
            return num + 1;
        } else {
            return num - 1;
        }
    }
}