ng-devui
Version:
DevUI components based on Angular
64 lines • 7.95 kB
JavaScript
import { Directive, ElementRef, Input, Renderer2 } from '@angular/core';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { DBreakpoints } from './layout.types';
import { DScreenMediaQueryService } from './screen-media-query.service';
import * as i0 from "@angular/core";
import * as i1 from "./screen-media-query.service";
export class DStyleDirective {
constructor(elementRef, renderer, screenQueryService) {
this.elementRef = elementRef;
this.renderer = renderer;
this.screenQueryService = screenQueryService;
this.destroy$ = new Subject();
this.styleObject = {};
}
ngAfterViewInit() {
this.screenQueryService
.getPoint()
.pipe(takeUntil(this.destroy$))
.subscribe(({ currentPoint }) => {
this.updateStyle(currentPoint);
});
}
updateStyle(currentPoint) {
let finalStyleObject = {};
let isResponse = false;
if (this.dStyle) {
for (const point of DBreakpoints) {
if (this.dStyle[point]) {
finalStyleObject = { ...finalStyleObject, ...this.dStyle[point] };
isResponse = true;
}
if (currentPoint === point) {
break;
}
}
if (!isResponse) {
finalStyleObject = { ...this.dStyle };
}
}
Object.keys(this.styleObject).forEach((key) => {
this.renderer.removeStyle(this.elementRef.nativeElement, key);
});
Object.keys(finalStyleObject).forEach((key) => {
this.renderer.setStyle(this.elementRef.nativeElement, key, finalStyleObject[key]);
});
this.styleObject = finalStyleObject;
}
ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DStyleDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.DScreenMediaQueryService }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: DStyleDirective, selector: "[dStyle]", inputs: { dStyle: "dStyle" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DStyleDirective, decorators: [{
type: Directive,
args: [{
selector: `[dStyle]`,
}]
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.DScreenMediaQueryService }], propDecorators: { dStyle: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGUuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vZGV2dWkvbGF5b3V0L3N0eWxlLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQWlCLFNBQVMsRUFBRSxVQUFVLEVBQUUsS0FBSyxFQUFhLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNsRyxPQUFPLEVBQUUsT0FBTyxFQUFFLE1BQU0sTUFBTSxDQUFDO0FBQy9CLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUMzQyxPQUFPLEVBQUUsWUFBWSxFQUFzQixNQUFNLGdCQUFnQixDQUFDO0FBQ2xFLE9BQU8sRUFBRSx3QkFBd0IsRUFBRSxNQUFNLDhCQUE4QixDQUFDOzs7QUFLeEUsTUFBTSxPQUFPLGVBQWU7SUFNMUIsWUFBb0IsVUFBc0IsRUFBVSxRQUFtQixFQUFVLGtCQUE0QztRQUF6RyxlQUFVLEdBQVYsVUFBVSxDQUFZO1FBQVUsYUFBUSxHQUFSLFFBQVEsQ0FBVztRQUFVLHVCQUFrQixHQUFsQixrQkFBa0IsQ0FBMEI7UUFIckgsYUFBUSxHQUFHLElBQUksT0FBTyxFQUFRLENBQUM7UUFDL0IsZ0JBQVcsR0FBRyxFQUFFLENBQUM7SUFFdUcsQ0FBQztJQUVqSSxlQUFlO1FBQ2IsSUFBSSxDQUFDLGtCQUFrQjthQUNwQixRQUFRLEVBQUU7YUFDVixJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQzthQUM5QixTQUFTLENBQUMsQ0FBQyxFQUFFLFlBQVksRUFBRSxFQUFFLEVBQUU7WUFDOUIsSUFBSSxDQUFDLFdBQVcsQ0FBQyxZQUFZLENBQUMsQ0FBQztRQUNqQyxDQUFDLENBQUMsQ0FBQztJQUNQLENBQUM7SUFFRCxXQUFXLENBQUMsWUFBWTtRQUN0QixJQUFJLGdCQUFnQixHQUFHLEVBQUUsQ0FBQztRQUMxQixJQUFJLFVBQVUsR0FBRyxLQUFLLENBQUM7UUFFdkIsSUFBSSxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUM7WUFDaEIsS0FBSyxNQUFNLEtBQUssSUFBSSxZQUFZLEVBQUUsQ0FBQztnQkFDakMsSUFBSSxJQUFJLENBQUMsTUFBTSxDQUFDLEtBQUssQ0FBQyxFQUFFLENBQUM7b0JBQ3ZCLGdCQUFnQixHQUFHLEVBQUUsR0FBRyxnQkFBZ0IsRUFBRSxHQUFHLElBQUksQ0FBQyxNQUFNLENBQUMsS0FBSyxDQUFDLEVBQUUsQ0FBQztvQkFDbEUsVUFBVSxHQUFHLElBQUksQ0FBQztnQkFDcEIsQ0FBQztnQkFDRCxJQUFJLFlBQVksS0FBSyxLQUFLLEVBQUUsQ0FBQztvQkFDM0IsTUFBTTtnQkFDUixDQUFDO1lBQ0gsQ0FBQztZQUVELElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQztnQkFDaEIsZ0JBQWdCLEdBQUcsRUFBRSxHQUFHLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQztZQUN4QyxDQUFDO1FBQ0gsQ0FBQztRQUVELE1BQU0sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLEdBQUcsRUFBRSxFQUFFO1lBQzVDLElBQUksQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxFQUFFLEdBQUcsQ0FBQyxDQUFDO1FBQ2hFLENBQUMsQ0FBQyxDQUFDO1FBRUgsTUFBTSxDQUFDLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLEdBQUcsRUFBRSxFQUFFO1lBQzVDLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxFQUFFLEdBQUcsRUFBRSxnQkFBZ0IsQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDO1FBQ3BGLENBQUMsQ0FBQyxDQUFDO1FBRUgsSUFBSSxDQUFDLFdBQVcsR0FBRyxnQkFBZ0IsQ0FBQztJQUN0QyxDQUFDO0lBRUQsV0FBVztRQUNULElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxFQUFFLENBQUM7UUFDckIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUMzQixDQUFDOytHQW5EVSxlQUFlO21HQUFmLGVBQWU7OzRGQUFmLGVBQWU7a0JBSDNCLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLFVBQVU7aUJBQ3JCOzhJQUVVLE1BQU07c0JBQWQsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFmdGVyVmlld0luaXQsIERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSW5wdXQsIE9uRGVzdHJveSwgUmVuZGVyZXIyIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBTdWJqZWN0IH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyB0YWtlVW50aWwgfSBmcm9tICdyeGpzL29wZXJhdG9ycyc7XG5pbXBvcnQgeyBEQnJlYWtwb2ludHMsIERSZXNwb25zZVBhcmFtZXRlciB9IGZyb20gJy4vbGF5b3V0LnR5cGVzJztcbmltcG9ydCB7IERTY3JlZW5NZWRpYVF1ZXJ5U2VydmljZSB9IGZyb20gJy4vc2NyZWVuLW1lZGlhLXF1ZXJ5LnNlcnZpY2UnO1xuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6IGBbZFN0eWxlXWAsXG59KVxuZXhwb3J0IGNsYXNzIERTdHlsZURpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uRGVzdHJveSwgQWZ0ZXJWaWV3SW5pdCB7XG4gIEBJbnB1dCgpIGRTdHlsZTogRFJlc3BvbnNlUGFyYW1ldGVyPE9iamVjdD47XG5cbiAgcHJpdmF0ZSBkZXN0cm95JCA9IG5ldyBTdWJqZWN0PHZvaWQ+KCk7XG4gIHByaXZhdGUgc3R5bGVPYmplY3QgPSB7fTtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYsIHByaXZhdGUgcmVuZGVyZXI6IFJlbmRlcmVyMiwgcHJpdmF0ZSBzY3JlZW5RdWVyeVNlcnZpY2U6IERTY3JlZW5NZWRpYVF1ZXJ5U2VydmljZSkge31cblxuICBuZ0FmdGVyVmlld0luaXQoKTogdm9pZCB7XG4gICAgdGhpcy5zY3JlZW5RdWVyeVNlcnZpY2VcbiAgICAgIC5nZXRQb2ludCgpXG4gICAgICAucGlwZSh0YWtlVW50aWwodGhpcy5kZXN0cm95JCkpXG4gICAgICAuc3Vic2NyaWJlKCh7IGN1cnJlbnRQb2ludCB9KSA9PiB7XG4gICAgICAgIHRoaXMudXBkYXRlU3R5bGUoY3VycmVudFBvaW50KTtcbiAgICAgIH0pO1xuICB9XG5cbiAgdXBkYXRlU3R5bGUoY3VycmVudFBvaW50KSB7XG4gICAgbGV0IGZpbmFsU3R5bGVPYmplY3QgPSB7fTtcbiAgICBsZXQgaXNSZXNwb25zZSA9IGZhbHNlO1xuXG4gICAgaWYgKHRoaXMuZFN0eWxlKSB7XG4gICAgICBmb3IgKGNvbnN0IHBvaW50IG9mIERCcmVha3BvaW50cykge1xuICAgICAgICBpZiAodGhpcy5kU3R5bGVbcG9pbnRdKSB7XG4gICAgICAgICAgZmluYWxTdHlsZU9iamVjdCA9IHsgLi4uZmluYWxTdHlsZU9iamVjdCwgLi4udGhpcy5kU3R5bGVbcG9pbnRdIH07XG4gICAgICAgICAgaXNSZXNwb25zZSA9IHRydWU7XG4gICAgICAgIH1cbiAgICAgICAgaWYgKGN1cnJlbnRQb2ludCA9PT0gcG9pbnQpIHtcbiAgICAgICAgICBicmVhaztcbiAgICAgICAgfVxuICAgICAgfVxuXG4gICAgICBpZiAoIWlzUmVzcG9uc2UpIHtcbiAgICAgICAgZmluYWxTdHlsZU9iamVjdCA9IHsgLi4udGhpcy5kU3R5bGUgfTtcbiAgICAgIH1cbiAgICB9XG5cbiAgICBPYmplY3Qua2V5cyh0aGlzLnN0eWxlT2JqZWN0KS5mb3JFYWNoKChrZXkpID0+IHtcbiAgICAgIHRoaXMucmVuZGVyZXIucmVtb3ZlU3R5bGUodGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQsIGtleSk7XG4gICAgfSk7XG5cbiAgICBPYmplY3Qua2V5cyhmaW5hbFN0eWxlT2JqZWN0KS5mb3JFYWNoKChrZXkpID0+IHtcbiAgICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUodGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQsIGtleSwgZmluYWxTdHlsZU9iamVjdFtrZXldKTtcbiAgICB9KTtcblxuICAgIHRoaXMuc3R5bGVPYmplY3QgPSBmaW5hbFN0eWxlT2JqZWN0O1xuICB9XG5cbiAgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgdGhpcy5kZXN0cm95JC5uZXh0KCk7XG4gICAgdGhpcy5kZXN0cm95JC5jb21wbGV0ZSgpO1xuICB9XG59XG4iXX0=