aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/search/highlight.pipe.ts
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/app/search/highlight.pipe.ts')
-rw-r--r--client/src/app/search/highlight.pipe.ts54
1 files changed, 54 insertions, 0 deletions
diff --git a/client/src/app/search/highlight.pipe.ts b/client/src/app/search/highlight.pipe.ts
new file mode 100644
index 000000000..50ee5c1bd
--- /dev/null
+++ b/client/src/app/search/highlight.pipe.ts
@@ -0,0 +1,54 @@
1import { PipeTransform, Pipe } from '@angular/core'
2import { SafeHtml } from '@angular/platform-browser'
3
4// Thanks https://gist.github.com/adamrecsko/0f28f474eca63e0279455476cc11eca7#gistcomment-2917369
5@Pipe({ name: 'highlight' })
6export class HighlightPipe implements PipeTransform {
7 /* use this for single match search */
8 static SINGLE_MATCH = 'Single-Match'
9 /* use this for single match search with a restriction that target should start with search string */
10 static SINGLE_AND_STARTS_WITH_MATCH = 'Single-And-StartsWith-Match'
11 /* use this for global search */
12 static MULTI_MATCH = 'Multi-Match'
13
14 transform (
15 contentString: string = null,
16 stringToHighlight: string = null,
17 option = 'Single-And-StartsWith-Match',
18 caseSensitive = false,
19 highlightStyleName = 'search-highlight'
20 ): SafeHtml {
21 if (stringToHighlight && contentString && option) {
22 let regex: any = ''
23 const caseFlag: string = !caseSensitive ? 'i' : ''
24
25 switch (option) {
26 case 'Single-Match': {
27 regex = new RegExp(stringToHighlight, caseFlag)
28 break
29 }
30 case 'Single-And-StartsWith-Match': {
31 regex = new RegExp('^' + stringToHighlight, caseFlag)
32 break
33 }
34 case 'Multi-Match': {
35 regex = new RegExp(stringToHighlight, 'g' + caseFlag)
36 break
37 }
38 default: {
39 // default will be a global case-insensitive match
40 regex = new RegExp(stringToHighlight, 'gi')
41 }
42 }
43
44 const replaced = contentString.replace(
45 regex,
46 (match) => `<span class="${highlightStyleName}">${match}</span>`
47 )
48
49 return replaced
50 } else {
51 return contentString
52 }
53 }
54}