geonetwork-ui 2.11.0-dev.5f9922c2e → 2.11.0-dev.6c8b66d60
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/geonetwork-ui.mjs +229 -196
- package/fesm2022/geonetwork-ui.mjs.map +1 -1
- package/index.d.ts +78 -51
- package/index.d.ts.map +1 -1
- package/package.json +2 -1
- package/src/libs/api/repository/src/lib/gn4/elasticsearch/elasticsearch.service.ts +63 -30
- package/src/libs/common/domain/src/lib/model/search/filter.model.ts +8 -1
- package/src/libs/feature/map/src/index.ts +0 -1
- package/src/libs/feature/map/src/lib/feature-map.module.ts +1 -8
- package/src/libs/feature/search/src/index.ts +2 -0
- package/src/libs/feature/search/src/lib/filter-dropdown/filter-dropdown.component.html +3 -0
- package/src/libs/feature/search/src/lib/filter-dropdown/filter-dropdown.component.ts +13 -1
- package/src/libs/feature/{map/src/lib → search/src/lib/geocoding}/geocoding.service.ts +5 -1
- package/src/libs/feature/search/src/lib/location-search/location-search.component.html +8 -0
- package/src/libs/feature/search/src/lib/location-search/location-search.component.ts +40 -0
- package/src/libs/feature/search/src/lib/search-filters-summary-item/search-filters-summary-item.component.ts +1 -0
- package/src/libs/feature/search/src/lib/utils/service/fields.service.ts +6 -0
- package/src/libs/feature/search/src/lib/utils/service/fields.ts +34 -0
- package/src/libs/ui/elements/src/lib/service-capabilities/service-capabilities.component.ts +2 -1
- package/src/libs/ui/inputs/src/lib/autocomplete/autocomplete.component.html +10 -1
- package/src/libs/ui/inputs/src/lib/autocomplete/autocomplete.component.ts +8 -0
- package/src/libs/ui/inputs/src/lib/dropdown-multiselect/dropdown-multiselect.component.html +7 -4
- package/src/libs/ui/inputs/src/lib/dropdown-multiselect/dropdown-multiselect.component.ts +12 -9
- package/src/libs/ui/inputs/src/lib/dropdown-multiselect/dropdown-multiselect.model.ts +2 -2
- package/src/libs/ui/inputs/src/lib/spatial-extent-dropdown/spatial-extent-dropdown.component.html +5 -11
- package/src/libs/ui/inputs/src/lib/spatial-extent-dropdown/spatial-extent-dropdown.component.ts +34 -4
- package/src/libs/ui/layout/src/lib/block-list/block-list.component.css +1 -0
- package/src/libs/ui/map/src/lib/components/map-container/map-container.component.ts +2 -0
- package/src/libs/util/shared/src/lib/links/link-utils.ts +19 -10
- package/src/libs/util/shared/src/lib/utils/geojson.ts +16 -0
- package/translations/de.json +8 -4
- package/translations/en.json +9 -5
- package/translations/es.json +8 -4
- package/translations/fr.json +9 -5
- package/translations/it.json +8 -4
- package/translations/nl.json +8 -4
- package/translations/pt.json +8 -4
- package/translations/sk.json +8 -4
- package/src/libs/feature/map/src/lib/geocoding/geocoding.component.css +0 -0
- package/src/libs/feature/map/src/lib/geocoding/geocoding.component.html +0 -41
- package/src/libs/feature/map/src/lib/geocoding/geocoding.component.ts +0 -112
|
@@ -2,18 +2,11 @@ import { NgModule } from '@angular/core'
|
|
|
2
2
|
import { StoreModule } from '@ngrx/store'
|
|
3
3
|
import * as fromMap from './+state/map.reducer'
|
|
4
4
|
import { MapFacade } from './+state/map.facade'
|
|
5
|
-
import { GEOCODING_PROVIDER, GeocodingProvider } from './geocoding.service'
|
|
6
5
|
|
|
7
6
|
@NgModule({
|
|
8
7
|
imports: [
|
|
9
8
|
StoreModule.forFeature(fromMap.MAP_FEATURE_KEY, fromMap.mapReducer),
|
|
10
9
|
],
|
|
11
|
-
providers: [
|
|
12
|
-
MapFacade,
|
|
13
|
-
{
|
|
14
|
-
provide: GEOCODING_PROVIDER,
|
|
15
|
-
useValue: ['geonames', { maxRows: 5 }] as GeocodingProvider,
|
|
16
|
-
},
|
|
17
|
-
],
|
|
10
|
+
providers: [MapFacade],
|
|
18
11
|
})
|
|
19
12
|
export class FeatureMapModule {}
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
export * from './lib/feature-search.module'
|
|
2
|
+
export * from './lib/geocoding/geocoding.service'
|
|
3
|
+
export * from './lib/location-search/location-search.component'
|
|
2
4
|
export * from './lib/filter-geometry.token'
|
|
3
5
|
export * from './lib/record-url.token'
|
|
4
6
|
export * from './lib/state/actions'
|
|
@@ -3,13 +3,16 @@
|
|
|
3
3
|
[title]="title"
|
|
4
4
|
[dateRange]="(selectedDateRange$ | async) ?? {}"
|
|
5
5
|
(dateRangeChange)="onDateRangeChange($event)"
|
|
6
|
+
[attr.data-cy-field]="fieldName"
|
|
6
7
|
></gn-ui-date-range-dropdown>
|
|
7
8
|
} @else if (fieldType === 'spatialExtent') {
|
|
8
9
|
<gn-ui-spatial-extent-dropdown
|
|
9
10
|
[title]="title"
|
|
11
|
+
[initialBbox]="(selectedBoundingBox$ | async) ?? null"
|
|
10
12
|
[maxFileSizeMb]="spatialExtentMaxFileSize"
|
|
11
13
|
(bboxChange)="onBboxChange($event)"
|
|
12
14
|
(errorChange)="onSpatialExtentError($event)"
|
|
15
|
+
[attr.data-cy-field]="fieldName"
|
|
13
16
|
></gn-ui-spatial-extent-dropdown>
|
|
14
17
|
} @else {
|
|
15
18
|
<gn-ui-dropdown-multiselect
|
|
@@ -71,6 +71,14 @@ export class FilterDropdownComponent implements OnInit {
|
|
|
71
71
|
map((selected) => (Array.isArray(selected) ? {} : (selected as DateRange)))
|
|
72
72
|
) as Observable<DateRange>
|
|
73
73
|
|
|
74
|
+
selectedBoundingBox$ = this.selected$.pipe(
|
|
75
|
+
map((selected) =>
|
|
76
|
+
Array.isArray(selected) && selected.length > 0
|
|
77
|
+
? (selected as BoundingBox)
|
|
78
|
+
: null
|
|
79
|
+
)
|
|
80
|
+
) as Observable<BoundingBox | null>
|
|
81
|
+
|
|
74
82
|
onSelectedValues(values: unknown[]) {
|
|
75
83
|
this.fieldsService
|
|
76
84
|
.buildFiltersFromFieldValues({ [this.fieldName]: values as FieldValue[] })
|
|
@@ -80,7 +88,11 @@ export class FilterDropdownComponent implements OnInit {
|
|
|
80
88
|
private spatialExtentErrorNotificationId: number | null = null
|
|
81
89
|
|
|
82
90
|
onBboxChange(bbox: BoundingBox | null) {
|
|
83
|
-
|
|
91
|
+
this.fieldsService
|
|
92
|
+
.buildFiltersFromFieldValues({
|
|
93
|
+
[this.fieldName]: bbox,
|
|
94
|
+
})
|
|
95
|
+
.subscribe((filters) => this.searchService.updateFilters(filters))
|
|
84
96
|
this.clearSpatialExtentErrorNotification()
|
|
85
97
|
}
|
|
86
98
|
|
|
@@ -20,7 +20,11 @@ export type GeocodingProvider =
|
|
|
20
20
|
| DataGouvFrGeocodingProvider
|
|
21
21
|
|
|
22
22
|
export const GEOCODING_PROVIDER = new InjectionToken<GeocodingProvider>(
|
|
23
|
-
'geocoding-provider'
|
|
23
|
+
'geocoding-provider',
|
|
24
|
+
{
|
|
25
|
+
providedIn: 'root',
|
|
26
|
+
factory: () => ['geonames', { maxRows: 5 }] as GeocodingProvider,
|
|
27
|
+
}
|
|
24
28
|
)
|
|
25
29
|
|
|
26
30
|
@Injectable({
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import {
|
|
2
|
+
ChangeDetectionStrategy,
|
|
3
|
+
Component,
|
|
4
|
+
EventEmitter,
|
|
5
|
+
inject,
|
|
6
|
+
Input,
|
|
7
|
+
Output,
|
|
8
|
+
TemplateRef,
|
|
9
|
+
} from '@angular/core'
|
|
10
|
+
import { Observable } from 'rxjs'
|
|
11
|
+
import { GeocodingResult } from '@geospatial-sdk/geocoding'
|
|
12
|
+
import {
|
|
13
|
+
AutocompleteComponent,
|
|
14
|
+
AutocompleteItem,
|
|
15
|
+
} from '../../../../../../libs/ui/inputs/src'
|
|
16
|
+
import { GeocodingService } from '../geocoding/geocoding.service'
|
|
17
|
+
|
|
18
|
+
@Component({
|
|
19
|
+
selector: 'gn-ui-location-search',
|
|
20
|
+
templateUrl: './location-search.component.html',
|
|
21
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
22
|
+
standalone: true,
|
|
23
|
+
imports: [AutocompleteComponent],
|
|
24
|
+
})
|
|
25
|
+
export class LocationSearchComponent {
|
|
26
|
+
private geocodingService = inject(GeocodingService)
|
|
27
|
+
|
|
28
|
+
@Input() placeholder = ''
|
|
29
|
+
@Input() displayWithTemplate?: TemplateRef<{ $implicit: GeocodingResult }>
|
|
30
|
+
@Output() resultSelected = new EventEmitter<GeocodingResult>()
|
|
31
|
+
|
|
32
|
+
displayWithFn = (item: AutocompleteItem) => (item as GeocodingResult).label
|
|
33
|
+
|
|
34
|
+
searchAction = (text: string): Observable<AutocompleteItem[]> =>
|
|
35
|
+
this.geocodingService.query(text)
|
|
36
|
+
|
|
37
|
+
handleItemSelected(item: AutocompleteItem) {
|
|
38
|
+
this.resultSelected.emit(item as GeocodingResult)
|
|
39
|
+
}
|
|
40
|
+
}
|
|
@@ -20,6 +20,7 @@ import { marker } from '@biesbjerg/ngx-translate-extract-marker'
|
|
|
20
20
|
|
|
21
21
|
marker('search.filters.summaryLabel.user')
|
|
22
22
|
marker('search.filters.summaryLabel.changeDate')
|
|
23
|
+
marker('search.filters.summaryLabel.resourceCreationRevisionDate')
|
|
23
24
|
|
|
24
25
|
const OPEN_BOUND = '…'
|
|
25
26
|
|
|
@@ -11,6 +11,7 @@ import {
|
|
|
11
11
|
MultilingualSearchField,
|
|
12
12
|
OrganizationSearchField,
|
|
13
13
|
OwnerSearchField,
|
|
14
|
+
ResourceCreationRevisionDateSearchField,
|
|
14
15
|
ResourceTypeLegacyField,
|
|
15
16
|
SimpleSearchField,
|
|
16
17
|
TranslatedSearchField,
|
|
@@ -43,6 +44,7 @@ marker('search.filters.producerOrg')
|
|
|
43
44
|
marker('search.filters.publisherOrg')
|
|
44
45
|
marker('search.filters.user')
|
|
45
46
|
marker('search.filters.changeDate')
|
|
47
|
+
marker('search.filters.resourceCreationRevisionDate')
|
|
46
48
|
marker('search.filters.spatialExtent')
|
|
47
49
|
@Injectable({
|
|
48
50
|
providedIn: 'root',
|
|
@@ -95,6 +97,10 @@ export class FieldsService {
|
|
|
95
97
|
),
|
|
96
98
|
user: new UserSearchField(this.injector),
|
|
97
99
|
changeDate: new DateRangeSearchField('changeDate', this.injector, 'desc'),
|
|
100
|
+
resourceCreationRevisionDate: new ResourceCreationRevisionDateSearchField(
|
|
101
|
+
this.injector,
|
|
102
|
+
'desc'
|
|
103
|
+
),
|
|
98
104
|
availableServices: new AvailableServicesField(this.injector),
|
|
99
105
|
spatialExtent: new BoundingBoxSearchField('spatialExtent', this.injector),
|
|
100
106
|
} as Record<string, AbstractSearchField>
|
|
@@ -435,6 +435,40 @@ export class DateRangeSearchField extends SimpleSearchField {
|
|
|
435
435
|
}
|
|
436
436
|
}
|
|
437
437
|
|
|
438
|
+
// treats a resource's creation/revision dates as an interval (its min and max), so a record matches
|
|
439
|
+
// when that interval intersects the filter range, not just when a single date falls inside it
|
|
440
|
+
export class ResourceCreationRevisionDateSearchField extends DateRangeSearchField {
|
|
441
|
+
constructor(injector: Injector, order: 'asc' | 'desc' = 'desc') {
|
|
442
|
+
super('resourceCreationRevisionDate', injector, order)
|
|
443
|
+
const dateSourceFields = [
|
|
444
|
+
'creationDateForResource',
|
|
445
|
+
'revisionDateForResource',
|
|
446
|
+
]
|
|
447
|
+
const collectSortedDates = dateSourceFields
|
|
448
|
+
.map(
|
|
449
|
+
(field) => `if (doc.containsKey('${field}')) {
|
|
450
|
+
for (def date : doc['${field}']) { dates.add(date.millis); }
|
|
451
|
+
}`
|
|
452
|
+
)
|
|
453
|
+
.join('\n')
|
|
454
|
+
|
|
455
|
+
this.esService.registerRuntimeField(
|
|
456
|
+
'resourceCreationRevisionDateMin',
|
|
457
|
+
`def dates = [];
|
|
458
|
+
${collectSortedDates}
|
|
459
|
+
if (dates.length > 0) { dates.sort(null); emit(dates[0]); }`,
|
|
460
|
+
'date'
|
|
461
|
+
)
|
|
462
|
+
this.esService.registerRuntimeField(
|
|
463
|
+
'resourceCreationRevisionDateMax',
|
|
464
|
+
`def dates = [];
|
|
465
|
+
${collectSortedDates}
|
|
466
|
+
if (dates.length > 0) { dates.sort(null); emit(dates[dates.length - 1]); }`,
|
|
467
|
+
'date'
|
|
468
|
+
)
|
|
469
|
+
}
|
|
470
|
+
}
|
|
471
|
+
|
|
438
472
|
export class BoundingBoxSearchField extends SimpleSearchField {
|
|
439
473
|
getAvailableValues(): Observable<FieldAvailableValue[]> {
|
|
440
474
|
return of([])
|
|
@@ -128,7 +128,8 @@ export class ServiceCapabilitiesComponent implements OnInit {
|
|
|
128
128
|
this.loading = true
|
|
129
129
|
this.availableLayers = await getLayers(
|
|
130
130
|
this.apiLinks[0].url.href,
|
|
131
|
-
this.apiLinks[0].accessServiceProtocol
|
|
131
|
+
this.apiLinks[0].accessServiceProtocol,
|
|
132
|
+
true
|
|
132
133
|
)
|
|
133
134
|
this.loading = false
|
|
134
135
|
this.cdr.detectChanges()
|
|
@@ -83,7 +83,16 @@
|
|
|
83
83
|
>
|
|
84
84
|
@for (suggestion of suggestions$ | async; track suggestion) {
|
|
85
85
|
<mat-option [value]="suggestion" class="p-2 suggestion text-start">
|
|
86
|
-
|
|
86
|
+
@if (displayWithTemplate) {
|
|
87
|
+
<ng-container
|
|
88
|
+
*ngTemplateOutlet="
|
|
89
|
+
displayWithTemplate;
|
|
90
|
+
context: { $implicit: suggestion }
|
|
91
|
+
"
|
|
92
|
+
></ng-container>
|
|
93
|
+
} @else {
|
|
94
|
+
{{ displayWithFnInternal(suggestion) }}
|
|
95
|
+
}
|
|
87
96
|
</mat-option>
|
|
88
97
|
}
|
|
89
98
|
</mat-autocomplete>
|
|
@@ -11,6 +11,7 @@ import {
|
|
|
11
11
|
OnInit,
|
|
12
12
|
Output,
|
|
13
13
|
SimpleChanges,
|
|
14
|
+
TemplateRef,
|
|
14
15
|
ViewChild,
|
|
15
16
|
inject,
|
|
16
17
|
} from '@angular/core'
|
|
@@ -97,6 +98,13 @@ export class AutocompleteComponent
|
|
|
97
98
|
@ViewChild(MatAutocompleteTrigger) triggerRef: MatAutocompleteTrigger
|
|
98
99
|
@ViewChild(MatAutocomplete) autocomplete: MatAutocomplete
|
|
99
100
|
@ViewChild('searchInput') inputRef: ElementRef<HTMLInputElement>
|
|
101
|
+
/**
|
|
102
|
+
* Custom template to render each suggestion. Takes precedence over
|
|
103
|
+
* `displayWithFn` when set.
|
|
104
|
+
*/
|
|
105
|
+
@Input() displayWithTemplate?: TemplateRef<{
|
|
106
|
+
$implicit: AutocompleteItem
|
|
107
|
+
}>
|
|
100
108
|
|
|
101
109
|
searching: boolean
|
|
102
110
|
control = new UntypedFormControl()
|
|
@@ -20,10 +20,13 @@
|
|
|
20
20
|
</div>
|
|
21
21
|
}
|
|
22
22
|
</div>
|
|
23
|
-
<button
|
|
23
|
+
<button
|
|
24
|
+
class="h-6 w-6 flex items-center justify-center"
|
|
25
|
+
data-test="dropdown-clear"
|
|
26
|
+
>
|
|
24
27
|
@if (hasSelectedChoices && !overlayOpen) {
|
|
25
28
|
<ng-icon
|
|
26
|
-
class="shrink-0 opacity-40
|
|
29
|
+
class="shrink-0 opacity-40 hover:opacity-80 transition-colors clear-btn"
|
|
27
30
|
(click)="clearSelection($event)"
|
|
28
31
|
name="matClose"
|
|
29
32
|
></ng-icon>
|
|
@@ -61,13 +64,13 @@
|
|
|
61
64
|
#overlayContainer
|
|
62
65
|
>
|
|
63
66
|
<div
|
|
64
|
-
class="border border-gray-300 rounded mb-2 mx-2 min-h-[44px] flex flex-row gap-
|
|
67
|
+
class="border border-gray-300 rounded mb-2 mx-2 min-h-[44px] flex flex-row gap-1 flex-wrap p-2 focus-within:rounded focus-within:border-2 focus-within:border-primary"
|
|
65
68
|
>
|
|
66
69
|
@for (selected of selectedChoices; track selected) {
|
|
67
70
|
<button
|
|
68
71
|
type="button"
|
|
69
72
|
[title]="selected.label"
|
|
70
|
-
class="max-w-full bg-main text-white rounded pr-[7px] flex gap-1 items-center opacity-70 hover:opacity-100 focus:opacity-100 transition-opacity
|
|
73
|
+
class="max-w-full bg-main text-white rounded pr-[7px] flex gap-1 items-center opacity-70 hover:opacity-100 focus:opacity-100 transition-opacity"
|
|
71
74
|
(click)="select(selected, false)"
|
|
72
75
|
>
|
|
73
76
|
<div class="text-sm truncate leading-[26px] px-2">
|
|
@@ -24,7 +24,7 @@ import {
|
|
|
24
24
|
propagateToDocumentOnly,
|
|
25
25
|
} from '../../../../../../libs/util/shared/src'
|
|
26
26
|
import { ButtonComponent } from '../button/button.component'
|
|
27
|
-
import { NgIcon, provideIcons } from '@ng-icons/core'
|
|
27
|
+
import { NgIcon, provideIcons, provideNgIconsConfig } from '@ng-icons/core'
|
|
28
28
|
import { FormsModule } from '@angular/forms'
|
|
29
29
|
import { TranslatePipe } from '@ngx-translate/core'
|
|
30
30
|
|
|
@@ -46,19 +46,22 @@ import {
|
|
|
46
46
|
matExpandMore,
|
|
47
47
|
matExpandLess,
|
|
48
48
|
}),
|
|
49
|
+
provideNgIconsConfig({
|
|
50
|
+
size: '1.5rem',
|
|
51
|
+
}),
|
|
49
52
|
],
|
|
50
53
|
standalone: true,
|
|
51
54
|
})
|
|
52
|
-
export class DropdownMultiselectComponent {
|
|
55
|
+
export class DropdownMultiselectComponent<T = unknown> {
|
|
53
56
|
private scrollStrategies = inject(ScrollStrategyOptions)
|
|
54
57
|
|
|
55
58
|
@Input() title: string
|
|
56
|
-
@Input() choices: Choice[]
|
|
57
|
-
@Input() selected:
|
|
59
|
+
@Input() choices: Choice<T>[]
|
|
60
|
+
@Input() selected: T[] = []
|
|
58
61
|
@Input() allowSearch = true
|
|
59
62
|
@Input() maxRows: number
|
|
60
63
|
@Input() searchInputValue = ''
|
|
61
|
-
@Output() selectValues = new EventEmitter<
|
|
64
|
+
@Output() selectValues = new EventEmitter<T[]>()
|
|
62
65
|
@ViewChild('overlayOrigin') overlayOrigin: CdkOverlayOrigin
|
|
63
66
|
@ViewChild(CdkConnectedOverlay) overlay: CdkConnectedOverlay
|
|
64
67
|
@ViewChild('overlayContainer', { read: ElementRef })
|
|
@@ -115,7 +118,7 @@ export class DropdownMultiselectComponent {
|
|
|
115
118
|
|
|
116
119
|
private setFocus() {
|
|
117
120
|
setTimeout(() => {
|
|
118
|
-
this.searchFieldInput
|
|
121
|
+
this.searchFieldInput?.nativeElement.focus()
|
|
119
122
|
}, 0)
|
|
120
123
|
}
|
|
121
124
|
|
|
@@ -194,18 +197,18 @@ export class DropdownMultiselectComponent {
|
|
|
194
197
|
this.checkboxes.get(newIndex).nativeElement.focus()
|
|
195
198
|
}
|
|
196
199
|
|
|
197
|
-
isSelected(choice: Choice) {
|
|
200
|
+
isSelected(choice: Choice<T>) {
|
|
198
201
|
return this.selected.indexOf(choice.value) > -1
|
|
199
202
|
}
|
|
200
203
|
|
|
201
|
-
select(choice: Choice
|
|
204
|
+
select(choice: Choice<T>, selected: boolean) {
|
|
202
205
|
this.selected = selected
|
|
203
206
|
? [...this.selected.filter((v) => v !== choice.value), choice.value]
|
|
204
207
|
: this.selected.filter((v) => v !== choice.value)
|
|
205
208
|
this.selectValues.emit(this.selected)
|
|
206
209
|
}
|
|
207
210
|
|
|
208
|
-
toggle(choice: Choice) {
|
|
211
|
+
toggle(choice: Choice<T>) {
|
|
209
212
|
this.select(choice, !this.isSelected(choice))
|
|
210
213
|
}
|
|
211
214
|
|
package/src/libs/ui/inputs/src/lib/spatial-extent-dropdown/spatial-extent-dropdown.component.html
CHANGED
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
[class]="
|
|
59
59
|
(hasSelection
|
|
60
60
|
? 'border-b-[1px] border-gray-400 pb-[20px]'
|
|
61
|
-
: 'pb-[
|
|
61
|
+
: 'pb-[12px]') + ' text-black'
|
|
62
62
|
"
|
|
63
63
|
>
|
|
64
64
|
<gn-ui-drag-and-drop-file-input
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
[showFileName]="false"
|
|
69
69
|
textClass="text-black truncate"
|
|
70
70
|
dropzoneBackgroundColor="transparent"
|
|
71
|
-
icon="
|
|
71
|
+
icon="iconoirUpload"
|
|
72
72
|
extraClass="gn-ui-gray-outline-input w-full !h-[32px] px-[8px] py-[4px] justify-between"
|
|
73
73
|
(fileChange)="handleFileSelected($event)"
|
|
74
74
|
(errorChange)="handleFileError($event)"
|
|
@@ -79,11 +79,7 @@
|
|
|
79
79
|
@if (hasSelection) {
|
|
80
80
|
<gn-ui-button
|
|
81
81
|
[type]="'primary-light'"
|
|
82
|
-
[title]="
|
|
83
|
-
('search.filters.spatialExtent.bboxDelete' | translate) +
|
|
84
|
-
' ' +
|
|
85
|
-
fileName
|
|
86
|
-
"
|
|
82
|
+
[title]="selectionDeleteLabelKey | translate: selectionLabelParams"
|
|
87
83
|
(buttonClick)="removeSelection($event)"
|
|
88
84
|
extraClass="group gap-x-2 w-full h-[28px] px-[8px] py-[4px] mb-[12px] bg-primary-lighter text-white"
|
|
89
85
|
data-test="spatial-extent-selected-item"
|
|
@@ -94,12 +90,10 @@
|
|
|
94
90
|
size="15px"
|
|
95
91
|
></ng-icon>
|
|
96
92
|
<span class="group-hover:hidden truncate text-sm m-auto">
|
|
97
|
-
{{
|
|
98
|
-
{{ fileName }}
|
|
93
|
+
{{ selectionLabelKey | translate: selectionLabelParams }}
|
|
99
94
|
</span>
|
|
100
95
|
<span class="hidden group-hover:block truncate text-sm m-auto">
|
|
101
|
-
{{
|
|
102
|
-
{{ fileName }}
|
|
96
|
+
{{ selectionDeleteLabelKey | translate: selectionLabelParams }}
|
|
103
97
|
</span>
|
|
104
98
|
<ng-icon
|
|
105
99
|
name="iconoirCheckCircle"
|
package/src/libs/ui/inputs/src/lib/spatial-extent-dropdown/spatial-extent-dropdown.component.ts
CHANGED
|
@@ -20,9 +20,9 @@ import { ButtonComponent } from '../button/button.component'
|
|
|
20
20
|
import { NgIcon, provideIcons } from '@ng-icons/core'
|
|
21
21
|
import {
|
|
22
22
|
iconoirCheckCircle,
|
|
23
|
-
iconoirImport,
|
|
24
23
|
iconoirSquareDashed,
|
|
25
24
|
iconoirTrash,
|
|
25
|
+
iconoirUpload,
|
|
26
26
|
} from '@ng-icons/iconoir'
|
|
27
27
|
import {
|
|
28
28
|
matClose,
|
|
@@ -35,6 +35,7 @@ import {
|
|
|
35
35
|
BoundingBox,
|
|
36
36
|
getGeometryBoundingBox,
|
|
37
37
|
getGeometryFromGeoJSON,
|
|
38
|
+
isBoundingBoxWithinWorldExtent,
|
|
38
39
|
propagateToDocumentOnly,
|
|
39
40
|
readFileAsText,
|
|
40
41
|
} from '../../../../../../libs/util/shared/src'
|
|
@@ -46,13 +47,21 @@ import {
|
|
|
46
47
|
marker('search.filters.spatialExtent.import')
|
|
47
48
|
marker('search.filters.spatialExtent.helpText')
|
|
48
49
|
marker('search.filters.spatialExtent.error.title')
|
|
49
|
-
marker('search.filters.spatialExtent.
|
|
50
|
+
marker('search.filters.spatialExtent.error.outOfBounds')
|
|
51
|
+
|
|
52
|
+
const LABEL_FROM_FILE = marker('search.filters.spatialExtent.bboxFromFile')
|
|
53
|
+
const LABEL_FROM_FILE_DELETE = marker(
|
|
54
|
+
'search.filters.spatialExtent.bboxFromFileDelete'
|
|
55
|
+
)
|
|
56
|
+
const LABEL_INITIAL = marker('search.filters.spatialExtent.bboxInitial')
|
|
57
|
+
const LABEL_INITIAL_DELETE = marker(
|
|
58
|
+
'search.filters.spatialExtent.bboxInitialDelete'
|
|
59
|
+
)
|
|
50
60
|
|
|
51
61
|
export interface SpatialExtentDropdownError {
|
|
52
62
|
key: string
|
|
53
63
|
params?: Record<string, string | number>
|
|
54
64
|
}
|
|
55
|
-
marker('search.filters.spatialExtent.bboxDelete')
|
|
56
65
|
|
|
57
66
|
@Component({
|
|
58
67
|
selector: 'gn-ui-spatial-extent-dropdown',
|
|
@@ -67,9 +76,9 @@ marker('search.filters.spatialExtent.bboxDelete')
|
|
|
67
76
|
providers: [
|
|
68
77
|
provideIcons({
|
|
69
78
|
iconoirCheckCircle,
|
|
70
|
-
iconoirImport,
|
|
71
79
|
iconoirSquareDashed,
|
|
72
80
|
iconoirTrash,
|
|
81
|
+
iconoirUpload,
|
|
73
82
|
matClose,
|
|
74
83
|
matExpandLess,
|
|
75
84
|
matExpandMore,
|
|
@@ -85,6 +94,11 @@ export class SpatialExtentDropdownComponent {
|
|
|
85
94
|
|
|
86
95
|
@Input() title: string
|
|
87
96
|
@Input() maxFileSizeMb: number | null = null
|
|
97
|
+
@Input() set initialBbox(value: BoundingBox | null) {
|
|
98
|
+
if (!this.bbox && value) {
|
|
99
|
+
this.bbox = value
|
|
100
|
+
}
|
|
101
|
+
}
|
|
88
102
|
|
|
89
103
|
@Output() bboxChange = new EventEmitter<BoundingBox | null>()
|
|
90
104
|
@Output() errorChange = new EventEmitter<SpatialExtentDropdownError>()
|
|
@@ -123,6 +137,18 @@ export class SpatialExtentDropdownComponent {
|
|
|
123
137
|
return !!this.bbox
|
|
124
138
|
}
|
|
125
139
|
|
|
140
|
+
get selectionLabelKey() {
|
|
141
|
+
return this.fileName ? LABEL_FROM_FILE : LABEL_INITIAL
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
get selectionDeleteLabelKey() {
|
|
145
|
+
return this.fileName ? LABEL_FROM_FILE_DELETE : LABEL_INITIAL_DELETE
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
get selectionLabelParams() {
|
|
149
|
+
return { fileName: this.fileName }
|
|
150
|
+
}
|
|
151
|
+
|
|
126
152
|
openOverlay() {
|
|
127
153
|
this.overlayMinWidth =
|
|
128
154
|
this.overlayOrigin.elementRef.nativeElement.getBoundingClientRect()
|
|
@@ -154,6 +180,10 @@ export class SpatialExtentDropdownComponent {
|
|
|
154
180
|
return
|
|
155
181
|
}
|
|
156
182
|
const bbox = getGeometryBoundingBox(geometry)
|
|
183
|
+
if (!isBoundingBoxWithinWorldExtent(bbox)) {
|
|
184
|
+
this.setError(marker('search.filters.spatialExtent.error.outOfBounds'))
|
|
185
|
+
return
|
|
186
|
+
}
|
|
157
187
|
this.bbox = bbox
|
|
158
188
|
this.fileName = file.name
|
|
159
189
|
this.bboxChange.emit(bbox)
|
|
@@ -58,6 +58,8 @@ import { transformExtent } from 'ol/proj.js'
|
|
|
58
58
|
export const DEFAULT_BASEMAP_LAYER: MapContextLayerMapLibreStyle = {
|
|
59
59
|
type: 'maplibre-style',
|
|
60
60
|
styleUrl: `https://basemaps.cartocdn.com/gl/positron-gl-style/style.json`,
|
|
61
|
+
clickable: false,
|
|
62
|
+
hoverable: false,
|
|
61
63
|
}
|
|
62
64
|
|
|
63
65
|
const DEFAULT_VIEW: MapContextView = {
|
|
@@ -344,7 +344,11 @@ export function getLinkLabel(
|
|
|
344
344
|
return format ? `${label} (${format})` : label
|
|
345
345
|
}
|
|
346
346
|
|
|
347
|
-
export async function getLayers(
|
|
347
|
+
export async function getLayers(
|
|
348
|
+
url: string,
|
|
349
|
+
serviceProtocol: ServiceProtocol,
|
|
350
|
+
deep = false
|
|
351
|
+
) {
|
|
348
352
|
switch (serviceProtocol) {
|
|
349
353
|
case 'ogcFeatures': {
|
|
350
354
|
const layers = await new OgcApiEndpoint(url).allCollections
|
|
@@ -352,7 +356,10 @@ export async function getLayers(url: string, serviceProtocol: ServiceProtocol) {
|
|
|
352
356
|
}
|
|
353
357
|
case 'wfs': {
|
|
354
358
|
const endpointWfs = await new WfsEndpoint(url).isReady()
|
|
355
|
-
const featureTypes =
|
|
359
|
+
const featureTypes = endpointWfs.getFeatureTypes()
|
|
360
|
+
if (!deep) {
|
|
361
|
+
return featureTypes
|
|
362
|
+
}
|
|
356
363
|
const layers = (
|
|
357
364
|
await Promise.allSettled(
|
|
358
365
|
featureTypes.map((collection) => {
|
|
@@ -366,14 +373,16 @@ export async function getLayers(url: string, serviceProtocol: ServiceProtocol) {
|
|
|
366
373
|
}
|
|
367
374
|
case 'wms': {
|
|
368
375
|
const endpointWms = await new WmsEndpoint(url).isReady()
|
|
369
|
-
const
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
376
|
+
const layersSummary = endpointWms
|
|
377
|
+
.getLayers()
|
|
378
|
+
.flatMap(wmsLayerFlatten)
|
|
379
|
+
.filter((l) => l.name)
|
|
380
|
+
if (!deep) {
|
|
381
|
+
return layersSummary
|
|
382
|
+
}
|
|
383
|
+
const layers = layersSummary.map((collection) =>
|
|
384
|
+
endpointWms.getLayerByName(collection.name)
|
|
385
|
+
)
|
|
377
386
|
return layers
|
|
378
387
|
}
|
|
379
388
|
case 'wmts': {
|
|
@@ -46,6 +46,22 @@ export function isBoundingBox(value: unknown): value is BoundingBox {
|
|
|
46
46
|
)
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
+
/**
|
|
50
|
+
* Checks that a bounding box's coordinates stay within the valid
|
|
51
|
+
* longitude (-180/180) and latitude (-90/90) ranges.
|
|
52
|
+
*/
|
|
53
|
+
export function isBoundingBoxWithinWorldExtent(bbox: BoundingBox): boolean {
|
|
54
|
+
const [minX, minY, maxX, maxY] = bbox
|
|
55
|
+
return (
|
|
56
|
+
minX >= -180 &&
|
|
57
|
+
maxX <= 180 &&
|
|
58
|
+
minY >= -90 &&
|
|
59
|
+
maxY <= 90 &&
|
|
60
|
+
minX <= maxX &&
|
|
61
|
+
minY <= maxY
|
|
62
|
+
)
|
|
63
|
+
}
|
|
64
|
+
|
|
49
65
|
export function getGeometryBoundingBox(geometry: Geometry): BoundingBox {
|
|
50
66
|
// use the bounding box if specified in the GeoJSON object
|
|
51
67
|
if (geometry.bbox) {
|
package/translations/de.json
CHANGED
|
@@ -425,7 +425,6 @@
|
|
|
425
425
|
"map.add.layer.wms": "Aus WMS",
|
|
426
426
|
"map.addFromFile.placeholder": "Klicke hier oder ziehe eine Datei herein",
|
|
427
427
|
"map.dropdown.placeholder": "Kein Vorschaulayer verfügbar",
|
|
428
|
-
"map.geocoding.placeholder": "Nach einem Ort suchen",
|
|
429
428
|
"map.help.addFromFile": "Klicke oder ziehe eine Datei herein um eine Karte hinzuzufügen (momentan wird nur das GeoJSON-Format unterstützt).",
|
|
430
429
|
"map.layer.add": "Hinzufügen",
|
|
431
430
|
"map.layers.available": "Verfügbare Layer",
|
|
@@ -690,18 +689,23 @@
|
|
|
690
689
|
"search.filters.recordKind.reuse": "Wiederverwendungen",
|
|
691
690
|
"search.filters.recordKind.service": "Dienste",
|
|
692
691
|
"search.filters.representationType": "Repräsentationstyp",
|
|
692
|
+
"search.filters.resourceCreationRevisionDate": "Ressourcendatum",
|
|
693
693
|
"search.filters.resourceType": "Ressourcentyp",
|
|
694
|
-
"search.filters.spatialExtent": "",
|
|
695
|
-
"search.filters.spatialExtent.
|
|
696
|
-
"search.filters.spatialExtent.
|
|
694
|
+
"search.filters.spatialExtent.bboxFromFile": "",
|
|
695
|
+
"search.filters.spatialExtent.bboxFromFileDelete": "",
|
|
696
|
+
"search.filters.spatialExtent.bboxInitial": "",
|
|
697
|
+
"search.filters.spatialExtent.bboxInitialDelete": "",
|
|
697
698
|
"search.filters.spatialExtent.error.fileTooLarge": "",
|
|
698
699
|
"search.filters.spatialExtent.error.invalidFormat": "",
|
|
699
700
|
"search.filters.spatialExtent.error.noGeometry": "",
|
|
701
|
+
"search.filters.spatialExtent.error.outOfBounds": "",
|
|
700
702
|
"search.filters.spatialExtent.error.title": "",
|
|
703
|
+
"search.filters.spatialExtent": "",
|
|
701
704
|
"search.filters.spatialExtent.helpText": "",
|
|
702
705
|
"search.filters.spatialExtent.import": "",
|
|
703
706
|
"search.filters.standard": "Standard",
|
|
704
707
|
"search.filters.summaryLabel.changeDate": "Geändert am: ",
|
|
708
|
+
"search.filters.summaryLabel.resourceCreationRevisionDate": "Ressourcendatum: ",
|
|
705
709
|
"search.filters.summaryLabel.user": "Geändert von: ",
|
|
706
710
|
"search.filters.title": "Ergebnisse filtern",
|
|
707
711
|
"search.filters.topic": "Themen",
|