const { ccclass, property } = cc._decorator;

@ccclass
export default class GachaBallDropSquash extends cc.Component {
    @property
    autoPlay: boolean = true;

    @property
    dropOffsetY: number = 900;

    @property
    firstBounceHeight: number = 120;

    @property
    secondBounceHeight: number = 55;

    @property
    thirdBounceHeight: number = 18;

    @property
    bounceTimeScale: number = 0.5;

    @property
    squashDelay: number = 0.2;

    @property
    squashDuration: number = 0.2;

    @property
    finalScaleX: number = 1.28;

    @property
    finalScaleY: number = 0.62;

    private baseX: number = 0;
    private baseY: number = 0;
    private baseScaleX: number = 1;
    private baseScaleY: number = 1;

    onLoad() {
        this.baseX = this.node.x;
        this.baseY = this.node.y;
        this.baseScaleX = this.node.scaleX;
        this.baseScaleY = this.node.scaleY;

        if (this.autoPlay) {
            this.playDropSquash();
        }
    }

    playDropSquash(onComplete?: Function) {
        this.node.stopAllActions();
        this.node.setPosition(this.baseX, this.baseY + this.dropOffsetY);
        this.node.scaleX = this.baseScaleX;
        this.node.scaleY = this.baseScaleY;

        cc.tween(this.node)
            .to(0.42 * this.bounceTimeScale, { y: this.baseY, scaleX: this.baseScaleX * 0.94, scaleY: this.baseScaleY * 1.08 }, { easing: "quadIn" })
            .to(0.08 * this.bounceTimeScale, { scaleX: this.baseScaleX * 1.18, scaleY: this.baseScaleY * 0.82 }, { easing: "sineOut" })
            .to(0.18 * this.bounceTimeScale, { y: this.baseY + this.firstBounceHeight, scaleX: this.baseScaleX * 0.9, scaleY: this.baseScaleY * 1.1 }, { easing: "quadOut" })
            .to(0.2 * this.bounceTimeScale, { y: this.baseY, scaleX: this.baseScaleX * 1.12, scaleY: this.baseScaleY * 0.88 }, { easing: "quadIn" })
            .to(0.14 * this.bounceTimeScale, { y: this.baseY + this.secondBounceHeight, scaleX: this.baseScaleX * 0.96, scaleY: this.baseScaleY * 1.04 }, { easing: "quadOut" })
            .to(0.16 * this.bounceTimeScale, { y: this.baseY, scaleX: this.baseScaleX * 1.07, scaleY: this.baseScaleY * 0.93 }, { easing: "quadIn" })
            .to(0.1 * this.bounceTimeScale, { y: this.baseY + this.thirdBounceHeight, scaleX: this.baseScaleX * 0.98, scaleY: this.baseScaleY * 1.02 }, { easing: "quadOut" })
            .to(0.12 * this.bounceTimeScale, { y: this.baseY, scaleX: this.baseScaleX, scaleY: this.baseScaleY }, { easing: "quadIn" })
            .delay(this.squashDelay)
            .to(this.squashDuration, { scaleX: this.baseScaleX * this.finalScaleX, scaleY: this.baseScaleY * this.finalScaleY }, { easing: "linear" })
            .call(() => {
                if (onComplete) {
                    onComplete();
                }
            })
            .start();
    }

    onDestroy() {
        this.node.stopAllActions();
    }
}