geonetwork-ui 2.10.0-dev.cf0577fae → 2.10.0-dev.d37bc8ad9
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 +435 -5787
- package/fesm2022/geonetwork-ui.mjs.map +1 -1
- package/index.d.ts +108 -67
- package/index.d.ts.map +1 -1
- package/material-styles.css +483 -0
- package/package.json +25 -35
- package/src/libs/api/metadata-converter/src/lib/gn4/atomic-operations.ts +48 -7
- package/src/libs/api/metadata-converter/src/lib/gn4/gn4.field.mapper.ts +5 -4
- package/src/libs/api/metadata-converter/src/lib/gn4/metadata-url.service.ts +2 -2
- package/src/libs/api/metadata-converter/src/lib/gn4/types/metadata.model.ts +1 -0
- package/src/libs/api/repository/src/lib/gn4/auth/auth.service.ts +4 -4
- package/src/libs/api/repository/src/lib/gn4/elasticsearch/elasticsearch.service.ts +2 -2
- package/src/libs/api/repository/src/lib/gn4/gn4-repository.ts +44 -30
- package/src/libs/api/repository/src/lib/gn4/organizations/organizations-from-groups.service.ts +1 -1
- package/src/libs/api/repository/src/lib/gn4/organizations/organizations-from-metadata.service.ts +1 -1
- package/src/libs/api/repository/src/lib/gn4/platform/gn4-platform.service.ts +48 -2
- package/src/libs/common/domain/src/lib/model/record/metadata.model.ts +2 -5
- package/src/libs/common/domain/src/lib/model/thesaurus/thesaurus.model.ts +2 -1
- package/src/libs/common/domain/src/lib/model/user/group.model.ts +8 -0
- package/src/libs/common/domain/src/lib/model/user/index.ts +1 -0
- package/src/libs/common/domain/src/lib/platform.service.interface.ts +2 -0
- package/src/libs/feature/catalog/src/lib/sources/sources.service.ts +5 -2
- package/src/libs/feature/editor/src/lib/components/constraint-card/constraint-card.component.ts +0 -2
- package/src/libs/feature/editor/src/lib/components/record-form/form-field/field-focus.directive.ts +4 -1
- package/src/libs/feature/editor/src/lib/components/record-form/form-field/form-field-constraints-shortcuts/form-field-constraints-shortcuts.component.ts +6 -7
- package/src/libs/feature/editor/src/lib/components/record-form/form-field/form-field-topics/form-field-topics.component.ts +2 -2
- package/src/libs/feature/editor/src/lib/components/record-form/form-field/form-field.component.css +0 -34
- package/src/libs/feature/editor/src/lib/components/record-form/record-form.component.css +35 -0
- package/src/libs/feature/editor/src/lib/components/record-form/record-form.component.html +5 -1
- package/src/libs/feature/editor/src/lib/components/record-form/record-form.component.ts +35 -19
- package/src/libs/feature/editor/src/lib/fields.config.ts +60 -47
- package/src/libs/feature/map/src/lib/utils/map-utils.service.ts +33 -0
- package/src/libs/feature/record/src/lib/map-view/map-view.component.ts +9 -1
- package/src/libs/ui/catalog/src/lib/language-switcher/language-switcher.component.ts +2 -2
- package/src/libs/ui/dataviz/src/index.ts +0 -1
- package/src/libs/ui/elements/src/lib/contact-details/contact-details.component.html +1 -1
- package/src/libs/ui/elements/src/lib/contact-pill/contact-pill.component.html +7 -3
- package/src/libs/ui/elements/src/lib/image-overlay-preview/image-overlay-preview.component.css +13 -0
- package/src/libs/ui/elements/src/lib/image-overlay-preview/image-overlay-preview.component.html +13 -3
- package/src/libs/ui/elements/src/lib/image-overlay-preview/image-overlay-preview.component.ts +43 -6
- package/src/libs/ui/elements/src/lib/markdown-parser/markdown-parser.component.ts +2 -2
- package/src/libs/ui/elements/src/lib/metadata-info/metadata-info.component.html +18 -8
- package/src/libs/ui/elements/src/lib/metadata-info/metadata-info.component.ts +29 -1
- package/src/libs/ui/inputs/src/lib/button/button.component.ts +4 -0
- package/src/libs/ui/inputs/src/lib/date-picker/date-picker.component.ts +2 -2
- package/src/libs/ui/map/src/lib/components/spatial-extent/spatial-extent.component.ts +4 -54
- package/src/libs/ui/map/src/lib/map-utils.ts +48 -0
- package/src/libs/ui/search/src/lib/record-preview-feed/record-preview-feed.component.ts +1 -1
- package/src/libs/ui/widgets/src/lib/popover/popover.component.ts +7 -1
- package/src/libs/util/app-config/src/lib/app-config.ts +21 -9
- package/src/libs/util/data-fetcher/src/lib/readers/base-file.ts +1 -2
- package/src/libs/util/data-fetcher/src/lib/readers/wfs.ts +6 -3
- package/src/libs/util/i18n/src/index.ts +0 -1
- package/src/libs/util/i18n/src/lib/i18n.constants.ts +17 -11
- package/src/libs/util/i18n/src/lib/i18n.interceptor.ts +2 -2
- package/src/libs/util/i18n/src/lib/i18n.providers.ts +14 -17
- package/src/libs/util/i18n/src/lib/test.translate.loader.ts +48 -0
- package/src/libs/util/shared/src/lib/links/link-utils.ts +1 -1
- package/src/libs/util/shared/src/lib/services/date.service.ts +3 -3
- package/src/libs/util/shared/src/lib/utils/geojson.ts +58 -1
- package/style.css +0 -1
- package/tailwind.base.css +8 -0
- package/translations/de.json +23 -19
- package/translations/en.json +23 -19
- package/translations/es.json +23 -19
- package/translations/fr.json +23 -19
- package/translations/it.json +23 -19
- package/translations/nl.json +23 -19
- package/translations/pt.json +23 -19
- package/translations/sk.json +23 -19
|
@@ -4,10 +4,12 @@ import {
|
|
|
4
4
|
EditorField,
|
|
5
5
|
EditorSection,
|
|
6
6
|
} from './models/editor-config.model'
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
7
|
+
import { Keyword } from '../../../../../libs/common/domain/src/lib/model/record'
|
|
8
|
+
|
|
9
|
+
export interface ISOTopic {
|
|
10
|
+
value: string
|
|
11
|
+
label: string
|
|
12
|
+
}
|
|
11
13
|
|
|
12
14
|
/**
|
|
13
15
|
* This file contains the configuration of the fields that will be displayed in the editor.
|
|
@@ -359,75 +361,86 @@ export const SPATIAL_SCOPES: Keyword[] = [
|
|
|
359
361
|
]
|
|
360
362
|
|
|
361
363
|
/************************************************************
|
|
362
|
-
***************
|
|
364
|
+
*************** ISO TOPICS **************
|
|
363
365
|
************************************************************
|
|
364
366
|
*/
|
|
365
367
|
|
|
366
|
-
|
|
367
|
-
|
|
368
|
+
// label keys mirror the ISO MD_TopicCategoryCode value for consistency
|
|
369
|
+
// TODO: correctly handle code lists; for instance, this code list is specific to ISO 19139
|
|
370
|
+
export const ISO_TOPICS: ISOTopic[] = [
|
|
371
|
+
{ value: 'biota', label: marker('editor.record.form.topics.iso.biota') },
|
|
368
372
|
{
|
|
369
373
|
value: 'boundaries',
|
|
370
|
-
label: 'editor.record.form.topics.
|
|
374
|
+
label: marker('editor.record.form.topics.iso.boundaries'),
|
|
371
375
|
},
|
|
372
376
|
{
|
|
373
377
|
value: 'climatologyMeteorologyAtmosphere',
|
|
374
|
-
label:
|
|
378
|
+
label: marker(
|
|
379
|
+
'editor.record.form.topics.iso.climatologyMeteorologyAtmosphere'
|
|
380
|
+
),
|
|
381
|
+
},
|
|
382
|
+
{
|
|
383
|
+
value: 'economy',
|
|
384
|
+
label: marker('editor.record.form.topics.iso.economy'),
|
|
385
|
+
},
|
|
386
|
+
{
|
|
387
|
+
value: 'elevation',
|
|
388
|
+
label: marker('editor.record.form.topics.iso.elevation'),
|
|
375
389
|
},
|
|
376
|
-
{ value: 'economy', label: 'editor.record.form.topics.inspire.economy' },
|
|
377
|
-
{ value: 'elevation', label: 'editor.record.form.topics.inspire.elevation' },
|
|
378
390
|
{
|
|
379
391
|
value: 'environment',
|
|
380
|
-
label: 'editor.record.form.topics.
|
|
392
|
+
label: marker('editor.record.form.topics.iso.environment'),
|
|
393
|
+
},
|
|
394
|
+
{
|
|
395
|
+
value: 'farming',
|
|
396
|
+
label: marker('editor.record.form.topics.iso.farming'),
|
|
397
|
+
},
|
|
398
|
+
{
|
|
399
|
+
value: 'geoscientificInformation',
|
|
400
|
+
label: marker('editor.record.form.topics.iso.geoscientificInformation'),
|
|
381
401
|
},
|
|
382
|
-
{ value: 'farming', label: 'editor.record.form.topics.inspire.farming' },
|
|
383
402
|
{
|
|
384
|
-
value: '
|
|
385
|
-
label: 'editor.record.form.topics.
|
|
403
|
+
value: 'health',
|
|
404
|
+
label: marker('editor.record.form.topics.iso.health'),
|
|
386
405
|
},
|
|
387
|
-
{ value: 'health', label: 'editor.record.form.topics.inspire.health' },
|
|
388
406
|
{
|
|
389
407
|
value: 'imageryBaseMapsEarthCover',
|
|
390
|
-
label: 'editor.record.form.topics.
|
|
408
|
+
label: marker('editor.record.form.topics.iso.imageryBaseMapsEarthCover'),
|
|
409
|
+
},
|
|
410
|
+
{
|
|
411
|
+
value: 'inlandWaters',
|
|
412
|
+
label: marker('editor.record.form.topics.iso.inlandWaters'),
|
|
391
413
|
},
|
|
392
|
-
{ value: 'inlandWaters', label: 'editor.record.form.topics.inspire.waters' },
|
|
393
414
|
{
|
|
394
415
|
value: 'intelligenceMilitary',
|
|
395
|
-
label: 'editor.record.form.topics.
|
|
416
|
+
label: marker('editor.record.form.topics.iso.intelligenceMilitary'),
|
|
417
|
+
},
|
|
418
|
+
{
|
|
419
|
+
value: 'location',
|
|
420
|
+
label: marker('editor.record.form.topics.iso.location'),
|
|
421
|
+
},
|
|
422
|
+
{
|
|
423
|
+
value: 'oceans',
|
|
424
|
+
label: marker('editor.record.form.topics.iso.oceans'),
|
|
396
425
|
},
|
|
397
|
-
{ value: 'Location', label: 'editor.record.form.topics.inspire.location' },
|
|
398
|
-
{ value: 'Oceans', label: 'editor.record.form.topics.inspire.oceans' },
|
|
399
426
|
{
|
|
400
427
|
value: 'planningCadastre',
|
|
401
|
-
label: 'editor.record.form.topics.
|
|
428
|
+
label: marker('editor.record.form.topics.iso.planningCadastre'),
|
|
402
429
|
},
|
|
403
|
-
{ value: 'Society', label: 'editor.record.form.topics.inspire.society' },
|
|
404
|
-
{ value: 'Structure', label: 'editor.record.form.topics.inspire.structure' },
|
|
405
430
|
{
|
|
406
|
-
value: '
|
|
407
|
-
label: 'editor.record.form.topics.
|
|
431
|
+
value: 'society',
|
|
432
|
+
label: marker('editor.record.form.topics.iso.society'),
|
|
433
|
+
},
|
|
434
|
+
{
|
|
435
|
+
value: 'structure',
|
|
436
|
+
label: marker('editor.record.form.topics.iso.structure'),
|
|
437
|
+
},
|
|
438
|
+
{
|
|
439
|
+
value: 'transportation',
|
|
440
|
+
label: marker('editor.record.form.topics.iso.transportation'),
|
|
408
441
|
},
|
|
409
442
|
{
|
|
410
443
|
value: 'utilitiesCommunication',
|
|
411
|
-
label: 'editor.record.form.topics.
|
|
444
|
+
label: marker('editor.record.form.topics.iso.utilitiesCommunication'),
|
|
412
445
|
},
|
|
413
446
|
]
|
|
414
|
-
|
|
415
|
-
marker('editor.record.form.topics.inspire.biota')
|
|
416
|
-
marker('editor.record.form.topics.inspire.boundaries')
|
|
417
|
-
marker('editor.record.form.topics.inspire.climatology')
|
|
418
|
-
marker('editor.record.form.topics.inspire.economy')
|
|
419
|
-
marker('editor.record.form.topics.inspire.elevation')
|
|
420
|
-
marker('editor.record.form.topics.inspire.environnement')
|
|
421
|
-
marker('editor.record.form.topics.inspire.farming')
|
|
422
|
-
marker('editor.record.form.topics.inspire.geoscientific')
|
|
423
|
-
marker('editor.record.form.topics.inspire.health')
|
|
424
|
-
marker('editor.record.form.topics.inspire.imagery')
|
|
425
|
-
marker('editor.record.form.topics.inspire.intelligence')
|
|
426
|
-
marker('editor.record.form.topics.inspire.location')
|
|
427
|
-
marker('editor.record.form.topics.inspire.oceans')
|
|
428
|
-
marker('editor.record.form.topics.inspire.planning')
|
|
429
|
-
marker('editor.record.form.topics.inspire.society')
|
|
430
|
-
marker('editor.record.form.topics.inspire.structure')
|
|
431
|
-
marker('editor.record.form.topics.inspire.transportation')
|
|
432
|
-
marker('editor.record.form.topics.inspire.utilities')
|
|
433
|
-
marker('editor.record.form.topics.inspire.waters')
|
|
@@ -2,6 +2,23 @@ import { Injectable } from '@angular/core'
|
|
|
2
2
|
import { extend } from 'ol/extent.js'
|
|
3
3
|
import { CatalogRecord } from '../../../../../../libs/common/domain/src/lib/model/record'
|
|
4
4
|
import { BoundingBox, getGeometryBoundingBox } from '../../../../../../libs/util/shared/src'
|
|
5
|
+
import { MapContextLayer } from '@geospatial-sdk/core'
|
|
6
|
+
import {
|
|
7
|
+
createSpatialExtentLayer,
|
|
8
|
+
SpatialExtentLayerStyle,
|
|
9
|
+
} from '../../../../../../libs/ui/map/src'
|
|
10
|
+
|
|
11
|
+
/**
|
|
12
|
+
* Style of the extent overlay drawn on top of the previewed data: a dashed
|
|
13
|
+
* black outline over a very light fill, so the extent stays readable without
|
|
14
|
+
* hiding the data underneath.
|
|
15
|
+
*/
|
|
16
|
+
const RECORD_EXTENT_OVERLAY_STYLE: SpatialExtentLayerStyle = {
|
|
17
|
+
'stroke-color': 'rgba(0, 0, 0, 0.6)',
|
|
18
|
+
'stroke-width': 2,
|
|
19
|
+
'stroke-line-dash': [8, 6],
|
|
20
|
+
'fill-color': 'rgba(0, 0, 0, 0.03)',
|
|
21
|
+
}
|
|
5
22
|
|
|
6
23
|
@Injectable({
|
|
7
24
|
providedIn: 'root',
|
|
@@ -26,4 +43,20 @@ export class MapUtilsService {
|
|
|
26
43
|
[Infinity, Infinity, -Infinity, -Infinity]
|
|
27
44
|
)
|
|
28
45
|
}
|
|
46
|
+
|
|
47
|
+
/**
|
|
48
|
+
* Builds a non-interactive overlay layer drawing the spatial extent(s)
|
|
49
|
+
* declared in the record's metadata (bounding boxes and/or geometries).
|
|
50
|
+
* Returns null when the record has no usable spatial extent.
|
|
51
|
+
*
|
|
52
|
+
* This is purely for display and is independent from the map's initial view,
|
|
53
|
+
* which is derived separately (see {@link getRecordExtent}).
|
|
54
|
+
*/
|
|
55
|
+
getRecordExtentLayer(record: Partial<CatalogRecord>): MapContextLayer | null {
|
|
56
|
+
return createSpatialExtentLayer(record.spatialExtents ?? [], {
|
|
57
|
+
label: 'Spatial extent',
|
|
58
|
+
clickable: false,
|
|
59
|
+
style: RECORD_EXTENT_OVERLAY_STYLE,
|
|
60
|
+
})
|
|
61
|
+
}
|
|
29
62
|
}
|
|
@@ -431,11 +431,19 @@ export class MapViewComponent implements AfterViewInit {
|
|
|
431
431
|
}),
|
|
432
432
|
withLatestFrom(this.mdViewFacade.metadata$),
|
|
433
433
|
map(([context, metadata]) => {
|
|
434
|
-
|
|
434
|
+
// overlay the record's declared spatial extent on top of the data layers
|
|
435
|
+
const extentLayer = this.mapUtils.getRecordExtentLayer(metadata)
|
|
436
|
+
const layers = extentLayer
|
|
437
|
+
? [...context.layers, extentLayer]
|
|
438
|
+
: context.layers
|
|
439
|
+
// the view (initial zoom) is derived from the data layer or, as a
|
|
440
|
+
// fallback, from the record extent — independently from the overlay above
|
|
441
|
+
if (context.view) return { ...context, layers }
|
|
435
442
|
const extent = this.mapUtils.getRecordExtent(metadata)
|
|
436
443
|
const view = extent ? { extent } : null
|
|
437
444
|
return {
|
|
438
445
|
...context,
|
|
446
|
+
layers,
|
|
439
447
|
view,
|
|
440
448
|
}
|
|
441
449
|
}),
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Component,
|
|
1
|
+
import { Component, inject, InjectionToken } from '@angular/core'
|
|
2
2
|
import { LANGUAGE_STORAGE_KEY } from '../../../../../../libs/util/i18n/src'
|
|
3
3
|
import { TranslateService } from '@ngx-translate/core'
|
|
4
4
|
import { DropdownSelectorComponent } from '../../../../../../libs/ui/inputs/src'
|
|
@@ -26,7 +26,7 @@ export class LanguageSwitcherComponent {
|
|
|
26
26
|
)
|
|
27
27
|
|
|
28
28
|
get currentLang() {
|
|
29
|
-
return this.translate.
|
|
29
|
+
return this.translate.getCurrentLang()
|
|
30
30
|
}
|
|
31
31
|
|
|
32
32
|
changeLanguage(value: unknown) {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<gn-ui-button
|
|
2
|
-
[type]="overlayOpen ? '
|
|
2
|
+
[type]="overlayOpen ? 'gray-light' : 'primary-light'"
|
|
3
3
|
extraClass="group w-full min-h-12 gap-3 justify-between py-2 pl-5 pr-4 rounded"
|
|
4
4
|
data-test="contact-pill"
|
|
5
5
|
(buttonClick)="toggleOverlay()"
|
|
@@ -7,12 +7,16 @@
|
|
|
7
7
|
#overlayOrigin="cdkOverlayOrigin"
|
|
8
8
|
>
|
|
9
9
|
<span
|
|
10
|
-
class="font-title font-medium text-base leading-tight truncate
|
|
10
|
+
class="font-title font-medium text-base leading-tight truncate"
|
|
11
|
+
[class]="!overlayOpen ? 'text-primary-black group-hover:text-white' : ''"
|
|
11
12
|
[title]="displayName"
|
|
12
13
|
>{{ displayName }}</span
|
|
13
14
|
>
|
|
14
15
|
<div
|
|
15
|
-
class="gn-ui-card-icon items-center justify-center w-10 h-8
|
|
16
|
+
class="gn-ui-card-icon items-center justify-center w-10 h-8"
|
|
17
|
+
[class]="
|
|
18
|
+
!overlayOpen ? 'group-hover:border-white group-hover:text-white' : ''
|
|
19
|
+
"
|
|
16
20
|
>
|
|
17
21
|
@if (overlayOpen) {
|
|
18
22
|
<ng-icon class="!w-6 !h-6 !text-[24px]" name="matClose"></ng-icon>
|
package/src/libs/ui/elements/src/lib/image-overlay-preview/image-overlay-preview.component.css
CHANGED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/** the animation values are made to be identical to the cdk overlay values */
|
|
2
|
+
.lightbox-image {
|
|
3
|
+
animation: show 400ms cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
|
|
4
|
+
opacity: 0;
|
|
5
|
+
transform: scale(0.9);
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
@keyframes show {
|
|
9
|
+
100% {
|
|
10
|
+
opacity: 1;
|
|
11
|
+
transform: none;
|
|
12
|
+
}
|
|
13
|
+
}
|
package/src/libs/ui/elements/src/lib/image-overlay-preview/image-overlay-preview.component.html
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<gn-ui-content-ghost
|
|
2
|
-
[showContent]="imageUrl !== undefined"
|
|
2
|
+
[showContent]="imageUrl() !== undefined"
|
|
3
3
|
ghostClass="h-full w-full"
|
|
4
4
|
>
|
|
5
5
|
@if (imageUrl) {
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
>
|
|
10
10
|
<gn-ui-thumbnail
|
|
11
11
|
class="relative h-full w-full"
|
|
12
|
-
[thumbnailUrl]="imageUrl"
|
|
12
|
+
[thumbnailUrl]="imageUrl()"
|
|
13
13
|
fit="cover"
|
|
14
14
|
(placeholderShown)="isPlaceholderShown.emit($event)"
|
|
15
15
|
></gn-ui-thumbnail>
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
class="absolute bottom-0 right-0 z-10 mr-2 mb-2"
|
|
19
19
|
[type]="'outline'"
|
|
20
20
|
[extraClass]="'!py-2 !px-0'"
|
|
21
|
-
(buttonClick)="openLightbox(
|
|
21
|
+
(buttonClick)="openLightbox()"
|
|
22
22
|
>
|
|
23
23
|
<ng-icon name="matZoomOutMap"></ng-icon>
|
|
24
24
|
</gn-ui-button>
|
|
@@ -26,3 +26,13 @@
|
|
|
26
26
|
</div>
|
|
27
27
|
}
|
|
28
28
|
</gn-ui-content-ghost>
|
|
29
|
+
|
|
30
|
+
<ng-template #imageTemplate>
|
|
31
|
+
<img
|
|
32
|
+
data-test="lightbox-image"
|
|
33
|
+
class="lightbox-image bg-white max-h-[90vh] max-w-[90vw]"
|
|
34
|
+
[src]="imageUrl()"
|
|
35
|
+
alt="Preview image"
|
|
36
|
+
(click)="closeLightbox()"
|
|
37
|
+
/>
|
|
38
|
+
</ng-template>
|
package/src/libs/ui/elements/src/lib/image-overlay-preview/image-overlay-preview.component.ts
CHANGED
|
@@ -1,10 +1,19 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import {
|
|
2
|
+
Component,
|
|
3
|
+
inject,
|
|
4
|
+
input,
|
|
5
|
+
output,
|
|
6
|
+
TemplateRef,
|
|
7
|
+
viewChild,
|
|
8
|
+
ViewContainerRef,
|
|
9
|
+
} from '@angular/core'
|
|
3
10
|
import { ContentGhostComponent } from '../content-ghost/content-ghost.component'
|
|
4
11
|
import { ThumbnailComponent } from '../thumbnail/thumbnail.component'
|
|
5
12
|
import { ButtonComponent } from '../../../../../../libs/ui/inputs/src'
|
|
6
13
|
import { NgIcon, provideIcons, provideNgIconsConfig } from '@ng-icons/core'
|
|
7
14
|
import { matZoomOutMap } from '@ng-icons/material-icons/baseline'
|
|
15
|
+
import { Overlay, OverlayRef } from '@angular/cdk/overlay'
|
|
16
|
+
import { TemplatePortal } from '@angular/cdk/portal'
|
|
8
17
|
|
|
9
18
|
@Component({
|
|
10
19
|
selector: 'gn-ui-image-overlay-preview',
|
|
@@ -20,9 +29,37 @@ import { matZoomOutMap } from '@ng-icons/material-icons/baseline'
|
|
|
20
29
|
],
|
|
21
30
|
})
|
|
22
31
|
export class ImageOverlayPreviewComponent {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
32
|
+
imageUrl = input<string>()
|
|
33
|
+
isPlaceholderShown = output<boolean>({})
|
|
34
|
+
|
|
35
|
+
private imageTemplate = viewChild<TemplateRef<HTMLElement>>('imageTemplate')
|
|
36
|
+
private overlay = inject(Overlay)
|
|
37
|
+
private viewContainerRef = inject(ViewContainerRef)
|
|
38
|
+
private overlayRef: OverlayRef
|
|
39
|
+
|
|
40
|
+
openLightbox() {
|
|
41
|
+
const positionStrategy = this.overlay
|
|
42
|
+
.position()
|
|
43
|
+
.global()
|
|
44
|
+
.centerHorizontally()
|
|
45
|
+
.centerVertically()
|
|
46
|
+
const scrollStrategy = this.overlay.scrollStrategies.block()
|
|
47
|
+
|
|
48
|
+
this.overlayRef = this.overlay.create({
|
|
49
|
+
hasBackdrop: true,
|
|
50
|
+
backdropClass: 'bg-black/80',
|
|
51
|
+
positionStrategy,
|
|
52
|
+
scrollStrategy,
|
|
53
|
+
})
|
|
54
|
+
this.overlayRef.backdropClick().subscribe(() => this.overlayRef.dispose())
|
|
55
|
+
const portal = new TemplatePortal(
|
|
56
|
+
this.imageTemplate(),
|
|
57
|
+
this.viewContainerRef
|
|
58
|
+
)
|
|
59
|
+
this.overlayRef.attach(portal)
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
closeLightbox() {
|
|
63
|
+
this.overlayRef?.dispose()
|
|
27
64
|
}
|
|
28
65
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChangeDetectionStrategy, Component, Input } from '@angular/core'
|
|
2
|
-
import {
|
|
2
|
+
import { parse } from 'marked'
|
|
3
3
|
|
|
4
4
|
@Component({
|
|
5
5
|
selector: 'gn-ui-markdown-parser',
|
|
@@ -14,6 +14,6 @@ export class MarkdownParserComponent {
|
|
|
14
14
|
@Input() whitoutStyles?: boolean
|
|
15
15
|
|
|
16
16
|
get parsedMarkdown() {
|
|
17
|
-
return
|
|
17
|
+
return parse(this.textContent ?? '')
|
|
18
18
|
}
|
|
19
19
|
}
|
|
@@ -28,13 +28,23 @@
|
|
|
28
28
|
<gn-ui-max-lines [maxLines]="7">
|
|
29
29
|
<div class="metadata-info-keywords sm:pb-4 flex flex-wrap gap-2">
|
|
30
30
|
@for (keyword of metadata.keywords; track keyword) {
|
|
31
|
-
<
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
31
|
+
<ng-template #keywordTooltip>
|
|
32
|
+
@for (segment of keywordTooltipSegments(keyword); track $index) {
|
|
33
|
+
<span [class.font-bold]="$last">{{ segment }}</span>
|
|
34
|
+
@if (!$last) {
|
|
35
|
+
<span> > </span>
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
</ng-template>
|
|
39
|
+
<gn-ui-popover [content]="keywordTooltip" theme="dark">
|
|
40
|
+
<gn-ui-button
|
|
41
|
+
type="primary-light"
|
|
42
|
+
class="inline-block opacity-70"
|
|
43
|
+
extraClass="lowercase text-sm py-1 px-2"
|
|
44
|
+
(buttonClick)="onKeywordClick(keyword)"
|
|
45
|
+
>{{ keyword.label }}</gn-ui-button
|
|
46
|
+
>
|
|
47
|
+
</gn-ui-popover>
|
|
38
48
|
}
|
|
39
49
|
</div>
|
|
40
50
|
</gn-ui-max-lines>
|
|
@@ -113,7 +123,7 @@
|
|
|
113
123
|
>
|
|
114
124
|
<div class="flex flex-col gap-1 pt-3 pb-4">
|
|
115
125
|
@for (group of contactGroups; track group.role) {
|
|
116
|
-
<div class="flex flex-col gap-1 rounded
|
|
126
|
+
<div class="flex flex-col gap-1 rounded py-4 px-2">
|
|
117
127
|
<p class="text-xs font-normal text-black">
|
|
118
128
|
{{ group.roleLabel | translate }}
|
|
119
129
|
</p>
|
|
@@ -19,12 +19,18 @@ import {
|
|
|
19
19
|
ExpandablePanelComponent,
|
|
20
20
|
MaxLinesComponent,
|
|
21
21
|
} from '../../../../../../libs/ui/layout/src'
|
|
22
|
-
import {
|
|
22
|
+
import {
|
|
23
|
+
TranslateDirective,
|
|
24
|
+
TranslatePipe,
|
|
25
|
+
TranslateService,
|
|
26
|
+
} from '@ngx-translate/core'
|
|
27
|
+
import { marker } from '@biesbjerg/ngx-translate-extract-marker'
|
|
23
28
|
import {
|
|
24
29
|
BadgeComponent,
|
|
25
30
|
ButtonComponent,
|
|
26
31
|
CopyTextButtonComponent,
|
|
27
32
|
} from '../../../../../../libs/ui/inputs/src'
|
|
33
|
+
import { PopoverComponent } from '../../../../../../libs/ui/widgets/src'
|
|
28
34
|
import { ContentGhostComponent } from '../content-ghost/content-ghost.component'
|
|
29
35
|
import { NgIcon, provideIcons } from '@ng-icons/core'
|
|
30
36
|
import { matOpenInNew } from '@ng-icons/material-icons/baseline'
|
|
@@ -35,6 +41,11 @@ import { GnUiHumanizeDateDirective } from '../../../../../../libs/util/shared/sr
|
|
|
35
41
|
import { SpatialExtentComponent } from '../../../../../../libs/ui/map/src'
|
|
36
42
|
import { ContactPillComponent } from '../contact-pill/contact-pill.component'
|
|
37
43
|
|
|
44
|
+
marker('domain.record.keywordType.theme')
|
|
45
|
+
marker('domain.record.keywordType.place')
|
|
46
|
+
marker('domain.record.keywordType.temporal')
|
|
47
|
+
marker('domain.record.keywordType.other')
|
|
48
|
+
|
|
38
49
|
@Component({
|
|
39
50
|
selector: 'gn-ui-metadata-info',
|
|
40
51
|
templateUrl: './metadata-info.component.html',
|
|
@@ -56,6 +67,7 @@ import { ContactPillComponent } from '../contact-pill/contact-pill.component'
|
|
|
56
67
|
GnUiHumanizeDateDirective,
|
|
57
68
|
SpatialExtentComponent,
|
|
58
69
|
ContactPillComponent,
|
|
70
|
+
PopoverComponent,
|
|
59
71
|
],
|
|
60
72
|
viewProviders: [
|
|
61
73
|
provideIcons({
|
|
@@ -66,6 +78,7 @@ import { ContactPillComponent } from '../contact-pill/contact-pill.component'
|
|
|
66
78
|
})
|
|
67
79
|
export class MetadataInfoComponent {
|
|
68
80
|
private dateService = inject(DateService)
|
|
81
|
+
private translateService = inject(TranslateService)
|
|
69
82
|
|
|
70
83
|
@Input() metadata: Partial<CatalogRecord>
|
|
71
84
|
@Input() incomplete: boolean
|
|
@@ -167,4 +180,19 @@ export class MetadataInfoComponent {
|
|
|
167
180
|
onKeywordClick(keyword: Keyword) {
|
|
168
181
|
this.keyword.emit(keyword)
|
|
169
182
|
}
|
|
183
|
+
|
|
184
|
+
keywordTooltipSegments(keyword: Keyword): string[] {
|
|
185
|
+
if (keyword.hierarchyPath?.length) {
|
|
186
|
+
return keyword.hierarchyPath
|
|
187
|
+
}
|
|
188
|
+
if (keyword.thesaurus?.name) {
|
|
189
|
+
return [keyword.thesaurus.name, keyword.label]
|
|
190
|
+
}
|
|
191
|
+
return [
|
|
192
|
+
this.translateService.instant(
|
|
193
|
+
`domain.record.keywordType.${keyword.type}`
|
|
194
|
+
),
|
|
195
|
+
keyword.label,
|
|
196
|
+
]
|
|
197
|
+
}
|
|
170
198
|
}
|
|
@@ -25,6 +25,7 @@ export class ButtonComponent {
|
|
|
25
25
|
| 'outline'
|
|
26
26
|
| 'light'
|
|
27
27
|
| 'gray'
|
|
28
|
+
| 'gray-light'
|
|
28
29
|
| 'black'
|
|
29
30
|
| 'primary-light'
|
|
30
31
|
) {
|
|
@@ -45,6 +46,9 @@ export class ButtonComponent {
|
|
|
45
46
|
case 'gray':
|
|
46
47
|
this.btnClass = 'gn-ui-btn-gray'
|
|
47
48
|
break
|
|
49
|
+
case 'gray-light':
|
|
50
|
+
this.btnClass = 'gn-ui-btn-gray-light'
|
|
51
|
+
break
|
|
48
52
|
case 'black':
|
|
49
53
|
this.btnClass = 'gn-ui-btn-black'
|
|
50
54
|
break
|
|
@@ -2,9 +2,9 @@ import {
|
|
|
2
2
|
ChangeDetectionStrategy,
|
|
3
3
|
Component,
|
|
4
4
|
EventEmitter,
|
|
5
|
+
inject,
|
|
5
6
|
Input,
|
|
6
7
|
Output,
|
|
7
|
-
inject,
|
|
8
8
|
} from '@angular/core'
|
|
9
9
|
import {
|
|
10
10
|
DateAdapter,
|
|
@@ -52,6 +52,6 @@ export class DatePickerComponent {
|
|
|
52
52
|
@Output() dateChange = new EventEmitter<Date>()
|
|
53
53
|
|
|
54
54
|
constructor() {
|
|
55
|
-
this.dateAdapter.setLocale(this.translate.
|
|
55
|
+
this.dateAdapter.setLocale(this.translate.getCurrentLang())
|
|
56
56
|
}
|
|
57
57
|
}
|
|
@@ -1,18 +1,11 @@
|
|
|
1
1
|
import { ChangeDetectorRef, Component, inject, Input } from '@angular/core'
|
|
2
2
|
import { CommonModule } from '@angular/common'
|
|
3
|
-
import {
|
|
4
|
-
import { GeoJSONFeatureCollection } from 'ol/format/GeoJSON.js'
|
|
5
|
-
import GeoJSON from 'ol/format/GeoJSON.js'
|
|
6
|
-
import { Polygon } from 'ol/geom.js'
|
|
7
|
-
import {
|
|
8
|
-
createViewFromLayer,
|
|
9
|
-
MapContext,
|
|
10
|
-
MapContextLayer,
|
|
11
|
-
} from '@geospatial-sdk/core'
|
|
3
|
+
import { createViewFromLayer, MapContext } from '@geospatial-sdk/core'
|
|
12
4
|
import { MapContainerComponent } from '../map-container/map-container.component'
|
|
13
5
|
import { BehaviorSubject, from, Observable, of } from 'rxjs'
|
|
14
6
|
import { map, switchMap, tap } from 'rxjs/operators'
|
|
15
7
|
import { DatasetSpatialExtent } from '../../../../../../../libs/common/domain/src/lib/model/record'
|
|
8
|
+
import { createSpatialExtentLayer } from '../../map-utils'
|
|
16
9
|
|
|
17
10
|
@Component({
|
|
18
11
|
selector: 'gn-ui-spatial-extent',
|
|
@@ -30,39 +23,10 @@ export class SpatialExtentComponent {
|
|
|
30
23
|
spatialExtents$ = new BehaviorSubject<DatasetSpatialExtent[]>([])
|
|
31
24
|
mapContext$: Observable<MapContext> = this.spatialExtents$.pipe(
|
|
32
25
|
switchMap((extents) => {
|
|
33
|
-
|
|
26
|
+
const layer = createSpatialExtentLayer(extents)
|
|
27
|
+
if (!layer) {
|
|
34
28
|
return of(null)
|
|
35
29
|
}
|
|
36
|
-
const featureCollection: GeoJSONFeatureCollection = {
|
|
37
|
-
type: 'FeatureCollection',
|
|
38
|
-
features: [],
|
|
39
|
-
}
|
|
40
|
-
extents.forEach((extent) => {
|
|
41
|
-
if (extent.geometry) {
|
|
42
|
-
featureCollection.features.push({
|
|
43
|
-
type: 'Feature',
|
|
44
|
-
properties: {},
|
|
45
|
-
geometry: extent.geometry,
|
|
46
|
-
})
|
|
47
|
-
} else if (extent.bbox?.length >= 0) {
|
|
48
|
-
featureCollection.features.push({
|
|
49
|
-
type: 'Feature',
|
|
50
|
-
properties: {},
|
|
51
|
-
geometry: this.bboxCoordsToGeometry(extent.bbox),
|
|
52
|
-
})
|
|
53
|
-
}
|
|
54
|
-
})
|
|
55
|
-
|
|
56
|
-
const layer: MapContextLayer = {
|
|
57
|
-
type: 'geojson',
|
|
58
|
-
data: featureCollection,
|
|
59
|
-
label: 'Spatial extents',
|
|
60
|
-
style: {
|
|
61
|
-
'stroke-color': 'black',
|
|
62
|
-
'stroke-width': 2,
|
|
63
|
-
'fill-color': 'rgba(153, 153, 153, 0.3)',
|
|
64
|
-
},
|
|
65
|
-
}
|
|
66
30
|
return from(createViewFromLayer(layer)).pipe(
|
|
67
31
|
map((view) => ({ view, layers: [layer] }) as MapContext),
|
|
68
32
|
tap(() => this._cdr.markForCheck())
|
|
@@ -71,18 +35,4 @@ export class SpatialExtentComponent {
|
|
|
71
35
|
)
|
|
72
36
|
|
|
73
37
|
error = ''
|
|
74
|
-
|
|
75
|
-
bboxCoordsToGeometry(bbox: [number, number, number, number]): Geometry {
|
|
76
|
-
const geometry = new Polygon([
|
|
77
|
-
[
|
|
78
|
-
[bbox[0], bbox[1]],
|
|
79
|
-
[bbox[0], bbox[3]],
|
|
80
|
-
[bbox[2], bbox[3]],
|
|
81
|
-
[bbox[2], bbox[1]],
|
|
82
|
-
[bbox[0], bbox[1]],
|
|
83
|
-
],
|
|
84
|
-
])
|
|
85
|
-
|
|
86
|
-
return new GeoJSON().writeGeometryObject(geometry)
|
|
87
|
-
}
|
|
88
38
|
}
|