ngx-animations
Version:
An adaptation of Animate.css using @angular/animations
50 lines • 5.83 kB
JavaScript
import { __awaiter } from "tslib";
import { Directive, Input, ElementRef } from '@angular/core';
import { AnimationsService } from '../services/animations.service';
import { timer } from 'rxjs';
export class AnimatedDirective {
constructor(el, _animationsService) {
this.el = el;
this._animationsService = _animationsService;
this.time = 300;
this.animation = 'fadeIn';
}
set animAted(options) {
if (options) {
this.time = options.time || this.time;
this.animation = options.animation || this.animation;
}
}
animate(options) {
let player;
if (options !== undefined) {
player = this.createPlayer(options.animation || this.animation, options.time || this.time);
}
else {
player = this.createPlayer(this.animation, this.time);
}
player.play();
player.onDone(() => __awaiter(this, void 0, void 0, function* () {
const time = options !== undefined ? options.time || this.time : this.time;
yield timer(time).toPromise();
player.reset();
}));
}
createPlayer(animation, time) {
return this._animationsService.create(this._animationsService.animations[animation](time), this.el.nativeElement);
}
}
AnimatedDirective.decorators = [
{ type: Directive, args: [{
selector: '[animAted]',
exportAs: 'animated'
},] }
];
AnimatedDirective.ctorParameters = () => [
{ type: ElementRef },
{ type: AnimationsService }
];
AnimatedDirective.propDecorators = {
animAted: [{ type: Input }]
};
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW5pbWF0ZWQuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6Ii4uLy4uLy4uLy4uLy4uL2xpYnMvbmd4LWFuaW1hdGlvbnMvc3JjLyIsInNvdXJjZXMiOlsibGliL2RpcmVjdGl2ZXMvYW5pbWF0ZWQuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDN0QsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZ0NBQWdDLENBQUM7QUFDbkUsT0FBTyxFQUFFLEtBQUssRUFBRSxNQUFNLE1BQU0sQ0FBQztBQU03QixNQUFNLE9BQU8saUJBQWlCO0lBVTVCLFlBQ1UsRUFBYyxFQUNkLGtCQUFxQztRQURyQyxPQUFFLEdBQUYsRUFBRSxDQUFZO1FBQ2QsdUJBQWtCLEdBQWxCLGtCQUFrQixDQUFtQjtRQUwvQyxTQUFJLEdBQUcsR0FBRyxDQUFDO1FBQ1gsY0FBUyxHQUFHLFFBQVEsQ0FBQztJQUtsQixDQUFDO0lBWkosSUFBYSxRQUFRLENBQUMsT0FBOEI7UUFDbEQsSUFBSSxPQUFPLEVBQUU7WUFDWCxJQUFJLENBQUMsSUFBSSxHQUFHLE9BQU8sQ0FBQyxJQUFJLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQztZQUN0QyxJQUFJLENBQUMsU0FBUyxHQUFHLE9BQU8sQ0FBQyxTQUFTLElBQUksSUFBSSxDQUFDLFNBQVMsQ0FBQztTQUN0RDtJQUNILENBQUM7SUFTTSxPQUFPLENBQUMsT0FBK0I7UUFDNUMsSUFBSSxNQUFNLENBQUM7UUFDWCxJQUFJLE9BQU8sS0FBSyxTQUFTLEVBQUU7WUFDekIsTUFBTSxHQUFHLElBQUksQ0FBQyxZQUFZLENBQ3hCLE9BQU8sQ0FBQyxTQUFTLElBQUksSUFBSSxDQUFDLFNBQVMsRUFDbkMsT0FBTyxDQUFDLElBQUksSUFBSSxJQUFJLENBQUMsSUFBSSxDQUMxQixDQUFDO1NBQ0g7YUFBTTtZQUNMLE1BQU0sR0FBRyxJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxTQUFTLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1NBQ3ZEO1FBQ0QsTUFBTSxDQUFDLElBQUksRUFBRSxDQUFDO1FBQ2QsTUFBTSxDQUFDLE1BQU0sQ0FBQyxHQUFTLEVBQUU7WUFDdkIsTUFBTSxJQUFJLEdBQ1IsT0FBTyxLQUFLLFNBQVMsQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDLElBQUksSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDO1lBQ2hFLE1BQU0sS0FBSyxDQUFDLElBQUksQ0FBQyxDQUFDLFNBQVMsRUFBRSxDQUFDO1lBQzlCLE1BQU0sQ0FBQyxLQUFLLEVBQUUsQ0FBQztRQUNqQixDQUFDLENBQUEsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVPLFlBQVksQ0FBQyxTQUFpQixFQUFFLElBQVk7UUFDbEQsT0FBTyxJQUFJLENBQUMsa0JBQWtCLENBQUMsTUFBTSxDQUNuQyxJQUFJLENBQUMsa0JBQWtCLENBQUMsVUFBVSxDQUFDLFNBQVMsQ0FBQyxDQUFDLElBQUksQ0FBQyxFQUNuRCxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FDdEIsQ0FBQztJQUNKLENBQUM7OztZQTNDRixTQUFTLFNBQUM7Z0JBQ1QsUUFBUSxFQUFFLFlBQVk7Z0JBQ3RCLFFBQVEsRUFBRSxVQUFVO2FBQ3JCOzs7WUFQMEIsVUFBVTtZQUM1QixpQkFBaUI7Ozt1QkFRdkIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgSW5wdXQsIEVsZW1lbnRSZWYgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQW5pbWF0aW9uc1NlcnZpY2UgfSBmcm9tICcuLi9zZXJ2aWNlcy9hbmltYXRpb25zLnNlcnZpY2UnO1xyXG5pbXBvcnQgeyB0aW1lciB9IGZyb20gJ3J4anMnO1xyXG5cclxuQERpcmVjdGl2ZSh7XHJcbiAgc2VsZWN0b3I6ICdbYW5pbUF0ZWRdJyxcclxuICBleHBvcnRBczogJ2FuaW1hdGVkJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgQW5pbWF0ZWREaXJlY3RpdmUge1xyXG4gIEBJbnB1dCgpIHNldCBhbmltQXRlZChvcHRpb25zOiB7IGFuaW1hdGlvbj87IHRpbWU/IH0pIHtcclxuICAgIGlmIChvcHRpb25zKSB7XHJcbiAgICAgIHRoaXMudGltZSA9IG9wdGlvbnMudGltZSB8fCB0aGlzLnRpbWU7XHJcbiAgICAgIHRoaXMuYW5pbWF0aW9uID0gb3B0aW9ucy5hbmltYXRpb24gfHwgdGhpcy5hbmltYXRpb247XHJcbiAgICB9XHJcbiAgfVxyXG4gIHRpbWUgPSAzMDA7XHJcbiAgYW5pbWF0aW9uID0gJ2ZhZGVJbic7XHJcblxyXG4gIGNvbnN0cnVjdG9yKFxyXG4gICAgcHJpdmF0ZSBlbDogRWxlbWVudFJlZixcclxuICAgIHByaXZhdGUgX2FuaW1hdGlvbnNTZXJ2aWNlOiBBbmltYXRpb25zU2VydmljZVxyXG4gICkge31cclxuXHJcbiAgcHVibGljIGFuaW1hdGUob3B0aW9ucz86IHsgYW5pbWF0aW9uPzsgdGltZT8gfSkge1xyXG4gICAgbGV0IHBsYXllcjtcclxuICAgIGlmIChvcHRpb25zICE9PSB1bmRlZmluZWQpIHtcclxuICAgICAgcGxheWVyID0gdGhpcy5jcmVhdGVQbGF5ZXIoXHJcbiAgICAgICAgb3B0aW9ucy5hbmltYXRpb24gfHwgdGhpcy5hbmltYXRpb24sXHJcbiAgICAgICAgb3B0aW9ucy50aW1lIHx8IHRoaXMudGltZVxyXG4gICAgICApO1xyXG4gICAgfSBlbHNlIHtcclxuICAgICAgcGxheWVyID0gdGhpcy5jcmVhdGVQbGF5ZXIodGhpcy5hbmltYXRpb24sIHRoaXMudGltZSk7XHJcbiAgICB9XHJcbiAgICBwbGF5ZXIucGxheSgpO1xyXG4gICAgcGxheWVyLm9uRG9uZShhc3luYyAoKSA9PiB7XHJcbiAgICAgIGNvbnN0IHRpbWUgPVxyXG4gICAgICAgIG9wdGlvbnMgIT09IHVuZGVmaW5lZCA/IG9wdGlvbnMudGltZSB8fCB0aGlzLnRpbWUgOiB0aGlzLnRpbWU7XHJcbiAgICAgIGF3YWl0IHRpbWVyKHRpbWUpLnRvUHJvbWlzZSgpO1xyXG4gICAgICBwbGF5ZXIucmVzZXQoKTtcclxuICAgIH0pO1xyXG4gIH1cclxuXHJcbiAgcHJpdmF0ZSBjcmVhdGVQbGF5ZXIoYW5pbWF0aW9uOiBzdHJpbmcsIHRpbWU6IG51bWJlcikge1xyXG4gICAgcmV0dXJuIHRoaXMuX2FuaW1hdGlvbnNTZXJ2aWNlLmNyZWF0ZShcclxuICAgICAgdGhpcy5fYW5pbWF0aW9uc1NlcnZpY2UuYW5pbWF0aW9uc1thbmltYXRpb25dKHRpbWUpLFxyXG4gICAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnRcclxuICAgICk7XHJcbiAgfVxyXG59XHJcbiJdfQ==