1
|
import {Component, Input, OnInit} from "@angular/core";
|
2
|
import {StringUtils} from "../../../utils/string-utils.class";
|
3
|
import {Organization, Project} from "../../../utils/result-preview/result-preview";
|
4
|
|
5
|
export interface Keyword {
|
6
|
field: string,
|
7
|
value: string,
|
8
|
tokenized: boolean
|
9
|
}
|
10
|
|
11
|
@Component({
|
12
|
selector: 'highlight',
|
13
|
template: `
|
14
|
<ng-template [ngIf]="html" [ngIfElse]="highlightText">
|
15
|
<ng-container *ngFor="let token of split()">
|
16
|
<span [class.uk-text-bold]="isHighlighted(token)" [innerHTML]="token"></span>
|
17
|
</ng-container>
|
18
|
</ng-template>
|
19
|
<ng-template #highlightText>
|
20
|
<ng-container *ngFor="let token of split()">
|
21
|
<span *ngIf="isHighlighted(token) else noHighlight" class="uk-text-bold">{{token}}</span>
|
22
|
<ng-template #noHighlight>{{token}}</ng-template>
|
23
|
</ng-container>
|
24
|
</ng-template>`
|
25
|
})
|
26
|
export class HighlightComponent implements OnInit{
|
27
|
@Input() keywords: Keyword[];
|
28
|
@Input() field: string;
|
29
|
@Input() element: string | Project[] | Organization[];
|
30
|
@Input() html = false;
|
31
|
public text: string;
|
32
|
public separators: string[] = [' ', '-', ',', '.'];
|
33
|
|
34
|
constructor() {
|
35
|
}
|
36
|
|
37
|
ngOnInit(): void {
|
38
|
if(typeof this.element === "string") {
|
39
|
this.text = this.element;
|
40
|
} else {
|
41
|
/*if(this.element instanceof Project) {
|
42
|
this.text = this.element.
|
43
|
}*/
|
44
|
}
|
45
|
|
46
|
}
|
47
|
|
48
|
public split(): string[] {
|
49
|
return StringUtils.split(this.text, this.separators);
|
50
|
}
|
51
|
|
52
|
/**
|
53
|
* Returns true if the word given is matched with any keyword
|
54
|
*
|
55
|
* @param word
|
56
|
*/
|
57
|
isHighlighted(word: string) {
|
58
|
if (this.keywords) {
|
59
|
for (let keyword of this.keywords) {
|
60
|
if (!keyword.field || keyword.field === this.field) {
|
61
|
if (keyword.tokenized && keyword.value.toLowerCase() === word.toLowerCase()) {
|
62
|
return true;
|
63
|
} else if (!keyword.tokenized && word.toLowerCase().includes(keyword.value.toLowerCase())) {
|
64
|
return true;
|
65
|
}
|
66
|
}
|
67
|
}
|
68
|
}
|
69
|
return false;
|
70
|
}
|
71
|
}
|