Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 | 1x 7x 7x 7x 7x 7x 10x 24x 7x 7x 7x 18x 18x 8x 10x 10x 13x 18x 7x 7x 10x 24x 7x | import {
Component, Input, OnChanges, ViewEncapsulation
} from '@angular/core';
import {
Observable, ReplaySubject, Subject, Subscription
} from 'rxjs';
import { map } from 'rxjs/operators';
import { CustomtextPipe } from '../../pipes/customtext/customtext.pipe';
import { CustomtextService } from '../../services/customtext/customtext.service';
@Component({
selector: 'tc-alert',
templateUrl: 'alert.component.html',
styleUrls: ['alert.component.css']
})
export class AlertComponent implements OnChanges {
@Input() text: string = '';
@Input() customtext: string = '';
@Input() replacements: string[] = [];
@Input() level: 'error' | 'warning' | 'info' | 'success' = 'info';
icons = {
error: 'error',
warning: 'warning',
info: 'info',
success: 'check_circle'
};
get displayText$(): Observable<string> {
return this._displayText$
.pipe(
map(text => AlertComponent.highlightTicks(text || ''))
);
}
private _displayText$: Subject<string>;
private customTextSubscription: Subscription | null = null;
constructor(
private cts: CustomtextService
) {
this._displayText$ = new ReplaySubject<string>();
}
ngOnChanges(): void {
this.unsubscribeCustomText();
if (!this.customtext) {
this._displayText$.next(this.text);
} else {
this.subscribeCustomText();
}
}
private subscribeCustomText(): void {
this.customTextSubscription = this.getCustomtext()
.subscribe(text => this._displayText$.next(text));
}
private unsubscribeCustomText(): void {
if (this.customTextSubscription) {
this.customTextSubscription.unsubscribe();
this.customTextSubscription = null;
}
}
getCustomtext(): Observable<string> {
return new CustomtextPipe(this.cts)
.transform(this.text, this.customtext, ...(this.replacements || []));
}
private static highlightTicks = (text: string): string => text.replace(
/\u0060([^\u0060]+)\u0060/g,
(match, match2) => `<span class='highlight'>${match2}</span>`
);
}
|