@wizdm/animate/esm2015/lib/entrances/flip-in.js

On Scroll Animation for Angular

import { state, animate, style, transition, keyframes } from '@angular/animations';
export const flipIn = [
    state('idle-flipInX', style({ opacity: 0 })),
    state('idle-flipInY', style({ opacity: 0 })),
    transition('* => flipInX', [
        style({ backfaceVisibility: 'visible' }),
        animate('{{timing}} {{delay}} ease-in', keyframes([
            style({
                transform: 'perspective(400px) rotate3d(1, 0, 0, 90deg)',
                opacity: 0,
                offset: 0
            }),
            style({
                transform: ' perspective(400px) rotate3d(1, 0, 0, -20deg)',
                opacity: 1,
                offset: 0.4
            }),
            style({
                transform: 'perspective(400px) rotate3d(1, 0, 0, 10deg)',
                offset: 0.6
            }),
            style({
                transform: 'perspective(400px) rotate3d(1, 0, 0, -5deg)',
                offset: 0.8
            }),
            style({
                transform: 'perspective(400px) rotate3d(1, 0, 0, 0)',
                offset: 1
            })
        ]))
    ], { params: { timing: '1s', delay: '' } }),
    transition('* => flipInY', [
        style({ backfaceVisibility: 'visible' }),
        animate('{{timing}} {{delay}} ease-in', keyframes([
            style({
                transform: 'perspective(400px) rotate3d(0, 1, 0, 90deg)',
                opacity: 0,
                offset: 0
            }),
            style({
                transform: ' perspective(400px) rotate3d(0, 1, 0, -20deg)',
                opacity: 1,
                offset: 0.4
            }),
            style({
                transform: 'perspective(400px) rotate3d(0, 1, 0, 10deg)',
                offset: 0.6
            }),
            style({
                transform: 'perspective(400px) rotate3d(0, 1, 0, -5deg)',
                offset: 0.8
            }),
            style({
                transform: 'perspective(400px) rotate3d(0, 1, 0, 0)',
                offset: 1
            })
        ]))
    ], { params: { timing: '1s', delay: '' } })
];
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmxpcC1pbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2FuaW1hdGUvc3JjL2xpYi9lbnRyYW5jZXMvZmxpcC1pbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsS0FBSyxFQUFFLE9BQU8sRUFBRSxLQUFLLEVBQUUsVUFBVSxFQUFFLFNBQVMsRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBRW5GLE1BQU0sQ0FBQyxNQUFNLE1BQU0sR0FBRztJQUVwQixLQUFLLENBQUMsY0FBYyxFQUFFLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFFO0lBQzdDLEtBQUssQ0FBQyxjQUFjLEVBQUUsS0FBSyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsRUFBRSxDQUFDLENBQUU7SUFFN0MsVUFBVSxDQUFDLGNBQWMsRUFBRTtRQUV6QixLQUFLLENBQUMsRUFBRSxrQkFBa0IsRUFBRSxTQUFTLEVBQUUsQ0FBQztRQUV4QyxPQUFPLENBQUMsOEJBQThCLEVBRXBDLFNBQVMsQ0FBQztZQUNSLEtBQUssQ0FBQztnQkFDSixTQUFTLEVBQUUsNkNBQTZDO2dCQUN4RCxPQUFPLEVBQUUsQ0FBQztnQkFDVixNQUFNLEVBQUUsQ0FBQzthQUNWLENBQUM7WUFDRixLQUFLLENBQUM7Z0JBQ0osU0FBUyxFQUFFLCtDQUErQztnQkFDMUQsT0FBTyxFQUFFLENBQUM7Z0JBQ1YsTUFBTSxFQUFFLEdBQUc7YUFDWixDQUFDO1lBQ0YsS0FBSyxDQUFDO2dCQUNKLFNBQVMsRUFBRSw2Q0FBNkM7Z0JBQ3hELE1BQU0sRUFBRSxHQUFHO2FBQ1osQ0FBQztZQUNGLEtBQUssQ0FBQztnQkFDSixTQUFTLEVBQUUsNkNBQTZDO2dCQUN4RCxNQUFNLEVBQUUsR0FBRzthQUNaLENBQUM7WUFDRixLQUFLLENBQUM7Z0JBQ0osU0FBUyxFQUFFLHlDQUF5QztnQkFDcEQsTUFBTSxFQUFFLENBQUM7YUFDVixDQUFDO1NBQ0gsQ0FBQyxDQUNIO0tBQUMsRUFBRSxFQUFFLE1BQU0sRUFBRSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxFQUFDLENBQzNDO0lBRUQsVUFBVSxDQUFDLGNBQWMsRUFBRTtRQUV6QixLQUFLLENBQUMsRUFBRSxrQkFBa0IsRUFBRSxTQUFTLEVBQUUsQ0FBQztRQUV4QyxPQUFPLENBQUMsOEJBQThCLEVBRXBDLFNBQVMsQ0FBQztZQUNSLEtBQUssQ0FBQztnQkFDSixTQUFTLEVBQUUsNkNBQTZDO2dCQUN4RCxPQUFPLEVBQUUsQ0FBQztnQkFDVixNQUFNLEVBQUUsQ0FBQzthQUNWLENBQUM7WUFDRixLQUFLLENBQUM7Z0JBQ0osU0FBUyxFQUFFLCtDQUErQztnQkFDMUQsT0FBTyxFQUFFLENBQUM7Z0JBQ1YsTUFBTSxFQUFFLEdBQUc7YUFDWixDQUFDO1lBQ0YsS0FBSyxDQUFDO2dCQUNKLFNBQVMsRUFBRSw2Q0FBNkM7Z0JBQ3hELE1BQU0sRUFBRSxHQUFHO2FBQ1osQ0FBQztZQUNGLEtBQUssQ0FBQztnQkFDSixTQUFTLEVBQUUsNkNBQTZDO2dCQUN4RCxNQUFNLEVBQUUsR0FBRzthQUNaLENBQUM7WUFDRixLQUFLLENBQUM7Z0JBQ0osU0FBUyxFQUFFLHlDQUF5QztnQkFDcEQsTUFBTSxFQUFFLENBQUM7YUFDVixDQUFDO1NBQ0gsQ0FBQyxDQUNIO0tBQUMsRUFBRSxFQUFFLE1BQU0sRUFBRSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxFQUFDLENBQzNDO0NBQ0YsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IHN0YXRlLCBhbmltYXRlLCBzdHlsZSwgdHJhbnNpdGlvbiwga2V5ZnJhbWVzIH0gZnJvbSAnQGFuZ3VsYXIvYW5pbWF0aW9ucyc7XHJcblxyXG5leHBvcnQgY29uc3QgZmxpcEluID0gW1xyXG5cclxuICBzdGF0ZSgnaWRsZS1mbGlwSW5YJywgc3R5bGUoeyBvcGFjaXR5OiAwIH0pICksXHJcbiAgc3RhdGUoJ2lkbGUtZmxpcEluWScsIHN0eWxlKHsgb3BhY2l0eTogMCB9KSApLFxyXG5cclxuICB0cmFuc2l0aW9uKCcqID0+IGZsaXBJblgnLCBbXHJcblxyXG4gICAgc3R5bGUoeyBiYWNrZmFjZVZpc2liaWxpdHk6ICd2aXNpYmxlJyB9KSxcclxuXHJcbiAgICBhbmltYXRlKCd7e3RpbWluZ319IHt7ZGVsYXl9fSBlYXNlLWluJywgXHJcblxyXG4gICAgICBrZXlmcmFtZXMoW1xyXG4gICAgICAgIHN0eWxlKHsgXHJcbiAgICAgICAgICB0cmFuc2Zvcm06ICdwZXJzcGVjdGl2ZSg0MDBweCkgcm90YXRlM2QoMSwgMCwgMCwgOTBkZWcpJywgXHJcbiAgICAgICAgICBvcGFjaXR5OiAwLFxyXG4gICAgICAgICAgb2Zmc2V0OiAwIFxyXG4gICAgICAgIH0pLFxyXG4gICAgICAgIHN0eWxlKHsgXHJcbiAgICAgICAgICB0cmFuc2Zvcm06ICcgcGVyc3BlY3RpdmUoNDAwcHgpIHJvdGF0ZTNkKDEsIDAsIDAsIC0yMGRlZyknLCBcclxuICAgICAgICAgIG9wYWNpdHk6IDEsXHJcbiAgICAgICAgICBvZmZzZXQ6IDAuNCBcclxuICAgICAgICB9KSxcclxuICAgICAgICBzdHlsZSh7IFxyXG4gICAgICAgICAgdHJhbnNmb3JtOiAncGVyc3BlY3RpdmUoNDAwcHgpIHJvdGF0ZTNkKDEsIDAsIDAsIDEwZGVnKScsIFxyXG4gICAgICAgICAgb2Zmc2V0OiAwLjYgXHJcbiAgICAgICAgfSksXHJcbiAgICAgICAgc3R5bGUoeyBcclxuICAgICAgICAgIHRyYW5zZm9ybTogJ3BlcnNwZWN0aXZlKDQwMHB4KSByb3RhdGUzZCgxLCAwLCAwLCAtNWRlZyknLCBcclxuICAgICAgICAgIG9mZnNldDogMC44IFxyXG4gICAgICAgIH0pLFxyXG4gICAgICAgIHN0eWxlKHsgXHJcbiAgICAgICAgICB0cmFuc2Zvcm06ICdwZXJzcGVjdGl2ZSg0MDBweCkgcm90YXRlM2QoMSwgMCwgMCwgMCknLCBcclxuICAgICAgICAgIG9mZnNldDogMSBcclxuICAgICAgICB9KVxyXG4gICAgICBdKVxyXG4gICAgKV0sIHsgcGFyYW1zOiB7IHRpbWluZzogJzFzJywgZGVsYXk6ICcnIH19XHJcbiAgKSxcclxuXHJcbiAgdHJhbnNpdGlvbignKiA9PiBmbGlwSW5ZJywgW1xyXG5cclxuICAgIHN0eWxlKHsgYmFja2ZhY2VWaXNpYmlsaXR5OiAndmlzaWJsZScgfSksXHJcblxyXG4gICAgYW5pbWF0ZSgne3t0aW1pbmd9fSB7e2RlbGF5fX0gZWFzZS1pbicsIFxyXG5cclxuICAgICAga2V5ZnJhbWVzKFtcclxuICAgICAgICBzdHlsZSh7IFxyXG4gICAgICAgICAgdHJhbnNmb3JtOiAncGVyc3BlY3RpdmUoNDAwcHgpIHJvdGF0ZTNkKDAsIDEsIDAsIDkwZGVnKScsXHJcbiAgICAgICAgICBvcGFjaXR5OiAwLFxyXG4gICAgICAgICAgb2Zmc2V0OiAwIFxyXG4gICAgICAgIH0pLFxyXG4gICAgICAgIHN0eWxlKHsgXHJcbiAgICAgICAgICB0cmFuc2Zvcm06ICcgcGVyc3BlY3RpdmUoNDAwcHgpIHJvdGF0ZTNkKDAsIDEsIDAsIC0yMGRlZyknLFxyXG4gICAgICAgICAgb3BhY2l0eTogMSxcclxuICAgICAgICAgIG9mZnNldDogMC40IFxyXG4gICAgICAgIH0pLFxyXG4gICAgICAgIHN0eWxlKHsgXHJcbiAgICAgICAgICB0cmFuc2Zvcm06ICdwZXJzcGVjdGl2ZSg0MDBweCkgcm90YXRlM2QoMCwgMSwgMCwgMTBkZWcpJywgXHJcbiAgICAgICAgICBvZmZzZXQ6IDAuNiBcclxuICAgICAgICB9KSxcclxuICAgICAgICBzdHlsZSh7IFxyXG4gICAgICAgICAgdHJhbnNmb3JtOiAncGVyc3BlY3RpdmUoNDAwcHgpIHJvdGF0ZTNkKDAsIDEsIDAsIC01ZGVnKScsIFxyXG4gICAgICAgICAgb2Zmc2V0OiAwLjggXHJcbiAgICAgICAgfSksXHJcbiAgICAgICAgc3R5bGUoeyBcclxuICAgICAgICAgIHRyYW5zZm9ybTogJ3BlcnNwZWN0aXZlKDQwMHB4KSByb3RhdGUzZCgwLCAxLCAwLCAwKScsIFxyXG4gICAgICAgICAgb2Zmc2V0OiAxIFxyXG4gICAgICAgIH0pXHJcbiAgICAgIF0pXHJcbiAgICApXSwgeyBwYXJhbXM6IHsgdGltaW5nOiAnMXMnLCBkZWxheTogJycgfX1cclxuICApXHJcbl07Il19