@provoly/dashboard 0.14.12 → 0.14.13

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.
@@ -7,7 +7,7 @@ import { Injectable, Component, ViewEncapsulation, Pipe, ViewContainerRef, Templ
7
7
  import * as i6 from '@angular/forms';
8
8
  import { FormsModule } from '@angular/forms';
9
9
  import * as i2 from '@provoly/dashboard';
10
- import { widgetMapConfig, DashboardActions, ContextMenuActions, TooltipMode, ItemUtils, FieldType, DEFAULT_PROJECTION, ClassSelectors, FieldSelectors, DataWidgetComponent, WIDGET_HEADER_HEIGHT, ConfigSelectors, DashboardSelectors, GeoMetadata, GeometricFieldTypes, Operation, DataSourceSelectors, ResultsetUtils, BaseWidgetModule, PryCoreModule, PryDashboardModule, PrySelectModule, PryIconModule, PryToggleModule, PryOverlayModule, PryI18nModule, PryRangeModule } from '@provoly/dashboard';
10
+ import { widgetMapConfig, DashboardActions, ContextMenuActions, TooltipMode, ItemUtils, FieldType, DEFAULT_PROJECTION, ClassSelectors, FieldSelectors, DataWidgetComponent, WIDGET_HEADER_HEIGHT, NamedQueryTypes, DashboardSelectors, ConfigSelectors, GeoMetadata, GeometricFieldTypes, Operation, DataSourceSelectors, ResultsetUtils, BaseWidgetModule, PryCoreModule, PryDashboardModule, PrySelectModule, PryIconModule, PryToggleModule, PryOverlayModule, PryI18nModule, PryRangeModule } from '@provoly/dashboard';
11
11
  import * as i7 from '@provoly/dashboard/components/checkbox';
12
12
  import { PryCheckboxModule } from '@provoly/dashboard/components/checkbox';
13
13
  import equal from 'fast-deep-equal/es6';
@@ -20,7 +20,7 @@ import { toLonLat, get, transform, fromLonLat } from 'ol/proj';
20
20
  import { register } from 'ol/proj/proj4';
21
21
  import { Vector, TileWMS, WMTS, XYZ, Cluster } from 'ol/source';
22
22
  import proj4 from 'proj4';
23
- import { map, combineLatest, filter, BehaviorSubject, startWith, distinctUntilChanged, debounceTime, delay, mergeMap, of, from } from 'rxjs';
23
+ import { map, combineLatest, filter, BehaviorSubject, distinctUntilChanged, startWith, debounceTime, delay, mergeMap, of, from } from 'rxjs';
24
24
  import { ScaleLine } from 'ol/control';
25
25
  import { Polygon, Circle as Circle$1, LineString } from 'ol/geom';
26
26
  import PointerInteraction from 'ol/interaction/Pointer';
@@ -1076,7 +1076,27 @@ class WidgetMapComponent extends DataWidgetComponent {
1076
1076
  this.classes$ = this.store
1077
1077
  .select(ClassSelectors.classes)
1078
1078
  .pipe(map((classes) => classes.sort((a, b) => a.name.localeCompare(b.name))));
1079
+ this.usedClasses$ = combineLatest([this.classes$, this.usedDatasources$]).pipe(map(([classes, datasources]) => {
1080
+ return classes.filter((classItem) => datasources.some((dataSource) => {
1081
+ if (dataSource.sourceType === 'namedQuery' && 'type' in dataSource.request) {
1082
+ if (dataSource.request.type === NamedQueryTypes.MULTI_CLASS ||
1083
+ dataSource.request.type === NamedQueryTypes.FULL_TEXT) {
1084
+ return true;
1085
+ }
1086
+ }
1087
+ return dataSource.sourceType === 'dataset'
1088
+ ? dataSource.oClass === classItem.id
1089
+ : dataSource.sourceType === 'namedQuery' && 'oClass' in dataSource.request
1090
+ ? dataSource.request.oClass === classItem.id
1091
+ : dataSource.sourceType === 'namedQuery' && 'type' in dataSource.request
1092
+ ? dataSource.request.type === NamedQueryTypes.MONO_CLASS
1093
+ : false;
1094
+ }));
1095
+ }));
1079
1096
  this.fields$ = this.store.select(FieldSelectors.fields);
1097
+ this.datasourceFilters$ = this.store
1098
+ .select(DashboardSelectors.datasourceFilters)
1099
+ .pipe(distinctUntilChanged((p, c) => equal(p, c)));
1080
1100
  this.styles$ = this.store.select(ConfigSelectors.mapStyles).pipe(map((styles) => styles.concat({
1081
1101
  identifier: this.NO_STYLE,
1082
1102
  label: this.translateService.instant('@pry.widget.map.noStyle')
@@ -1293,7 +1313,7 @@ class WidgetMapComponent extends DataWidgetComponent {
1293
1313
  this.classes$,
1294
1314
  this.additionalLayers$,
1295
1315
  this.itemStyles$,
1296
- this.store.select(DashboardSelectors.datasourceFilters).pipe(distinctUntilChanged((p, c) => equal(p, c)))
1316
+ this.datasourceFilters$
1297
1317
  ]).pipe(filter(([resultSet, options, classes, additionalLayers, itemStyles, filters]) => !!resultSet && !!options && !!classes), map(([resultSet, options, classes, additionalLayers, itemStyles, filters]) => {
1298
1318
  let hasRelationLayer = null;
1299
1319
  const layers = (options?.layers || [])
@@ -1377,7 +1397,12 @@ class WidgetMapComponent extends DataWidgetComponent {
1377
1397
  }
1378
1398
  return layers;
1379
1399
  }));
1380
- this.aggregatedExtents$ = combineLatest([this.geoServerLayerDescriptions$, this.classes$, this.fields$]).pipe(mergeMap(([layers, classes, fields]) => combineLatest(layers
1400
+ this.aggregatedExtents$ = combineLatest([
1401
+ this.geoServerLayerDescriptions$,
1402
+ this.classes$,
1403
+ this.fields$,
1404
+ this.datasourceFilters$
1405
+ ]).pipe(mergeMap(([layers, classes, fields, filters]) => combineLatest(layers
1381
1406
  .map((layer) => (classes.find((clazz) => clazz.id === layer.oClass) ?? { attributes: [] }).attributes
1382
1407
  .map((attr) => ({ attr, field: fields.find((field) => field.id === attr.field) }))
1383
1408
  .filter(({ attr, field }) => GeometricFieldTypes.includes(field?.type ?? '----'))
@@ -1853,11 +1878,11 @@ class WidgetMapComponent extends DataWidgetComponent {
1853
1878
  this.store.dispatch(DashboardActions.resetWmsFeatures());
1854
1879
  }
1855
1880
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: WidgetMapComponent, deps: [{ token: i1.Store }, { token: i2.PrySnackbarService }, { token: i2.PryI18nService }, { token: i2.TooltipFactoryService }, { token: i3.Overlay }, { token: i0.ViewContainerRef }, { token: i2.SymbolService }, { token: i0.Injector }, { token: WidgetMapLayerService }, { token: i2.PryAggregationService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
1856
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: WidgetMapComponent, selector: "pry-widget-map", viewQueries: [{ propertyName: "mapRef", first: true, predicate: ["mapRef"], descendants: true }, { propertyName: "popup", first: true, predicate: ["popup"], descendants: true }, { propertyName: "popupContent", first: true, predicate: ["popupContent"], descendants: true, read: ViewContainerRef }, { propertyName: "exportTypeTemplate", first: true, predicate: ["exportTypeTemplate"], descendants: true, read: TemplateRef }, { propertyName: "address", first: true, predicate: ["address"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pry-widget-map-css></pry-widget-map-css>\n<div class=\"o-widget o-widget--map\">\n <pry-widget-header\n [datasourceIds]=\"(datasourceIds$ | async) ?? []\"\n *ngIf=\"displayHeader$ | async\"\n [widgetIndex]=\"widgetIndex\"\n [manifest]=\"manifest\"\n (manifestModified)=\"manifestModified.emit($event)\"\n [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n #header\n >\n <pry-settings\n (saveTriggered)=\"emitManifest()\"\n (changeTitle)=\"changeWidgetTitle($event)\"\n [headerPresent]=\"displayHeader$ | async\"\n [widgetIndex]=\"widgetIndex\"\n [header]=\"header\"\n [open$]=\"open$\"\n class=\"o-settings\"\n >\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_style\">{{ '@pry.widget.map.style' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeStyle($event)\"\n [itemsAsOption]=\"true\"\n [items]=\"styles$ | async\"\n [ngModel]=\"optionsCopy.style\"\n bindLabel=\"label\"\n bindValue=\"identifier\"\n id=\"map_style\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"optionsCopy.style === STYLE_FROM_URL\">\n <label class=\"a-label\" for=\"style_URL\">{{ '@pry.widget.map.styleUrl' | i18n }}</label>\n <input\n id=\"style_URL\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeStyleURL($event)\"\n [value]=\"optionsCopy.styleURL ?? ''\"\n />\n </div>\n\n <pry-checkbox (ngModelChange)=\"changeSingleLayer($event)\" [ngModel]=\"optionsCopy.singleLayer ?? false\">\n {{ '@pry.widget.map.singleLayer' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeAutoLayer($event)\" [ngModel]=\"optionsCopy.automaticLayers ?? false\">\n {{ '@pry.widget.map.autoLayer' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeFit($event)\" [ngModel]=\"optionsCopy.fit ?? false\">\n {{ '@pry.widget.map.fit' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeAttributions($event)\" [ngModel]=\"optionsCopy.attributions ?? false\">\n {{ '@pry.widget.map.attributions' | i18n }}\n </pry-checkbox>\n\n <div class=\"o-settings__popup__content__actions -has-separator\">\n <button type=\"button\" (click)=\"addLayer()\" class=\"a-btn a-btn--icon-text -link-like\">\n <pry-icon iconSvg=\"library_add\"></pry-icon>\n {{ '@pry.widget.map.addLayer' | i18n }}\n </button>\n </div>\n\n <div *ngFor=\"let layer of optionsCopy?.layers; let i = index\" class=\"o-settings__popup__content__fields\">\n <div class=\"o-settings__popup__content__fields__head\">\n <h3 class=\"a-h3 settings-layer-title__title\">{{ '@pry.widget.map.layer' | i18n : { index: i + 1 } }}</h3>\n <div class=\"m-btn-group\">\n <button type=\"button\" class=\"a-btn a-btn--icon-only\" (click)=\"invertLayers(i, i - 1)\" *ngIf=\"i > 0\">\n <pry-icon iconSvg=\"fleche_haut\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.action.moveUp' | i18n }}</span>\n </button>\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n (click)=\"invertLayers(i, i + 1)\"\n *ngIf=\"i < (optionsCopy?.layers?.length ?? 0) - 1\"\n >\n <pry-icon iconSvg=\"fleche_bas\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.action.moveDown' | i18n }}</span>\n </button>\n </div>\n </div>\n\n <div class=\"o-settings__popup__content__fields__content\">\n <pry-range\n [ngModel]=\"(layer?.opacity ?? 100) + ''\"\n (ngModelChange)=\"changeOpacity(layer, $event)\"\n labelTranslate=\"@pry.widget.map.opacity\"\n min=\"0\"\n max=\"100\"\n ></pry-range>\n\n <fieldset>\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.layerOptions' | i18n : { index: i + 1 } }}</legend>\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_layerTitle\">{{ '@pry.widget.map.layerTitle' | i18n }}</label>\n <input\n id=\"map_layerTitle\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeTitle($event, layer)\"\n [value]=\"layer.title ?? ''\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"!['geoserver', 'auto'].includes(layer.type)\">\n <label class=\"a-label\" for=\"map_layerType\">{{ '@pry.widget.map.layerType.title' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeLayerType($event, i)\"\n [bindData]=\"true\"\n [itemsAsOption]=\"true\"\n [items]=\"layerTypes\"\n [labelTranslate]=\"true\"\n [ngModel]=\"layer.type\"\n baseTranslate=\"@pry.widget.map.layerType.\"\n class=\"a-pry-select\"\n id=\"map_layerType\"\n ></pry-select>\n </div>\n\n <div\n *ngIf=\"\n layer.type !== 'relation' &&\n layer.type !== 'wms' &&\n layer.type !== 'wmts' &&\n layer.type !== 'geoserver' &&\n layer.type !== 'featurelayer' &&\n layer.type !== 'vectortile' &&\n layer.type !== 'rastertile' &&\n layer.type !== 'auto'\n \"\n class=\"m-form-label-field\"\n >\n <label class=\"a-label\" for=\"map_classes\">{{ '@pry.widget.map.classes' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeClasses($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"classes$ | async\"\n [multiple]=\"true\"\n [ngModel]=\"layer.classes\"\n bindLabel=\"name\"\n bindValue=\"id\"\n class=\"a-pry-select\"\n id=\"map_classes\"\n ></pry-select>\n </div>\n </fieldset>\n </div>\n\n <fieldset\n *ngIf=\"\n layer.type !== 'relation' &&\n layer.type !== 'wms' &&\n layer.type !== 'wmts' &&\n layer.type !== 'geoserver' &&\n layer.type !== 'featurelayer' &&\n layer.type !== 'vectortile' &&\n layer.type !== 'rastertile'\n \"\n >\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.locationAttr' | i18n }}</legend>\n <ng-container\n *ngIf=\"\n layer\n | geometryFieldsFor : { resultSet: resultSet$, classes: layer.classes, type: layer.type }\n | async as fields\n \"\n >\n <div\n *ngIf=\"\n ['heatmap', 'bubble', 'marker', 'point', 'line', 'polygon', 'multi-line', 'multi-polygon'].indexOf(\n layer.type\n ) >= 0\n \"\n >\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_locationAttribute_both\">{{\n '@pry.widget.map.locationAttribute.both' | i18n\n }}</label>\n <pry-select\n (ngModelChange)=\"changeLocationAttributes($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"fields\"\n [ngModel]=\"layer.attribute\"\n bindLabel=\"name\"\n bindValue=\"name\"\n id=\"map_locationAttribute_both\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n </div>\n\n <div *ngIf=\"['heatmap', 'bubble'].indexOf(layer.type) >= 0\">\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_intensityAttribute\">{{\n '@pry.widget.map.intensityAttribute' | i18n\n }}</label>\n <pry-select\n (ngModelChange)=\"changeIntensityAttributes($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"fields\"\n [ngModel]=\"layerHasIntensity(layer).intensityAttribute\"\n bindLabel=\"name\"\n bindValue=\"name\"\n id=\"map_intensityAttribute\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n </div>\n </ng-container>\n </fieldset>\n\n <fieldset\n *ngIf=\"\n layer.type === 'wms' ||\n layer.type === 'wmts' ||\n layer.type === 'featurelayer' ||\n layer.type === 'vectortile' ||\n layer.type === 'rastertile'\n \"\n >\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.tile' | i18n }}</legend>\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_wms_url\">{{ '@pry.widget.map.wms.url' | i18n }}</label>\n <input\n id=\"map_wms_url\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeUrl($event, layer)\"\n [value]=\"layer.url\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wms' || layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_paramLayer\">{{ '@pry.widget.map.wms.paramLayer' | i18n }}</label>\n <input\n id=\"map_wms_paramLayer\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeParamLayer($event, layer)\"\n [value]=\"layer.paramLayer\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_matrixSet\">{{ '@pry.widget.map.wms.matrixSet' | i18n }}</label>\n <input\n id=\"map_wms_matrixSet\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeMatrixSet($event, layer)\"\n [value]=\"layer.matrixSet\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_style\">{{ '@pry.widget.map.wms.style' | i18n }}</label>\n <input\n id=\"map_wms_style\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeParamStyle($event, layer)\"\n [value]=\"layer.style\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wms'\">\n <pry-checkbox (ngModelChange)=\"changeParamTiled($event, layer)\" [ngModel]=\"layer?.paramTiled ?? false\">\n {{ '@pry.widget.map.wms.paramTiled' | i18n }}\n </pry-checkbox>\n </div>\n </fieldset>\n\n <fieldset *ngIf=\"layer.type === 'marker'\">\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.clustering' | i18n }}</legend>\n <div class=\"m-form-label-field\">\n <pry-checkbox (ngModelChange)=\"changeClustered(layer, $event)\" [ngModel]=\"layer.clustered\">\n {{ '@pry.widget.map.clustered' | i18n }}\n </pry-checkbox>\n </div>\n <div *ngIf=\"layer.clustered\">\n <pry-range\n [ngModel]=\"layer.clustered\"\n (ngModelChange)=\"changeClusterDistance(layer, $event)\"\n labelTranslate=\"@pry.widget.map.clusterDistance\"\n min=\"1\"\n max=\"500\"\n ></pry-range>\n </div>\n </fieldset>\n\n <div class=\"m-form-label-field\" *ngIf=\"optionsCopy.attributions\">\n <label class=\"a-label\" for=\"attribution\">{{ '@pry.widget.map.attribution' | i18n }}</label>\n <input\n id=\"attribution\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeAttribution($event, layer)\"\n [value]=\"layer.attribution ? layer.attribution : ''\"\n />\n </div>\n\n <button\n type=\"button\"\n (click)=\"deleteLayer(i, layer)\"\n class=\"a-btn a-btn--icon-text -link-like\"\n *ngIf=\"layer.type !== 'geoserver'\"\n data-func=\"delete\"\n >\n <pry-icon iconSvg=\"delete\" [width]=\"19\" [height]=\"19\"></pry-icon>\n <span>{{ '@pry.widget.map.deleteLayer' | i18n }}</span>\n </button>\n </div>\n </pry-settings>\n </pry-widget-header>\n\n <div class=\"m-btn-group -selection-choice\" [style.transform]=\"bottomLeft$ | async\">\n <ng-container *ngFor=\"let action of basicActions$ | async\">\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n (click)=\"interactionManager.selectionInteraction.changeSelection(action)\"\n [class.-selected]=\"interactionManager.selectionInteraction.selectionType === action\"\n [pryTooltip]=\"infoTooltipAction\"\n pryTooltipPosition=\"bottom\"\n aria-describedby=\"infoTooltipAction\"\n [pryTooltipContext]=\"{ action: action }\"\n >\n <pry-icon [iconSvg]=\"action\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.widget.map.' + action | i18n }}</span>\n </button>\n </ng-container>\n\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n id=\"export_card\"\n aria-expanded=\"false\"\n aria-controls=\"export_type\"\n aria-haspopup=\"menu\"\n [pryTooltip]=\"infoTooltipDown\"\n pryTooltipPosition=\"bottom\"\n aria-describedby=\"infoTooltipDown_widgetMap\"\n *ngIf=\"(actions$ | async)?.includes('export')\"\n >\n <pry-icon iconSvg=\"file_download\" (click)=\"export()\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.widget.map.export' | i18n }}</span>\n </button>\n </div>\n\n <div\n class=\"ol-control m-layer-switcher\"\n *ngIf=\"((layers$ | async)?.length ?? 0) > 0\"\n [style.top.px]=\"layersTop$ | async\"\n >\n <button\n class=\"m-layer-switcher__toggle\"\n (click)=\"toggleLayersWindow()\"\n [title]=\"'@pry.widget.map.selectLayers' | i18n\"\n >\n <pry-icon iconSvg=\"layers\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </button>\n <ng-container *ngFor=\"let layer of mapLayers; let index = index\">\n <div class=\"m-layer-switcher__title\" [class.-hidden]=\"!layersTabOpen\">\n {{ layer.get('title') }}\n <ng-container *ngIf=\"!(options$ | async)?.singleLayer; else singleLayer\">\n <pry-checkbox [ngModel]=\"layer.getVisible()\" (change)=\"changeVisibility(layer)\"></pry-checkbox>\n </ng-container>\n <ng-template #singleLayer>\n <input\n type=\"radio\"\n name=\"layer\"\n [id]=\"'radio-layer-' + layer.get('title').split(' ')[0]\"\n [ngModel]=\"layerVisibleIdx\"\n [value]=\"index\"\n (change)=\"changeVisibility(layer)\"\n />\n </ng-template>\n </div>\n </ng-container>\n </div>\n\n <div\n class=\"ol-control m-layer-legend\"\n *ngIf=\"((legendLayers$ | async)?.length ?? 0) > 0\"\n [style.top.px]=\"legendTop$ | async\"\n >\n <button class=\"m-layer-legend__toggle\" (click)=\"toggleLegendWindow()\" [title]=\"'@pry.widget.map.legends' | i18n\">\n <pry-icon iconSvg=\"legend\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </button>\n <ng-container *ngFor=\"let geoLayer of legendLayers$ | async; let index = index\">\n <div class=\"m-layer-legend__title\" [class.-hidden]=\"!legendTabOpen\">\n {{ geoLayer.title }}\n <ng-container *ngIf=\"isLayerRendered(geoLayer)\">\n <button class=\"m-layer-legend__toggle\" (click)=\"toggleLegend(index)\">\n <pry-icon\n [iconSvg]=\"legendTab === index ? 'chevron_top' : 'chevron_bottom'\"\n [width]=\"22\"\n [height]=\"22\"\n ></pry-icon>\n </button>\n </ng-container>\n <ng-container *ngIf=\"!isLayerRendered(geoLayer)\">\n <pry-icon [iconSvg]=\"'close'\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </ng-container>\n </div>\n <div\n class=\"m-layer-legend__image\"\n [class.-hidden]=\"!legendTabOpen || legendTab !== index || !isLayerRendered(geoLayer)\"\n [style.max-height.px]=\"legendHeight$ | async\"\n >\n <ng-container *ngIf=\"geoLayer | legendUrl : { capabilities: (wmsCapabilities$ | async) } as url\">\n <img\n [src]=\"url\"\n [alt]=\"'@pry.widget.map.legend' | i18n : { layer: geoLayer.title }\"\n (error)=\"imageNotProvided[index] = true\"\n />\n </ng-container>\n <ng-container *ngIf=\"!(geoLayer | legendUrl : { capabilities: (wmsCapabilities$ | async) })\">\n <p class=\"m-layer-legend__error\">{{ '@pry.widget.map.legendNotProvided' | i18n }}</p>\n </ng-container>\n </div>\n </ng-container>\n </div>\n\n <div [style.height.px]=\"height$ | async\" class=\"o-map-wrapper\">\n <div class=\"o-map\">\n <div #mapRef id=\"map\"></div>\n </div>\n </div>\n\n <ng-template #infoTooltipAction let-action=\"action\">\n <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipAction\" aria-hidden=\"true\">\n <span class=\"m-tooltip__text\">{{ '@pry.widget.map.' + action | i18n }}</span>\n </div>\n </ng-template>\n\n <ng-template #infoTooltipDown>\n <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipDown_widgetMap\" aria-hidden=\"true\">\n <span class=\"m-tooltip__text\">{{ '@pry.widget.map.export' | i18n }}</span>\n </div>\n </ng-template>\n\n <div #popup class=\"m-tooltip m-tooltip--popup\" [hidden]=\"true\" role=\"tooltip\">\n <div class=\"m-tooltip--popup__header\">\n <p>{{ this.tooltipIndex + 1 }} / {{ this.tooltipNumber }}</p>\n <button class=\"a-btn a-btn--primary a-btn--icon-only\" (click)=\"tooltipMove(-1)\" [disabled]=\"!tooltipCanMove(-1)\">\n <pry-icon iconSvg=\"arrow_back\"></pry-icon>\n </button>\n <button class=\"a-btn a-btn--primary a-btn--icon-only\" (click)=\"tooltipMove(1)\" [disabled]=\"!tooltipCanMove(1)\">\n <pry-icon iconSvg=\"arrow_right\"></pry-icon>\n </button>\n </div>\n <div class=\"m-tooltip--popup__container\">\n <ng-container #popupContent></ng-container>\n </div>\n </div>\n <div\n #address\n class=\"m-tooltip m-tooltip--address tooltip-address\"\n [style.display]=\"'none'\"\n (click)=\"hideAddress()\"\n ></div>\n</div>\n", dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.SettingsComponent, selector: "pry-settings", inputs: ["widgetIndex", "isDisable", "headerPresent", "open$", "header"], outputs: ["saveTriggered", "changeTitle"] }, { kind: "component", type: i2.PryWidgetHeaderComponent, selector: "pry-widget-header", inputs: ["manifest", "additionalOptions", "headerOptions", "displayCount", "datasourceIds", "widgetIndex"], outputs: ["manifestModified"] }, { kind: "component", type: i2.PrySelectComponent, selector: "pry-select", inputs: ["labelTranslate", "baseTranslate", "translationFn", "translationFnArgs", "clearable", "multiple", "multipleClearRight", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "items", "itemsAsOption", "bindData", "bindValue", "bindLabel", "bindIcon", "iconSize", "templateLabel", "templateOption", "autocomplete"] }, { kind: "component", type: i2.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: i7.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "directive", type: i2.PryTooltipDirective, selector: "[pryTooltip]", inputs: ["pryTooltip", "styleReversed", "pryTooltipContext", "pryTooltipPosition", "pryTooltipShowDelay"] }, { kind: "component", type: i2.PryRangeComponent, selector: "pry-range", inputs: ["min", "max", "step", "disabled", "labelTranslate"] }, { kind: "component", type: PryWidgetMapCssComponent, selector: "pry-widget-map-css" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.I18nPipe, name: "i18n" }, { kind: "pipe", type: GeometryFieldsForPipe, name: "geometryFieldsFor" }, { kind: "pipe", type: WidgetMapLegendUrlPipe, name: "legendUrl" }] }); }
1881
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: WidgetMapComponent, selector: "pry-widget-map", viewQueries: [{ propertyName: "mapRef", first: true, predicate: ["mapRef"], descendants: true }, { propertyName: "popup", first: true, predicate: ["popup"], descendants: true }, { propertyName: "popupContent", first: true, predicate: ["popupContent"], descendants: true, read: ViewContainerRef }, { propertyName: "exportTypeTemplate", first: true, predicate: ["exportTypeTemplate"], descendants: true, read: TemplateRef }, { propertyName: "address", first: true, predicate: ["address"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pry-widget-map-css></pry-widget-map-css>\n<div class=\"o-widget o-widget--map\">\n <pry-widget-header\n [datasourceIds]=\"(datasourceIds$ | async) ?? []\"\n *ngIf=\"displayHeader$ | async\"\n [widgetIndex]=\"widgetIndex\"\n [manifest]=\"manifest\"\n (manifestModified)=\"manifestModified.emit($event)\"\n [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n #header\n >\n <pry-settings\n (saveTriggered)=\"emitManifest()\"\n (changeTitle)=\"changeWidgetTitle($event)\"\n [headerPresent]=\"displayHeader$ | async\"\n [widgetIndex]=\"widgetIndex\"\n [header]=\"header\"\n [open$]=\"open$\"\n class=\"o-settings\"\n >\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_style\">{{ '@pry.widget.map.style' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeStyle($event)\"\n [itemsAsOption]=\"true\"\n [items]=\"styles$ | async\"\n [ngModel]=\"optionsCopy.style\"\n bindLabel=\"label\"\n bindValue=\"identifier\"\n id=\"map_style\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"optionsCopy.style === STYLE_FROM_URL\">\n <label class=\"a-label\" for=\"style_URL\">{{ '@pry.widget.map.styleUrl' | i18n }}</label>\n <input\n id=\"style_URL\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeStyleURL($event)\"\n [value]=\"optionsCopy.styleURL ?? ''\"\n />\n </div>\n\n <pry-checkbox (ngModelChange)=\"changeSingleLayer($event)\" [ngModel]=\"optionsCopy.singleLayer ?? false\">\n {{ '@pry.widget.map.singleLayer' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeAutoLayer($event)\" [ngModel]=\"optionsCopy.automaticLayers ?? false\">\n {{ '@pry.widget.map.autoLayer' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeFit($event)\" [ngModel]=\"optionsCopy.fit ?? false\">\n {{ '@pry.widget.map.fit' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeAttributions($event)\" [ngModel]=\"optionsCopy.attributions ?? false\">\n {{ '@pry.widget.map.attributions' | i18n }}\n </pry-checkbox>\n\n <div class=\"o-settings__popup__content__actions -has-separator\">\n <button type=\"button\" (click)=\"addLayer()\" class=\"a-btn a-btn--icon-text -link-like\">\n <pry-icon iconSvg=\"library_add\"></pry-icon>\n {{ '@pry.widget.map.addLayer' | i18n }}\n </button>\n </div>\n\n <div *ngFor=\"let layer of optionsCopy?.layers; let i = index\" class=\"o-settings__popup__content__fields\">\n <div class=\"o-settings__popup__content__fields__head\">\n <h3 class=\"a-h3 settings-layer-title__title\">{{ '@pry.widget.map.layer' | i18n : { index: i + 1 } }}</h3>\n <div class=\"m-btn-group\">\n <button type=\"button\" class=\"a-btn a-btn--icon-only\" (click)=\"invertLayers(i, i - 1)\" *ngIf=\"i > 0\">\n <pry-icon iconSvg=\"fleche_haut\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.action.moveUp' | i18n }}</span>\n </button>\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n (click)=\"invertLayers(i, i + 1)\"\n *ngIf=\"i < (optionsCopy?.layers?.length ?? 0) - 1\"\n >\n <pry-icon iconSvg=\"fleche_bas\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.action.moveDown' | i18n }}</span>\n </button>\n </div>\n </div>\n\n <div class=\"o-settings__popup__content__fields__content\">\n <pry-range\n [ngModel]=\"(layer?.opacity ?? 100) + ''\"\n (ngModelChange)=\"changeOpacity(layer, $event)\"\n labelTranslate=\"@pry.widget.map.opacity\"\n min=\"0\"\n max=\"100\"\n ></pry-range>\n\n <fieldset>\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.layerOptions' | i18n : { index: i + 1 } }}</legend>\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_layerTitle\">{{ '@pry.widget.map.layerTitle' | i18n }}</label>\n <input\n id=\"map_layerTitle\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeTitle($event, layer)\"\n [value]=\"layer.title ?? ''\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"!['geoserver', 'auto'].includes(layer.type)\">\n <label class=\"a-label\" for=\"map_layerType\">{{ '@pry.widget.map.layerType.title' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeLayerType($event, i)\"\n [bindData]=\"true\"\n [itemsAsOption]=\"true\"\n [items]=\"layerTypes\"\n [labelTranslate]=\"true\"\n [ngModel]=\"layer.type\"\n baseTranslate=\"@pry.widget.map.layerType.\"\n class=\"a-pry-select\"\n id=\"map_layerType\"\n ></pry-select>\n </div>\n\n <div\n *ngIf=\"\n layer.type !== 'relation' &&\n layer.type !== 'wms' &&\n layer.type !== 'wmts' &&\n layer.type !== 'geoserver' &&\n layer.type !== 'featurelayer' &&\n layer.type !== 'vectortile' &&\n layer.type !== 'rastertile' &&\n layer.type !== 'auto'\n \"\n class=\"m-form-label-field\"\n >\n <label class=\"a-label\" for=\"map_classes\">{{ '@pry.widget.map.classes' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeClasses($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"usedClasses$ | async\"\n [multiple]=\"true\"\n [ngModel]=\"layer.classes\"\n bindLabel=\"name\"\n bindValue=\"id\"\n class=\"a-pry-select\"\n id=\"map_classes\"\n ></pry-select>\n </div>\n </fieldset>\n </div>\n\n <fieldset\n *ngIf=\"\n layer.type !== 'relation' &&\n layer.type !== 'wms' &&\n layer.type !== 'wmts' &&\n layer.type !== 'geoserver' &&\n layer.type !== 'featurelayer' &&\n layer.type !== 'vectortile' &&\n layer.type !== 'rastertile'\n \"\n >\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.locationAttr' | i18n }}</legend>\n <ng-container\n *ngIf=\"\n layer\n | geometryFieldsFor : { resultSet: resultSet$, classes: layer.classes, type: layer.type }\n | async as fields\n \"\n >\n <div\n *ngIf=\"\n ['heatmap', 'bubble', 'marker', 'point', 'line', 'polygon', 'multi-line', 'multi-polygon'].indexOf(\n layer.type\n ) >= 0\n \"\n >\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_locationAttribute_both\">{{\n '@pry.widget.map.locationAttribute.both' | i18n\n }}</label>\n <pry-select\n (ngModelChange)=\"changeLocationAttributes($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"fields\"\n [ngModel]=\"layer.attribute\"\n bindLabel=\"name\"\n bindValue=\"name\"\n id=\"map_locationAttribute_both\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n </div>\n\n <div *ngIf=\"['heatmap', 'bubble'].indexOf(layer.type) >= 0\">\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_intensityAttribute\">{{\n '@pry.widget.map.intensityAttribute' | i18n\n }}</label>\n <pry-select\n (ngModelChange)=\"changeIntensityAttributes($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"fields\"\n [ngModel]=\"layerHasIntensity(layer).intensityAttribute\"\n bindLabel=\"name\"\n bindValue=\"name\"\n id=\"map_intensityAttribute\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n </div>\n </ng-container>\n </fieldset>\n\n <fieldset\n *ngIf=\"\n layer.type === 'wms' ||\n layer.type === 'wmts' ||\n layer.type === 'featurelayer' ||\n layer.type === 'vectortile' ||\n layer.type === 'rastertile'\n \"\n >\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.tile' | i18n }}</legend>\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_wms_url\">{{ '@pry.widget.map.wms.url' | i18n }}</label>\n <input\n id=\"map_wms_url\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeUrl($event, layer)\"\n [value]=\"layer.url\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wms' || layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_paramLayer\">{{ '@pry.widget.map.wms.paramLayer' | i18n }}</label>\n <input\n id=\"map_wms_paramLayer\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeParamLayer($event, layer)\"\n [value]=\"layer.paramLayer\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_matrixSet\">{{ '@pry.widget.map.wms.matrixSet' | i18n }}</label>\n <input\n id=\"map_wms_matrixSet\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeMatrixSet($event, layer)\"\n [value]=\"layer.matrixSet\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_style\">{{ '@pry.widget.map.wms.style' | i18n }}</label>\n <input\n id=\"map_wms_style\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeParamStyle($event, layer)\"\n [value]=\"layer.style\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wms'\">\n <pry-checkbox (ngModelChange)=\"changeParamTiled($event, layer)\" [ngModel]=\"layer?.paramTiled ?? false\">\n {{ '@pry.widget.map.wms.paramTiled' | i18n }}\n </pry-checkbox>\n </div>\n </fieldset>\n\n <fieldset *ngIf=\"layer.type === 'marker'\">\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.clustering' | i18n }}</legend>\n <div class=\"m-form-label-field\">\n <pry-checkbox (ngModelChange)=\"changeClustered(layer, $event)\" [ngModel]=\"layer.clustered\">\n {{ '@pry.widget.map.clustered' | i18n }}\n </pry-checkbox>\n </div>\n <div *ngIf=\"layer.clustered\">\n <pry-range\n [ngModel]=\"layer.clustered\"\n (ngModelChange)=\"changeClusterDistance(layer, $event)\"\n labelTranslate=\"@pry.widget.map.clusterDistance\"\n min=\"1\"\n max=\"500\"\n ></pry-range>\n </div>\n </fieldset>\n\n <div class=\"m-form-label-field\" *ngIf=\"optionsCopy.attributions\">\n <label class=\"a-label\" for=\"attribution\">{{ '@pry.widget.map.attribution' | i18n }}</label>\n <input\n id=\"attribution\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeAttribution($event, layer)\"\n [value]=\"layer.attribution ? layer.attribution : ''\"\n />\n </div>\n\n <button\n type=\"button\"\n (click)=\"deleteLayer(i, layer)\"\n class=\"a-btn a-btn--icon-text -link-like\"\n *ngIf=\"layer.type !== 'geoserver'\"\n data-func=\"delete\"\n >\n <pry-icon iconSvg=\"delete\" [width]=\"19\" [height]=\"19\"></pry-icon>\n <span>{{ '@pry.widget.map.deleteLayer' | i18n }}</span>\n </button>\n </div>\n </pry-settings>\n </pry-widget-header>\n\n <div class=\"m-btn-group -selection-choice\" [style.transform]=\"bottomLeft$ | async\">\n <ng-container *ngFor=\"let action of basicActions$ | async\">\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n (click)=\"interactionManager.selectionInteraction.changeSelection(action)\"\n [class.-selected]=\"interactionManager.selectionInteraction.selectionType === action\"\n [pryTooltip]=\"infoTooltipAction\"\n pryTooltipPosition=\"bottom\"\n aria-describedby=\"infoTooltipAction\"\n [pryTooltipContext]=\"{ action: action }\"\n >\n <pry-icon [iconSvg]=\"action\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.widget.map.' + action | i18n }}</span>\n </button>\n </ng-container>\n\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n id=\"export_card\"\n aria-expanded=\"false\"\n aria-controls=\"export_type\"\n aria-haspopup=\"menu\"\n [pryTooltip]=\"infoTooltipDown\"\n pryTooltipPosition=\"bottom\"\n aria-describedby=\"infoTooltipDown_widgetMap\"\n *ngIf=\"(actions$ | async)?.includes('export')\"\n >\n <pry-icon iconSvg=\"file_download\" (click)=\"export()\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.widget.map.export' | i18n }}</span>\n </button>\n </div>\n\n <div\n class=\"ol-control m-layer-switcher\"\n *ngIf=\"((layers$ | async)?.length ?? 0) > 0\"\n [style.top.px]=\"layersTop$ | async\"\n >\n <button\n class=\"m-layer-switcher__toggle\"\n (click)=\"toggleLayersWindow()\"\n [title]=\"'@pry.widget.map.selectLayers' | i18n\"\n >\n <pry-icon iconSvg=\"layers\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </button>\n <ng-container *ngFor=\"let layer of mapLayers; let index = index\">\n <div class=\"m-layer-switcher__title\" [class.-hidden]=\"!layersTabOpen\">\n {{ layer.get('title') }}\n <ng-container *ngIf=\"!(options$ | async)?.singleLayer; else singleLayer\">\n <pry-checkbox [ngModel]=\"layer.getVisible()\" (change)=\"changeVisibility(layer)\"></pry-checkbox>\n </ng-container>\n <ng-template #singleLayer>\n <input\n type=\"radio\"\n name=\"layer\"\n [id]=\"'radio-layer-' + layer.get('title').split(' ')[0]\"\n [ngModel]=\"layerVisibleIdx\"\n [value]=\"index\"\n (change)=\"changeVisibility(layer)\"\n />\n </ng-template>\n </div>\n </ng-container>\n </div>\n\n <div\n class=\"ol-control m-layer-legend\"\n *ngIf=\"((legendLayers$ | async)?.length ?? 0) > 0\"\n [style.top.px]=\"legendTop$ | async\"\n >\n <button class=\"m-layer-legend__toggle\" (click)=\"toggleLegendWindow()\" [title]=\"'@pry.widget.map.legends' | i18n\">\n <pry-icon iconSvg=\"legend\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </button>\n <ng-container *ngFor=\"let geoLayer of legendLayers$ | async; let index = index\">\n <div class=\"m-layer-legend__title\" [class.-hidden]=\"!legendTabOpen\">\n {{ geoLayer.title }}\n <ng-container *ngIf=\"isLayerRendered(geoLayer)\">\n <button class=\"m-layer-legend__toggle\" (click)=\"toggleLegend(index)\">\n <pry-icon\n [iconSvg]=\"legendTab === index ? 'chevron_top' : 'chevron_bottom'\"\n [width]=\"22\"\n [height]=\"22\"\n ></pry-icon>\n </button>\n </ng-container>\n <ng-container *ngIf=\"!isLayerRendered(geoLayer)\">\n <pry-icon [iconSvg]=\"'close'\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </ng-container>\n </div>\n <div\n class=\"m-layer-legend__image\"\n [class.-hidden]=\"!legendTabOpen || legendTab !== index || !isLayerRendered(geoLayer)\"\n [style.max-height.px]=\"legendHeight$ | async\"\n >\n <ng-container *ngIf=\"geoLayer | legendUrl : { capabilities: (wmsCapabilities$ | async) } as url\">\n <img\n [src]=\"url\"\n [alt]=\"'@pry.widget.map.legend' | i18n : { layer: geoLayer.title }\"\n (error)=\"imageNotProvided[index] = true\"\n />\n </ng-container>\n <ng-container *ngIf=\"!(geoLayer | legendUrl : { capabilities: (wmsCapabilities$ | async) })\">\n <p class=\"m-layer-legend__error\">{{ '@pry.widget.map.legendNotProvided' | i18n }}</p>\n </ng-container>\n </div>\n </ng-container>\n </div>\n\n <div [style.height.px]=\"height$ | async\" class=\"o-map-wrapper\">\n <div class=\"o-map\">\n <div #mapRef id=\"map\"></div>\n </div>\n </div>\n\n <ng-template #infoTooltipAction let-action=\"action\">\n <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipAction\" aria-hidden=\"true\">\n <span class=\"m-tooltip__text\">{{ '@pry.widget.map.' + action | i18n }}</span>\n </div>\n </ng-template>\n\n <ng-template #infoTooltipDown>\n <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipDown_widgetMap\" aria-hidden=\"true\">\n <span class=\"m-tooltip__text\">{{ '@pry.widget.map.export' | i18n }}</span>\n </div>\n </ng-template>\n\n <div #popup class=\"m-tooltip m-tooltip--popup\" [hidden]=\"true\" role=\"tooltip\">\n <div class=\"m-tooltip--popup__header\">\n <p>{{ this.tooltipIndex + 1 }} / {{ this.tooltipNumber }}</p>\n <button class=\"a-btn a-btn--primary a-btn--icon-only\" (click)=\"tooltipMove(-1)\" [disabled]=\"!tooltipCanMove(-1)\">\n <pry-icon iconSvg=\"arrow_back\"></pry-icon>\n </button>\n <button class=\"a-btn a-btn--primary a-btn--icon-only\" (click)=\"tooltipMove(1)\" [disabled]=\"!tooltipCanMove(1)\">\n <pry-icon iconSvg=\"arrow_right\"></pry-icon>\n </button>\n </div>\n <div class=\"m-tooltip--popup__container\">\n <ng-container #popupContent></ng-container>\n </div>\n </div>\n <div\n #address\n class=\"m-tooltip m-tooltip--address tooltip-address\"\n [style.display]=\"'none'\"\n (click)=\"hideAddress()\"\n ></div>\n</div>\n", dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.SettingsComponent, selector: "pry-settings", inputs: ["widgetIndex", "isDisable", "headerPresent", "open$", "header"], outputs: ["saveTriggered", "changeTitle"] }, { kind: "component", type: i2.PryWidgetHeaderComponent, selector: "pry-widget-header", inputs: ["manifest", "additionalOptions", "headerOptions", "displayCount", "datasourceIds", "widgetIndex"], outputs: ["manifestModified"] }, { kind: "component", type: i2.PrySelectComponent, selector: "pry-select", inputs: ["labelTranslate", "baseTranslate", "translationFn", "translationFnArgs", "clearable", "multiple", "multipleClearRight", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "items", "itemsAsOption", "bindData", "bindValue", "bindLabel", "bindIcon", "iconSize", "templateLabel", "templateOption", "autocomplete"] }, { kind: "component", type: i2.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: i7.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "directive", type: i2.PryTooltipDirective, selector: "[pryTooltip]", inputs: ["pryTooltip", "styleReversed", "pryTooltipContext", "pryTooltipPosition", "pryTooltipShowDelay"] }, { kind: "component", type: i2.PryRangeComponent, selector: "pry-range", inputs: ["min", "max", "step", "disabled", "labelTranslate"] }, { kind: "component", type: PryWidgetMapCssComponent, selector: "pry-widget-map-css" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.I18nPipe, name: "i18n" }, { kind: "pipe", type: GeometryFieldsForPipe, name: "geometryFieldsFor" }, { kind: "pipe", type: WidgetMapLegendUrlPipe, name: "legendUrl" }] }); }
1857
1882
  }
1858
1883
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: WidgetMapComponent, decorators: [{
1859
1884
  type: Component,
1860
- args: [{ selector: 'pry-widget-map', template: "<pry-widget-map-css></pry-widget-map-css>\n<div class=\"o-widget o-widget--map\">\n <pry-widget-header\n [datasourceIds]=\"(datasourceIds$ | async) ?? []\"\n *ngIf=\"displayHeader$ | async\"\n [widgetIndex]=\"widgetIndex\"\n [manifest]=\"manifest\"\n (manifestModified)=\"manifestModified.emit($event)\"\n [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n #header\n >\n <pry-settings\n (saveTriggered)=\"emitManifest()\"\n (changeTitle)=\"changeWidgetTitle($event)\"\n [headerPresent]=\"displayHeader$ | async\"\n [widgetIndex]=\"widgetIndex\"\n [header]=\"header\"\n [open$]=\"open$\"\n class=\"o-settings\"\n >\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_style\">{{ '@pry.widget.map.style' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeStyle($event)\"\n [itemsAsOption]=\"true\"\n [items]=\"styles$ | async\"\n [ngModel]=\"optionsCopy.style\"\n bindLabel=\"label\"\n bindValue=\"identifier\"\n id=\"map_style\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"optionsCopy.style === STYLE_FROM_URL\">\n <label class=\"a-label\" for=\"style_URL\">{{ '@pry.widget.map.styleUrl' | i18n }}</label>\n <input\n id=\"style_URL\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeStyleURL($event)\"\n [value]=\"optionsCopy.styleURL ?? ''\"\n />\n </div>\n\n <pry-checkbox (ngModelChange)=\"changeSingleLayer($event)\" [ngModel]=\"optionsCopy.singleLayer ?? false\">\n {{ '@pry.widget.map.singleLayer' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeAutoLayer($event)\" [ngModel]=\"optionsCopy.automaticLayers ?? false\">\n {{ '@pry.widget.map.autoLayer' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeFit($event)\" [ngModel]=\"optionsCopy.fit ?? false\">\n {{ '@pry.widget.map.fit' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeAttributions($event)\" [ngModel]=\"optionsCopy.attributions ?? false\">\n {{ '@pry.widget.map.attributions' | i18n }}\n </pry-checkbox>\n\n <div class=\"o-settings__popup__content__actions -has-separator\">\n <button type=\"button\" (click)=\"addLayer()\" class=\"a-btn a-btn--icon-text -link-like\">\n <pry-icon iconSvg=\"library_add\"></pry-icon>\n {{ '@pry.widget.map.addLayer' | i18n }}\n </button>\n </div>\n\n <div *ngFor=\"let layer of optionsCopy?.layers; let i = index\" class=\"o-settings__popup__content__fields\">\n <div class=\"o-settings__popup__content__fields__head\">\n <h3 class=\"a-h3 settings-layer-title__title\">{{ '@pry.widget.map.layer' | i18n : { index: i + 1 } }}</h3>\n <div class=\"m-btn-group\">\n <button type=\"button\" class=\"a-btn a-btn--icon-only\" (click)=\"invertLayers(i, i - 1)\" *ngIf=\"i > 0\">\n <pry-icon iconSvg=\"fleche_haut\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.action.moveUp' | i18n }}</span>\n </button>\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n (click)=\"invertLayers(i, i + 1)\"\n *ngIf=\"i < (optionsCopy?.layers?.length ?? 0) - 1\"\n >\n <pry-icon iconSvg=\"fleche_bas\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.action.moveDown' | i18n }}</span>\n </button>\n </div>\n </div>\n\n <div class=\"o-settings__popup__content__fields__content\">\n <pry-range\n [ngModel]=\"(layer?.opacity ?? 100) + ''\"\n (ngModelChange)=\"changeOpacity(layer, $event)\"\n labelTranslate=\"@pry.widget.map.opacity\"\n min=\"0\"\n max=\"100\"\n ></pry-range>\n\n <fieldset>\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.layerOptions' | i18n : { index: i + 1 } }}</legend>\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_layerTitle\">{{ '@pry.widget.map.layerTitle' | i18n }}</label>\n <input\n id=\"map_layerTitle\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeTitle($event, layer)\"\n [value]=\"layer.title ?? ''\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"!['geoserver', 'auto'].includes(layer.type)\">\n <label class=\"a-label\" for=\"map_layerType\">{{ '@pry.widget.map.layerType.title' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeLayerType($event, i)\"\n [bindData]=\"true\"\n [itemsAsOption]=\"true\"\n [items]=\"layerTypes\"\n [labelTranslate]=\"true\"\n [ngModel]=\"layer.type\"\n baseTranslate=\"@pry.widget.map.layerType.\"\n class=\"a-pry-select\"\n id=\"map_layerType\"\n ></pry-select>\n </div>\n\n <div\n *ngIf=\"\n layer.type !== 'relation' &&\n layer.type !== 'wms' &&\n layer.type !== 'wmts' &&\n layer.type !== 'geoserver' &&\n layer.type !== 'featurelayer' &&\n layer.type !== 'vectortile' &&\n layer.type !== 'rastertile' &&\n layer.type !== 'auto'\n \"\n class=\"m-form-label-field\"\n >\n <label class=\"a-label\" for=\"map_classes\">{{ '@pry.widget.map.classes' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeClasses($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"classes$ | async\"\n [multiple]=\"true\"\n [ngModel]=\"layer.classes\"\n bindLabel=\"name\"\n bindValue=\"id\"\n class=\"a-pry-select\"\n id=\"map_classes\"\n ></pry-select>\n </div>\n </fieldset>\n </div>\n\n <fieldset\n *ngIf=\"\n layer.type !== 'relation' &&\n layer.type !== 'wms' &&\n layer.type !== 'wmts' &&\n layer.type !== 'geoserver' &&\n layer.type !== 'featurelayer' &&\n layer.type !== 'vectortile' &&\n layer.type !== 'rastertile'\n \"\n >\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.locationAttr' | i18n }}</legend>\n <ng-container\n *ngIf=\"\n layer\n | geometryFieldsFor : { resultSet: resultSet$, classes: layer.classes, type: layer.type }\n | async as fields\n \"\n >\n <div\n *ngIf=\"\n ['heatmap', 'bubble', 'marker', 'point', 'line', 'polygon', 'multi-line', 'multi-polygon'].indexOf(\n layer.type\n ) >= 0\n \"\n >\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_locationAttribute_both\">{{\n '@pry.widget.map.locationAttribute.both' | i18n\n }}</label>\n <pry-select\n (ngModelChange)=\"changeLocationAttributes($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"fields\"\n [ngModel]=\"layer.attribute\"\n bindLabel=\"name\"\n bindValue=\"name\"\n id=\"map_locationAttribute_both\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n </div>\n\n <div *ngIf=\"['heatmap', 'bubble'].indexOf(layer.type) >= 0\">\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_intensityAttribute\">{{\n '@pry.widget.map.intensityAttribute' | i18n\n }}</label>\n <pry-select\n (ngModelChange)=\"changeIntensityAttributes($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"fields\"\n [ngModel]=\"layerHasIntensity(layer).intensityAttribute\"\n bindLabel=\"name\"\n bindValue=\"name\"\n id=\"map_intensityAttribute\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n </div>\n </ng-container>\n </fieldset>\n\n <fieldset\n *ngIf=\"\n layer.type === 'wms' ||\n layer.type === 'wmts' ||\n layer.type === 'featurelayer' ||\n layer.type === 'vectortile' ||\n layer.type === 'rastertile'\n \"\n >\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.tile' | i18n }}</legend>\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_wms_url\">{{ '@pry.widget.map.wms.url' | i18n }}</label>\n <input\n id=\"map_wms_url\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeUrl($event, layer)\"\n [value]=\"layer.url\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wms' || layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_paramLayer\">{{ '@pry.widget.map.wms.paramLayer' | i18n }}</label>\n <input\n id=\"map_wms_paramLayer\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeParamLayer($event, layer)\"\n [value]=\"layer.paramLayer\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_matrixSet\">{{ '@pry.widget.map.wms.matrixSet' | i18n }}</label>\n <input\n id=\"map_wms_matrixSet\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeMatrixSet($event, layer)\"\n [value]=\"layer.matrixSet\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_style\">{{ '@pry.widget.map.wms.style' | i18n }}</label>\n <input\n id=\"map_wms_style\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeParamStyle($event, layer)\"\n [value]=\"layer.style\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wms'\">\n <pry-checkbox (ngModelChange)=\"changeParamTiled($event, layer)\" [ngModel]=\"layer?.paramTiled ?? false\">\n {{ '@pry.widget.map.wms.paramTiled' | i18n }}\n </pry-checkbox>\n </div>\n </fieldset>\n\n <fieldset *ngIf=\"layer.type === 'marker'\">\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.clustering' | i18n }}</legend>\n <div class=\"m-form-label-field\">\n <pry-checkbox (ngModelChange)=\"changeClustered(layer, $event)\" [ngModel]=\"layer.clustered\">\n {{ '@pry.widget.map.clustered' | i18n }}\n </pry-checkbox>\n </div>\n <div *ngIf=\"layer.clustered\">\n <pry-range\n [ngModel]=\"layer.clustered\"\n (ngModelChange)=\"changeClusterDistance(layer, $event)\"\n labelTranslate=\"@pry.widget.map.clusterDistance\"\n min=\"1\"\n max=\"500\"\n ></pry-range>\n </div>\n </fieldset>\n\n <div class=\"m-form-label-field\" *ngIf=\"optionsCopy.attributions\">\n <label class=\"a-label\" for=\"attribution\">{{ '@pry.widget.map.attribution' | i18n }}</label>\n <input\n id=\"attribution\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeAttribution($event, layer)\"\n [value]=\"layer.attribution ? layer.attribution : ''\"\n />\n </div>\n\n <button\n type=\"button\"\n (click)=\"deleteLayer(i, layer)\"\n class=\"a-btn a-btn--icon-text -link-like\"\n *ngIf=\"layer.type !== 'geoserver'\"\n data-func=\"delete\"\n >\n <pry-icon iconSvg=\"delete\" [width]=\"19\" [height]=\"19\"></pry-icon>\n <span>{{ '@pry.widget.map.deleteLayer' | i18n }}</span>\n </button>\n </div>\n </pry-settings>\n </pry-widget-header>\n\n <div class=\"m-btn-group -selection-choice\" [style.transform]=\"bottomLeft$ | async\">\n <ng-container *ngFor=\"let action of basicActions$ | async\">\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n (click)=\"interactionManager.selectionInteraction.changeSelection(action)\"\n [class.-selected]=\"interactionManager.selectionInteraction.selectionType === action\"\n [pryTooltip]=\"infoTooltipAction\"\n pryTooltipPosition=\"bottom\"\n aria-describedby=\"infoTooltipAction\"\n [pryTooltipContext]=\"{ action: action }\"\n >\n <pry-icon [iconSvg]=\"action\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.widget.map.' + action | i18n }}</span>\n </button>\n </ng-container>\n\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n id=\"export_card\"\n aria-expanded=\"false\"\n aria-controls=\"export_type\"\n aria-haspopup=\"menu\"\n [pryTooltip]=\"infoTooltipDown\"\n pryTooltipPosition=\"bottom\"\n aria-describedby=\"infoTooltipDown_widgetMap\"\n *ngIf=\"(actions$ | async)?.includes('export')\"\n >\n <pry-icon iconSvg=\"file_download\" (click)=\"export()\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.widget.map.export' | i18n }}</span>\n </button>\n </div>\n\n <div\n class=\"ol-control m-layer-switcher\"\n *ngIf=\"((layers$ | async)?.length ?? 0) > 0\"\n [style.top.px]=\"layersTop$ | async\"\n >\n <button\n class=\"m-layer-switcher__toggle\"\n (click)=\"toggleLayersWindow()\"\n [title]=\"'@pry.widget.map.selectLayers' | i18n\"\n >\n <pry-icon iconSvg=\"layers\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </button>\n <ng-container *ngFor=\"let layer of mapLayers; let index = index\">\n <div class=\"m-layer-switcher__title\" [class.-hidden]=\"!layersTabOpen\">\n {{ layer.get('title') }}\n <ng-container *ngIf=\"!(options$ | async)?.singleLayer; else singleLayer\">\n <pry-checkbox [ngModel]=\"layer.getVisible()\" (change)=\"changeVisibility(layer)\"></pry-checkbox>\n </ng-container>\n <ng-template #singleLayer>\n <input\n type=\"radio\"\n name=\"layer\"\n [id]=\"'radio-layer-' + layer.get('title').split(' ')[0]\"\n [ngModel]=\"layerVisibleIdx\"\n [value]=\"index\"\n (change)=\"changeVisibility(layer)\"\n />\n </ng-template>\n </div>\n </ng-container>\n </div>\n\n <div\n class=\"ol-control m-layer-legend\"\n *ngIf=\"((legendLayers$ | async)?.length ?? 0) > 0\"\n [style.top.px]=\"legendTop$ | async\"\n >\n <button class=\"m-layer-legend__toggle\" (click)=\"toggleLegendWindow()\" [title]=\"'@pry.widget.map.legends' | i18n\">\n <pry-icon iconSvg=\"legend\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </button>\n <ng-container *ngFor=\"let geoLayer of legendLayers$ | async; let index = index\">\n <div class=\"m-layer-legend__title\" [class.-hidden]=\"!legendTabOpen\">\n {{ geoLayer.title }}\n <ng-container *ngIf=\"isLayerRendered(geoLayer)\">\n <button class=\"m-layer-legend__toggle\" (click)=\"toggleLegend(index)\">\n <pry-icon\n [iconSvg]=\"legendTab === index ? 'chevron_top' : 'chevron_bottom'\"\n [width]=\"22\"\n [height]=\"22\"\n ></pry-icon>\n </button>\n </ng-container>\n <ng-container *ngIf=\"!isLayerRendered(geoLayer)\">\n <pry-icon [iconSvg]=\"'close'\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </ng-container>\n </div>\n <div\n class=\"m-layer-legend__image\"\n [class.-hidden]=\"!legendTabOpen || legendTab !== index || !isLayerRendered(geoLayer)\"\n [style.max-height.px]=\"legendHeight$ | async\"\n >\n <ng-container *ngIf=\"geoLayer | legendUrl : { capabilities: (wmsCapabilities$ | async) } as url\">\n <img\n [src]=\"url\"\n [alt]=\"'@pry.widget.map.legend' | i18n : { layer: geoLayer.title }\"\n (error)=\"imageNotProvided[index] = true\"\n />\n </ng-container>\n <ng-container *ngIf=\"!(geoLayer | legendUrl : { capabilities: (wmsCapabilities$ | async) })\">\n <p class=\"m-layer-legend__error\">{{ '@pry.widget.map.legendNotProvided' | i18n }}</p>\n </ng-container>\n </div>\n </ng-container>\n </div>\n\n <div [style.height.px]=\"height$ | async\" class=\"o-map-wrapper\">\n <div class=\"o-map\">\n <div #mapRef id=\"map\"></div>\n </div>\n </div>\n\n <ng-template #infoTooltipAction let-action=\"action\">\n <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipAction\" aria-hidden=\"true\">\n <span class=\"m-tooltip__text\">{{ '@pry.widget.map.' + action | i18n }}</span>\n </div>\n </ng-template>\n\n <ng-template #infoTooltipDown>\n <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipDown_widgetMap\" aria-hidden=\"true\">\n <span class=\"m-tooltip__text\">{{ '@pry.widget.map.export' | i18n }}</span>\n </div>\n </ng-template>\n\n <div #popup class=\"m-tooltip m-tooltip--popup\" [hidden]=\"true\" role=\"tooltip\">\n <div class=\"m-tooltip--popup__header\">\n <p>{{ this.tooltipIndex + 1 }} / {{ this.tooltipNumber }}</p>\n <button class=\"a-btn a-btn--primary a-btn--icon-only\" (click)=\"tooltipMove(-1)\" [disabled]=\"!tooltipCanMove(-1)\">\n <pry-icon iconSvg=\"arrow_back\"></pry-icon>\n </button>\n <button class=\"a-btn a-btn--primary a-btn--icon-only\" (click)=\"tooltipMove(1)\" [disabled]=\"!tooltipCanMove(1)\">\n <pry-icon iconSvg=\"arrow_right\"></pry-icon>\n </button>\n </div>\n <div class=\"m-tooltip--popup__container\">\n <ng-container #popupContent></ng-container>\n </div>\n </div>\n <div\n #address\n class=\"m-tooltip m-tooltip--address tooltip-address\"\n [style.display]=\"'none'\"\n (click)=\"hideAddress()\"\n ></div>\n</div>\n" }]
1885
+ args: [{ selector: 'pry-widget-map', template: "<pry-widget-map-css></pry-widget-map-css>\n<div class=\"o-widget o-widget--map\">\n <pry-widget-header\n [datasourceIds]=\"(datasourceIds$ | async) ?? []\"\n *ngIf=\"displayHeader$ | async\"\n [widgetIndex]=\"widgetIndex\"\n [manifest]=\"manifest\"\n (manifestModified)=\"manifestModified.emit($event)\"\n [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n #header\n >\n <pry-settings\n (saveTriggered)=\"emitManifest()\"\n (changeTitle)=\"changeWidgetTitle($event)\"\n [headerPresent]=\"displayHeader$ | async\"\n [widgetIndex]=\"widgetIndex\"\n [header]=\"header\"\n [open$]=\"open$\"\n class=\"o-settings\"\n >\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_style\">{{ '@pry.widget.map.style' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeStyle($event)\"\n [itemsAsOption]=\"true\"\n [items]=\"styles$ | async\"\n [ngModel]=\"optionsCopy.style\"\n bindLabel=\"label\"\n bindValue=\"identifier\"\n id=\"map_style\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"optionsCopy.style === STYLE_FROM_URL\">\n <label class=\"a-label\" for=\"style_URL\">{{ '@pry.widget.map.styleUrl' | i18n }}</label>\n <input\n id=\"style_URL\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeStyleURL($event)\"\n [value]=\"optionsCopy.styleURL ?? ''\"\n />\n </div>\n\n <pry-checkbox (ngModelChange)=\"changeSingleLayer($event)\" [ngModel]=\"optionsCopy.singleLayer ?? false\">\n {{ '@pry.widget.map.singleLayer' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeAutoLayer($event)\" [ngModel]=\"optionsCopy.automaticLayers ?? false\">\n {{ '@pry.widget.map.autoLayer' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeFit($event)\" [ngModel]=\"optionsCopy.fit ?? false\">\n {{ '@pry.widget.map.fit' | i18n }}\n </pry-checkbox>\n\n <pry-checkbox (ngModelChange)=\"changeAttributions($event)\" [ngModel]=\"optionsCopy.attributions ?? false\">\n {{ '@pry.widget.map.attributions' | i18n }}\n </pry-checkbox>\n\n <div class=\"o-settings__popup__content__actions -has-separator\">\n <button type=\"button\" (click)=\"addLayer()\" class=\"a-btn a-btn--icon-text -link-like\">\n <pry-icon iconSvg=\"library_add\"></pry-icon>\n {{ '@pry.widget.map.addLayer' | i18n }}\n </button>\n </div>\n\n <div *ngFor=\"let layer of optionsCopy?.layers; let i = index\" class=\"o-settings__popup__content__fields\">\n <div class=\"o-settings__popup__content__fields__head\">\n <h3 class=\"a-h3 settings-layer-title__title\">{{ '@pry.widget.map.layer' | i18n : { index: i + 1 } }}</h3>\n <div class=\"m-btn-group\">\n <button type=\"button\" class=\"a-btn a-btn--icon-only\" (click)=\"invertLayers(i, i - 1)\" *ngIf=\"i > 0\">\n <pry-icon iconSvg=\"fleche_haut\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.action.moveUp' | i18n }}</span>\n </button>\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n (click)=\"invertLayers(i, i + 1)\"\n *ngIf=\"i < (optionsCopy?.layers?.length ?? 0) - 1\"\n >\n <pry-icon iconSvg=\"fleche_bas\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.action.moveDown' | i18n }}</span>\n </button>\n </div>\n </div>\n\n <div class=\"o-settings__popup__content__fields__content\">\n <pry-range\n [ngModel]=\"(layer?.opacity ?? 100) + ''\"\n (ngModelChange)=\"changeOpacity(layer, $event)\"\n labelTranslate=\"@pry.widget.map.opacity\"\n min=\"0\"\n max=\"100\"\n ></pry-range>\n\n <fieldset>\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.layerOptions' | i18n : { index: i + 1 } }}</legend>\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_layerTitle\">{{ '@pry.widget.map.layerTitle' | i18n }}</label>\n <input\n id=\"map_layerTitle\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeTitle($event, layer)\"\n [value]=\"layer.title ?? ''\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"!['geoserver', 'auto'].includes(layer.type)\">\n <label class=\"a-label\" for=\"map_layerType\">{{ '@pry.widget.map.layerType.title' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeLayerType($event, i)\"\n [bindData]=\"true\"\n [itemsAsOption]=\"true\"\n [items]=\"layerTypes\"\n [labelTranslate]=\"true\"\n [ngModel]=\"layer.type\"\n baseTranslate=\"@pry.widget.map.layerType.\"\n class=\"a-pry-select\"\n id=\"map_layerType\"\n ></pry-select>\n </div>\n\n <div\n *ngIf=\"\n layer.type !== 'relation' &&\n layer.type !== 'wms' &&\n layer.type !== 'wmts' &&\n layer.type !== 'geoserver' &&\n layer.type !== 'featurelayer' &&\n layer.type !== 'vectortile' &&\n layer.type !== 'rastertile' &&\n layer.type !== 'auto'\n \"\n class=\"m-form-label-field\"\n >\n <label class=\"a-label\" for=\"map_classes\">{{ '@pry.widget.map.classes' | i18n }}</label>\n <pry-select\n (ngModelChange)=\"changeClasses($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"usedClasses$ | async\"\n [multiple]=\"true\"\n [ngModel]=\"layer.classes\"\n bindLabel=\"name\"\n bindValue=\"id\"\n class=\"a-pry-select\"\n id=\"map_classes\"\n ></pry-select>\n </div>\n </fieldset>\n </div>\n\n <fieldset\n *ngIf=\"\n layer.type !== 'relation' &&\n layer.type !== 'wms' &&\n layer.type !== 'wmts' &&\n layer.type !== 'geoserver' &&\n layer.type !== 'featurelayer' &&\n layer.type !== 'vectortile' &&\n layer.type !== 'rastertile'\n \"\n >\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.locationAttr' | i18n }}</legend>\n <ng-container\n *ngIf=\"\n layer\n | geometryFieldsFor : { resultSet: resultSet$, classes: layer.classes, type: layer.type }\n | async as fields\n \"\n >\n <div\n *ngIf=\"\n ['heatmap', 'bubble', 'marker', 'point', 'line', 'polygon', 'multi-line', 'multi-polygon'].indexOf(\n layer.type\n ) >= 0\n \"\n >\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_locationAttribute_both\">{{\n '@pry.widget.map.locationAttribute.both' | i18n\n }}</label>\n <pry-select\n (ngModelChange)=\"changeLocationAttributes($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"fields\"\n [ngModel]=\"layer.attribute\"\n bindLabel=\"name\"\n bindValue=\"name\"\n id=\"map_locationAttribute_both\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n </div>\n\n <div *ngIf=\"['heatmap', 'bubble'].indexOf(layer.type) >= 0\">\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_intensityAttribute\">{{\n '@pry.widget.map.intensityAttribute' | i18n\n }}</label>\n <pry-select\n (ngModelChange)=\"changeIntensityAttributes($event, layer)\"\n [itemsAsOption]=\"true\"\n [items]=\"fields\"\n [ngModel]=\"layerHasIntensity(layer).intensityAttribute\"\n bindLabel=\"name\"\n bindValue=\"name\"\n id=\"map_intensityAttribute\"\n class=\"a-pry-select\"\n ></pry-select>\n </div>\n </div>\n </ng-container>\n </fieldset>\n\n <fieldset\n *ngIf=\"\n layer.type === 'wms' ||\n layer.type === 'wmts' ||\n layer.type === 'featurelayer' ||\n layer.type === 'vectortile' ||\n layer.type === 'rastertile'\n \"\n >\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.tile' | i18n }}</legend>\n <div class=\"m-form-label-field\">\n <label class=\"a-label\" for=\"map_wms_url\">{{ '@pry.widget.map.wms.url' | i18n }}</label>\n <input\n id=\"map_wms_url\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeUrl($event, layer)\"\n [value]=\"layer.url\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wms' || layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_paramLayer\">{{ '@pry.widget.map.wms.paramLayer' | i18n }}</label>\n <input\n id=\"map_wms_paramLayer\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeParamLayer($event, layer)\"\n [value]=\"layer.paramLayer\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_matrixSet\">{{ '@pry.widget.map.wms.matrixSet' | i18n }}</label>\n <input\n id=\"map_wms_matrixSet\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeMatrixSet($event, layer)\"\n [value]=\"layer.matrixSet\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wmts'\">\n <label class=\"a-label\" for=\"map_wms_style\">{{ '@pry.widget.map.wms.style' | i18n }}</label>\n <input\n id=\"map_wms_style\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeParamStyle($event, layer)\"\n [value]=\"layer.style\"\n />\n </div>\n\n <div class=\"m-form-label-field\" *ngIf=\"layer.type === 'wms'\">\n <pry-checkbox (ngModelChange)=\"changeParamTiled($event, layer)\" [ngModel]=\"layer?.paramTiled ?? false\">\n {{ '@pry.widget.map.wms.paramTiled' | i18n }}\n </pry-checkbox>\n </div>\n </fieldset>\n\n <fieldset *ngIf=\"layer.type === 'marker'\">\n <legend class=\"u-visually-hidden\">{{ '@pry.widget.map.clustering' | i18n }}</legend>\n <div class=\"m-form-label-field\">\n <pry-checkbox (ngModelChange)=\"changeClustered(layer, $event)\" [ngModel]=\"layer.clustered\">\n {{ '@pry.widget.map.clustered' | i18n }}\n </pry-checkbox>\n </div>\n <div *ngIf=\"layer.clustered\">\n <pry-range\n [ngModel]=\"layer.clustered\"\n (ngModelChange)=\"changeClusterDistance(layer, $event)\"\n labelTranslate=\"@pry.widget.map.clusterDistance\"\n min=\"1\"\n max=\"500\"\n ></pry-range>\n </div>\n </fieldset>\n\n <div class=\"m-form-label-field\" *ngIf=\"optionsCopy.attributions\">\n <label class=\"a-label\" for=\"attribution\">{{ '@pry.widget.map.attribution' | i18n }}</label>\n <input\n id=\"attribution\"\n class=\"a-form-field\"\n type=\"text\"\n (input)=\"changeAttribution($event, layer)\"\n [value]=\"layer.attribution ? layer.attribution : ''\"\n />\n </div>\n\n <button\n type=\"button\"\n (click)=\"deleteLayer(i, layer)\"\n class=\"a-btn a-btn--icon-text -link-like\"\n *ngIf=\"layer.type !== 'geoserver'\"\n data-func=\"delete\"\n >\n <pry-icon iconSvg=\"delete\" [width]=\"19\" [height]=\"19\"></pry-icon>\n <span>{{ '@pry.widget.map.deleteLayer' | i18n }}</span>\n </button>\n </div>\n </pry-settings>\n </pry-widget-header>\n\n <div class=\"m-btn-group -selection-choice\" [style.transform]=\"bottomLeft$ | async\">\n <ng-container *ngFor=\"let action of basicActions$ | async\">\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n (click)=\"interactionManager.selectionInteraction.changeSelection(action)\"\n [class.-selected]=\"interactionManager.selectionInteraction.selectionType === action\"\n [pryTooltip]=\"infoTooltipAction\"\n pryTooltipPosition=\"bottom\"\n aria-describedby=\"infoTooltipAction\"\n [pryTooltipContext]=\"{ action: action }\"\n >\n <pry-icon [iconSvg]=\"action\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.widget.map.' + action | i18n }}</span>\n </button>\n </ng-container>\n\n <button\n type=\"button\"\n class=\"a-btn a-btn--icon-only\"\n id=\"export_card\"\n aria-expanded=\"false\"\n aria-controls=\"export_type\"\n aria-haspopup=\"menu\"\n [pryTooltip]=\"infoTooltipDown\"\n pryTooltipPosition=\"bottom\"\n aria-describedby=\"infoTooltipDown_widgetMap\"\n *ngIf=\"(actions$ | async)?.includes('export')\"\n >\n <pry-icon iconSvg=\"file_download\" (click)=\"export()\"></pry-icon>\n <span class=\"u-visually-hidden\">{{ '@pry.widget.map.export' | i18n }}</span>\n </button>\n </div>\n\n <div\n class=\"ol-control m-layer-switcher\"\n *ngIf=\"((layers$ | async)?.length ?? 0) > 0\"\n [style.top.px]=\"layersTop$ | async\"\n >\n <button\n class=\"m-layer-switcher__toggle\"\n (click)=\"toggleLayersWindow()\"\n [title]=\"'@pry.widget.map.selectLayers' | i18n\"\n >\n <pry-icon iconSvg=\"layers\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </button>\n <ng-container *ngFor=\"let layer of mapLayers; let index = index\">\n <div class=\"m-layer-switcher__title\" [class.-hidden]=\"!layersTabOpen\">\n {{ layer.get('title') }}\n <ng-container *ngIf=\"!(options$ | async)?.singleLayer; else singleLayer\">\n <pry-checkbox [ngModel]=\"layer.getVisible()\" (change)=\"changeVisibility(layer)\"></pry-checkbox>\n </ng-container>\n <ng-template #singleLayer>\n <input\n type=\"radio\"\n name=\"layer\"\n [id]=\"'radio-layer-' + layer.get('title').split(' ')[0]\"\n [ngModel]=\"layerVisibleIdx\"\n [value]=\"index\"\n (change)=\"changeVisibility(layer)\"\n />\n </ng-template>\n </div>\n </ng-container>\n </div>\n\n <div\n class=\"ol-control m-layer-legend\"\n *ngIf=\"((legendLayers$ | async)?.length ?? 0) > 0\"\n [style.top.px]=\"legendTop$ | async\"\n >\n <button class=\"m-layer-legend__toggle\" (click)=\"toggleLegendWindow()\" [title]=\"'@pry.widget.map.legends' | i18n\">\n <pry-icon iconSvg=\"legend\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </button>\n <ng-container *ngFor=\"let geoLayer of legendLayers$ | async; let index = index\">\n <div class=\"m-layer-legend__title\" [class.-hidden]=\"!legendTabOpen\">\n {{ geoLayer.title }}\n <ng-container *ngIf=\"isLayerRendered(geoLayer)\">\n <button class=\"m-layer-legend__toggle\" (click)=\"toggleLegend(index)\">\n <pry-icon\n [iconSvg]=\"legendTab === index ? 'chevron_top' : 'chevron_bottom'\"\n [width]=\"22\"\n [height]=\"22\"\n ></pry-icon>\n </button>\n </ng-container>\n <ng-container *ngIf=\"!isLayerRendered(geoLayer)\">\n <pry-icon [iconSvg]=\"'close'\" [width]=\"22\" [height]=\"22\"></pry-icon>\n </ng-container>\n </div>\n <div\n class=\"m-layer-legend__image\"\n [class.-hidden]=\"!legendTabOpen || legendTab !== index || !isLayerRendered(geoLayer)\"\n [style.max-height.px]=\"legendHeight$ | async\"\n >\n <ng-container *ngIf=\"geoLayer | legendUrl : { capabilities: (wmsCapabilities$ | async) } as url\">\n <img\n [src]=\"url\"\n [alt]=\"'@pry.widget.map.legend' | i18n : { layer: geoLayer.title }\"\n (error)=\"imageNotProvided[index] = true\"\n />\n </ng-container>\n <ng-container *ngIf=\"!(geoLayer | legendUrl : { capabilities: (wmsCapabilities$ | async) })\">\n <p class=\"m-layer-legend__error\">{{ '@pry.widget.map.legendNotProvided' | i18n }}</p>\n </ng-container>\n </div>\n </ng-container>\n </div>\n\n <div [style.height.px]=\"height$ | async\" class=\"o-map-wrapper\">\n <div class=\"o-map\">\n <div #mapRef id=\"map\"></div>\n </div>\n </div>\n\n <ng-template #infoTooltipAction let-action=\"action\">\n <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipAction\" aria-hidden=\"true\">\n <span class=\"m-tooltip__text\">{{ '@pry.widget.map.' + action | i18n }}</span>\n </div>\n </ng-template>\n\n <ng-template #infoTooltipDown>\n <div class=\"m-tooltip\" role=\"tooltip\" id=\"infoTooltipDown_widgetMap\" aria-hidden=\"true\">\n <span class=\"m-tooltip__text\">{{ '@pry.widget.map.export' | i18n }}</span>\n </div>\n </ng-template>\n\n <div #popup class=\"m-tooltip m-tooltip--popup\" [hidden]=\"true\" role=\"tooltip\">\n <div class=\"m-tooltip--popup__header\">\n <p>{{ this.tooltipIndex + 1 }} / {{ this.tooltipNumber }}</p>\n <button class=\"a-btn a-btn--primary a-btn--icon-only\" (click)=\"tooltipMove(-1)\" [disabled]=\"!tooltipCanMove(-1)\">\n <pry-icon iconSvg=\"arrow_back\"></pry-icon>\n </button>\n <button class=\"a-btn a-btn--primary a-btn--icon-only\" (click)=\"tooltipMove(1)\" [disabled]=\"!tooltipCanMove(1)\">\n <pry-icon iconSvg=\"arrow_right\"></pry-icon>\n </button>\n </div>\n <div class=\"m-tooltip--popup__container\">\n <ng-container #popupContent></ng-container>\n </div>\n </div>\n <div\n #address\n class=\"m-tooltip m-tooltip--address tooltip-address\"\n [style.display]=\"'none'\"\n (click)=\"hideAddress()\"\n ></div>\n</div>\n" }]
1861
1886
  }], ctorParameters: function () { return [{ type: i1.Store }, { type: i2.PrySnackbarService }, { type: i2.PryI18nService }, { type: i2.TooltipFactoryService }, { type: i3.Overlay }, { type: i0.ViewContainerRef }, { type: i2.SymbolService }, { type: i0.Injector }, { type: WidgetMapLayerService }, { type: i2.PryAggregationService }, { type: i0.ElementRef }]; }, propDecorators: { mapRef: [{
1862
1887
  type: ViewChild,
1863
1888
  args: ['mapRef']