import { _decorator, Component, Node, sp, tween } from 'cc';
import { BattleSpinePlayback } from 'db://assets/script/battle/presentation/BattleSpinePlayback';
const { ccclass, property } = _decorator;

@ccclass('Calendar')
export class Calendar extends Component {

    ui_bgMask: Node;
    ui_anim: sp.Skeleton;

    protected onLoad(): void {
        this.ui_bgMask = this.node.getChildByName("ui_bgMask");
        this.ui_anim = this.node.getChildByName("ui_anim").getComponent(sp.Skeleton);
    }

    protected onEnable(): void {
        this.ui_bgMask.opacity = 0;
        this.ui_anim.node.active = false;
    }

    /**
     * 
     * @param type 
     * @param callback 
     */
    showType(type = 1, callback: Function = null) {
        tween(this.ui_bgMask).set({ opacity: 0 }).to(0.3, { opacity: 220 })
            .call(() => {
                this.ui_anim.node.active = true;
                const animName = this.getAnim(type);
                BattleSpinePlayback.play(this.ui_anim, animName, {
                    loop: false,
                    onComplete: () => {
                        this.ui_anim.node.active = false;
                        tween(this.ui_bgMask).to(1.5, { opacity: 0 }).call(() => {
                            this.node.active = false;
                            if (callback) {
                                callback();
                            }
                        }).start();
                    },
                });
            }).start();
    }

    getAnim(type) {
        switch (type) {
            case 0: return "5-8";
            case 1: return "1-4";
            case 2: return "4-8";
            default: return "8-12";
        }
    }
}