adb-shared 6.3.2 → 7.0.0
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.
|
@@ -240,7 +240,7 @@ class PolygonDrawerInput {
|
|
|
240
240
|
useExisting: forwardRef(() => PolygonDrawerInput),
|
|
241
241
|
multi: true
|
|
242
242
|
}
|
|
243
|
-
], ngImport: i0, template: "<div class=\"mb-1 d-flex gap-1 flex-wrap align-items-start\">\r\n <button class=\"btn btn-secondary\" type=\"button\" [disabled]=\"shapeLayer\" (click)=\"onDrawPolygon()\" title=\"Polygon\">\r\n <span class=\"
|
|
243
|
+
], ngImport: i0, template: "<div class=\"mb-1 d-flex gap-1 flex-wrap align-items-start\">\r\n <button class=\"btn btn-secondary\" type=\"button\" [disabled]=\"shapeLayer\" (click)=\"onDrawPolygon()\" title=\"Polygon\">\r\n <span class=\"bi bi-pentagon\"></span> {{'OBSERVATION.DRAW'|translate}}\r\n </button>\r\n <button class=\"btn btn-secondary\" type=\"button\" [disabled]=\"shapeLayer\" (click)=\"onDrawCircle()\" title=\"Circle\">\r\n <span class=\"bi bi-circle\"></span> {{'OBSERVATION.DRAW_CIRCLE'|translate}}\r\n </button>\r\n @if (shapeLayer) {\r\n <button class=\"btn btn-secondary\" type=\"button\" (click)=\"onDeleteShape()\" title=\"Ta bort\">\r\n <span class=\"bi bi-x\"></span>\r\n </button>\r\n }\r\n @if (polygonDraw) {\r\n <button class=\"btn btn-secondary\" type=\"button\" (click)=\"onUndoStep()\" title=\"\u00C5ngra\">\r\n <span class=\"bi bi-arrow-counterclockwise\"></span>\r\n </button>\r\n }\r\n</div>\r\n<div [id]=\"mapId\" class=\"border\" style=\"height:20rem\"></div>", dependencies: [{ kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
|
|
244
244
|
}
|
|
245
245
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: PolygonDrawerInput, decorators: [{
|
|
246
246
|
type: Component,
|
|
@@ -250,7 +250,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
250
250
|
useExisting: forwardRef(() => PolygonDrawerInput),
|
|
251
251
|
multi: true
|
|
252
252
|
}
|
|
253
|
-
], template: "<div class=\"mb-1 d-flex gap-1 flex-wrap align-items-start\">\r\n <button class=\"btn btn-secondary\" type=\"button\" [disabled]=\"shapeLayer\" (click)=\"onDrawPolygon()\" title=\"Polygon\">\r\n <span class=\"
|
|
253
|
+
], template: "<div class=\"mb-1 d-flex gap-1 flex-wrap align-items-start\">\r\n <button class=\"btn btn-secondary\" type=\"button\" [disabled]=\"shapeLayer\" (click)=\"onDrawPolygon()\" title=\"Polygon\">\r\n <span class=\"bi bi-pentagon\"></span> {{'OBSERVATION.DRAW'|translate}}\r\n </button>\r\n <button class=\"btn btn-secondary\" type=\"button\" [disabled]=\"shapeLayer\" (click)=\"onDrawCircle()\" title=\"Circle\">\r\n <span class=\"bi bi-circle\"></span> {{'OBSERVATION.DRAW_CIRCLE'|translate}}\r\n </button>\r\n @if (shapeLayer) {\r\n <button class=\"btn btn-secondary\" type=\"button\" (click)=\"onDeleteShape()\" title=\"Ta bort\">\r\n <span class=\"bi bi-x\"></span>\r\n </button>\r\n }\r\n @if (polygonDraw) {\r\n <button class=\"btn btn-secondary\" type=\"button\" (click)=\"onUndoStep()\" title=\"\u00C5ngra\">\r\n <span class=\"bi bi-arrow-counterclockwise\"></span>\r\n </button>\r\n }\r\n</div>\r\n<div [id]=\"mapId\" class=\"border\" style=\"height:20rem\"></div>" }]
|
|
254
254
|
}] });
|
|
255
255
|
|
|
256
256
|
var AdbMapFilterType;
|
|
@@ -280,7 +280,6 @@ class AdbMapConfigService {
|
|
|
280
280
|
taxaListsApi;
|
|
281
281
|
filters;
|
|
282
282
|
observationPage;
|
|
283
|
-
locationPage;
|
|
284
283
|
dynamic;
|
|
285
284
|
constructor(config) {
|
|
286
285
|
this.log = config.log ?? false;
|
|
@@ -288,8 +287,7 @@ class AdbMapConfigService {
|
|
|
288
287
|
this.artfaktaTaxonLists = config.artfaktaTaxonLists ?? 'https://artfakta.se/metadata/listor';
|
|
289
288
|
this.taxaListsApi = config.api + '/taxalists';
|
|
290
289
|
this.observationFeatures = config.api + '/observation-features';
|
|
291
|
-
this.observationPage = config.observationPage ??
|
|
292
|
-
this.locationPage = config.locationPage ?? window.location.origin + '/lokaler';
|
|
290
|
+
this.observationPage = config.observationPage ?? 'https://mobil.artportalen.se/observationer';
|
|
293
291
|
this.filters = {
|
|
294
292
|
showTaxon: this.hasFilter(AdbMapFilterType.Taxon, config.filters),
|
|
295
293
|
showTime: this.hasFilter(AdbMapFilterType.Time, config.filters),
|
|
@@ -395,9 +393,6 @@ class AdbObsMapComponent {
|
|
|
395
393
|
config;
|
|
396
394
|
router;
|
|
397
395
|
http;
|
|
398
|
-
static LOCATION_MARKER_COLOR = '#007c91';
|
|
399
|
-
static OBS_MARKER_COLOR = '#007c91';
|
|
400
|
-
static UNCERTAINTY_COLOR = '#777';
|
|
401
396
|
subscriptions = new Subscription();
|
|
402
397
|
error;
|
|
403
398
|
mapLoading = signal(false, ...(ngDevMode ? [{ debugName: "mapLoading" }] : []));
|
|
@@ -516,8 +511,22 @@ class AdbObsMapComponent {
|
|
|
516
511
|
this.count = geojson?.properties?.count;
|
|
517
512
|
this.siteLayer = Leaflet.geoJson(geojson, {
|
|
518
513
|
style: (feature) => this.getPolygonStyle(feature.properties),
|
|
519
|
-
pointToLayer: (feature, latlng) =>
|
|
520
|
-
|
|
514
|
+
pointToLayer: (feature, latlng) => {
|
|
515
|
+
const marker = Leaflet.marker(latlng, {
|
|
516
|
+
interactive: this.config.dynamic,
|
|
517
|
+
icon: Leaflet.divIcon({
|
|
518
|
+
className: '',
|
|
519
|
+
html: '<div class="adb-map-marker"></div>',
|
|
520
|
+
iconAnchor: [3, 3]
|
|
521
|
+
})
|
|
522
|
+
});
|
|
523
|
+
if (feature.properties && feature.properties['Occurrence.OccurrenceId']) {
|
|
524
|
+
marker.on('click', () => {
|
|
525
|
+
window.location.href = this.config.observationPage + '/' + feature.properties['Occurrence.OccurrenceId'];
|
|
526
|
+
});
|
|
527
|
+
}
|
|
528
|
+
return marker;
|
|
529
|
+
}, onEachFeature: (feature, layer) => {
|
|
521
530
|
if (feature.geometry.type === "Polygon" ||
|
|
522
531
|
feature.geometry.type === "MultiPolygon") {
|
|
523
532
|
if (feature.properties.ObservationsCount > 0) {
|
|
@@ -566,49 +575,9 @@ class AdbObsMapComponent {
|
|
|
566
575
|
bounds.getNorth()
|
|
567
576
|
];
|
|
568
577
|
}
|
|
569
|
-
createPointLayer(feature, latlng) {
|
|
570
|
-
const isLocation = this.queryParams['format'] === 'locations';
|
|
571
|
-
const showUncertainty = this.queryParams['uncertainty'] === 'true';
|
|
572
|
-
const marker = Leaflet.circleMarker(latlng, {
|
|
573
|
-
radius: 6,
|
|
574
|
-
fillColor: isLocation ? AdbObsMapComponent.LOCATION_MARKER_COLOR : AdbObsMapComponent.OBS_MARKER_COLOR,
|
|
575
|
-
fillOpacity: 1,
|
|
576
|
-
color: '#ffffff',
|
|
577
|
-
weight: 2,
|
|
578
|
-
interactive: this.config.dynamic
|
|
579
|
-
});
|
|
580
|
-
if (feature.properties) {
|
|
581
|
-
const occurrenceId = feature.properties?.occurrence?.occurrenceId;
|
|
582
|
-
const locationId = feature.properties?.location?.locationId;
|
|
583
|
-
if (occurrenceId || locationId) {
|
|
584
|
-
marker.on('click', () => {
|
|
585
|
-
if (isLocation) {
|
|
586
|
-
window.location.href = `${this.config.locationPage}/${locationId}`;
|
|
587
|
-
}
|
|
588
|
-
else {
|
|
589
|
-
window.location.href = `${this.config.observationPage}/${occurrenceId}`;
|
|
590
|
-
}
|
|
591
|
-
});
|
|
592
|
-
}
|
|
593
|
-
}
|
|
594
|
-
const layers = [marker];
|
|
595
|
-
if (showUncertainty) {
|
|
596
|
-
const uncertainty = feature.properties?.location?.coordinateUncertaintyInMeters;
|
|
597
|
-
if (typeof uncertainty === 'number' && uncertainty > 0) {
|
|
598
|
-
layers.push(Leaflet.circle(latlng, {
|
|
599
|
-
radius: uncertainty,
|
|
600
|
-
fill: false,
|
|
601
|
-
color: AdbObsMapComponent.UNCERTAINTY_COLOR,
|
|
602
|
-
weight: 1,
|
|
603
|
-
opacity: 0.9,
|
|
604
|
-
interactive: false
|
|
605
|
-
}));
|
|
606
|
-
}
|
|
607
|
-
}
|
|
608
|
-
return Leaflet.layerGroup(layers);
|
|
609
|
-
}
|
|
610
578
|
getPolygonStyle(props) {
|
|
611
579
|
if (props.location) {
|
|
580
|
+
//Its locations
|
|
612
581
|
return {
|
|
613
582
|
weight: 2,
|
|
614
583
|
color: '#005e67',
|
|
@@ -648,11 +617,11 @@ class AdbObsMapComponent {
|
|
|
648
617
|
this.subscriptions.unsubscribe();
|
|
649
618
|
}
|
|
650
619
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AdbObsMapComponent, deps: [{ token: i1$2.ActivatedRoute }, { token: AdbMapConfigService }, { token: i1$2.Router }, { token: i3.HttpClient }], target: i0.ɵɵFactoryTarget.Component });
|
|
651
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: AdbObsMapComponent, isStandalone: false, selector: "adb-obs-map", ngImport: i0, template: "@if(hasBox&&!mapLoading()){\r\n<div class=\"mb-1 d-flex justify-content-between flex-wrap\">\r\n <a [routerLink]=\"[]\" [queryParams]=\"{bbox:null,z:null}\" queryParamsHandling=\"merge\" class=\"d-flex gap-1 align-items-baseline\">\r\n <span class=\"
|
|
620
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: AdbObsMapComponent, isStandalone: false, selector: "adb-obs-map", ngImport: i0, template: "@if(hasBox&&!mapLoading()){\r\n<div class=\"mb-1 d-flex justify-content-between flex-wrap\">\r\n <a [routerLink]=\"[]\" [queryParams]=\"{bbox:null,z:null}\" queryParamsHandling=\"merge\" class=\"d-flex gap-1 align-items-baseline\">\r\n <span class=\"bi bi-chevron-left\"></span>\r\n Tillbaka upp\r\n </a>\r\n</div>\r\n}\r\n@if(error){\r\n<div class=\"alert alert-danger\">\r\n {{'ERROR.SERVER_ERROR'|translate}}\r\n</div>\r\n}\r\n<div [class.loading]=\"mapLoading()\">\r\n <div [id]=\"mapId\" class=\"mb-1 map-container\"></div>\r\n</div>\r\n<div class=\"mb-1 d-flex gap-3 justify-content-between flex-wrap\">\r\n @if (!mapLoading()&&count) {\r\n <div class=\"d-flex align-items-center gap-1\">\r\n <div class=\"legend map-heat-low\"></div>\r\n <10\r\n </div>\r\n <div class=\"d-flex align-items-center gap-1\">\r\n <div class=\"legend map-heat-medium\"></div>\r\n 10 - 500\r\n </div>\r\n <div class=\"d-flex align-items-center gap-1\">\r\n <div class=\"legend map-heat-high\"></div>\r\n >500\r\n </div>\r\n <div class=\"ms-auto\">\r\n {{count|adbSpacing}} {{'OBSERVATION.OBSERVATIONS'|translate}}\r\n </div>\r\n }\r\n</div>", dependencies: [{ kind: "directive", type: i1$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i5.NumberSpacingPipe, name: "adbSpacing" }] });
|
|
652
621
|
}
|
|
653
622
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AdbObsMapComponent, decorators: [{
|
|
654
623
|
type: Component,
|
|
655
|
-
args: [{ selector: 'adb-obs-map', standalone: false, template: "@if(hasBox&&!mapLoading()){\r\n<div class=\"mb-1 d-flex justify-content-between flex-wrap\">\r\n <a [routerLink]=\"[]\" [queryParams]=\"{bbox:null,z:null}\" queryParamsHandling=\"merge\" class=\"d-flex gap-1 align-items-baseline\">\r\n <span class=\"
|
|
624
|
+
args: [{ selector: 'adb-obs-map', standalone: false, template: "@if(hasBox&&!mapLoading()){\r\n<div class=\"mb-1 d-flex justify-content-between flex-wrap\">\r\n <a [routerLink]=\"[]\" [queryParams]=\"{bbox:null,z:null}\" queryParamsHandling=\"merge\" class=\"d-flex gap-1 align-items-baseline\">\r\n <span class=\"bi bi-chevron-left\"></span>\r\n Tillbaka upp\r\n </a>\r\n</div>\r\n}\r\n@if(error){\r\n<div class=\"alert alert-danger\">\r\n {{'ERROR.SERVER_ERROR'|translate}}\r\n</div>\r\n}\r\n<div [class.loading]=\"mapLoading()\">\r\n <div [id]=\"mapId\" class=\"mb-1 map-container\"></div>\r\n</div>\r\n<div class=\"mb-1 d-flex gap-3 justify-content-between flex-wrap\">\r\n @if (!mapLoading()&&count) {\r\n <div class=\"d-flex align-items-center gap-1\">\r\n <div class=\"legend map-heat-low\"></div>\r\n <10\r\n </div>\r\n <div class=\"d-flex align-items-center gap-1\">\r\n <div class=\"legend map-heat-medium\"></div>\r\n 10 - 500\r\n </div>\r\n <div class=\"d-flex align-items-center gap-1\">\r\n <div class=\"legend map-heat-high\"></div>\r\n >500\r\n </div>\r\n <div class=\"ms-auto\">\r\n {{count|adbSpacing}} {{'OBSERVATION.OBSERVATIONS'|translate}}\r\n </div>\r\n }\r\n</div>" }]
|
|
656
625
|
}], ctorParameters: () => [{ type: i1$2.ActivatedRoute }, { type: AdbMapConfigService }, { type: i1$2.Router }, { type: i3.HttpClient }] });
|
|
657
626
|
|
|
658
627
|
const DateTypes = {
|
|
@@ -841,11 +810,11 @@ class AdbMapFilters {
|
|
|
841
810
|
this.subscriptions.unsubscribe();
|
|
842
811
|
}
|
|
843
812
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AdbMapFilters, deps: [{ token: i0.ChangeDetectorRef }, { token: AdbMapConfigService }, { token: i3.HttpClient }, { token: i1$2.Router }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
|
|
844
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: AdbMapFilters, isStandalone: false, selector: "adb-map-filters", inputs: { inline: "inline" }, ngImport: i0, template: "@if(form){\r\n<form [formGroup]=\"form\" class=\"form mb-3\" (ngSubmit)=\"onSubmit()\">\r\n <div class=\"mb-3\">\r\n <adb-filter-section titleResource=\"TAXON.TAXA\" [expanded]=\"true\">\r\n @if(filters.showTaxon&&!hasTaxonInUrlParameter){\r\n <div class=\"mb-3\">\r\n <label for=\"species\">{{'TAXON.TAXON'|translate}}</label>\r\n <adb-taxon-picker formControlName=\"taxonId\" id=\"species\"></adb-taxon-picker>\r\n </div>\r\n }\r\n </adb-filter-section>\r\n @if(filters.showTime){\r\n <adb-filter-section [count]=\"periodCount\" titleResource=\"OBSERVATION.PERIOD\">\r\n <div class=\"mb-1\">\r\n <select class=\"form-select\" formControlName=\"period\" id=\"period\">\r\n <option value=\"1\">{{thisYear|date:'yyyy'}}</option>\r\n <option value=\"2\">{{lastYear|date:'yyyy'}}</option>\r\n <option value=\"3\">{{'OBSERVATION.ALL_YEAR'|translate}}</option>\r\n <option value=\"4\">{{'OBSERVATION.LAST_5_YEAR'|translate}}</option>\r\n <option value=\"5\">{{'OBSERVATION.LAST_25_YEAR'|translate}}</option>\r\n <option value=\"6\">{{'OBSERVATION.CUSTOMIZED'|translate}}</option>\r\n </select>\r\n </div>\r\n @if (form.value?.period==='6') {\r\n <div class=\"mb-2\">\r\n <label for=\"startAt\">{{'FROM' |translate}}</label>\r\n <input adbDatepicker type=\"text\" class=\"form-control datepicker\" id=\"startAt\" formControlName=\"startAt\" [settings]=\"dateStartConfig\">\r\n </div>\r\n <div class=\"mb-2\">\r\n <label for=\"endAt\">{{'TO' |translate}}</label>\r\n <input adbDatepicker type=\"text\" class=\"form-control datepicker\" id=\"endAt\" formControlName=\"endAt\" [settings]=\"dateEndConfig\">\r\n </div>\r\n }\r\n </adb-filter-section>\r\n }\r\n @if(filters.showArea){\r\n <adb-filter-section [count]=\"areaCount\" titleResource=\"GEOGRAPHY\" [lazy]=\"true\">\r\n <ng-template>\r\n @if(filters.showOwnArea){\r\n <div role=\"tablist\" aria-label=\"{{'AREA'|translate}}\" class=\"d-flex gap-2 justify-content-end\">\r\n <button class=\"btn btn-link p-0\" [class.text-dark]=\"!hasOwnArea\" (click)=\"hasOwnArea=false\" role=\"tab\" id=\"tab-select\" aria-selected=\"{{!hasOwnArea}}\" aria-controls=\"panel-select\">\r\n {{'CHOOSE'|translate}}\r\n </button>\r\n <button class=\"btn btn-link p-0\" [class.text-dark]=\"hasOwnArea\" (click)=\"hasOwnArea=true\" role=\"tab\" id=\"tab-draw\" aria-selected=\"false\" aria-controls=\"panel-draw\">\r\n {{'OWN_AREA'|translate}}\r\n </button>\r\n </div>\r\n }\r\n <div class=\"mb-2\">\r\n @if(hasOwnArea&&filters.showOwnArea){\r\n <div class=\"pt-1\" role=\"tabpanel\" id=\"area-draw\" aria-labelledby=\"tab-draw\">\r\n <div>\r\n <adb-polygon-drawer formControlName=\"geo\"></adb-polygon-drawer>\r\n </div>\r\n </div>\r\n }@else{\r\n <div role=\"tabpanel\" id=\"area-select\" aria-labelledby=\"tab-select\">\r\n <div formArrayName=\"areas\">\r\n <div class=\"d-flex align-items-end mb-1\">\r\n <label>{{'AREAS'|translate}}</label>\r\n <button class=\"ms-auto text-dark btn btn-sm btn-secondary\" attr.aria-label=\"{{'OBSERVATION.ADD_AREA'|translate}}\" title=\"{{'OBSERVATION.ADD_AREA'|translate}}\" type=\"button\" (click)=\"addArea()\">\r\n <span class=\"
|
|
813
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: AdbMapFilters, isStandalone: false, selector: "adb-map-filters", inputs: { inline: "inline" }, ngImport: i0, template: "@if(form){\r\n<form [formGroup]=\"form\" class=\"form mb-3\" (ngSubmit)=\"onSubmit()\">\r\n <div class=\"mb-3\">\r\n <adb-filter-section titleResource=\"TAXON.TAXA\" [expanded]=\"true\">\r\n @if(filters.showTaxon&&!hasTaxonInUrlParameter){\r\n <div class=\"mb-3\">\r\n <label for=\"species\">{{'TAXON.TAXON'|translate}}</label>\r\n <adb-taxon-picker formControlName=\"taxonId\" id=\"species\"></adb-taxon-picker>\r\n </div>\r\n }\r\n </adb-filter-section>\r\n @if(filters.showTime){\r\n <adb-filter-section [count]=\"periodCount\" titleResource=\"OBSERVATION.PERIOD\">\r\n <div class=\"mb-1\">\r\n <select class=\"form-select\" formControlName=\"period\" id=\"period\">\r\n <option value=\"1\">{{thisYear|date:'yyyy'}}</option>\r\n <option value=\"2\">{{lastYear|date:'yyyy'}}</option>\r\n <option value=\"3\">{{'OBSERVATION.ALL_YEAR'|translate}}</option>\r\n <option value=\"4\">{{'OBSERVATION.LAST_5_YEAR'|translate}}</option>\r\n <option value=\"5\">{{'OBSERVATION.LAST_25_YEAR'|translate}}</option>\r\n <option value=\"6\">{{'OBSERVATION.CUSTOMIZED'|translate}}</option>\r\n </select>\r\n </div>\r\n @if (form.value?.period==='6') {\r\n <div class=\"mb-2\">\r\n <label for=\"startAt\">{{'FROM' |translate}}</label>\r\n <input adbDatepicker type=\"text\" class=\"form-control datepicker\" id=\"startAt\" formControlName=\"startAt\" [settings]=\"dateStartConfig\">\r\n </div>\r\n <div class=\"mb-2\">\r\n <label for=\"endAt\">{{'TO' |translate}}</label>\r\n <input adbDatepicker type=\"text\" class=\"form-control datepicker\" id=\"endAt\" formControlName=\"endAt\" [settings]=\"dateEndConfig\">\r\n </div>\r\n }\r\n </adb-filter-section>\r\n }\r\n @if(filters.showArea){\r\n <adb-filter-section [count]=\"areaCount\" titleResource=\"GEOGRAPHY\" [lazy]=\"true\">\r\n <ng-template>\r\n @if(filters.showOwnArea){\r\n <div role=\"tablist\" aria-label=\"{{'AREA'|translate}}\" class=\"d-flex gap-2 justify-content-end\">\r\n <button class=\"btn btn-link p-0\" [class.text-dark]=\"!hasOwnArea\" (click)=\"hasOwnArea=false\" role=\"tab\" id=\"tab-select\" aria-selected=\"{{!hasOwnArea}}\" aria-controls=\"panel-select\">\r\n {{'CHOOSE'|translate}}\r\n </button>\r\n <button class=\"btn btn-link p-0\" [class.text-dark]=\"hasOwnArea\" (click)=\"hasOwnArea=true\" role=\"tab\" id=\"tab-draw\" aria-selected=\"false\" aria-controls=\"panel-draw\">\r\n {{'OWN_AREA'|translate}}\r\n </button>\r\n </div>\r\n }\r\n <div class=\"mb-2\">\r\n @if(hasOwnArea&&filters.showOwnArea){\r\n <div class=\"pt-1\" role=\"tabpanel\" id=\"area-draw\" aria-labelledby=\"tab-draw\">\r\n <div>\r\n <adb-polygon-drawer formControlName=\"geo\"></adb-polygon-drawer>\r\n </div>\r\n </div>\r\n }@else{\r\n <div role=\"tabpanel\" id=\"area-select\" aria-labelledby=\"tab-select\">\r\n <div formArrayName=\"areas\">\r\n <div class=\"d-flex align-items-end mb-1\">\r\n <label>{{'AREAS'|translate}}</label>\r\n <button class=\"ms-auto text-dark btn btn-sm btn-secondary\" attr.aria-label=\"{{'OBSERVATION.ADD_AREA'|translate}}\" title=\"{{'OBSERVATION.ADD_AREA'|translate}}\" type=\"button\" (click)=\"addArea()\">\r\n <span class=\"bi bi-plus\"></span>\r\n </button>\r\n </div>\r\n @for (ctrl of areasArray.controls; track ctrl; let i = $index; let last = $last) {\r\n <div class=\"d-flex mb-2\">\r\n <adb-area-picker id=\"area-{{i}}\" [formControlName]=\"i\"></adb-area-picker>\r\n @if(areasArray.length>1){\r\n <button class=\"btn btn-secondary ms-1\" attr.aria-label=\"{{'DELETE'|translate}}\" title=\"{{'DELETE'|translate}}\" type=\"button\" (click)=\"removeArea(i)\">\r\n <span class=\"bi bi-trash\"></span>\r\n </button>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </ng-template>\r\n </adb-filter-section>\r\n }\r\n @if(form.get('taxonId')){\r\n @if(filters.showTaxaLists){\r\n <adb-filter-section [count]=\"taxonListCount\" titleResource=\"LISTS.NATURE_CONSERVATION_LISTS\">\r\n <div class=\"mb-3\">\r\n <app-treeview formControlName=\"list\" [nodes]=\"taxaLists\"></app-treeview>\r\n </div>\r\n {{'LISTS.READ_MORE'|translate}}\r\n <a [href]=\"artfakta\">{{'LISTS.LIST_CONTENT'|translate}}</a>\r\n </adb-filter-section>\r\n }\r\n @if(filters.showDatasets){\r\n <adb-filter-section [count]=\"dataSetCount\" titleResource=\"DATASET.DATASETS\">\r\n @if (form.get('ds')) {\r\n <div formArrayName=\"ds\">\r\n @for (item of dsControls; track item; let i = $index) {\r\n <div [formGroupName]=\"i\" class=\"form-check\">\r\n <input type=\"checkbox\" formControlName=\"selected\" [id]=\"'ds-' + item.value.id\" class=\"form-check-input\">\r\n <label [for]=\"'ds-' + item.value.id\" class=\"form-check-label\">{{ 'PROVIDERS.'+item.value.id |translate }}</label>\r\n </div>\r\n }\r\n </div>\r\n }\r\n </adb-filter-section>\r\n }\r\n }\r\n </div>\r\n <div class=\"d-flex justify-content-end gap-2\">\r\n @if (inline) {\r\n <a class=\"btn btn-secondary\" [routerLink]=\"[]\">\r\n {{'CANCEL'|translate}}\r\n </a>\r\n }\r\n <button type=\"submit\" class=\"btn btn-primary\" [disabled]=\"form.invalid||form.pristine\">{{'FILTER'|translate}}</button>\r\n </div>\r\n</form>\r\n}", dependencies: [{ kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.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: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i4.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i4.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i5.AdbDatePickerDirective, selector: "input[adbDatepicker]", inputs: ["format", "toLeft", "settings"], outputs: ["adbBlur"] }, { kind: "component", type: i5.FilterSectionComponent, selector: "adb-filter-section", inputs: ["titleResource", "helpResource", "count", "expanded", "lazy"] }, { kind: "component", type: i5.AdbAreaPickerComponent, selector: "adb-area-picker", inputs: ["placeholder", "useObject", "prefill"] }, { kind: "component", type: i5.AdbTaxonPickerComponent, selector: "adb-taxon-picker", inputs: ["placeholder", "useObject", "prefill"] }, { kind: "component", type: PolygonDrawerInput, selector: "adb-polygon-drawer" }, { kind: "component", type: TreeviewComponent, selector: "app-treeview", inputs: ["nodes"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
|
|
845
814
|
}
|
|
846
815
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AdbMapFilters, decorators: [{
|
|
847
816
|
type: Component,
|
|
848
|
-
args: [{ selector: 'adb-map-filters', standalone: false, template: "@if(form){\r\n<form [formGroup]=\"form\" class=\"form mb-3\" (ngSubmit)=\"onSubmit()\">\r\n <div class=\"mb-3\">\r\n <adb-filter-section titleResource=\"TAXON.TAXA\" [expanded]=\"true\">\r\n @if(filters.showTaxon&&!hasTaxonInUrlParameter){\r\n <div class=\"mb-3\">\r\n <label for=\"species\">{{'TAXON.TAXON'|translate}}</label>\r\n <adb-taxon-picker formControlName=\"taxonId\" id=\"species\"></adb-taxon-picker>\r\n </div>\r\n }\r\n </adb-filter-section>\r\n @if(filters.showTime){\r\n <adb-filter-section [count]=\"periodCount\" titleResource=\"OBSERVATION.PERIOD\">\r\n <div class=\"mb-1\">\r\n <select class=\"form-select\" formControlName=\"period\" id=\"period\">\r\n <option value=\"1\">{{thisYear|date:'yyyy'}}</option>\r\n <option value=\"2\">{{lastYear|date:'yyyy'}}</option>\r\n <option value=\"3\">{{'OBSERVATION.ALL_YEAR'|translate}}</option>\r\n <option value=\"4\">{{'OBSERVATION.LAST_5_YEAR'|translate}}</option>\r\n <option value=\"5\">{{'OBSERVATION.LAST_25_YEAR'|translate}}</option>\r\n <option value=\"6\">{{'OBSERVATION.CUSTOMIZED'|translate}}</option>\r\n </select>\r\n </div>\r\n @if (form.value?.period==='6') {\r\n <div class=\"mb-2\">\r\n <label for=\"startAt\">{{'FROM' |translate}}</label>\r\n <input adbDatepicker type=\"text\" class=\"form-control datepicker\" id=\"startAt\" formControlName=\"startAt\" [settings]=\"dateStartConfig\">\r\n </div>\r\n <div class=\"mb-2\">\r\n <label for=\"endAt\">{{'TO' |translate}}</label>\r\n <input adbDatepicker type=\"text\" class=\"form-control datepicker\" id=\"endAt\" formControlName=\"endAt\" [settings]=\"dateEndConfig\">\r\n </div>\r\n }\r\n </adb-filter-section>\r\n }\r\n @if(filters.showArea){\r\n <adb-filter-section [count]=\"areaCount\" titleResource=\"GEOGRAPHY\" [lazy]=\"true\">\r\n <ng-template>\r\n @if(filters.showOwnArea){\r\n <div role=\"tablist\" aria-label=\"{{'AREA'|translate}}\" class=\"d-flex gap-2 justify-content-end\">\r\n <button class=\"btn btn-link p-0\" [class.text-dark]=\"!hasOwnArea\" (click)=\"hasOwnArea=false\" role=\"tab\" id=\"tab-select\" aria-selected=\"{{!hasOwnArea}}\" aria-controls=\"panel-select\">\r\n {{'CHOOSE'|translate}}\r\n </button>\r\n <button class=\"btn btn-link p-0\" [class.text-dark]=\"hasOwnArea\" (click)=\"hasOwnArea=true\" role=\"tab\" id=\"tab-draw\" aria-selected=\"false\" aria-controls=\"panel-draw\">\r\n {{'OWN_AREA'|translate}}\r\n </button>\r\n </div>\r\n }\r\n <div class=\"mb-2\">\r\n @if(hasOwnArea&&filters.showOwnArea){\r\n <div class=\"pt-1\" role=\"tabpanel\" id=\"area-draw\" aria-labelledby=\"tab-draw\">\r\n <div>\r\n <adb-polygon-drawer formControlName=\"geo\"></adb-polygon-drawer>\r\n </div>\r\n </div>\r\n }@else{\r\n <div role=\"tabpanel\" id=\"area-select\" aria-labelledby=\"tab-select\">\r\n <div formArrayName=\"areas\">\r\n <div class=\"d-flex align-items-end mb-1\">\r\n <label>{{'AREAS'|translate}}</label>\r\n <button class=\"ms-auto text-dark btn btn-sm btn-secondary\" attr.aria-label=\"{{'OBSERVATION.ADD_AREA'|translate}}\" title=\"{{'OBSERVATION.ADD_AREA'|translate}}\" type=\"button\" (click)=\"addArea()\">\r\n <span class=\"
|
|
817
|
+
args: [{ selector: 'adb-map-filters', standalone: false, template: "@if(form){\r\n<form [formGroup]=\"form\" class=\"form mb-3\" (ngSubmit)=\"onSubmit()\">\r\n <div class=\"mb-3\">\r\n <adb-filter-section titleResource=\"TAXON.TAXA\" [expanded]=\"true\">\r\n @if(filters.showTaxon&&!hasTaxonInUrlParameter){\r\n <div class=\"mb-3\">\r\n <label for=\"species\">{{'TAXON.TAXON'|translate}}</label>\r\n <adb-taxon-picker formControlName=\"taxonId\" id=\"species\"></adb-taxon-picker>\r\n </div>\r\n }\r\n </adb-filter-section>\r\n @if(filters.showTime){\r\n <adb-filter-section [count]=\"periodCount\" titleResource=\"OBSERVATION.PERIOD\">\r\n <div class=\"mb-1\">\r\n <select class=\"form-select\" formControlName=\"period\" id=\"period\">\r\n <option value=\"1\">{{thisYear|date:'yyyy'}}</option>\r\n <option value=\"2\">{{lastYear|date:'yyyy'}}</option>\r\n <option value=\"3\">{{'OBSERVATION.ALL_YEAR'|translate}}</option>\r\n <option value=\"4\">{{'OBSERVATION.LAST_5_YEAR'|translate}}</option>\r\n <option value=\"5\">{{'OBSERVATION.LAST_25_YEAR'|translate}}</option>\r\n <option value=\"6\">{{'OBSERVATION.CUSTOMIZED'|translate}}</option>\r\n </select>\r\n </div>\r\n @if (form.value?.period==='6') {\r\n <div class=\"mb-2\">\r\n <label for=\"startAt\">{{'FROM' |translate}}</label>\r\n <input adbDatepicker type=\"text\" class=\"form-control datepicker\" id=\"startAt\" formControlName=\"startAt\" [settings]=\"dateStartConfig\">\r\n </div>\r\n <div class=\"mb-2\">\r\n <label for=\"endAt\">{{'TO' |translate}}</label>\r\n <input adbDatepicker type=\"text\" class=\"form-control datepicker\" id=\"endAt\" formControlName=\"endAt\" [settings]=\"dateEndConfig\">\r\n </div>\r\n }\r\n </adb-filter-section>\r\n }\r\n @if(filters.showArea){\r\n <adb-filter-section [count]=\"areaCount\" titleResource=\"GEOGRAPHY\" [lazy]=\"true\">\r\n <ng-template>\r\n @if(filters.showOwnArea){\r\n <div role=\"tablist\" aria-label=\"{{'AREA'|translate}}\" class=\"d-flex gap-2 justify-content-end\">\r\n <button class=\"btn btn-link p-0\" [class.text-dark]=\"!hasOwnArea\" (click)=\"hasOwnArea=false\" role=\"tab\" id=\"tab-select\" aria-selected=\"{{!hasOwnArea}}\" aria-controls=\"panel-select\">\r\n {{'CHOOSE'|translate}}\r\n </button>\r\n <button class=\"btn btn-link p-0\" [class.text-dark]=\"hasOwnArea\" (click)=\"hasOwnArea=true\" role=\"tab\" id=\"tab-draw\" aria-selected=\"false\" aria-controls=\"panel-draw\">\r\n {{'OWN_AREA'|translate}}\r\n </button>\r\n </div>\r\n }\r\n <div class=\"mb-2\">\r\n @if(hasOwnArea&&filters.showOwnArea){\r\n <div class=\"pt-1\" role=\"tabpanel\" id=\"area-draw\" aria-labelledby=\"tab-draw\">\r\n <div>\r\n <adb-polygon-drawer formControlName=\"geo\"></adb-polygon-drawer>\r\n </div>\r\n </div>\r\n }@else{\r\n <div role=\"tabpanel\" id=\"area-select\" aria-labelledby=\"tab-select\">\r\n <div formArrayName=\"areas\">\r\n <div class=\"d-flex align-items-end mb-1\">\r\n <label>{{'AREAS'|translate}}</label>\r\n <button class=\"ms-auto text-dark btn btn-sm btn-secondary\" attr.aria-label=\"{{'OBSERVATION.ADD_AREA'|translate}}\" title=\"{{'OBSERVATION.ADD_AREA'|translate}}\" type=\"button\" (click)=\"addArea()\">\r\n <span class=\"bi bi-plus\"></span>\r\n </button>\r\n </div>\r\n @for (ctrl of areasArray.controls; track ctrl; let i = $index; let last = $last) {\r\n <div class=\"d-flex mb-2\">\r\n <adb-area-picker id=\"area-{{i}}\" [formControlName]=\"i\"></adb-area-picker>\r\n @if(areasArray.length>1){\r\n <button class=\"btn btn-secondary ms-1\" attr.aria-label=\"{{'DELETE'|translate}}\" title=\"{{'DELETE'|translate}}\" type=\"button\" (click)=\"removeArea(i)\">\r\n <span class=\"bi bi-trash\"></span>\r\n </button>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </ng-template>\r\n </adb-filter-section>\r\n }\r\n @if(form.get('taxonId')){\r\n @if(filters.showTaxaLists){\r\n <adb-filter-section [count]=\"taxonListCount\" titleResource=\"LISTS.NATURE_CONSERVATION_LISTS\">\r\n <div class=\"mb-3\">\r\n <app-treeview formControlName=\"list\" [nodes]=\"taxaLists\"></app-treeview>\r\n </div>\r\n {{'LISTS.READ_MORE'|translate}}\r\n <a [href]=\"artfakta\">{{'LISTS.LIST_CONTENT'|translate}}</a>\r\n </adb-filter-section>\r\n }\r\n @if(filters.showDatasets){\r\n <adb-filter-section [count]=\"dataSetCount\" titleResource=\"DATASET.DATASETS\">\r\n @if (form.get('ds')) {\r\n <div formArrayName=\"ds\">\r\n @for (item of dsControls; track item; let i = $index) {\r\n <div [formGroupName]=\"i\" class=\"form-check\">\r\n <input type=\"checkbox\" formControlName=\"selected\" [id]=\"'ds-' + item.value.id\" class=\"form-check-input\">\r\n <label [for]=\"'ds-' + item.value.id\" class=\"form-check-label\">{{ 'PROVIDERS.'+item.value.id |translate }}</label>\r\n </div>\r\n }\r\n </div>\r\n }\r\n </adb-filter-section>\r\n }\r\n }\r\n </div>\r\n <div class=\"d-flex justify-content-end gap-2\">\r\n @if (inline) {\r\n <a class=\"btn btn-secondary\" [routerLink]=\"[]\">\r\n {{'CANCEL'|translate}}\r\n </a>\r\n }\r\n <button type=\"submit\" class=\"btn btn-primary\" [disabled]=\"form.invalid||form.pristine\">{{'FILTER'|translate}}</button>\r\n </div>\r\n</form>\r\n}" }]
|
|
849
818
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: AdbMapConfigService }, { type: i3.HttpClient }, { type: i1$2.Router }, { type: i1$2.ActivatedRoute }], propDecorators: { inline: [{
|
|
850
819
|
type: Input
|
|
851
820
|
}] } });
|