diff --git a/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.html b/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.html
index 75ba45ef2..c208d28f9 100644
--- a/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.html
+++ b/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.html
@@ -47,8 +47,11 @@
diff --git a/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.scss b/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.scss
index 7cf9df5db..dcf9b1926 100644
--- a/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.scss
+++ b/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.scss
@@ -80,9 +80,20 @@ ace-editor {
position: absolute;
right: 12px;
top: 8px;
+ color: $grey-1;
+
+ .with-input {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ .search-match-text {
+ }
+ }
mat-icon {
max-width: 14px;
+ margin-left: 8px;
&.transform-180 {
transform: rotate(180deg);
diff --git a/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.ts b/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.ts
index 6cc66c05d..b41cfe3bc 100644
--- a/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.ts
+++ b/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.ts
@@ -25,14 +25,18 @@ export class DictionaryOverviewScreenComponent {
dictionary: TypeValue;
activeEditMarkers: any[] = [];
+
activeSearchMarkers: any[] = [];
+ searchPositions: any[] = [];
+ currentMatch: number = 1;
+
initialDictionaryEntries: string[] = [];
currentDictionaryEntries: string[] = [];
changedLines: number[] = [];
dictionaryEntriesAsText: string;
aceOptions = { showPrintMargin: false };
- searchText: string = '';
+ searchText = '';
constructor(
public readonly permissionsService: PermissionsService,
@@ -81,16 +85,18 @@ export class DictionaryOverviewScreenComponent {
searchChanged(text: string) {
this.searchText = text.toLowerCase();
this._applySearchMarkers();
+ this.currentMatch = 0;
+ this.nextSearchMatch();
}
private _applySearchMarkers() {
- const positions = this._getSearchPositions();
+ this.searchPositions = this._getSearchPositions();
this.activeSearchMarkers.forEach((am) => {
this.editorComponent.getEditor().getSession().removeMarker(am);
});
this.activeSearchMarkers = [];
- for (let position of positions) {
+ for (const position of this.searchPositions) {
this.activeSearchMarkers.push(
this.editorComponent
.getEditor()
@@ -156,6 +162,8 @@ export class DictionaryOverviewScreenComponent {
await this._dictionaryControllerService.deleteEntries(entriesToDelete, this.dictionary.type).toPromise();
}
this._initialize();
+
+ // .ace_marker-layer .search-marker
}
revert() {
@@ -163,4 +171,24 @@ export class DictionaryOverviewScreenComponent {
this.editorComponent.getEditor().setValue(this.dictionaryEntriesAsText);
this.editorComponent.getEditor().clearSelection();
}
+
+ nextSearchMatch() {
+ if (this.searchPositions.length > 0) {
+ this.currentMatch = this.currentMatch < this.searchPositions.length ? this.currentMatch + 1 : 1;
+ this._gotoLine();
+ }
+ }
+
+ previousSearchMatch() {
+ if (this.searchPositions.length > 0) {
+ this.currentMatch = this.currentMatch > 1 ? this.currentMatch - 1 : this.searchPositions.length - 1;
+ this._gotoLine();
+ }
+ }
+
+ private _gotoLine() {
+ const position = this.searchPositions[this.currentMatch - 1];
+ this.editorComponent.getEditor().scrollToLine(position.row, true, true, () => {});
+ this.editorComponent.getEditor().gotoLine(position.row + 1, position.column, true);
+ }
}