123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156 |
- import { Component, ComponentRef, Input, OnDestroy, ViewChild, ViewContainerRef } from '@angular/core';
- import { AttributesMap } from 'ng-dynamic-component';
- import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
- import { filter, map, shareReplay } from 'rxjs/operators';
- import { EditionLevelType, TextFlow } from '../../app.config';
- import { GenericElement } from '../../models/evt-models';
- import { ComponentRegisterService } from '../../services/component-register.service';
- import { EntitiesSelectService } from '../../services/entities-select.service';
- import { EntitiesSelectItem } from '../entities-select/entities-select.component';
- import { LemsSelectService } from '../../services/lems-select.service';
- import { LemsSelectItem } from '../lems-select/lems-select.component';
- @Component({
- selector: 'evt-content-viewer',
- templateUrl: './content-viewer.component.html',
- })
- export class ContentViewerComponent implements OnDestroy {
- private v: GenericElement;
- @Input() set content(v: GenericElement) {
- this.v = v;
- this.contentChange.next(v);
- }
- get content() { return this.v; }
- private ith: EntitiesSelectItem[];
- @Input() set itemsToHighlight(i: EntitiesSelectItem[]) {
- this.ith = i;
- this.itemsToHighlightChange.next(i);
- }
- get itemsToHighlight() { return this.ith; }
- contentChange = new BehaviorSubject<GenericElement>(undefined);
- @ViewChild('container', { read: ViewContainerRef }) container: ViewContainerRef;
- itemsToHighlightChange = new BehaviorSubject<EntitiesSelectItem[]>([]);
- private ithlems: LemsSelectItem[];
- @Input() set itemsLemsToHighlight(i: LemsSelectItem[]) {
- this.ithlems = i;
- this.itemsLemsToHighlightChange.next(i);
- }
- get itemsLemsToHighlight() { return this.ithlems; }
- itemsLemsToHighlightChange = new BehaviorSubject<LemsSelectItem[]>([]);
- private edLevel: EditionLevelType;
- @Input() set editionLevel(el: EditionLevelType) {
- this.edLevel = el;
- this.editionLevelChange.next(el);
- }
- get editionLevel() { return this.edLevel; }
- editionLevelChange = new BehaviorSubject<EditionLevelType | ''>('');
- private txtFlow: TextFlow;
- @Input() set textFlow(t: TextFlow) {
- this.txtFlow = t;
- this.textFlowChange.next(t);
- }
- get textFlow() { return this.txtFlow; }
- textFlowChange = new BehaviorSubject<TextFlow>(undefined);
- constructor(
- private componentRegister: ComponentRegisterService,
- private entitiesSelectService: EntitiesSelectService,
- private lemsSelectService: LemsSelectService,
- ) {
- }
- // tslint:disable-next-line: no-any
- public parsedContent: Observable<{ [keyName: string]: any }> = this.contentChange.pipe(
- map((data) => ({
- ...data,
- type: this.componentRegister.getComponent(data?.type ?? GenericElement) || this.componentRegister.getComponent(GenericElement),
- })),
- shareReplay(1),
- );
- // tslint:disable-next-line: no-any
- public inputs: Observable<{ [keyName: string]: any }> = combineLatest([
- this.contentChange,
- this.itemsToHighlightChange,
- this.itemsLemsToHighlightChange,
- this.editionLevelChange,
- this.textFlowChange,
- ]).pipe(
- map(([data, itemsToHighlight, itemsLemsToHighlight, editionLevel, textFlow]) => {
- if (this.toBeHighlighted()) {
- return {
- data,
- highlightData: this.getHighlightData(data, itemsToHighlight),
- highlightDataLem: this.getHighlightDataLem(data, itemsLemsToHighlight),
- itemsToHighlight,
- itemsLemsToHighlight,
- editionLevel,
- textFlow,
- };
- }
- return {
- data,
- editionLevel,
- textFlow,
- };
- }),
- shareReplay(1),
- );
- // tslint:disable-next-line: ban-types
- public outputs: Observable<{ [keyName: string]: Function }> = this.contentChange.pipe(
- map(() => ({})),
- shareReplay(1),
- );
- public attributes: Observable<AttributesMap> = this.contentChange.pipe(
- filter(parsedContent => !!parsedContent),
- map((parsedContent) => ({ ...parsedContent.attributes || {}, ...{ class: `edition-font ${parsedContent.class || ''}` } })),
- shareReplay(1),
- );
- public context$ = combineLatest([
- this.parsedContent,
- this.inputs,
- this.outputs,
- this.attributes,
- ]).pipe(
- map(([parsedContent, inputs, outputs, attributes]) => (
- { parsedContent, inputs, outputs, attributes }
- )),
- );
- private componentRef: ComponentRef<{}>;
- private toBeHighlighted() {
- return true; // TODO: Decide when an item should be highlighted
- }
- private getHighlightData(data, ith: EntitiesSelectItem[]) {
- return {
- highlight: ith?.some(i => this.entitiesSelectService.matchClassAndAttributes(i.value, data?.attributes ?? {}, data?.class)) ?? false,
- highlightColor: this.entitiesSelectService.getHighlightColor(data?.attributes ?? {}, data?.class, ith),
- };
- }
- private getHighlightDataLem(data, ithlems: LemsSelectItem[]) {
- return {
- highlightLem: ithlems?.some(i => this.lemsSelectService.matchClassAndAttributes(i.value, data?.attributes ?? {}, data?.class)) ?? false,
- highlightColorLem: this.lemsSelectService.getHighlightColor(data?.attributes ?? {}, data?.class, ithlems),
- };
- }
- ngOnDestroy() {
- if (this.componentRef) {
- this.componentRef.destroy();
- this.componentRef = undefined;
- }
- }
- }
|