From a62e25219d76b5646e2e38f6b7911cee1f939acf Mon Sep 17 00:00:00 2001 From: "Patrik J. Braun" Date: Thu, 16 Mar 2023 00:37:13 +0100 Subject: [PATCH] Improving search modal ui #587 --- src/frontend/app/app.module.ts | 2 + src/frontend/app/pipes/StringifySearchType.ts | 12 ++ src/frontend/app/ui/EnumTranslations.ts | 22 ++++ .../query-entry.search.gallery.component.html | 107 +++++++++--------- .../search/search.gallery.component.html | 38 ++++--- 5 files changed, 112 insertions(+), 69 deletions(-) create mode 100644 src/frontend/app/pipes/StringifySearchType.ts diff --git a/src/frontend/app/app.module.ts b/src/frontend/app/app.module.ts index b979cc28..08b55a70 100644 --- a/src/frontend/app/app.module.ts +++ b/src/frontend/app/app.module.ts @@ -106,6 +106,7 @@ import {UsersComponent} from './ui/settings/users/users.component'; import {SharingsListComponent} from './ui/settings/sharings-list/sharings-list.component'; import {ThemeService} from './model/theme.service'; import {StringifyConfigPriority} from './pipes/StringifyConfigPriority'; +import {StringifySearchType} from './pipes/StringifySearchType'; @Injectable() export class MyHammerConfig extends HammerGestureConfig { @@ -237,6 +238,7 @@ Marker.prototype.options.icon = iconDefault; MDFilesFilterPipe, StringifySearchQuery, StringifyConfigPriority, + StringifySearchType, FileDTOToPathPipe, PhotoFilterPipe, UsersComponent, diff --git a/src/frontend/app/pipes/StringifySearchType.ts b/src/frontend/app/pipes/StringifySearchType.ts new file mode 100644 index 00000000..20db18ac --- /dev/null +++ b/src/frontend/app/pipes/StringifySearchType.ts @@ -0,0 +1,12 @@ +import { Pipe, PipeTransform } from '@angular/core'; +import {EnumTranslations} from '../ui/EnumTranslations'; +import {SearchQueryTypes} from '../../../common/entities/SearchQueryDTO'; + +@Pipe({ name: 'stringifySearchType' }) +export class StringifySearchType implements PipeTransform { + + transform(type: SearchQueryTypes): string { + return EnumTranslations[SearchQueryTypes[type]]; + } +} + diff --git a/src/frontend/app/ui/EnumTranslations.ts b/src/frontend/app/ui/EnumTranslations.ts index d0f80e32..f04fcc63 100644 --- a/src/frontend/app/ui/EnumTranslations.ts +++ b/src/frontend/app/ui/EnumTranslations.ts @@ -2,6 +2,7 @@ import {UserRoles} from '../../../common/entities/UserDTO'; import {ConfigPriority, MapProviders, NavigationLinkTypes} from '../../../common/config/public/ClientConfig'; import {ReIndexingSensitivity} from '../../../common/config/private/PrivateConfig'; import {SortingMethods} from '../../../common/entities/SortingMethods'; +import {SearchQueryTypes} from '../../../common/entities/SearchQueryDTO'; export const EnumTranslations: Record = {}; export const enumToTranslatedArray = (EnumType: any): { key: number; value: string }[] => { @@ -49,3 +50,24 @@ EnumTranslations[NavigationLinkTypes[NavigationLinkTypes.search]] = $localize`Se EnumTranslations[NavigationLinkTypes[NavigationLinkTypes.gallery]] = $localize`Gallery`; EnumTranslations[NavigationLinkTypes[NavigationLinkTypes.albums]] = $localize`Albums`; EnumTranslations[NavigationLinkTypes[NavigationLinkTypes.faces]] = $localize`Faces`; + + +EnumTranslations[SearchQueryTypes[SearchQueryTypes.AND]] = $localize`And`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.OR]] = $localize`Or`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.SOME_OF]] = $localize`Some of`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.any_text]] = $localize`Any text`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.from_date]] = $localize`From`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.to_date]] = $localize`Until`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.distance]] = $localize`Distance`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.min_rating]] = $localize`Min rating`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.max_rating]] = $localize`Max rating`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.min_resolution]] = $localize`Min resolution`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.max_resolution]] = $localize`Max resolution`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.directory]] = $localize`Directory`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.file_name]] = $localize`File name`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.caption]] = $localize`Caption`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.orientation]] = $localize`Orientation`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.position]] = $localize`Position`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.person]] = $localize`Person`; +EnumTranslations[SearchQueryTypes[SearchQueryTypes.keyword]] = $localize`Keyword`; + diff --git a/src/frontend/app/ui/gallery/search/query-enrty/query-entry.search.gallery.component.html b/src/frontend/app/ui/gallery/search/query-enrty/query-entry.search.gallery.component.html index a04dbea6..28573932 100644 --- a/src/frontend/app/ui/gallery/search/query-enrty/query-entry.search.gallery.component.html +++ b/src/frontend/app/ui/gallery/search/query-enrty/query-entry.search.gallery.component.html @@ -1,39 +1,40 @@
-
+
- -
+
@@ -43,8 +44,8 @@ (delete)="itemDeleted(i)">
-
-
@@ -57,11 +58,11 @@ class="form-select" [(ngModel)]="queryEntry.type" (ngModelChange)="onChangeType()"> -
-
+
-
-
-
- - km +
+
+
+
+ + km +
-
-
-
- - +
+
+ + +
-
+
-
+
-
+
-
+
-
+
-
+
Mpx
-
+