@alauda-fe/common
Version:
Alauda frontend team common codes.
92 lines • 10.8 kB
JavaScript
import { __decorate, __metadata } from "tslib";
import { ThemeService } from '@alauda/ui';
import { Directive, ElementRef, EventEmitter, Input, Output, } from '@angular/core';
import lottie from 'lottie-web';
import { Observable, combineLatest, Subject, takeUntil } from 'rxjs';
import { ObservableInput, ValueHook } from '../../../core/public-api';
import ANIM_DATA from './animation-data';
import { replaceLottieColorsByTheme } from './replace-lottie-colors';
import * as i0 from "@angular/core";
import * as i1 from "@alauda/ui";
export class NavLottieIconDirective {
constructor(hostEl, theme) {
this.hostEl = hostEl;
this.theme = theme;
this.aniInit = new EventEmitter();
this.destroy$$ = new Subject();
}
ngOnInit() {
combineLatest([this.animDataKey$, this.animData$, this.theme.currentTheme$])
.pipe(takeUntil(this.destroy$$))
.subscribe(([key, _data, theme]) => {
const data = _data || ANIM_DATA[key];
if (!data) {
return;
}
const animationData = replaceLottieColorsByTheme(theme, data);
this.aniIns?.destroy();
this.aniIns = lottie.loadAnimation({
container: this.hostEl.nativeElement,
renderer: 'svg',
loop: false,
autoplay: false,
...this.aniConfig,
animationData,
});
this.aniInit.emit(this.aniIns);
this.jumpFrame();
});
}
jumpFrame(frame = this.frame) {
if (!this.aniIns || (!frame && frame !== 0)) {
return;
}
if (frame === -1 || frame >= this.aniIns.totalFrames) {
this.aniIns.goToAndStop(this.aniIns.totalFrames - 1, true);
}
else {
this.aniIns.goToAndStop(frame);
}
}
ngOnDestroy() {
this.aniIns?.destroy();
this.destroy$$.next();
this.destroy$$.complete();
}
static { this.ɵfac = function NavLottieIconDirective_Factory(t) { return new (t || NavLottieIconDirective)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i1.ThemeService)); }; }
static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: NavLottieIconDirective, selectors: [["", "aclNavLottieIcon", ""], ["acl-nav-lottie-icon"]], inputs: { animData: "animData", animDataKey: "animDataKey", aniConfig: "aniConfig", frame: "frame" }, outputs: { aniInit: "aniInit" }, standalone: true }); }
}
__decorate([
ObservableInput(),
__metadata("design:type", Observable)
], NavLottieIconDirective.prototype, "animData$", void 0);
__decorate([
ObservableInput(),
__metadata("design:type", Observable)
], NavLottieIconDirective.prototype, "animDataKey$", void 0);
__decorate([
ValueHook(function (frame) {
this.jumpFrame(frame);
}),
__metadata("design:type", Number)
], NavLottieIconDirective.prototype, "frame", void 0);
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NavLottieIconDirective, [{
type: Directive,
args: [{
selector: '[aclNavLottieIcon],acl-nav-lottie-icon',
standalone: true,
}]
}], () => [{ type: i0.ElementRef }, { type: i1.ThemeService }], { animData: [{
type: Input
}], animData$: [], animDataKey: [{
type: Input
}], animDataKey$: [], aniConfig: [{
type: Input
}],
// 设定Lottie当前帧，一旦设定或改变该值将立即跳转至该指定帧并停止动效。如果是-1则为最后一帧。
frame: [{
type: Input
}], aniInit: [{
type: Output
}] }); })();
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG90dGllLWljb24uZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21tb24vc3JjL3BhZ2Utc2NhZmZvbGQvbmF2aWdhdGlvbi9sb3R0aWUtaWNvbnMvbG90dGllLWljb24uZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sWUFBWSxDQUFDO0FBQzFDLE9BQU8sRUFDTCxTQUFTLEVBQ1QsVUFBVSxFQUNWLFlBQVksRUFDWixLQUFLLEVBR0wsTUFBTSxHQUNQLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sTUFBa0QsTUFBTSxZQUFZLENBQUM7QUFDNUUsT0FBTyxFQUFFLFVBQVUsRUFBRSxhQUFhLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUVyRSxPQUFPLEVBQUUsZUFBZSxFQUFFLFNBQVMsRUFBRSxNQUFNLDBCQUEwQixDQUFDO0FBRXRFLE9BQU8sU0FBUyxNQUFNLGtCQUFrQixDQUFDO0FBQ3pDLE9BQU8sRUFBRSwwQkFBMEIsRUFBRSxNQUFNLHlCQUF5QixDQUFDOzs7QUFNckUsTUFBTSxPQUFPLHNCQUFzQjtJQWdDakMsWUFDUyxNQUFrQixFQUNsQixLQUFtQjtRQURuQixXQUFNLEdBQU4sTUFBTSxDQUFZO1FBQ2xCLFVBQUssR0FBTCxLQUFLLENBQWM7UUFONUIsWUFBTyxHQUFHLElBQUksWUFBWSxFQUFpQixDQUFDO1FBRTNCLGNBQVMsR0FBRyxJQUFJLE9BQU8sRUFBUSxDQUFDO0lBSzlDLENBQUM7SUFFSixRQUFRO1FBQ04sYUFBYSxDQUFDLENBQUMsSUFBSSxDQUFDLFlBQVksRUFBRSxJQUFJLENBQUMsU0FBUyxFQUFFLElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxDQUFDLENBQUM7YUFDekUsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLENBQUM7YUFDL0IsU0FBUyxDQUFDLENBQUMsQ0FBQyxHQUFHLEVBQUUsS0FBSyxFQUFFLEtBQUssQ0FBQyxFQUFFLEVBQUU7WUFDakMsTUFBTSxJQUFJLEdBQUcsS0FBSyxJQUFJLFNBQVMsQ0FBQyxHQUFHLENBQUMsQ0FBQztZQUNyQyxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUM7Z0JBQ1YsT0FBTztZQUNULENBQUM7WUFDRCxNQUFNLGFBQWEsR0FBRywwQkFBMEIsQ0FBQyxLQUFLLEVBQUUsSUFBSSxDQUFDLENBQUM7WUFDOUQsSUFBSSxDQUFDLE1BQU0sRUFBRSxPQUFPLEVBQUUsQ0FBQztZQUN2QixJQUFJLENBQUMsTUFBTSxHQUFHLE1BQU0sQ0FBQyxhQUFhLENBQUM7Z0JBQ2pDLFNBQVMsRUFBRSxJQUFJLENBQUMsTUFBTSxDQUFDLGFBQWE7Z0JBQ3BDLFFBQVEsRUFBRSxLQUFLO2dCQUNmLElBQUksRUFBRSxLQUFLO2dCQUNYLFFBQVEsRUFBRSxLQUFLO2dCQUNmLEdBQUcsSUFBSSxDQUFDLFNBQVM7Z0JBQ2pCLGFBQWE7YUFDZCxDQUFDLENBQUM7WUFDSCxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUM7WUFDL0IsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDO1FBQ25CLENBQUMsQ0FBQyxDQUFDO0lBQ1AsQ0FBQztJQUVELFNBQVMsQ0FBQyxRQUFnQixJQUFJLENBQUMsS0FBSztRQUNsQyxJQUFJLENBQUMsSUFBSSxDQUFDLE1BQU0sSUFBSSxDQUFDLENBQUMsS0FBSyxJQUFJLEtBQUssS0FBSyxDQUFDLENBQUMsRUFBRSxDQUFDO1lBQzVDLE9BQU87UUFDVCxDQUFDO1FBQ0QsSUFBSSxLQUFLLEtBQUssQ0FBQyxDQUFDLElBQUksS0FBSyxJQUFJLElBQUksQ0FBQyxNQUFNLENBQUMsV0FBVyxFQUFFLENBQUM7WUFDckQsSUFBSSxDQUFDLE1BQU0sQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxXQUFXLEdBQUcsQ0FBQyxFQUFFLElBQUksQ0FBQyxDQUFDO1FBQzdELENBQUM7YUFBTSxDQUFDO1lBQ04sSUFBSSxDQUFDLE1BQU0sQ0FBQyxXQUFXLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDakMsQ0FBQztJQUNILENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxDQUFDLE1BQU0sRUFBRSxPQUFPLEVBQUUsQ0FBQztRQUN2QixJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksRUFBRSxDQUFDO1FBQ3RCLElBQUksQ0FBQyxTQUFTLENBQUMsUUFBUSxFQUFFLENBQUM7SUFDNUIsQ0FBQzt1RkEzRVUsc0JBQXNCO29FQUF0QixzQkFBc0I7O0FBUWpDO0lBREMsZUFBZSxFQUFFOzhCQUNOLFVBQVU7eURBQVU7QUFPaEM7SUFEQyxlQUFlLEVBQUU7OEJBQ0gsVUFBVTs0REFBUztBQVVsQztJQUxDLFNBQVMsQ0FBQyxVQUF3QyxLQUFjO1FBQy9ELElBQUksQ0FBQyxTQUFTLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDeEIsQ0FBQyxDQUFDOztxREFHYTtpRkF6Qkosc0JBQXNCO2NBSmxDLFNBQVM7ZUFBQztnQkFDVCxRQUFRLEVBQUUsd0NBQXdDO2dCQUNsRCxVQUFVLEVBQUUsSUFBSTthQUNqQjtzRUFNQyxRQUFRO2tCQURQLEtBQUs7WUFJTixTQUFTLE1BSVQsV0FBVztrQkFEVixLQUFLO1lBSU4sWUFBWSxNQUdaLFNBQVM7a0JBRFIsS0FBSzs7SUFPTixvREFBb0Q7SUFDcEQsS0FBSztrQkFGSixLQUFLO1lBS04sT0FBTztrQkFETixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgVGhlbWVTZXJ2aWNlIH0gZnJvbSAnQGFsYXVkYS91aSc7XG5pbXBvcnQge1xuICBEaXJlY3RpdmUsXG4gIEVsZW1lbnRSZWYsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE9uRGVzdHJveSxcbiAgT25Jbml0LFxuICBPdXRwdXQsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IGxvdHRpZSwgeyBBbmltYXRpb25Db25maWdXaXRoRGF0YSwgQW5pbWF0aW9uSXRlbSB9IGZyb20gJ2xvdHRpZS13ZWInO1xuaW1wb3J0IHsgT2JzZXJ2YWJsZSwgY29tYmluZUxhdGVzdCwgU3ViamVjdCwgdGFrZVVudGlsIH0gZnJvbSAncnhqcyc7XG5cbmltcG9ydCB7IE9ic2VydmFibGVJbnB1dCwgVmFsdWVIb29rIH0gZnJvbSAnLi4vLi4vLi4vY29yZS9wdWJsaWMtYXBpJztcblxuaW1wb3J0IEFOSU1fREFUQSBmcm9tICcuL2FuaW1hdGlvbi1kYXRhJztcbmltcG9ydCB7IHJlcGxhY2VMb3R0aWVDb2xvcnNCeVRoZW1lIH0gZnJvbSAnLi9yZXBsYWNlLWxvdHRpZS1jb2xvcnMnO1xuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbYWNsTmF2TG90dGllSWNvbl0sYWNsLW5hdi1sb3R0aWUtaWNvbicsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG59KVxuZXhwb3J0IGNsYXNzIE5hdkxvdHRpZUljb25EaXJlY3RpdmUgaW1wbGVtZW50cyBPbkluaXQsIE9uRGVzdHJveSB7XG4gIGFuaUluczogQW5pbWF0aW9uSXRlbTtcblxuICAvLyBhbmltRGF0YSDlkowgYW5pbURhdGFLZXkg5LqM6YCJ5LiA5Y2z5Y+v77yM5ZCM5pe25a2Y5Zyo5pe2IGFuaW1EYXRhIOS8mOWFiOe6p+abtOmrmFxuICBASW5wdXQoKVxuICBhbmltRGF0YTogdW5rbm93bjtcblxuICBAT2JzZXJ2YWJsZUlucHV0KClcbiAgYW5pbURhdGEkITogT2JzZXJ2YWJsZTx1bmtub3duPjtcblxuICAvLyDlj6/ku6XlnKggLi9hbmltYXRpb24tZGF0YSDkuK3mib7liLDlrprkuYlcbiAgQElucHV0KClcbiAgYW5pbURhdGFLZXk6IHN0cmluZztcblxuICBAT2JzZXJ2YWJsZUlucHV0KClcbiAgYW5pbURhdGFLZXkkITogT2JzZXJ2YWJsZTxzdHJpbmc+O1xuXG4gIEBJbnB1dCgpXG4gIGFuaUNvbmZpZzogQW5pbWF0aW9uQ29uZmlnV2l0aERhdGE7XG5cbiAgQFZhbHVlSG9vayhmdW5jdGlvbiAodGhpczogTmF2TG90dGllSWNvbkRpcmVjdGl2ZSwgZnJhbWU/OiBudW1iZXIpIHtcbiAgICB0aGlzLmp1bXBGcmFtZShmcmFtZSk7XG4gIH0pXG4gIEBJbnB1dCgpXG4gIC8vIOiuvuWumkxvdHRpZeW9k+WJjeW4p++8jOS4gOaXpuiuvuWumuaIluaUueWPmOivpeWAvOWwhueri+WNs+i3s+i9rOiHs+ivpeaMh+WumuW4p+W5tuWBnOatouWKqOaViOOAguWmguaenOaYry0x5YiZ5Li65pyA5ZCO5LiA5bin44CCXG4gIGZyYW1lPzogbnVtYmVyO1xuXG4gIEBPdXRwdXQoKVxuICBhbmlJbml0ID0gbmV3IEV2ZW50RW1pdHRlcjxBbmltYXRpb25JdGVtPigpO1xuXG4gIHByaXZhdGUgcmVhZG9ubHkgZGVzdHJveSQkID0gbmV3IFN1YmplY3Q8dm9pZD4oKTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwdWJsaWMgaG9zdEVsOiBFbGVtZW50UmVmLFxuICAgIHB1YmxpYyB0aGVtZTogVGhlbWVTZXJ2aWNlLFxuICApIHt9XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgY29tYmluZUxhdGVzdChbdGhpcy5hbmltRGF0YUtleSQsIHRoaXMuYW5pbURhdGEkLCB0aGlzLnRoZW1lLmN1cnJlbnRUaGVtZSRdKVxuICAgICAgLnBpcGUodGFrZVVudGlsKHRoaXMuZGVzdHJveSQkKSlcbiAgICAgIC5zdWJzY3JpYmUoKFtrZXksIF9kYXRhLCB0aGVtZV0pID0+IHtcbiAgICAgICAgY29uc3QgZGF0YSA9IF9kYXRhIHx8IEFOSU1fREFUQVtrZXldO1xuICAgICAgICBpZiAoIWRhdGEpIHtcbiAgICAgICAgICByZXR1cm47XG4gICAgICAgIH1cbiAgICAgICAgY29uc3QgYW5pbWF0aW9uRGF0YSA9IHJlcGxhY2VMb3R0aWVDb2xvcnNCeVRoZW1lKHRoZW1lLCBkYXRhKTtcbiAgICAgICAgdGhpcy5hbmlJbnM/LmRlc3Ryb3koKTtcbiAgICAgICAgdGhpcy5hbmlJbnMgPSBsb3R0aWUubG9hZEFuaW1hdGlvbih7XG4gICAgICAgICAgY29udGFpbmVyOiB0aGlzLmhvc3RFbC5uYXRpdmVFbGVtZW50LFxuICAgICAgICAgIHJlbmRlcmVyOiAnc3ZnJyxcbiAgICAgICAgICBsb29wOiBmYWxzZSxcbiAgICAgICAgICBhdXRvcGxheTogZmFsc2UsXG4gICAgICAgICAgLi4udGhpcy5hbmlDb25maWcsXG4gICAgICAgICAgYW5pbWF0aW9uRGF0YSxcbiAgICAgICAgfSk7XG4gICAgICAgIHRoaXMuYW5pSW5pdC5lbWl0KHRoaXMuYW5pSW5zKTtcbiAgICAgICAgdGhpcy5qdW1wRnJhbWUoKTtcbiAgICAgIH0pO1xuICB9XG5cbiAganVtcEZyYW1lKGZyYW1lOiBudW1iZXIgPSB0aGlzLmZyYW1lKSB7XG4gICAgaWYgKCF0aGlzLmFuaUlucyB8fCAoIWZyYW1lICYmIGZyYW1lICE9PSAwKSkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICBpZiAoZnJhbWUgPT09IC0xIHx8IGZyYW1lID49IHRoaXMuYW5pSW5zLnRvdGFsRnJhbWVzKSB7XG4gICAgICB0aGlzLmFuaUlucy5nb1RvQW5kU3RvcCh0aGlzLmFuaUlucy50b3RhbEZyYW1lcyAtIDEsIHRydWUpO1xuICAgIH0gZWxzZSB7XG4gICAgICB0aGlzLmFuaUlucy5nb1RvQW5kU3RvcChmcmFtZSk7XG4gICAgfVxuICB9XG5cbiAgbmdPbkRlc3Ryb3koKSB7XG4gICAgdGhpcy5hbmlJbnM/LmRlc3Ryb3koKTtcbiAgICB0aGlzLmRlc3Ryb3kkJC5uZXh0KCk7XG4gICAgdGhpcy5kZXN0cm95JCQuY29tcGxldGUoKTtcbiAgfVxufVxuIl19