import { eventTarget, PLAY_ROLLING_SOUND } from "../Events";

const { ccclass, property } = cc._decorator;

@ccclass
export default class StartScreen extends cc.Component {
    @property(cc.Node)
    private selectBtnNode: cc.Node = null;
    @property(cc.AudioClip)
    private backgroundMusic: cc.AudioClip = null;
    @property(cc.AudioSource)
    private rollingSound: cc.AudioSource = null;

    private _text: cc.Node = null;
    private _loading: cc.Node = null;
    private _btn: cc.Button = null;

    protected onLoad(): void {
        this.selectBtnNode.on('click', this.onSelectBtnClick, this);

        this._btn = this.selectBtnNode.getComponent(cc.Button);
        [this._text, this._loading] = this.selectBtnNode.children;
        this._loading.active = false;

        cc.director.preloadScene('main');

        if (!cc.audioEngine.isMusicPlaying()) {
            cc.audioEngine.playMusic(this.backgroundMusic, true);
        }
        eventTarget.on(PLAY_ROLLING_SOUND, this.playRollingSound, this);
    }

    private playRollingSound() {
        this.rollingSound.play();
    }

    private onSelectBtnClick() {
        this._text.active = false;
        this._loading.active = true;
        this._btn.interactable = false;

        cc.tween(this._loading)
            .repeatForever(cc.tween(this._loading).by(0.5, { angle: 90 }))
            .start();

        this.selectBtnNode
        cc.director.loadScene('main');
    }
}
