pinball/assets/_Game/Scripts/Gacha/FlipCard.ts

import { _decorator, AudioClip, Component, Label, Node, Sprite } from 'cc';
import GachaBase from '../Base/GachaBase';
import SpineAnimationHandler from '../Base/SpineAnimationHandler';
import AudioManager from '../Manager/AudioManager';
import GachaManager from '../Manager/GachaManager';

const { ccclass, property } = _decorator;

@ccclass('FlipCard')
export default class FlipCard extends GachaBase {
    @property(SpineAnimationHandler)
    private animationHandler: SpineAnimationHandler;
    @property(Node)
    private spineRoot: Node;
    @property(Sprite)
    private cards: Sprite[] = [];
    @property(AudioClip)
    private showSfx: AudioClip;
    @property(AudioClip)
    private selectCardSfx: AudioClip;
    @property(AudioClip)
    private openCardSfx: AudioClip;

    private _opened: boolean = false;

    protected onLoad(): void {
        this.animationHandler.setListener((_, e) => {
            switch (e.data.name) {
                case 'card1-active':
                    this.cards[0].setNodeActive(true);
                    AudioManager.playSfx(this.openCardSfx);
                    break;
                case 'card2-active':
                    this.cards[1].setNodeActive(true);
                    AudioManager.playSfx(this.openCardSfx);
                    break;
                case 'card3-active':
                    this.cards[2].setNodeActive(true);
                    AudioManager.playSfx(this.openCardSfx);
                    break;
                case 'card4-active':
                    this.cards[3].setNodeActive(true);
                    AudioManager.playSfx(this.openCardSfx);
                    break;
            }
        });
    }

    protected onEnable(): void {
        this._opened = false;
        this.cards.forEach((card) => card.setNodeActive(false));
        this.spineRoot.setActive(false);
    }

    public async show(): Promise<void> {
        this.spineRoot.setActive(true);
        this.animationHandler.clearTracks();
        AudioManager.playSfx(this.showSfx);
        await this.animationHandler.setAnimationAsync('appear');
        this.animationHandler.addAnimation('idle', { loop: true });
    }

    public async open(event: Event, value: string) {
        if (this._opened) return;
        this._opened = true;
        if (this.cards[+value - 1].node.active) return;
        const reward = await GachaManager.instance.getReward();
        if (reward) {
            AudioManager.playSfx(this.selectCardSfx);
            this.cards[+value - 1].spriteFrame = reward.icon;
            this.cards[+value - 1].getComponentInChildren(Label).string = 'x' + reward.quantity.toString();
            await this.animationHandler.setAnimationAsync(`card${value}-active`, { trackIndex: +value });
            const pos = this.cards[+value - 1].node.worldPosition.clone();
            pos.y += 150;
            GachaManager.instance.showFloatingText(reward.quantity.toString(), pos, reward.icon);
            GachaManager.instance.gachaDone();
            return;
        }

        GachaManager.instance.gachaDone();
    }
}