geonetwork-ui 2.3.0-dev.2c3530dc → 2.3.0-dev.3222f975

package/src/libs/ui/layout/src/lib/carousel/carousel.component.ts

@@ -4,25 +4,49 @@ import {
   ChangeDetectorRef,
   Component,
   ElementRef,
+  EventEmitter,
   Input,
+  Output,
   ViewChild,
 } from '@angular/core'
 import EmblaCarousel, { EmblaCarouselType } from 'embla-carousel'
+import { CommonModule } from '@angular/common'
 
 @Component({
   selector: 'gn-ui-carousel',
   templateUrl: './carousel.component.html',
   styleUrls: ['./carousel.component.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
+  imports: [CommonModule],
 })
 export class CarouselComponent implements AfterViewInit {
+  @ViewChild('carouselOverflowContainer') carouselOverflowContainer: ElementRef
+
   @Input() containerClass = ''
-  @Input() stepsContainerClass = ''
-  @ViewChild('carouselOverflowContainer')
-  carouselOverflowContainer: ElementRef
-  steps: number[] = []
-  selectedStep = -1
-  emblaApi: EmblaCarouselType
+  @Input() stepsContainerClass = 'w-full bottom-0 top-auto'
+  @Output() currentStepChange = new EventEmitter<number>()
+
+  protected steps: number[] = []
+  protected emblaApi: EmblaCarouselType
+  protected currentStep = 0
+
+  protected refreshSteps = () => {
+    this.steps = this.emblaApi.scrollSnapList()
+    this.currentStep = this.emblaApi.selectedScrollSnap()
+    this.currentStepChange.emit(this.currentStep)
+    this.changeDetector.detectChanges()
+  }
+
+  get isFirstStep() {
+    return this.currentStep === 0
+  }
+  get isLastStep() {
+    return this.currentStep === this.steps.length - 1
+  }
+  get stepsCount() {
+    return this.steps.length
+  }
 
   constructor(private changeDetector: ChangeDetectorRef) {}
 
@@ -33,18 +57,24 @@ export class CarouselComponent implements AfterViewInit {
         duration: 15,
       }
     )
-    const refreshSteps = () => {
-      this.steps = this.emblaApi.scrollSnapList()
-      this.selectedStep = this.emblaApi.selectedScrollSnap()
-      this.changeDetector.detectChanges()
-    }
+
     this.emblaApi
-      .on('init', refreshSteps)
-      .on('reInit', refreshSteps)
-      .on('select', refreshSteps)
+      .on('init', this.refreshSteps)
+      .on('reInit', this.refreshSteps)
+      .on('select', this.refreshSteps)
   }
 
-  scrollToStep(stepIndex: number) {
+  public scrollToStep(stepIndex: number) {
     this.emblaApi.scrollTo(stepIndex)
   }
+
+  public slideToPrevious() {
+    if (this.isFirstStep) return
+    this.emblaApi.scrollPrev()
+  }
+
+  public slideToNext() {
+    if (this.isLastStep) return
+    this.emblaApi.scrollNext()
+  }
 }

package/src/libs/ui/layout/src/lib/form-field-wrapper/form-field-wrapper.component.html

@@ -0,0 +1,18 @@
+<div class="h-full flex flex-col">
+  <div class="flex-none w-full flex flex-row items-center">
+    <span class="flex-none font-bold">{{ label }}</span>
+    <div class="flex-1 flex justify-end items-center">
+      <ng-content select="[form-field-interaction]"></ng-content>
+      <span
+        class="material-symbols-outlined m-2 gn-ui-icon-small"
+        [matTooltip]="hint"
+        matTooltipPosition="above"
+      >
+        help
+      </span>
+    </div>
+  </div>
+  <div class="flex-1">
+    <ng-content></ng-content>
+  </div>
+</div>

package/src/libs/ui/layout/src/lib/form-field-wrapper/form-field-wrapper.component.ts

@@ -0,0 +1,16 @@
+import { ChangeDetectionStrategy, Component, Input } from '@angular/core'
+import { MatIconModule } from '@angular/material/icon'
+import { MatTooltipModule } from '@angular/material/tooltip'
+
+@Component({
+  selector: 'gn-ui-form-field-wrapper',
+  templateUrl: './form-field-wrapper.component.html',
+  styleUrls: ['./form-field-wrapper.component.css'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
+  imports: [MatIconModule, MatTooltipModule],
+})
+export class FormFieldWrapperComponent {
+  @Input() label: string
+  @Input() hint: string
+}

package/src/libs/ui/layout/src/lib/ui-layout.module.ts

@@ -15,14 +15,12 @@ import { CarouselComponent } from './carousel/carousel.component'
     StickyHeaderComponent,
     AnchorLinkDirective,
     ExpandablePanelButtonComponent,
-    CarouselComponent,
   ],
   exports: [
     ExpandablePanelComponent,
     StickyHeaderComponent,
     AnchorLinkDirective,
     ExpandablePanelButtonComponent,
-    CarouselComponent,
   ],
 })
 export class UiLayoutModule {}

package/src/libs/util/shared/src/lib/links/link-classifier.service.ts

@@ -26,7 +26,7 @@ export class LinkClassifierService {
           case 'wmts':
             return [LinkUsage.API, LinkUsage.MAP_API]
           case 'ogcFeatures':
-            return [LinkUsage.API]
+            return [LinkUsage.API, LinkUsage.DOWNLOAD, LinkUsage.GEODATA]
           default:
             return [LinkUsage.UNKNOWN]
         }

package/src/libs/util/shared/src/lib/links/link-utils.ts

@@ -94,6 +94,27 @@ export const FORMATS = {
     color: '#de630b',
     mimeTypes: ['application/x-dxf', 'image/x-dxf'],
   },
+  html: {
+    extensions: ['html', 'htm'],
+    priority: 12,
+    color: '#f2bb3a',
+    mimeTypes: ['text/html'],
+  },
+  fgb: {
+    extensions: ['fgb', 'flatgeobuf'],
+    priority: 13,
+    color: '#f2bb3a',
+    mimeTypes: ['application/flatgeobuf'],
+  },
+  jsonfg: {
+    extensions: ['jsonfg', 'jsonfgc'],
+    priority: 14,
+    color: '#f2bb3a',
+    mimeTypes: [
+      'application/vnd.ogc.fg+json',
+      'application/vnd.ogc.fg+json;compatibility=geojson',
+    ],
+  },
 } as const
 
 export type FileFormat = keyof typeof FORMATS

package/src/libs/util/shared/src/lib/utils/bytes-convert.ts

@@ -0,0 +1,3 @@
+export function megabytesToBytes(megabytes) {
+  return megabytes * 1048576
+}

package/src/libs/util/shared/src/lib/utils/image-resize.ts

@@ -0,0 +1,72 @@
+export function downsizeImage(
+  blob: Blob,
+  maxWidth: number,
+  maxHeight: number
+): Promise<Blob> {
+  return new Promise((resolve, reject) => {
+    const image = new Image()
+    image.src = URL.createObjectURL(blob)
+    image.onload = () => {
+      let width = image.width
+      let height = image.height
+
+      if (width > maxWidth || height > maxHeight) {
+        if (width > height) {
+          height = height * (maxWidth / width)
+          width = maxWidth
+        } else {
+          width = width * (maxHeight / height)
+          height = maxHeight
+        }
+      }
+
+      const canvas = document.createElement('canvas')
+      canvas.width = width
+      canvas.height = height
+
+      const context = canvas.getContext('2d')
+      context.drawImage(image, 0, 0, width, height)
+
+      canvas.toBlob(resolve, blob.type)
+    }
+    image.onerror = reject
+  })
+}
+
+export function downgradeImage(
+  blob: Blob,
+  maxSizeBytes: number
+): Promise<Blob> {
+  return new Promise((resolve, reject) => {
+    const image = new Image()
+    image.src = URL.createObjectURL(blob)
+    image.onload = () => {
+      const width = image.width
+      const height = image.height
+      let quality = 1.0
+
+      const canvas = document.createElement('canvas')
+      canvas.width = width
+      canvas.height = height
+
+      const context = canvas.getContext('2d')
+      context.drawImage(image, 0, 0, width, height)
+
+      const compressAndResolveBlob = (blobToCompress: Blob) => {
+        if (blobToCompress.size <= maxSizeBytes) {
+          resolve(blobToCompress)
+        } else {
+          quality -= 0.1
+          if (quality >= 0) {
+            canvas.toBlob(compressAndResolveBlob, blob.type, quality)
+          } else {
+            reject('Unable to compress image below max size')
+          }
+        }
+      }
+
+      canvas.toBlob(compressAndResolveBlob, blob.type, quality)
+    }
+    image.onerror = reject
+  })
+}

package/src/libs/util/shared/src/lib/utils/index.ts

@@ -1,9 +1,11 @@
+export * from './bytes-convert'
+export * from './event'
+export * from './fuzzy-filter'
+export * from './geojson'
+export * from './image-resize'
 export * from './parse'
-export * from './strip-html'
 export * from './remove-whitespace'
-export * from './geojson'
 export * from './sort-by'
-export * from './url'
-export * from './event'
-export * from './fuzzy-filter'
+export * from './strip-html'
 export * from './temporal-extent-union'
+export * from './url'

package/tailwind.base.css

@@ -9,6 +9,42 @@
     @apply shadow-xl hover:shadow-xl-hover transition-shadow;
   }
 
+  /* ICON CLASSES */
+  .gn-ui-icon-small {
+    font-size: 16px;
+    width: 16px;
+    height: 16px;
+  }
+
+  /* LINK CLASSES */
+  .gn-ui-link {
+    @apply text-blue-600 hover:text-blue-700 hover:underline;
+    text-underline-offset: 0.2em;
+    text-decoration-thickness: 1px;
+  }
+  .gn-ui-link-external-icon {
+    content: 'open_in_new';
+    font-family: 'Material Symbols Outlined';
+    font-size: 0.9em;
+    display: inline-block;
+    vertical-align: top;
+    padding-top: 0.1em;
+  }
+  .gn-ui-link-external {
+    @apply gn-ui-link;
+  }
+  .gn-ui-link-external::before {
+    @apply gn-ui-link-external-icon;
+    padding-right: 0.2em;
+  }
+  .gn-ui-link-external-after {
+    @apply gn-ui-link;
+  }
+  .gn-ui-link-external-after::after {
+    @apply gn-ui-link-external-icon;
+    padding-left: 0.2em;
+  }
+
   /* BUTTON CLASSES */
   /* these are used behind the scenes by the `gn-ui-button` component */
 

package/translations/de.json

@@ -1,4 +1,5 @@
 {
+  "button.login": "",
   "catalog.figures.datasets": "{count, plural, =0{Datensätze} one{Datensatz} other{Datensätze}}",
   "catalog.figures.organisations": "{count, plural, =0{Organisationen} one{Organisation} other{Organisationen}}",
   "chart.aggregation.average": "Durchschnitt",
@@ -144,7 +145,26 @@
   "downloads.format.unknown": "unbekannt",
   "downloads.wfs.featuretype.not.found": "Der Layer wurde nicht gefunden",
   "dropFile": "Datei ablegen",
+  "editor.record.form.license": "Lizenz",
+  "editor.record.form.license.cc-by": "",
+  "editor.record.form.license.cc-by-sa": "",
+  "editor.record.form.license.cc-zero": "",
+  "editor.record.form.license.etalab": "",
+  "editor.record.form.license.etalab-v2": "",
+  "editor.record.form.license.odbl": "",
+  "editor.record.form.license.odc-by": "",
+  "editor.record.form.license.pddl": "",
+  "editor.record.form.license.unknown": "Unbekannt oder nicht vorhanden",
+  "editor.record.form.resourceUpdated": "",
+  "editor.record.loadError.body": "",
+  "editor.record.loadError.closeMessage": "",
+  "editor.record.loadError.title": "",
   "editor.record.publish": "",
+  "editor.record.publishError.body": "",
+  "editor.record.publishError.closeMessage": "",
+  "editor.record.publishError.title": "",
+  "editor.record.publishSuccess.body": "",
+  "editor.record.publishSuccess.title": "",
   "editor.record.upToDate": "",
   "externalviewer.dataset.unnamed": "Datensatz aus dem Datahub",
   "facets.block.title.OrgForResource": "Organisation",
@@ -159,6 +179,16 @@
   "facets.block.title.tag.default": "Stichwort",
   "facets.block.title.th_regions_tree.default": "Regionen",
   "favorite.not.authenticated.tooltip": "<div><a href=' {link} '>Anmelden</a>, um auf diese Funktion zuzugreifen</div>",
+  "input.image.altTextPlaceholder": "",
+  "input.image.delete": "",
+  "input.image.displayAltTextInput": "",
+  "input.image.displayUrlInput": "",
+  "input.image.dropFileLabel": "",
+  "input.image.selectFileLabel": "",
+  "input.image.uploadErrorLabel": "",
+  "input.image.uploadErrorRetry": "",
+  "input.image.uploadProgressCancel": "",
+  "input.image.uploadProgressLabel": "",
   "language.ca": "Katalanisch",
   "language.cs": "Tschechisch",
   "language.de": "Deutsch",
@@ -177,6 +207,7 @@
   "map.add.layer": "Eine Ebene hinzufügen",
   "map.add.layer.catalog": "Aus dem Katalog",
   "map.add.layer.file": "Aus einer Datei",
+  "map.add.layer.ogc.api": "",
   "map.add.layer.wfs": "Aus WFS",
   "map.add.layer.wms": "Aus WMS",
   "map.addFromFile.placeholder": "Klicke hier oder ziehe eine Datei herein",
@@ -188,12 +219,14 @@
   "map.loading.data": "Kartendaten werden geladen...",
   "map.loading.service": "Dienst wird geladen...",
   "map.navigation.message": "Bitte verwenden Sie STRG + Maus (oder zwei Finger auf einem Mobilgerät), um die Karte zu navigieren",
+  "map.ogc.urlInput.hint": "",
   "map.select.layer": "Datenquelle",
   "map.wfs.urlInput.hint": "Geben Sie die WFS URL ein",
   "map.wms.urlInput.hint": "Geben Sie die WMS URL ein",
   "multiselect.filter.placeholder": "Suche",
   "nav.back": "Zurück",
   "next": "weiter",
+  "ogc.unreachable.unknown": "Der Dienst konnte nicht erreicht werden",
   "organisation.filter.placeholder": "Ergebnisse filtern",
   "organisation.sort.sortBy": "Sortieren nach:",
   "organisations.hits.found": "{hits, plural, =0{Keine Organisation gefunden} other{{hits} von {total} Organisationen angezeigt}}",
@@ -272,6 +305,14 @@
   "record.metadata.updateFrequency": "Aktualisierungsfrequenz der Daten",
   "record.metadata.updatedOn": "Letzte Aktualisierung der Dateninformationen",
   "record.metadata.usage": "Nutzung und Einschränkungen",
+  "record.metadata.userFeedbacks": "",
+  "record.metadata.userFeedbacks.anonymousUser": "",
+  "record.metadata.userFeedbacks.newAnswer.buttonTitle": "",
+  "record.metadata.userFeedbacks.newAnswer.placeholder": "",
+  "record.metadata.userFeedbacks.newComment.placeholder": "",
+  "record.metadata.userFeedbacks.sortSelector.choices.newestFirst": "",
+  "record.metadata.userFeedbacks.sortSelector.choices.oldestFirst": "",
+  "record.metadata.userFeedbacks.sortSelector.label": "",
   "record.more.details": "Weitere Details",
   "record.tab.chart": "Diagramm",
   "record.tab.data": "Tabelle",

package/translations/en.json

@@ -1,4 +1,5 @@
 {
+  "button.login": "Log in",
   "catalog.figures.datasets": "{count, plural, =0{datasets} one{dataset} other{datasets}}",
   "catalog.figures.organisations": "{count, plural, =0{organisations} one{organisation} other{organisations}}",
   "chart.aggregation.average": "average",
@@ -144,7 +145,26 @@
   "downloads.format.unknown": "unknown",
   "downloads.wfs.featuretype.not.found": "The layer was not found",
   "dropFile": "drop file",
+  "editor.record.form.license": "License",
+  "editor.record.form.license.cc-by": "Creative Commons CC-BY",
+  "editor.record.form.license.cc-by-sa": "Creative Commons CC-BY-SA",
+  "editor.record.form.license.cc-zero": "Creative Commons CC-0",
+  "editor.record.form.license.etalab": "Open Licence (Etalab)",
+  "editor.record.form.license.etalab-v2": "Open Licence v2.0 (Etalab)",
+  "editor.record.form.license.odbl": "Open Data Commons ODbL",
+  "editor.record.form.license.odc-by": "Open Data Commons ODC-By",
+  "editor.record.form.license.pddl": "Open Data Commons PDDL",
+  "editor.record.form.license.unknown": "Unknown or absent",
+  "editor.record.form.resourceUpdated": "Last update date",
+  "editor.record.loadError.body": "The record could not be loaded:",
+  "editor.record.loadError.closeMessage": "Understood",
+  "editor.record.loadError.title": "Error loading record",
   "editor.record.publish": "Publish this record",
+  "editor.record.publishError.body": "The record could not be published:",
+  "editor.record.publishError.closeMessage": "Understood",
+  "editor.record.publishError.title": "Error publishing record",
+  "editor.record.publishSuccess.body": "The record was successfully published!",
+  "editor.record.publishSuccess.title": "Publish success",
   "editor.record.upToDate": "This record is up to date",
   "externalviewer.dataset.unnamed": "Datahub layer",
   "facets.block.title.OrgForResource": "Organisation",
@@ -159,6 +179,16 @@
   "facets.block.title.tag.default": "Tag",
   "facets.block.title.th_regions_tree.default": "Regions",
   "favorite.not.authenticated.tooltip": "<div><a href=' {link} '>Login</a> to access this feature</div>",
+  "input.image.altTextPlaceholder": "Image alternate text",
+  "input.image.delete": "Delete",
+  "input.image.displayAltTextInput": "Alternate text",
+  "input.image.displayUrlInput": "Enter a URL",
+  "input.image.dropFileLabel": "or drop it here",
+  "input.image.selectFileLabel": "Select an image",
+  "input.image.uploadErrorLabel": "The image could not be uploaded",
+  "input.image.uploadErrorRetry": "Retry",
+  "input.image.uploadProgressCancel": "Cancel",
+  "input.image.uploadProgressLabel": "Upload in progress...",
   "language.ca": "Catalan",
   "language.cs": "Czech",
   "language.de": "German",
@@ -177,6 +207,7 @@
   "map.add.layer": "Add a layer",
   "map.add.layer.catalog": "From the catalog",
   "map.add.layer.file": "From a file",
+  "map.add.layer.ogc.api": "From OGC API",
   "map.add.layer.wfs": "From WFS",
   "map.add.layer.wms": "From WMS",
   "map.addFromFile.placeholder": "Click or drop a file here",
@@ -188,12 +219,14 @@
   "map.loading.data": "Loading map data...",
   "map.loading.service": "Loading service...",
   "map.navigation.message": "Please use CTRL + mouse (or two fingers on mobile) to navigate the map",
+  "map.ogc.urlInput.hint": "Enter OGC API service URL",
   "map.select.layer": "Data source",
   "map.wfs.urlInput.hint": "Enter WFS service URL",
   "map.wms.urlInput.hint": "Enter WMS service URL",
   "multiselect.filter.placeholder": "Search",
   "nav.back": "Back",
   "next": "next",
+  "ogc.unreachable.unknown": "The service could not be reached",
   "organisation.filter.placeholder": "Filter results",
   "organisation.sort.sortBy": "Sort by:",
   "organisations.hits.found": "{hits, plural, =0{No organizations found} other{{hits} out of {total} organizations shown}}",
@@ -272,6 +305,14 @@
   "record.metadata.updateFrequency": "Data Update Frequency",
   "record.metadata.updatedOn": "Last Data Information Update",
   "record.metadata.usage": "License and Conditions",
+  "record.metadata.userFeedbacks": "Questions / Answers",
+  "record.metadata.userFeedbacks.anonymousUser": "In order to leave a comment, please log in.",
+  "record.metadata.userFeedbacks.newAnswer.buttonTitle": "Publish",
+  "record.metadata.userFeedbacks.newAnswer.placeholder": "Answer...",
+  "record.metadata.userFeedbacks.newComment.placeholder": "Write your comment here...",
+  "record.metadata.userFeedbacks.sortSelector.choices.newestFirst": "Newest comments first",
+  "record.metadata.userFeedbacks.sortSelector.choices.oldestFirst": "Oldest comments first",
+  "record.metadata.userFeedbacks.sortSelector.label": "Sort by ...",
   "record.more.details": "Read more",
   "record.tab.chart": "Chart",
   "record.tab.data": "Table",

package/translations/es.json

@@ -1,4 +1,5 @@
 {
+  "button.login": "",
   "catalog.figures.datasets": "conjuntos de datos",
   "catalog.figures.organisations": "organizaciones",
   "chart.aggregation.average": "promedio",
@@ -144,7 +145,26 @@
   "downloads.format.unknown": "",
   "downloads.wfs.featuretype.not.found": "",
   "dropFile": "",
+  "editor.record.form.license": "",
+  "editor.record.form.license.cc-by": "",
+  "editor.record.form.license.cc-by-sa": "",
+  "editor.record.form.license.cc-zero": "",
+  "editor.record.form.license.etalab": "",
+  "editor.record.form.license.etalab-v2": "",
+  "editor.record.form.license.odbl": "",
+  "editor.record.form.license.odc-by": "",
+  "editor.record.form.license.pddl": "",
+  "editor.record.form.license.unknown": "",
+  "editor.record.form.resourceUpdated": "",
+  "editor.record.loadError.body": "",
+  "editor.record.loadError.closeMessage": "",
+  "editor.record.loadError.title": "",
   "editor.record.publish": "",
+  "editor.record.publishError.body": "",
+  "editor.record.publishError.closeMessage": "",
+  "editor.record.publishError.title": "",
+  "editor.record.publishSuccess.body": "",
+  "editor.record.publishSuccess.title": "",
   "editor.record.upToDate": "",
   "externalviewer.dataset.unnamed": "",
   "facets.block.title.OrgForResource": "",
@@ -159,6 +179,16 @@
   "facets.block.title.tag.default": "",
   "facets.block.title.th_regions_tree.default": "",
   "favorite.not.authenticated.tooltip": "",
+  "input.image.altTextPlaceholder": "",
+  "input.image.delete": "",
+  "input.image.displayAltTextInput": "",
+  "input.image.displayUrlInput": "",
+  "input.image.dropFileLabel": "",
+  "input.image.selectFileLabel": "",
+  "input.image.uploadErrorLabel": "",
+  "input.image.uploadErrorRetry": "",
+  "input.image.uploadProgressCancel": "",
+  "input.image.uploadProgressLabel": "",
   "language.ca": "Catalán",
   "language.cs": "Checo",
   "language.de": "Alemán",
@@ -177,6 +207,7 @@
   "map.add.layer": "",
   "map.add.layer.catalog": "",
   "map.add.layer.file": "",
+  "map.add.layer.ogc.api": "",
   "map.add.layer.wfs": "",
   "map.add.layer.wms": "",
   "map.addFromFile.placeholder": "",
@@ -188,12 +219,14 @@
   "map.loading.data": "",
   "map.loading.service": "",
   "map.navigation.message": "",
+  "map.ogc.urlInput.hint": "",
   "map.select.layer": "",
   "map.wfs.urlInput.hint": "",
   "map.wms.urlInput.hint": "",
   "multiselect.filter.placeholder": "",
   "nav.back": "",
   "next": "",
+  "ogc.unreachable.unknown": "",
   "organisation.filter.placeholder": "",
   "organisation.sort.sortBy": "",
   "organisations.hits.found": "",
@@ -272,6 +305,14 @@
   "record.metadata.updateFrequency": "",
   "record.metadata.updatedOn": "",
   "record.metadata.usage": "",
+  "record.metadata.userFeedbacks": "",
+  "record.metadata.userFeedbacks.anonymousUser": "",
+  "record.metadata.userFeedbacks.newAnswer.buttonTitle": "",
+  "record.metadata.userFeedbacks.newAnswer.placeholder": "",
+  "record.metadata.userFeedbacks.newComment.placeholder": "",
+  "record.metadata.userFeedbacks.sortSelector.choices.newestFirst": "",
+  "record.metadata.userFeedbacks.sortSelector.choices.oldestFirst": "",
+  "record.metadata.userFeedbacks.sortSelector.label": "",
   "record.more.details": "",
   "record.tab.chart": "",
   "record.tab.data": "",