@visactor/vrender-animate/es/custom/poptip-animate.js

This module provides a graph-based animation system for VRender.

import { AComponentAnimate } from "./custom-animate";

import { createComponentAnimator } from "../component";

import { InputText } from "./input-text";

import { applyAppearStartAttributes } from "./transient";

export class PoptipAppear extends AComponentAnimate {
    onBind() {
        super.onBind();
        const animator = createComponentAnimator(this.target);
        this._animator = animator;
        const duration = this.duration, easing = this.easing, target = this.target, {wave: wave} = this.params;
        if (applyAppearStartAttributes(target, {
            scaleX: 0,
            scaleY: 0
        }), animator.animate(target, {
            type: "to",
            to: {
                scaleX: 1,
                scaleY: 1
            },
            duration: duration / 3 * 2,
            easing: easing
        }), target.titleShape && animator.animate(target.titleShape, {
            type: "custom",
            to: {
                text: target.titleShape.attribute.text
            },
            duration: duration,
            easing: easing,
            custom: InputText
        }), target.contentShape && animator.animate(target.contentShape, {
            type: "custom",
            to: {
                text: target.contentShape.attribute.text
            },
            duration: duration,
            easing: easing,
            custom: InputText
        }), wave) {
            const dur = duration / 6;
            animator.animate(target.group, {
                timeSlices: [ {
                    duration: dur,
                    effects: {
                        type: "to",
                        to: {
                            angle: wave
                        },
                        easing: easing
                    }
                }, {
                    duration: 2 * dur,
                    effects: {
                        type: "to",
                        to: {
                            angle: -wave
                        },
                        easing: easing
                    }
                }, {
                    duration: 2 * dur,
                    effects: {
                        type: "to",
                        to: {
                            angle: wave
                        },
                        easing: easing
                    }
                }, {
                    duration: dur,
                    effects: {
                        type: "to",
                        to: {
                            angle: 0
                        },
                        easing: easing
                    }
                } ]
            });
        }
        this.completeBind(animator);
    }
}

export class PoptipDisappear extends AComponentAnimate {
    onBind() {
        super.onBind();
        const animator = createComponentAnimator(this.target);
        this._animator = animator;
        const duration = this.duration, easing = this.easing, target = this.target;
        animator.animate(target, {
            type: "to",
            to: {
                scaleX: 0,
                scaleY: 0
            },
            duration: duration,
            easing: easing
        }), this.completeBind(animator);
    }
}
//# sourceMappingURL=poptip-animate.js.map