Tìm hiểu về các Easing Functions: Áp dụng (#3)

private giveEffect(): Promise<void>
    {
        const createGiveUpgradeEffect = () => {
            const effect =instantiate(this.item_effectUpgrade);
            effect.parent = this.upgradeEffectParent;
            effect.position = Vec3.ZERO;
        }

        return new Promise((resolve) => {
            // Tạo vfx truyền năng lượng
            createGiveUpgradeEffect();
            
            // Làm mờ dần item 2
            tween(this.targetAccessory)
                .to(1.2, {opacity: 0})
            .start();

            const expand = new Vec3(1.1, 1.1, 1.1);

            // Tạo hiệu ứng nhấp nháy của item 1
            tween(this.currentAccessory.node)
                .to(0.1, {scale: expand}, {easing: 'sineIn'})
                .to(0.2, {scale: Vec3.ONE}, {easing: 'sineOut'})
                .union()
                .repeat(6)
                .call(() => resolve(null))
            .start();
        });
    }

    private currentMoveCenter(): Promise<void>
    {
        // Di chuyển item vào giữa
        return new Promise((resolve) => {
            tween(this.currentAccessory.node)
                .delay(0.5)
                .to(0.75, {position: Vec3.ZERO}, {easing: 'elasticOut'})
                .call(() => resolve(null))
            .start();
        });
    }

private hideCurrentAttached():  Promise<void>
    {
        return new Promise((resolve) => {

            const duration = 0.2;

            tween(this.currentEffectLevelNode)
                .to(duration, {opacity: 0})
            .start();

            tween(this.currentEffectStarNode)
                .to(duration, {opacity: 0})
            .start();
            
            tween(this.currentEffectValueNode)
                .to(duration, {opacity: 0})
                .delay(0.2)
                .call(() => resolve(null))
            .start();
        });
    }

    private changeFrame():  Promise<void>
    {
        const targetScale = Vec3.ZERO;
        
        this.newAccessory.active = false;
        this.newAccessory.scale = targetScale;
        this.newAccessoryEffectNode.scale = Vec3.ZERO;
        
        this.afterUpgradeNameNode.node.worldPosition = this.prepareUpgradeNameNode.worldPosition.clone();

        return new Promise((resolve) => {
            // Tụ lực
            tween(this.currentAccessory.node)
                .to(0.2, {scale: targetScale})
                .call(() => {this.prepareUpgradePanel.active = false})
            .start();

            // Bùng nổ item sau khi tụ lực đồng thời bật lại các component đã được đổi thông tin
            tween(this.newAccessory)
                .delay(0.2)
                .call(() => {
                    this.afterUpgradeNameNode.node.active = true;
                    this.upgradePanel.active = true;
                    this.newAccessory.active = true;
                })
                .to(0.5, {scale: Vec3.ONE}, {easing: 'elasticOut'})
            .start();

            // Bật hiệu ứng ánh sáng phía sau để chúc mừng hoàn thành.
            tween(this.newAccessoryEffectNode)
                .delay(0.5)
                .call(() => {this.newAccessoryEffectNode.active = true;})
                .to(0.7, {scale: Vec3.ONE}, {easing: 'elasticOut'})
                .call(() => resolve(null))
            .start();
        });
    }